/* =========================
   NOT TOO SWEET — CREAM / GRID (CLEAN)
   ========================= */

   *{ margin:0; padding:0; box-sizing:border-box; }
   html{ scroll-behavior:smooth; }
   
:root{
  /* background */
  --bg:#fff5e1;

  /* text system — 全部棕色 */
  --ink:#3d1f0d;                         /* 主文字：深可可棕 */
  --muted:rgba(61,31,13,.65);            /* 次级文字：淡棕 */

  /* dividers / borders */
  --line:rgba(61,31,13,.22);              /* 线条统一棕 */

  --pad-x:40px;

  /* ticker / accent */
  --ticker-h:22px;
  --brown:#722000;                        /* 品牌强调棕 */
  --cream-text:#f4efe4;
}
   
   /* base */
   body{
     font-family:'Canela Text','Georgia',serif;
     background:var(--bg);
     color:var(--ink);
     line-height:1.6;
   }
   
   a{ color:var(--ink); text-decoration:none; }
   /* 你如果不想全站 hover 变淡，可以把这行删掉 */
   a:hover{ opacity:.7; }
   
   /* anchor offset */
   #menu,#about,#contact{ scroll-margin-top:110px; }
   
   /* ================= TICKER ================= */
   .ticker{
     position:fixed;
     top:0; left:0; right:0;
     height:var(--ticker-h);
     background:var(--brown);
     color:var(--cream-text);
     z-index:10000;
     overflow:hidden;
   
     display:flex;
     align-items:center;
     justify-content:center;
   
     border-bottom:1px solid rgba(255,255,255,.14);
   }
   
   .ticker__track{
     display:inline-flex;
     align-items:center;
     white-space:nowrap;
     gap:40px;
   
     animation:ticker-move 18s linear infinite;
     will-change:transform;
   }
   
   .ticker__track span{
     font-size:11px;
     letter-spacing:.14em;
     text-transform:uppercase;
     line-height:1;
     opacity:.95;
   }
   
   @keyframes ticker-move{
     from{ transform:translateX(0); }
     to{ transform:translateX(-50%); }
   }
   
   @media (prefers-reduced-motion: reduce){
     .ticker__track{ animation:none; }
   }
   
   /* ================= HEADER ================= */
   header{
     position:fixed;
     inset:0 0 auto 0;
     top:var(--ticker-h);                 /* 给 ticker 让位 */
     padding:24px var(--pad-x);
     display:flex;
     justify-content:space-between;
     align-items:center;
   
     background:var(--bg);                /* ✅ 不透明 */
     border-bottom:1px solid var(--line);
     z-index:9999;
   }
   
   .logo{
     font-size:18px;
     letter-spacing:3px;
     text-transform:uppercase;
     font-weight:300;
   }
   
   /* desktop nav */
   nav#nav{
     display:flex;
     gap:34px;
   }
   
   nav#nav a{
     font-size:12px;
     letter-spacing:1px;
     text-transform:uppercase;
   }
   
   /* hamburger */
   .menu-btn{
     display:none;
     background:none;
     border:1px solid var(--line);
     padding:8px 10px;
     font-size:20px;
     line-height:1;
     cursor:pointer;
   
     position:relative;
     z-index:10001;
   }
   
   /* ================= HERO ================= */
   .hero{
     margin-top:calc(84px + var(--ticker-h));   /* 顶部整体下移 */
     padding:120px var(--pad-x) 100px;
     text-align:center;
   }
   
   .hero-logo-img{
     max-width:230px;
     margin:0 auto 18px;
     display:block;
   }
   
   .hero-tagline{
     font-size:13px;
     letter-spacing:.8px;
     color:var(--muted);
   }
   
   /* ================= MENU ================= */
   .categories{
     max-width:1200px;
     margin:0 auto;
     padding:80px var(--pad-x);
   }
   
   .category{ margin-bottom:90px; }
   
   .category h2{
     font-size:26px;
     letter-spacing:3px;
     text-transform:uppercase;
     font-weight:300;
     margin-bottom:28px;
     padding-bottom:14px;
     border-bottom:1px solid var(--line);
   }
   
   .items-grid{
     display:grid;
     grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
     gap:34px;
   }
   
   /* ================= ITEM ================= */
   .item{
     position:relative;
     padding:0 0 18px 0;
     border-bottom:1px solid var(--line);
     cursor:pointer;
     overflow:hidden;
   }
   
   .item-img{
     width:100%;
     aspect-ratio:4 / 3;
     height:auto;
     object-fit:cover;
     display:block;
     margin-bottom:16px;
   }
   
   .item h3{
     font-size:17px;
     letter-spacing:.6px;
     font-weight:400;
     margin-bottom:6px;
   }
   
   .item .price{
     font-size:14px;
     letter-spacing:.6px;
     color:var(--muted);
   }
   
   /* description overlay */
   .item-desc{
     position:absolute;
     left:0; right:0; bottom:0;
   
     padding:14px 16px;
     background:var(--bg);
     border-top:1px solid var(--line);
   
     opacity:0;
     transform:translateY(6px);
     transition:opacity .2s ease, transform .2s ease;
   
     font-size:13px;
     line-height:1.6;
     color:var(--muted);
     pointer-events:none;
   }
   
   .item:hover .item-desc{
     opacity:1;
     transform:translateY(0);
   }
   
   /* ================= SECTIONS ================= */
   .section{ padding:120px var(--pad-x); }
   
   .section-inner{
     max-width:1200px;
     margin:0 auto;
   }
   
   .section h2{
     font-size:26px;
     letter-spacing:3px;
     text-transform:uppercase;
     font-weight:300;
     margin-bottom:16px;
   }
   
   .section p{
     font-size:13px;
     line-height:1.9;
     color:var(--muted);
     max-width:760px;
   }
   
   /* ================= FOOTER ================= */
   footer{
     padding:90px var(--pad-x);
     text-align:center;
   }
   
   footer::before{
     content:"";
     display:block;
     height:1px;
     max-width:1200px;
     margin:0 auto 42px;
     background:var(--line);
   }
   
   footer p{
     font-size:12px;
     letter-spacing:1px;
     color:var(--muted);
   }
   
   /* ================= COOKIE CURSOR + CRUMBS ================= */
   html, body, a, button{ cursor:none !important; }
   
   #cookieCursor{
     position:fixed;
     left:0; top:0;
     width:18px;
     height:18px;
     border-radius:999px;
     background:var(--brown);
   
     transform:translate(-50%, -50%);
     pointer-events:none;
     z-index:9999999;
   
     box-shadow:
       0 0 0 1px rgba(17,17,17,0.12),
       0 8px 18px rgba(0,0,0,0.10);
   }
   
   #cookieCursor.is-down{
     transform:translate(-50%, -50%) scale(0.92);
   }
   
   #crumbLayer{
     position:fixed;
     inset:0;
     pointer-events:none;
     z-index:9999998;
   }
   
   .crumb{
     position:absolute;
     width:4px;
     height:4px;
     border-radius:999px;
     background:var(--brown);
     box-shadow:0 0 0 1px rgba(17,17,17,0.08);
     transform:translate(-50%, -50%);
     opacity:1;
     will-change:transform, opacity;
   }
   
   .crumb.is-chip{ border-radius:2px; width:5px; height:4px; }
   .crumb.is-dust{ width:2px; height:2px; opacity:.85; }
   
   /* ================= MOBILE ================= */
   @media (max-width:768px){
     :root{ --pad-x:22px; }
   
     .menu-btn{ display:block; }
   
     nav#nav{
       display:none;
       position:absolute;
       top:100%;
       left:0; right:0;
       padding:16px 22px;
   
       background:var(--bg);
       border-bottom:1px solid var(--line);
       z-index:10000;
     }
   
     nav#nav.active{
       display:flex;
       flex-direction:column;
       gap:14px;
     }
   
     .hero{ padding:96px var(--pad-x) 70px; }
   
     .items-grid{ grid-template-columns:1fr; gap:26px; }
   
     /* mobile: no hover, inline description */
     .item-desc{
       position:static;
       opacity:1;
       transform:none;
       border-top:none;
       padding:10px 0 0;
       pointer-events:auto;
     }
   }
   /* ================= FEEDBACK ================= */

