/* =========================================================
   JIAOZI — light, folded, delicious
   ========================================================= */

:root{
  --paper:#FBF3E6;
  --paper-2:#FFF9F1;
  --paper-3:#F6E9D6;
  --ink:#251A12;
  --ink-2:#5E4C3E;
  --ink-3:#8A7565;
  --chili:#D93F1E;
  --chili-d:#A82C10;
  --miso:#E9B44C;
  --jade:#2E6B51;
  --line:rgba(37,26,18,.14);
  --line-soft:rgba(37,26,18,.08);
  --radius:22px;
  --wrap:1280px;
  --navh:74px;
  --pad:clamp(20px,4.2vw,64px);
  --ease:cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:clamp(15px,1.05vw,17px); line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
h1,h2,h3,h4,h5{margin:0; font-weight:600; letter-spacing:-.02em}
p{margin:0}
ul,ol,dl{margin:0; padding:0; list-style:none}

/* paper grain */
.grain{
  position:fixed; inset:0; z-index:9998; pointer-events:none; opacity:.5;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E");
}

/* type helpers */
.eyebrow{
  display:flex; align-items:center; gap:.6em;
  font-size:.72rem; letter-spacing:.18em; text-transform:uppercase;
  font-weight:600; color:var(--ink-3); margin-bottom:1.4rem;
}
.eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--chili);flex:none}
.sec-title{
  font-family:"Fraunces",Georgia,serif;
  font-variation-settings:"SOFT" 60,"WONK" 1,"opsz" 90;
  font-weight:600; font-size:clamp(2.3rem,5.2vw,4.2rem); line-height:1.02;
  letter-spacing:-.03em;
}
.sec-title em{color:var(--chili); font-style:italic}
.sec-title--xl{font-size:clamp(3.2rem,11vw,9rem); line-height:.86}
.wrap{max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad)}

