/* 千纤 · 雨后江南。视觉层只覆盖公开页面，不改变数据与留言接口。 */
:root {
  font-family: "Noto Sans SC", "Microsoft YaHei", sans-serif;
  color: #34423b;
  background: #fcfaf5;
  --qx-paper: #fcfaf5;
  --qx-cream: #f5f3ec;
  --qx-mist: #e7eee8;
  --qx-jade: #6f8979;
  --qx-pine: #304b42;
  --qx-rose: #d5a4ac;
  --qx-muted: #728077;
  --qx-border: #e5e5dc;
  --qx-shadow: 0 12px 30px rgba(44, 70, 56, .055);
  --qx-shadow-hover: 0 20px 38px rgba(44, 70, 56, .105);
}

body { background: var(--qx-paper); }
::selection { background: #dce9e0; color: var(--qx-pine); }
.shell { width: min(1170px, calc(100% - 56px)); }
.preview-note { background: #edf2ec; color: #647568; }
.preview-note__icon { color: var(--qx-rose); }
.site-header { background: rgba(252, 250, 245, .92); border-bottom: 1px solid var(--qx-border); }
.brand { font-family: "Songti SC", "STSong", serif; color: var(--qx-pine); font-weight: 500; font-size: 25px; letter-spacing: .08em; }
.brand-mark { background: transparent; color: var(--qx-rose); font-size: 28px; }
.brand-dot { color: var(--qx-rose); }
.site-nav { color: #5f7066; font-weight: 500; }
.site-nav a:not(.nav-contact):hover, .site-nav a:not(.nav-contact):focus-visible { color: var(--qx-pine); }
.nav-contact { color: var(--qx-pine); background: #fffefa; border-color: #bccabf; }
.nav-contact:hover { background: var(--qx-mist); }

/* 主视觉的插画本身不动，只有低不透明度的薄雾层缓慢移动。 */
.hero { min-height: 640px; background: var(--qx-paper); }
.hero-image {
  inset: 64px max(28px, calc((100vw - 1170px) / 2)) 76px auto;
  width: min(43vw, 510px);
  z-index: 0;
  background: #e9f0e9 url('/assets/hero-jiangnan-v1.webp') center 58% / cover no-repeat;
  border-radius: 250px 250px 16px 16px;
  box-shadow: 0 23px 58px rgba(48, 75, 66, .10);
  overflow: hidden;
}
.hero-image::before, .hero-image::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(255,255,255,.9), rgba(255,255,255,.5) 38%, transparent 72%);
  filter: blur(12px);
  animation: qx-mist-drift 24s ease-in-out infinite alternate;
}
.hero-image::before { width: 78%; height: 31%; left: -10%; top: 31%; opacity: .15; }
.hero-image::after { width: 66%; height: 26%; left: 39%; top: 55%; opacity: .11; animation-duration: 30s; animation-direction: alternate-reverse; }
.hero::after {
  inset: auto max(28px, calc((100vw - 1170px) / 2)) 29px;
  height: 1px;
  z-index: 1;
  background: linear-gradient(90deg, transparent, var(--qx-rose) 12%, var(--qx-rose) 78%, transparent);
  transform-origin: left;
  animation: qx-thread-draw 1.15s ease-out .45s both;
}
.hero-inner { min-height: 640px; justify-content: flex-start; position: relative; z-index: 1; }
.hero-copy { width: min(51%, 560px); padding: 14px 0 65px; }
.hero-copy > * { animation: qx-rise .62s cubic-bezier(.18,.7,.26,1) both; }
.hero-copy .hero-kicker { animation-delay: .1s; }
.hero-copy h1 { animation-delay: .2s; }
.hero-copy .hero-description { animation-delay: .32s; }
.hero-copy .hero-actions { animation-delay: .45s; }
.eyebrow, .section-label { color: var(--qx-jade); font-weight: 600; }
.eyebrow-line { background: var(--qx-jade); }
.hero-kicker { color: #7b8d80; font-size: 13px; margin: 28px 0 10px; }
.hero h1 { font-family: "Songti SC", "STSong", serif; font-weight: 500; letter-spacing: .015em; line-height: 1.35; color: var(--qx-pine); font-size: clamp(38px, 3.9vw, 58px); }
.hero h1 em { font-family: inherit; font-style: normal; color: #718374; }
.hero-description { color: #6f7e73; max-width: 440px; }
.button { transition: transform .22s ease, background .22s ease, box-shadow .22s ease, border-color .22s ease; }
.button-primary { color: white; background: var(--qx-pine); box-shadow: 0 8px 18px rgba(48,75,66,.13); }
.button-primary:hover { background: #416457; box-shadow: 0 11px 22px rgba(48,75,66,.17); }
.text-link { color: var(--qx-pine); border-bottom-color: #a6b8a9; }
.text-link:hover { color: var(--qx-jade); }
.hero-bottom { left: auto; right: max(28px, calc((100vw - 1170px) / 2)); bottom: 9px; transform: none; flex-direction: row; color: #9caaa0; font-size: 10px; background: var(--qx-paper); padding-left: 12px; }
.hero-bottom-line { display: none; }

.section { padding: 86px 0; }
.section h2, .blog-panel h2 { font-family: "Songti SC", "STSong", serif; color: var(--qx-pine); font-weight: 500; letter-spacing: .01em; }
.heading-flower { color: var(--qx-rose); }
.section-heading p:not(.section-label), .notice-intro > p:last-child, .about-copy > p:not(.section-label), .blog-panel p:not(.section-label), .contact-layout > div > p:not(.section-label), .whisper-layout > div > p:not(.section-label) { color: var(--qx-muted); }
.section-deco { color: #a2b0a5; }
.shop-section, .about-section, .blog-section, .whisper-section { background: var(--qx-paper); }
.product-grid { gap: 22px; }
.product-card, .order-note, .notice-item, .notice-intro, .about-visual, .about-copy, .blog-panel, .contact-card, .contact-layout > div:first-child, .whisper-card, .whisper-layout > div:first-child, .item-panel {
  transition: transform .24s cubic-bezier(.2,.7,.2,1), box-shadow .24s ease, border-color .24s ease;
}
@media (hover: hover) {
  .product-card:hover, .order-note:hover, .notice-item:hover, .notice-intro:hover, .about-visual:hover, .about-copy:hover, .blog-panel:hover, .contact-card:hover, .contact-layout > div:first-child:hover, .whisper-card:hover, .whisper-layout > div:first-child:hover, .item-panel:hover {
    transform: translateY(-3px);
    box-shadow: var(--qx-shadow-hover);
    border-color: #cbd8cb;
  }
}
.product-card:focus-within, .blog-panel:focus-within, .contact-card:focus-within, .whisper-card:focus-within, .item-panel:focus-within { transform: translateY(-3px); box-shadow: var(--qx-shadow-hover); border-color: #cbd8cb; }
.product-card { background: #fffefa; border: 1px solid var(--qx-border); border-radius: 16px; box-shadow: var(--qx-shadow); }
.product-art--pink { background: linear-gradient(145deg, #e5eee7, #f9f1ef); }
.product-art--blue { background: linear-gradient(145deg, #e2ece9, #f5f4ec); }
.product-image { transition: transform .34s ease; }
@media (hover: hover) { .product-card:hover .product-image { transform: scale(1.015); } }
.product-art__flower { color: #d7b4b8; text-shadow: none; }
.product-card h3 { font-family: "Songti SC", "STSong", serif; font-weight: 500; color: var(--qx-pine); }
.product-card p, .product-card__footer a { color: var(--qx-muted); }
.product-card__footer { border-top-color: var(--qx-border); }
.pill, .pill--blue { background: #e8eee7; color: #67816e; }
.price { color: #b47881; }
.order-note { background: #f8f8f1; border-color: var(--qx-border); box-shadow: var(--qx-shadow); }
.order-note strong { color: var(--qx-pine); }
.order-note p, .shop-footnote { color: var(--qx-muted); }

.notice-section { background: #eef2ed; }
.notice-layout { gap: 50px; grid-template-columns: 310px minmax(0,1fr); }
.notice-intro { padding: 23px 25px; border: 1px solid rgba(180,200,183,.65); border-radius: 16px; background: rgba(255,255,255,.5); box-shadow: var(--qx-shadow); }
.notice-list { border-top: 0; display: grid; gap: 12px; }
.notice-item { background: rgba(255,255,255,.7); border: 1px solid rgba(180,200,183,.65); border-radius: 14px; padding: 20px 23px; box-shadow: var(--qx-shadow); }
.notice-number, .notice-tag, .notice-sparkle { color: #a87b83; }
.notice-item h3 { color: var(--qx-pine); }
.notice-item p { color: var(--qx-muted); }

.about-layout { gap: 72px; }
.about-visual { background: linear-gradient(180deg, rgba(246,249,244,.1), rgba(238,244,237,.24)), url('/assets/hero-jiangnan-v1.webp') center 60% / cover no-repeat; box-shadow: var(--qx-shadow); border: 1px solid #dbe5dc; }
.about-visual::before, .about-visual::after { content: none; }
.about-visual__frame { border-color: rgba(255,255,255,.8); background: rgba(255,255,255,.27); backdrop-filter: blur(2px); }
.about-visual__frame span { color: var(--qx-pine); text-shadow: 0 2px 15px white; }
.about-copy, .contact-layout > div:first-child, .whisper-layout > div:first-child { padding: 25px; border: 1px solid var(--qx-border); border-radius: 16px; background: rgba(255,255,255,.55); }
.blog-panel { background: linear-gradient(110deg, #fcfbf6, #edf2ec); border-color: var(--qx-border); box-shadow: var(--qx-shadow); }
.blog-panel__ornament { color: rgba(164,185,166,.14); }
.button-disabled { color: #8b9d8e; border-color: #d6e0d4; }

.contact-section { background: linear-gradient(135deg, #edf2ec, #f8f8f1 65%, #f9efef); }
.contact-section h2 em { font-family: inherit; font-style: normal; color: #789183; }
.contact-card { border-color: var(--qx-border); background: rgba(255,255,255,.78); box-shadow: var(--qx-shadow); }
.contact-card__flower { color: var(--qx-rose); }
.contact-card h3 { color: var(--qx-pine); }
.contact-card p, .contact-card__status { color: var(--qx-muted); }
.contact-card__status { border-top-color: var(--qx-border); }
.whisper-section { background: #f8f8f2; }
.whisper-layout { gap: 48px; }
.whisper-card { border-color: var(--qx-border); background: #fffefa; box-shadow: var(--qx-shadow); }
.whisper-card label { color: var(--qx-pine); }
.whisper-card textarea, .whisper-card input { color: var(--qx-pine); border-color: #d9e2d9; background: #fff; }
.whisper-card textarea:focus, .whisper-card input:focus { border-color: var(--qx-jade); box-shadow: 0 0 0 3px rgba(111,137,121,.12); }
.whisper-card #whisper-result { color: var(--qx-pine); }
.whisper-card .whisper-privacy { color: var(--qx-muted); }
.empty-state { color: var(--qx-muted); }

.site-footer { background: var(--qx-paper); border-top-color: var(--qx-border); }
.footer-inner { color: #8e9a8f; }
.footer-inner > a:hover { color: var(--qx-pine); }
.item-panel { background: #fffefa; border-color: var(--qx-border); box-shadow: var(--qx-shadow); }
.item-panel h1, .item-details { color: var(--qx-pine); }
.item-price { color: #b47881; }
.item-summary { color: var(--qx-muted); }

@keyframes qx-mist-drift { from { transform: translateX(-8px); } to { transform: translateX(18px); } }
@keyframes qx-thread-draw { from { opacity: 0; transform: scaleX(0); } to { opacity: 1; transform: scaleX(1); } }
@keyframes qx-rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 900px) {
  .hero { min-height: 0; }
  .hero-image { position: relative; inset: auto; display: block; width: min(520px, calc(100% - 48px)); height: 420px; margin: 38px auto 0; background-position: center 59%; border-radius: 260px 260px 16px 16px; }
  .hero-inner { min-height: 0; justify-content: center; }
  .hero-copy { width: min(100%, 600px); padding: 40px 0 70px; text-align: left; }
  .hero h1 { font-size: clamp(38px, 6vw, 54px); }
  .hero-actions { justify-content: flex-start; }
  .hero-bottom { display: none; }
  .notice-layout { grid-template-columns: 1fr; gap: 18px; }
  .about-layout { gap: 32px; }
}
@media (max-width: 620px) {
  .shell { width: min(100% - 36px, 480px); }
  .site-nav { background: rgba(252,250,245,.98); border-bottom-color: var(--qx-border); }
  .menu-toggle span { background: var(--qx-pine); }
  .hero-image { width: calc(100% - 36px); height: 330px; margin-top: 25px; }
  .hero-copy { padding: 30px 0 64px; text-align: left; }
  .hero h1 { font-size: clamp(36px, 9vw, 44px); }
  .hero-description { margin-left: 0; }
  .eyebrow { justify-content: flex-start; }
  .hero-kicker { margin-top: 20px; }
  .hero-actions { justify-content: flex-start; gap: 18px; }
  .hero::after { inset: auto 18px 17px; }
  .section { padding: 66px 0; }
  .notice-intro, .notice-item, .about-copy, .contact-layout > div:first-child, .whisper-layout > div:first-child { padding: 21px; }
  .notice-item { grid-template-columns: 28px 1fr 15px; gap: 11px; }
  .whisper-layout { gap: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-copy > *, .hero::after, .hero-image::before, .hero-image::after { animation: none !important; }
  .hero-copy > * { opacity: 1; transform: none; }
  .hero::after { opacity: 1; transform: none; }
  .product-card, .order-note, .notice-item, .notice-intro, .about-visual, .about-copy, .blog-panel, .contact-card, .contact-layout > div:first-child, .whisper-card, .whisper-layout > div:first-child, .item-panel, .product-image, .button { transition: none !important; }
}