.feedback-intro{
  margin-bottom:32px;
  font-size:13px;
  line-height:1.9;
  color:var(--muted);
  max-width:520px;
}

.feedback-form{
  max-width:520px;
}

.feedback-form textarea{
  width:100%;
  background:transparent;
  border:none;
  border-bottom:1px solid var(--line);
  padding:12px 0;
  font-family:inherit;
  font-size:14px;
  color:var(--ink);
  resize:none;
}

.feedback-form textarea::placeholder{
  color:var(--muted);
}

.feedback-form textarea:focus{
  outline:none;
  border-bottom-color:var(--brown);
}

.feedback-form button{
  margin-top:22px;
  background:none;
  border:none;
  padding:0;
  font-family:inherit;
  font-size:12px;
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--brown);
  cursor:pointer;
}

.feedback-form button:hover{
  opacity:.7;
}
/* ================= CONTACT SUBTITLE (SERIF, SMALL) ================= */
.contact-subtitle{
  margin-top:48px;         /* 👈 关键：在前面加 space */
  font-size:14px;
  font-weight:300;
  letter-spacing:.4px;
  text-transform:none;

  margin-bottom:12px;
  color:var(--ink);
}
/* ================= ABOUT LAYOUT ================= */
.about-inner{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap:64px;
  align-items:start;
}

.about-photo{
  margin:0;
}

.about-photo img{
  width:100%;
  height:auto;
  display:block;
}

.about-photo figcaption{
  margin-top:8px;
  font-size:12px;
  color:var(--muted);
}
@media (max-width:768px){
  .about-inner{
    grid-template-columns:1fr;
    gap:40px;
  }
}