/* buttons */
.btn{
  display:inline-flex; align-items:center; gap:.7em;
  padding:.95em 1.5em; border-radius:999px; font-weight:600; font-size:.95rem;
  border:1.5px solid transparent; cursor:pointer; position:relative;
  transition:transform .35s var(--ease), background .3s, color .3s, border-color .3s, box-shadow .35s;
  will-change:transform;
}
.btn:hover{transform:translateY(-2px)}
.btn--chili{background:var(--chili); color:#FFF7EE; box-shadow:0 12px 26px -14px rgba(217,63,30,.85)}
.btn--chili:hover{background:var(--chili-d); box-shadow:0 18px 34px -14px rgba(217,63,30,.9)}
.btn--chili b{font-weight:700; letter-spacing:.01em; padding-left:.7em; border-left:1px solid rgba(255,255,255,.28)}
.btn--ghost{border-color:var(--line); color:var(--ink); background:rgba(255,255,255,.35)}
.btn--ghost:hover{background:#fff; border-color:rgba(37,26,18,.28)}
.btn--lg{padding:1.15em 2em; font-size:1.02rem}

/* ───────── announce bar ───────── */
.announce{
  background:var(--ink); color:#F7E9D8; overflow:hidden;
  font-size:.78rem; letter-spacing:.06em;
}
.announce__track{
  display:flex; gap:1.6rem; align-items:center; justify-content:center;
  padding:.55rem 1rem; white-space:nowrap; flex-wrap:nowrap;
}
.announce__track > *:nth-child(n+4){display:none}
.announce__track span{opacity:.82}
.announce__track strong{color:var(--miso); font-weight:700}

/* ───────── nav ───────── */
.nav{
  position:sticky; top:0; z-index:900;
  display:flex; align-items:center; gap:2rem;
  padding:1rem var(--pad);
  background:rgba(251,243,230,.72);
  backdrop-filter:blur(14px) saturate(1.1);
  border-bottom:1px solid var(--line-soft);
}
.nav__logo{display:flex; align-items:center; gap:.6rem; color:var(--ink)}
.nav__mark{color:var(--chili); display:flex}
.nav__word{
  font-family:"Fraunces",Georgia,serif; font-weight:800; letter-spacing:.14em;
  font-size:1.05rem;
}
.nav__links{display:flex; gap:1.9rem; margin-left:auto; font-size:.9rem; font-weight:500}
.nav__links a{position:relative; padding:.2rem 0; color:var(--ink-2)}
.nav__links a::after{
  content:""; position:absolute; left:0; bottom:-2px; height:2px; width:100%;
  background:var(--chili); transform:scaleX(0); transform-origin:right;
  transition:transform .4s var(--ease);
}
.nav__links a:hover{color:var(--ink)}
.nav__links a:hover::after{transform:scaleX(1); transform-origin:left}
.nav__cta{padding:.72em 1.2em; font-size:.86rem}
.scroll-rail{position:absolute; left:0; bottom:-1px; height:2px; width:100%; background:transparent}
.scroll-rail i{display:block; height:100%; width:0%; background:var(--chili)}

/* ───────── hero ───────── */
.hero{
  position:relative; overflow:hidden;
  display:grid; grid-template-columns:1.02fr .98fr; align-items:center; gap:clamp(1rem,3vw,3rem);
  padding:clamp(1.4rem,3vw,3rem) var(--pad) clamp(1.8rem,3.4vw,3rem);
  max-width:var(--wrap); margin-inline:auto;
  min-height:calc(100svh - var(--navh) - 34px);
}
.hero__steam{position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:0; opacity:.55}
.hero__copy{position:relative; z-index:2; max-width:640px}
.hero__title{
  font-family:"Fraunces",Georgia,serif;
  font-variation-settings:"SOFT" 80,"WONK" 1,"opsz" 144;
  font-weight:700; font-size:clamp(3.1rem,7.6vw,7rem);
  line-height:.84; letter-spacing:-.045em; margin:.3rem 0 0;
}
.hero__title .line{display:block; will-change:transform}
.hero__title em{font-style:italic; color:var(--chili); font-variation-settings:"SOFT" 100,"WONK" 1,"opsz" 144}
.line--outline{
  color:transparent; -webkit-text-stroke:2.4px var(--ink); text-stroke:2.4px var(--ink);
}
.hero__sub{
  margin-top:1.2rem; max-width:38ch; color:var(--ink-2); font-size:clamp(1rem,1.2vw,1.12rem);
}
.hero__sub strong{color:var(--ink); font-weight:700}
.hero__actions{display:flex; gap:.8rem; margin-top:1.6rem; flex-wrap:wrap}
.hero__facts{
  display:flex; gap:clamp(1.4rem,3vw,2.8rem); margin-top:1.8rem;
  padding-top:1.1rem; border-top:1px solid var(--line);
}
.hero__facts dt{
  font-family:"Fraunces",Georgia,serif; font-size:1.35rem; font-weight:600; letter-spacing:-.02em;
}
.hero__facts dd{margin:.15rem 0 0; font-size:.8rem; color:var(--ink-3); letter-spacing:.02em}

.hero__art{position:relative; z-index:1; aspect-ratio:1/1.02; max-height:min(70svh,600px); display:grid; place-items:center}
.hero__blob{
  position:absolute; width:92%; aspect-ratio:1; border-radius:48% 52% 55% 45%/52% 46% 54% 48%;
  background:radial-gradient(circle at 36% 30%,#FFE2BE,#F7CFA0 55%,#F2C08B 100%);
  filter:blur(.2px);
  animation:blobMorph 22s ease-in-out infinite;
}
@keyframes blobMorph{
  0%,100%{border-radius:48% 52% 55% 45%/52% 46% 54% 48%}
  33%{border-radius:55% 45% 48% 52%/46% 55% 45% 54%}
  66%{border-radius:44% 56% 52% 48%/58% 44% 56% 42%}
}
.hero__img{
  position:relative; width:100%; max-height:min(70svh,600px); object-fit:contain;
  filter:drop-shadow(0 40px 45px rgba(120,70,25,.28));
  transform:rotate(-3deg);
}
.sticker{
  position:absolute; background:var(--paper-2); border:1px solid var(--line);
  border-radius:14px; padding:.6rem .85rem; box-shadow:0 14px 30px -18px rgba(60,35,15,.6);
  display:grid; gap:.05rem; line-height:1.15; z-index:3;
}
.sticker__small{font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-3)}
.sticker strong{font-family:"Fraunces",Georgia,serif; font-size:1rem; letter-spacing:-.01em}
.sticker--a{top:8%; left:-4%; transform:rotate(-7deg)}
.sticker--b{bottom:14%; right:-2%; transform:rotate(5deg); background:var(--chili); border-color:transparent; color:#FFF6EC}
.sticker--b .sticker__small{color:rgba(255,246,236,.72)}
.hero__pin{
  position:absolute; bottom:2%; left:-1%; width:112px; height:112px; z-index:3;
  display:grid; place-items:center; color:var(--ink-2);
}
.hero__pin svg{position:absolute; inset:0; width:100%; height:100%; animation:spin 26s linear infinite}
.hero__pin text{
  font-family:"Plus Jakarta Sans",sans-serif; font-size:9px; letter-spacing:.2em;
  fill:var(--ink-3); text-transform:uppercase; font-weight:600;
}
@keyframes spin{to{transform:rotate(360deg)}}
.hero__pin-emoji{display:grid; place-items:center}

/* ───────── marquee ───────── */
.marquee{
  border-block:1px solid var(--line); background:var(--paper-2);
  overflow:hidden; padding:.9rem 0;
}
.marquee__row{display:flex; gap:2rem; white-space:nowrap; width:max-content; will-change:transform}
.marquee__row span{
  font-family:"Fraunces",Georgia,serif; font-size:clamp(1.05rem,1.8vw,1.5rem);
  font-style:italic; color:var(--ink-2);
}
.marquee__row i{color:var(--chili); font-style:normal; font-size:1rem; align-self:center}

/* ───────── make ───────── */
.make{padding:clamp(4rem,9vw,8rem) 0}
.sec-head{margin-bottom:clamp(2.4rem,4vw,3.6rem); max-width:56ch}
.sec-head--row{display:flex; justify-content:space-between; align-items:flex-end; gap:2rem; max-width:none; flex-wrap:wrap}
.sec-head__note{max-width:34ch; color:var(--ink-3); font-size:.95rem}
.make__grid{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2vw,1.8rem)}
.card{position:relative}
.card__media{
  position:relative; overflow:hidden; border-radius:var(--radius);
  aspect-ratio:4/4.4; background:var(--paper-3);
}
.card__media img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 1.1s var(--ease), filter .6s;
}
.card:hover .card__media img{transform:scale(1.06)}
.card__num{
  position:absolute; top:14px; left:14px; z-index:2;
  font-family:"Fraunces",Georgia,serif; font-size:.78rem; letter-spacing:.1em;
  background:rgba(251,243,230,.9); padding:.3rem .6rem; border-radius:999px; color:var(--ink-2);
}
.card h3{
  font-family:"Fraunces",Georgia,serif; font-size:clamp(1.4rem,2.2vw,1.85rem);
  margin:1.1rem 0 .4rem; letter-spacing:-.02em;
}
.card p{color:var(--ink-2); font-size:.95rem; max-width:34ch}
.card__price{
  margin-top:.9rem !important; font-weight:700; color:var(--chili) !important;
  font-size:.85rem !important; letter-spacing:.06em; text-transform:uppercase;
}

/* ───────── unfold ───────── */
.unfold-intro{padding:clamp(3rem,8vw,7rem) 0 clamp(2rem,4vw,4rem); position:relative; overflow:hidden}
.unfold-intro__grid{display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(2rem,5vw,4rem); align-items:center}
.fig{position:relative; margin:0; display:grid; justify-items:center; gap:1rem}
.fig__stack{position:relative; width:min(320px,74%); aspect-ratio:1/1; display:grid; place-items:center}
.fig__l{
  position:absolute; width:100%; aspect-ratio:1.6/1; border-radius:20px;
  background:linear-gradient(150deg,#FFFBF3,#F3E4CE);
  border:1px solid rgba(37,26,18,.16);
  box-shadow:0 20px 34px -26px rgba(70,40,15,.75);
  animation:figFloat 6s ease-in-out infinite;
}
.fig__l--1{transform:translateY(-84px) rotate(-6deg); animation-delay:0s}
.fig__l--2{transform:translateY(-28px) rotate(4deg); animation-delay:.35s}
.fig__l--3{transform:translateY(28px) rotate(-3deg); animation-delay:.7s}
.fig__l--4{transform:translateY(84px) rotate(6deg); animation-delay:1.05s}
@keyframes figFloat{
  0%,100%{translate:0 0}
  50%{translate:0 -6px}
}
.fig__dot{
  position:absolute; top:50%; left:-8%; width:9px; height:9px; border-radius:50%;
  background:var(--chili); box-shadow:0 0 0 6px rgba(217,63,30,.12);
}
.fig figcaption{
  font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3);
  text-align:center;
}
.fig figcaption b{color:var(--chili); letter-spacing:.14em}
.unfold-intro__lead{max-width:44ch; color:var(--ink-2); margin-top:1.6rem; font-size:clamp(1rem,1.3vw,1.15rem)}
.unfold-intro__hint{
  display:flex; align-items:center; gap:.8rem; margin-top:2.4rem;
  font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-3);
}
.unfold-intro__hint svg{animation:nudge 2.4s ease-in-out infinite}
@keyframes nudge{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

.unfold{height:300vh; position:relative}
.unfold__stage{
  position:sticky; top:var(--navh); height:calc(100svh - var(--navh));
  display:flex; align-items:center; padding:0 var(--pad);
}
.unfold__grid{
  width:100%; max-width:var(--wrap); margin-inline:auto;
  display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(1rem,4vw,4rem);
  align-items:center;
}
.chapter-no{
  font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-3);
  margin-bottom:1rem; font-weight:600;
}
.chapter-no span{opacity:.5}
.unfold__name{
  font-family:"Fraunces",Georgia,serif;
  font-variation-settings:"SOFT" 70,"WONK" 1,"opsz" 120;
  font-size:clamp(2.4rem,5.6vw,4.6rem); line-height:.92; letter-spacing:-.035em;
}
.unfold__price{
  margin-top:.7rem; font-size:.95rem; font-weight:700; color:var(--chili); letter-spacing:.02em;
}
.unfold__price span{color:var(--ink-3); font-weight:500; letter-spacing:.02em}

.layers{margin-top:clamp(1.2rem,2.4vw,2rem); display:grid; gap:.1rem; max-width:46ch}
.layer{
  display:grid; grid-template-columns:2.4rem 1fr; gap:.9rem;
  padding:.72rem 0; border-top:1px solid var(--line-soft);
  opacity:.52; transition:opacity .45s var(--ease), transform .45s var(--ease);
  transform:translateX(0);
}
.layer:last-child{border-bottom:1px solid var(--line-soft)}
.layer.is-on{opacity:1; transform:translateX(4px)}
.layer__no{
  font-family:"Fraunces",Georgia,serif; font-size:.82rem; font-weight:600;
  color:var(--ink-3); padding-top:.15rem; transition:color .4s;
}
.layer.is-on .layer__no{color:var(--chili)}
.layer h4{font-size:.98rem; letter-spacing:-.01em; margin-bottom:.1rem}
.layer p{font-size:.84rem; color:var(--ink-3); line-height:1.45; max-width:42ch}

/* 3D stack */
.unfold__visual{
  position:relative; display:grid; place-items:center;
  height:min(72svh,660px); perspective:1500px; perspective-origin:50% 45%;
}
.stack{
  position:relative; width:min(33vw,340px); aspect-ratio:1;
  transform-style:preserve-3d;
  transform:rotateX(57deg) rotateZ(-26deg);
  will-change:transform;
}
.slab{
  position:absolute; inset:0; margin:0; border-radius:50%;
  background-size:cover; background-position:center;
  border:5px solid #FFF8ED;
  box-shadow:0 2px 0 rgba(255,255,255,.6) inset, 0 26px 40px -28px rgba(70,40,15,.7);
  transform:translateZ(var(--z,0px));
  will-change:transform;
  opacity:0;
}
.slab::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  box-shadow:0 0 0 1px rgba(37,26,18,.13) inset;
}
.slab__badge{display:none !important;
  position:absolute; bottom:2px; left:50%;
  width:30px; height:30px; border-radius:50%;
  background:var(--paper-2); color:var(--ink);
  display:grid; place-items:center;
  font-family:"Fraunces",Georgia,serif; font-size:.74rem; font-weight:700;
  border:1px solid var(--line);
  transform:translate(-50%,50%) rotateX(-57deg) rotateZ(26deg) translateZ(2px);
  box-shadow:0 8px 16px -10px rgba(60,35,15,.7);
  opacity:0;
}
.stack__axis{
  position:absolute; left:auto; right:11%; top:50%; height:0; width:1px;
  background:repeating-linear-gradient(to bottom,rgba(37,26,18,.3) 0 4px,transparent 4px 10px);
  transform:translateY(-50%); pointer-events:none;
}
.stack__axis i{
  position:absolute; left:50%; top:0; transform:translate(-50%,-50%);
  width:28px; height:28px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--paper-2); border:1px solid var(--line);
  font-family:"Fraunces",Georgia,serif; font-size:.66rem; font-weight:700; font-style:normal;
  color:var(--ink-2); opacity:0;
  box-shadow:0 6px 14px -10px rgba(60,35,15,.8);
}
.stack__axis i::after{
  content:""; position:absolute; left:-16px; top:50%; width:14px; height:1px;
  background:rgba(37,26,18,.26);
}
.stack__meter{
  position:absolute; left:50%; bottom:-2px; transform:translateX(-50%);
  display:flex; align-items:baseline; gap:.4rem;
  font-family:"Fraunces",Georgia,serif; color:var(--ink-3);
}
.stack__meter span{font-size:1.5rem; color:var(--ink); font-weight:600}
.stack__meter small{font-size:.66rem; letter-spacing:.16em; text-transform:uppercase}

/* ───────── menu ───────── */
.menu{padding:clamp(4rem,9vw,8rem) 0 clamp(3rem,6vw,6rem); border-top:1px solid var(--line)}
.menu__group{margin-top:clamp(2.4rem,4vw,3.6rem)}
.menu__cat{
  display:flex; align-items:baseline; gap:.8rem;
  font-family:"Fraunces",Georgia,serif; font-size:clamp(1.3rem,2.4vw,1.9rem);
  letter-spacing:-.02em; padding-bottom:.9rem; border-bottom:1px solid var(--line);
  margin-bottom:1.6rem;
}
.menu__cat span{font-size:.7rem; letter-spacing:.16em; color:var(--chili); font-family:"Plus Jakarta Sans",sans-serif; font-weight:700}
.menu__grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:clamp(1rem,2vw,1.6rem)}
.dish{
  background:var(--paper-2); border:1px solid var(--line-soft); border-radius:var(--radius);
  overflow:hidden; display:flex; flex-direction:column;
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), border-color .4s;
}
.dish:hover{transform:translateY(-5px); box-shadow:0 26px 46px -34px rgba(70,40,15,.6); border-color:var(--line)}
.dish__img{aspect-ratio:4/3; overflow:hidden; background:var(--paper-3)}
.dish__img img{width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease)}
.dish:hover .dish__img img{transform:scale(1.07)}
.dish__body{padding:1.1rem 1.15rem 1.25rem; display:flex; flex-direction:column; gap:.35rem; flex:1}
.dish h4{font-family:"Fraunces",Georgia,serif; font-size:1.18rem; letter-spacing:-.015em}
.dish p{font-size:.86rem; color:var(--ink-3); line-height:1.5}
.dish__price{
  margin-top:auto !important; padding-top:.8rem; color:var(--ink) !important;
  font-weight:700; font-size:.92rem !important;
}
.dish__price span{color:var(--ink-3); font-weight:500; font-size:.82rem}

/* ───────── delivery ───────── */
.delivery{
  background:linear-gradient(180deg,var(--paper) 0%,#F4E7D3 55%,#F1E1C9 100%);
  border-top:1px solid var(--line); padding:clamp(4rem,9vw,8rem) 0;
}
.delivery__grid{display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(2rem,5vw,5rem); align-items:start}
.delivery__lead{max-width:44ch; color:var(--ink-2); margin-top:1.5rem}
.rates{display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; margin:2.4rem 0 1.6rem; max-width:520px}
.rate{
  background:rgba(255,251,244,.7); border:1px solid var(--line); border-radius:16px; padding:1rem 1.1rem;
}
.rate span{display:block; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3)}
.rate strong{
  display:block; margin-top:.3rem; font-family:"Fraunces",Georgia,serif; font-size:1.3rem; font-weight:600;
}
.hours{max-width:520px}
.hours li{
  display:flex; justify-content:space-between; gap:1rem;
  padding:.7rem 0; border-top:1px solid var(--line-soft); font-size:.92rem;
}
.hours li:last-child{border-bottom:1px solid var(--line-soft)}
.hours span{color:var(--ink-3)}
.hours b{font-weight:600}
.hours .muted{color:var(--ink-3); font-weight:500}
.hours .chili{color:var(--chili)}

.order-card{
  background:var(--paper-2); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.6rem 1.5rem; box-shadow:0 30px 60px -46px rgba(70,40,15,.7);
  position:relative;
}
.order-card__kicker{
  font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-3);
  margin-bottom:1rem; font-weight:700;
}
.order-line{
  display:flex; align-items:center; gap:.9rem; padding:.9rem .2rem;
  border-top:1px solid var(--line-soft); transition:padding-left .35s var(--ease), color .3s;
}
.order-line:hover{padding-left:.6rem; color:var(--chili)}
.order-line__icon{
  width:38px; height:38px; border-radius:50%; flex:none; display:grid; place-items:center;
  background:var(--paper-3); color:var(--ink);
}
.order-line:hover .order-line__icon{background:var(--chili); color:#FFF7EE}
.order-line__txt{display:grid; line-height:1.25}
.order-line__txt b{font-size:.98rem; font-weight:600}
.order-line__txt small{font-size:.78rem; color:var(--ink-3)}
.order-line__cta{
  margin-left:auto; font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-3);
}
.order-card__foot{
  margin-top:1rem; padding-top:1rem; border-top:1px solid var(--line-soft);
  font-size:.82rem; color:var(--ink-3);
}
.order-card__foot b{color:var(--ink-2); font-weight:600}

/* ───────── closer ───────── */
.closer{padding:clamp(4rem,10vw,9rem) 0 clamp(3rem,6vw,6rem); position:relative; overflow:hidden}
.closer__inner{text-align:center; display:grid; justify-items:center; gap:1.2rem}
.closer__title{
  font-family:"Fraunces",Georgia,serif;
  font-variation-settings:"SOFT" 90,"WONK" 1,"opsz" 144;
  font-size:clamp(2.6rem,8.5vw,7rem); line-height:.88; letter-spacing:-.045em;
}
.closer__title em{color:var(--chili); font-style:italic}
.closer__sub{color:var(--ink-2); max-width:40ch}
.mascot{
  margin-top:1.6rem; background:none; border:0; cursor:pointer; position:relative;
  display:grid; justify-items:center; gap:.2rem;
  transform-origin:50% 90%;
}
.mascot__body{display:block; filter:drop-shadow(0 18px 22px rgba(120,70,25,.28)); transition:transform .3s var(--ease)}
.mascot:hover .mascot__body{transform:translateY(-4px) rotate(-2deg)}
.mascot__tag{
  font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-3);
}
.mascot__eye{transition:transform .12s linear}

/* ───────── footer ───────── */
.foot{background:var(--ink); color:#F1E3D2; padding:clamp(3rem,5vw,4.5rem) 0 1.6rem}
.foot__inner{display:flex; justify-content:space-between; gap:2.5rem; flex-wrap:wrap; padding-bottom:2.6rem}
.foot__word{
  font-family:"Fraunces",Georgia,serif; font-size:clamp(2rem,4vw,3rem);
  letter-spacing:.16em; color:#FFF6EA; font-weight:700;
}
.foot__brand p{margin-top:.6rem; font-size:.85rem; color:rgba(241,227,210,.6); line-height:1.6}
.foot__cols{display:flex; gap:clamp(2rem,6vw,5rem); flex-wrap:wrap}
.foot__cols h5{
  font-size:.68rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--miso); margin-bottom:.8rem; font-weight:700;
}
.foot__cols p{font-size:.85rem; color:rgba(241,227,210,.72); line-height:1.75}
.foot__base{
  display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  padding-top:1.4rem; border-top:1px solid rgba(241,227,210,.14);
  font-size:.74rem; color:rgba(241,227,210,.45); letter-spacing:.02em;
}

/* ───────── toast ───────── */
.toast{
  position:fixed; left:50%; bottom:26px; transform:translate(-50%,140%);
  background:var(--ink); color:#FFF6EA; padding:.75rem 1.2rem; border-radius:999px;
  font-size:.85rem; font-weight:600; z-index:9999; transition:transform .5s var(--ease);
  box-shadow:0 20px 40px -20px rgba(0,0,0,.6);
}
.toast.is-on{transform:translate(-50%,0)}

/* ───────── responsive ───────── */
@media (max-width:1080px){
  .hero{grid-template-columns:1fr; gap:.6rem; min-height:0; padding-bottom:2.4rem}
  .hero__art{order:-1; max-width:440px; max-height:29svh; justify-self:center; width:100%}
  .hero__img{max-height:29svh}
  .hero__title{font-size:clamp(2.5rem,11.5vw,6rem)}
  .make__grid{grid-template-columns:1fr 1fr}
  .delivery__grid{grid-template-columns:1fr}
}
@media (max-width:820px){
  :root{--navh:62px}
  .announce__track > *:nth-child(n+4){display:inline}
  .nav__links{display:none}
  .announce__track{justify-content:flex-start; animation:annScroll 26s linear infinite; padding-inline:0}
  @keyframes annScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  .make__grid{grid-template-columns:1fr}
  .card__media{aspect-ratio:4/3.4}
  .unfold-intro__grid{grid-template-columns:1fr}
  .fig{display:none}
  .unfold__grid{grid-template-columns:1fr; gap:1rem; align-content:center}
  .unfold{height:250vh}
  .unfold__visual{height:38svh; order:-1}
  .stack{width:min(58vw,300px)}
  .layers{max-width:none; margin-top:1rem}
  .layer{padding:.5rem 0; grid-template-columns:1.9rem 1fr; gap:.6rem}
  .layer p{display:none}
  .layer h4{font-size:.9rem}
  .unfold__name{font-size:clamp(2rem,7.4vw,3rem)}
  .unfold__price{font-size:.86rem}
  .stack__meter{display:none}
  .sec-head--row{align-items:flex-start}
  .hero__facts{gap:1.4rem}
}
@media (max-width:520px){
  .hero__pin{display:none}
  .hero__facts{flex-wrap:wrap; gap:1rem 1.6rem}
  .hero__sub{font-size:.95rem}
  .sticker--a{left:-2%; top:2%}
  .sticker--b{bottom:8%}
  .hero__facts dt{font-size:1.1rem}
  .rates{grid-template-columns:1fr 1fr}
  .foot__inner{gap:1.8rem}
}

/* ───────── reduced motion ───────── */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important}
  html{scroll-behavior:auto}
  .slab{opacity:1 !important}
  .slab__badge{opacity:1 !important}
  .layer{opacity:1 !important; transform:none !important}
}