@font-face{font-family:Vazirmatn;src:local("Vazirmatn"),url("/fonts/Vazirmatn.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:Estedad;src:local("Estedad"),url("/fonts/Estedad.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

:root {
  --color-primary:#281332;
  --color-accent:#f2cf20;
  --color-surface:#faf9f3;
  --color-ink:#281332;
  --color-ink-muted:#65596c;
  --color-card:#ffffff;
  --color-line:#ded9d9;
  --color-wash:#fff0bc;
  --color-mango:#f79720;
  --color-mango-wash:#fff0bc;
  --color-blue:#1685ca;
  --color-blue-wash:#cbeffa;
  --color-lime:#7eac1e;
  --color-lime-wash:#e5f4ba;
  --color-ruby:#cf3151;
  --color-ruby-wash:#f9d9de;
  --color-error:#a62741;
  --color-success:#22663a;
  --color-brand-black:#000000;
  --font-sans:"Vazirmatn",Tahoma,sans-serif;
  --font-display:"Estedad","Vazirmatn",Tahoma,sans-serif;
  --radius-md:0.625rem;
  --radius-lg:1rem;
  --radius-xl:1.5rem;
  --shadow-sm:0 4px 16px rgb(40 19 50 / .04);
  --shadow-lg:0 16px 40px rgb(40 19 50 / .09);
  --shadow-xl:0 24px 80px rgb(40 19 50 / .18);
  --text-sm:0.875rem;
  --text-base:1rem;
  --text-lg:1.125rem;
}

:root{
  --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-7:3rem;--space-8:4.5rem;--space-9:7rem;
  --page-gutter:clamp(1.25rem,4.4vw,4.5rem);--content-width:82rem;--header-height:5.25rem;--ease-out:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-block-start:calc(var(--header-height) + var(--space-4));background:var(--color-primary)}
body{margin:0;min-width:0;overflow-x:clip;background:var(--color-surface);color:var(--color-ink);font-family:var(--font-sans);font-size:var(--text-base);line-height:1.9;-webkit-font-smoothing:antialiased}
body:has(dialog[open]){overflow:hidden}
button,input,textarea,select{font:inherit}
button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
button{cursor:pointer}
button:disabled{cursor:not-allowed}
a{color:inherit;text-decoration:none}
button{color:inherit}
img{display:block;max-width:100%}
svg{flex-shrink:0}
h1,h2,h3,p{margin:0;overflow-wrap:anywhere}
h1,h2,h3{font-family:var(--font-display);font-weight:900;line-height:1.7}
p{line-height:1.95}
:where(a,button,input,select,textarea):focus-visible{outline:3px solid var(--color-blue);outline-offset:5px}
::selection{background:var(--color-accent);color:var(--color-primary)}
.zaphra-site{min-height:100dvh;width:100%;isolation:isolate}
.z-container{width:100%;max-width:var(--content-width);margin-inline:auto;min-width:0}
.z-section{padding-inline:var(--page-gutter);position:relative;width:100%}
.z-eyebrow{font-size:.75rem;font-weight:600;line-height:1.9;display:flex;align-items:center;gap:var(--space-3)}
.z-eyebrow::before{content:"";inline-size:1.5rem;block-size:1px;background:currentColor;flex:none}
.z-display{font-size:clamp(2.5rem,5.3vw,5.25rem);font-weight:900;line-height:1.7}
.z-display em{font-style:normal}
.z-cta{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-4);min-height:3.125rem;max-width:100%;padding:var(--space-3) var(--space-6);border:1px solid transparent;border-radius:99rem;font-weight:600;font-size:var(--text-sm);line-height:1.8;text-align:center;transition:background .25s,color .25s,border-color .25s,transform .3s var(--ease-out),box-shadow .3s;position:relative}
.z-cta svg{width:1.1rem;height:1.1rem;transition:transform .3s var(--ease-out)}
.z-cta:hover svg{transform:translateX(-4px)}
.z-cta:active{transform:scale(.97)}
.z-cta-primary{background:var(--color-primary);color:var(--color-card)}
.z-cta-primary:hover{box-shadow:0 8px 24px rgb(40 19 50 / .18);transform:translateY(-2px)}
.z-cta-outline{border-color:color-mix(in srgb,var(--color-primary) 32%,transparent);color:var(--color-primary);background:transparent}
.z-cta-outline:hover{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-card)}
.z-cta-accent{background:var(--color-accent);color:var(--color-primary)}
.z-cta-accent:hover{background:var(--color-card);transform:translateY(-3px)}
.z-cta-ghost{padding:var(--space-2) 0;border:0;border-radius:0;min-height:2.75rem;justify-content:flex-start;background:transparent}
.z-cta:disabled{opacity:.55;box-shadow:none;transform:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;inset-block-start:var(--space-3);inset-inline-start:var(--space-4);z-index:150;transform:translateY(-200%);padding:var(--space-3) var(--space-5);border-radius:var(--radius-md);background:var(--color-card);color:var(--color-primary)}
.skip-link:focus{transform:translateY(0)}

/* هدر مشترک */
.site-header{position:fixed;inset-block-start:0;inset-inline:0;z-index:50;height:var(--header-height);padding-inline:var(--page-gutter);border-block-end:1px solid color-mix(in srgb,var(--color-primary) 12%,transparent);color:var(--color-primary);background:color-mix(in srgb,var(--header-background,var(--color-mango-wash)) 87%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:background-color .65s,color .45s,border-color .45s}
.site-header.is-dark{background:color-mix(in srgb,var(--color-primary) 92%,transparent);color:var(--color-accent);border-color:color-mix(in srgb,var(--color-card) 14%,transparent)}
.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--space-6)}
.brand-link{display:flex;align-items:center;gap:var(--space-3);flex:none;min-height:2.75rem}
.brand-logo{width:4rem;height:4rem;object-fit:contain;background:var(--color-brand-black);border-radius:var(--space-1)}
.brand-word{font-family:var(--font-display);font-weight:900;font-size:1.5rem;line-height:1.7}
.header-nav{display:flex;align-items:center;gap:var(--space-7);margin-inline-start:auto}
.header-nav-link{position:relative;display:flex;align-items:center;min-height:2.75rem;font-size:.8125rem;font-weight:500}
.header-nav-link::after{content:"";position:absolute;inset-inline:0;inset-block-end:var(--space-2);height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .3s var(--ease-out)}
.header-nav-link:hover::after{transform:scaleX(1)}
.header-buy{min-height:2.5rem;padding:var(--space-2) var(--space-5);font-size:.75rem}
.is-dark .header-buy{color:var(--color-accent);border-color:color-mix(in srgb,var(--color-accent) 50%,transparent)}
.is-dark .header-buy:hover{background:var(--color-accent);color:var(--color-primary)}
.mobile-nav-toggle{display:none;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;background:transparent;border:1px solid color-mix(in srgb,currentColor 25%,transparent);border-radius:50%}
.mobile-menu-content{padding:var(--space-7) var(--space-6);display:flex;flex-direction:column;gap:var(--space-5)}
.mobile-menu-title{font-size:1.5rem}
.mobile-menu-link{font-family:var(--font-display);font-size:1.75rem;line-height:1.7;padding-block:var(--space-3);border-block-end:1px solid var(--color-line)}

/* فصل اسکرولی چهار طعم */
.hero-experience{height:340svh;min-height:100dvh;background:var(--scene-color,var(--color-mango-wash));transition:background-color .65s;scroll-margin-block-start:0}
.hero-stage{position:sticky;inset-block-start:0;height:100svh;min-height:42rem;padding-block-start:var(--header-height);display:flex;flex-direction:column;max-width:var(--content-width);margin-inline:auto}
.hero-content{flex:1;display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:var(--space-5);min-height:0;min-width:0}
.hero-copy{position:relative;z-index:3;min-width:0;padding-block:var(--space-5)}
.hero-kicker{margin-block-end:var(--space-3);font-size:.75rem;line-height:1.8;display:flex;align-items:center;gap:var(--space-3);font-weight:500}
.flavor-indicator{width:.5rem;height:.5rem;border-radius:50%;background:var(--flavor-color,var(--color-mango));box-shadow:0 0 0 4px color-mix(in srgb,var(--flavor-color,var(--color-mango)) 15%,transparent)}
.hero-title{font-size:clamp(3.4rem,7.1vw,6.5rem);font-weight:900;line-height:1.7;white-space:nowrap}
.hero-main-word{font-size:1.28em}
.hero-tagline{display:block;font-size:.74em;line-height:1.7}
.hero-description{font-size:.875rem;max-width:23rem;min-height:3.5rem;margin-block:var(--space-4) var(--space-5)}
.hero-cta{margin-block-start:var(--space-2)}
.hero-art{position:relative;width:100%;height:100%;min-height:0;display:grid;place-items:center;isolation:isolate;pointer-events:none}
.hero-can-motion{position:absolute;inset:0;display:grid;place-items:center;z-index:3;transform-style:preserve-3d;perspective:1000px}
.hero-can-image{height:clamp(25rem,75svh,45rem);width:auto;max-width:none;object-fit:contain;filter:drop-shadow(10px 28px 16px rgb(40 19 50 / .17));user-select:none}
.hero-can-layer{position:absolute;inset:0;display:grid;place-items:center;will-change:opacity}
.hero-splash-orbit{position:absolute;inset-inline:-5%;inset-block:0;display:grid;place-items:center;z-index:1}
.hero-splash-layer{position:absolute;inset:0;display:grid;place-items:center}
.hero-splash{width:100%;height:auto;max-height:88%;object-fit:contain;filter:drop-shadow(0 10px 15px rgb(40 19 50 / .07));user-select:none}
.hero-shadow{position:absolute;inset-block-end:6%;inset-inline:24%;height:var(--space-5);border-radius:50%;background:color-mix(in srgb,var(--color-primary) 15%,transparent);filter:blur(12px);z-index:0}
.hero-bottom{position:relative;z-index:5;min-height:5.25rem;flex:none;display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);border-block-start:1px solid color-mix(in srgb,var(--color-primary) 15%,transparent)}
.flavor-tabs{display:flex;gap:var(--space-2);align-items:center;flex-wrap:wrap;min-width:0}
.flavor-tab{border:1px solid color-mix(in srgb,var(--color-primary) 20%,transparent);background:transparent;border-radius:99rem;min-height:2.75rem;display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);font-size:.6875rem;font-weight:600;line-height:1.7;transition:background .3s,border-color .3s,transform .3s}
.flavor-tab:hover{transform:translateY(-2px);border-color:var(--color-primary)}
.flavor-tab[aria-pressed=true]{background:var(--flavor-color,var(--color-accent));border-color:transparent;color:var(--color-primary)}
.flavor-tab[data-flavor=blue][aria-pressed=true],.flavor-tab[data-flavor=ruby][aria-pressed=true]{color:var(--color-card)}
.flavor-tab-number{opacity:.75;font-size:.625rem}
.scroll-hint{font-size:.625rem;line-height:1.8;display:flex;align-items:center;gap:var(--space-3);font-weight:600;white-space:nowrap}
.scroll-hint svg{width:1rem;height:1rem;animation:hint-bounce 2.4s ease-in-out infinite}
.hero-progress-track{position:absolute;inset-block-end:0;inset-inline:0;height:2px;background:transparent;overflow:hidden}
.hero-progress{height:100%;width:100%;background:var(--color-primary);transform-origin:right}
@keyframes hint-bounce{0%,100%{transform:translateY(-2px)}50%{transform:translateY(3px)}}

/* معرفی تعاملی */
.discovery-section{padding-block:var(--space-8);background:var(--scene-color,var(--color-mango-wash));transition:background-color .65s}
.discovery-layout{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:var(--space-8);min-height:44rem}
.discovery-art{position:relative;display:grid;place-items:center;min-height:40rem;isolation:isolate}
.discovery-ring{position:absolute;width:82%;aspect-ratio:1;border:1px solid color-mix(in srgb,var(--color-primary) 16%,transparent);border-radius:50%;z-index:-1}
.discovery-ring::after{content:"";position:absolute;inset:var(--space-6);border:1px solid color-mix(in srgb,var(--color-primary) 8%,transparent);border-radius:50%}
.discovery-fruit{position:absolute;width:90%;height:90%;object-fit:contain;z-index:0;transform:rotate(-15deg)}
.discovery-can-wrap{position:relative;z-index:2;filter:drop-shadow(15px 25px 18px rgb(40 19 50 / .15))}
.discovery-can{height:39rem;width:auto;max-width:none;object-fit:contain;transform:rotate(12deg)}
.discovery-copy{min-width:0;position:relative;z-index:3}
.discovery-copy .z-eyebrow{margin-block-end:var(--space-4)}
.discovery-title{font-size:clamp(2.5rem,4.5vw,4.25rem);line-height:1.7;margin-block-end:var(--space-4)}
.discovery-body{max-width:30rem;font-size:.875rem;margin-block-end:var(--space-6)}
.discovery-copy .flavor-tabs{margin-block-end:var(--space-5)}
.flavor-note{padding:var(--space-5);background:color-mix(in srgb,var(--color-card) 35%,transparent);border-radius:var(--radius-md);min-height:9rem}
.flavor-note-heading{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);margin-block-end:var(--space-2)}
.flavor-note h3{font-size:1.25rem}
.flavor-note span{font-size:.6875rem}
.flavor-note p{font-size:.8125rem}
.discovery-link{margin-block-start:var(--space-4);font-size:.75rem}

/* طیف زرد و چیدمان بادبزنی */
.spectrum-section{padding-block:var(--space-8) 0;background:var(--color-accent);overflow:clip}
.spectrum-heading{text-align:center;position:relative;z-index:2}
.spectrum-heading .z-eyebrow{justify-content:center;margin-block-end:var(--space-3)}
.spectrum-title{font-size:clamp(2.75rem,6.1vw,5.5rem);line-height:1.7}
.spectrum-title span{display:block}
.spectrum-lineup{display:flex;align-items:flex-end;justify-content:center;width:100%;max-width:65rem;margin:var(--space-4) auto 0;min-height:25rem;padding-inline:var(--space-5);padding-block-end:var(--space-6);position:relative}
.spectrum-item{position:relative;flex:0 0 34%;margin-inline:-4.5%;z-index:2;min-width:0;transform-origin:50% 90%}
.spectrum-item img{width:100%;height:auto;object-fit:contain;filter:drop-shadow(12px 26px 13px rgb(40 19 50 / .18));user-select:none}
.spectrum-fruit{position:absolute!important;width:52%!important;height:auto!important;inset-block-end:var(--space-2);inset-inline-start:-1%;z-index:3;filter:drop-shadow(3px 10px 6px rgb(40 19 50 / .1))!important}
.spectrum-baseline{display:flex;justify-content:space-between;align-items:center;gap:var(--space-5);border-block-start:1px solid color-mix(in srgb,var(--color-primary) 20%,transparent);padding-block:var(--space-4);font-size:.6875rem;font-weight:600}
.spectrum-baseline .z-cta{font-size:.6875rem;min-height:2.75rem}

/* مجموعه چهارتایی */
.flavors-section{padding-block:var(--space-9);background:var(--color-surface)}
.collection-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--space-8);margin-block-end:var(--space-7)}
.collection-heading .z-eyebrow{margin-block-end:var(--space-3)}
.collection-heading h2{font-size:clamp(2.75rem,5.2vw,5rem);line-height:1.7}
.collection-heading p{max-width:24rem;font-size:.875rem;padding-block-end:var(--space-4)}
.flavor-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-5)}
.flavor-card{background:var(--color-card);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .4s var(--ease-out),box-shadow .4s;min-width:0}
.flavor-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.flavor-card-media{display:block;position:relative;aspect-ratio:4/5;background:var(--flavor-wash,var(--color-wash));isolation:isolate;overflow:hidden}
.card-cutout-can{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:2;transition:transform .65s var(--ease-out);filter:drop-shadow(6px 14px 9px rgb(40 19 50 / .17))}
.card-cutout-fruit{position:absolute;inset-inline:5%;inset-block-end:10%;width:90%;height:75%;object-fit:contain;z-index:1;transition:transform .65s var(--ease-out)}
.flavor-card:hover .card-cutout-can{transform:translateY(-6px) rotate(4deg)}
.flavor-card:hover .card-cutout-fruit{transform:scale(1.08) rotate(-5deg)}
.card-media-arrow{position:absolute;inset-inline-end:var(--space-3);inset-block-start:var(--space-3);width:2rem;height:2rem;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--color-primary) 20%,transparent);border-radius:50%;z-index:3;transition:background .3s,color .3s}
.card-media-arrow svg{width:1rem;height:1rem}
.flavor-card:hover .card-media-arrow{background:var(--color-primary);color:var(--color-card)}
.flavor-card-info{padding:var(--space-5) var(--space-4)}
.card-eyebrow{font-size:.625rem;color:var(--color-ink-muted);font-weight:500;line-height:1.9}
.flavor-card-info h3{font-size:1.6rem;line-height:1.7;margin-block:var(--space-1) var(--space-2)}
.flavor-card-description{font-size:.75rem;min-height:3rem;color:var(--color-ink-muted)}
.flavor-facts{margin-block:var(--space-4);font-size:.6875rem}
.flavor-facts div{display:flex;justify-content:space-between;gap:var(--space-3);padding-block:var(--space-2);border-block-start:1px solid var(--color-line)}
.flavor-facts dt{color:var(--color-ink-muted)}
.flavor-facts dd{margin:0;font-weight:500;text-align:end}
.card-detail-link{width:100%;min-height:2.75rem;padding:var(--space-2) var(--space-3);font-size:.6875rem;justify-content:space-between}

/* داستان برند با تصویر واقعی */
.story-section{padding-block:0 var(--space-9);background:var(--color-surface)}
.story-layout{display:grid;grid-template-columns:1.35fr 1fr;min-height:38rem;overflow:hidden;border-radius:var(--radius-md)}
.story-visual{position:relative;min-width:0;min-height:38rem;overflow:hidden}
.story-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:56% 50%}
.story-copy{min-width:0;background:var(--color-primary);color:var(--color-card);padding:var(--space-7);display:flex;flex-direction:column;justify-content:center;gap:var(--space-5)}
.story-copy .z-eyebrow{color:var(--color-accent)}
.story-title{font-size:clamp(2.25rem,3.7vw,3.5rem);color:var(--color-accent);line-height:1.7}
.story-copy p{font-size:.875rem;color:color-mix(in srgb,var(--color-card) 85%,var(--color-primary));max-width:25rem}
.story-copy .z-cta{align-self:flex-start;color:var(--color-accent);margin-block-start:var(--space-4)}
.story-signature{font-size:.6875rem!important;margin-block-start:var(--space-3);padding-block-start:var(--space-4);border-block-start:1px solid color-mix(in srgb,var(--color-card) 20%,transparent)}

/* پایان بنفش مرجع */
.finale-section{padding-block:var(--space-8) var(--space-7);background:var(--color-primary);color:var(--color-accent);text-align:center;overflow:clip}
.finale-title{font-size:clamp(2.75rem,7.3vw,6.5rem);font-weight:900;line-height:1.7}
.finale-description{font-size:.8125rem;color:color-mix(in srgb,var(--color-card) 80%,var(--color-primary));margin-block:var(--space-2) var(--space-4)}
.finale-cans{display:flex;justify-content:center;align-items:center;width:100%;max-width:44rem;margin:var(--space-5) auto var(--space-6);padding-inline:var(--space-4)}
.finale-can{flex:0 0 30%;margin-inline:-2.5%;position:relative;min-width:0;display:block;transition:transform .5s var(--ease-out)}
.finale-can img{width:100%;height:auto;object-fit:contain;filter:drop-shadow(3px 20px 14px rgb(0 0 0 / .25));transition:transform .5s var(--ease-out)}
.finale-can:hover img{transform:translateY(-14px) rotate(-5deg)}
.finale-buy{min-width:12rem}
.finale-note{color:color-mix(in srgb,var(--color-card) 75%,var(--color-primary));font-size:.6875rem;margin-block-start:var(--space-4)}
.site-footer{background:var(--color-primary);color:color-mix(in srgb,var(--color-card) 80%,var(--color-primary));padding-inline:var(--page-gutter)}
.footer-inner{border-block-start:1px solid color-mix(in srgb,var(--color-card) 18%,transparent);padding-block:var(--space-5);display:flex;align-items:center;justify-content:space-between;gap:var(--space-5)}
.footer-brand{display:flex;align-items:center;gap:var(--space-4)}
.footer-logo{width:4rem;height:4rem;object-fit:contain}
.footer-brand p{font-size:.6875rem}
.footer-links{display:flex;align-items:center;gap:var(--space-6);font-size:.6875rem}
.footer-links a{min-height:2.75rem;display:flex;align-items:center;gap:var(--space-2);transition:color .2s}
.footer-links a:hover{color:var(--color-accent)}
.footer-links svg{width:1rem;height:1rem}

/* پنجره‌های واقعی و دسترس‌پذیر */
.z-dialog{margin:auto;padding:0;border:0;background:var(--color-surface);color:var(--color-ink);border-radius:var(--radius-xl);width:min(calc(100% - var(--space-6)),58rem);max-width:none;max-height:calc(100dvh - var(--space-6));overflow:auto;box-shadow:var(--shadow-xl);overscroll-behavior:contain}
.z-dialog[open]{animation:dialog-in .3s var(--ease-out)}
.z-dialog::backdrop{background:rgb(24 10 31 / .72);backdrop-filter:blur(8px);animation:backdrop-in .25s ease-out}
.dialog-close{position:absolute;inset-block-start:var(--space-4);inset-inline-end:var(--space-4);width:2.75rem;height:2.75rem;display:grid;place-items:center;border:1px solid var(--color-line);border-radius:50%;background:var(--color-surface);color:var(--color-primary);z-index:10;transition:transform .25s}
.dialog-close:hover{transform:rotate(90deg)}
.dialog-close svg{width:1.25rem;height:1.25rem}
.dialog-body{position:relative;min-width:0}
.product-detail{display:grid;grid-template-columns:1fr 1fr;min-height:37rem}
.product-poster{position:relative;min-height:37rem;overflow:hidden}
.product-poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.product-detail-copy{padding:var(--space-8) var(--space-6) var(--space-6);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--space-4);min-width:0}
.product-detail-copy h3{font-size:2.25rem}
.product-detail-copy p{font-size:.875rem}
.product-detail-copy .flavor-facts{width:100%;margin-block:var(--space-3)}
.product-detail-copy .z-cta{width:100%}
.product-disclaimer{font-size:.6875rem!important;color:var(--color-ink-muted)}
.purchase-dialog{max-width:45rem}
.purchase-content{padding:var(--space-7) var(--space-6) var(--space-6)}
.purchase-heading{padding-inline-end:var(--space-7);margin-block-end:var(--space-5)}
.purchase-heading h3{font-size:1.75rem;margin-block-end:var(--space-2)}
.purchase-heading p{font-size:.8125rem;color:var(--color-ink-muted)}
.purchase-form{display:flex;flex-direction:column;gap:var(--space-5)}
.purchase-form fieldset{padding:0;border:0;margin:0;min-width:0}
.form-label,.purchase-form legend{display:block;font-size:.75rem;font-weight:600;margin-block-end:var(--space-2)}
.purchase-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-2)}
.purchase-option{position:relative;display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-2);border:1px solid var(--color-line);border-radius:var(--radius-md);font-size:.6875rem;min-height:2.75rem;cursor:pointer;transition:background .25s,border-color .25s}
.purchase-option:has(input:checked){background:var(--flavor-wash,var(--color-wash));border-color:var(--color-primary);font-weight:700}
.purchase-option:has(input:focus-visible){outline:3px solid var(--color-blue);outline-offset:3px}
.purchase-option-dot{width:.5rem;height:.5rem;background:var(--flavor-color,var(--color-mango));border-radius:50%;flex:none}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.form-field{min-width:0}
.form-input{width:100%;min-height:3rem;border:1px solid var(--color-line);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);background:var(--color-card);color:var(--color-ink);font-size:.875rem;line-height:1.8;transition:border-color .2s,box-shadow .2s;min-width:0}
.form-input:focus{border-color:var(--color-primary)}
.form-input::placeholder{color:var(--color-ink-muted);opacity:.8}
textarea.form-input{resize:vertical;min-height:6rem}
.phone-input{direction:ltr;text-align:right}
.quantity-control{display:flex;align-items:center;border:1px solid var(--color-line);border-radius:var(--radius-md);background:var(--color-card);width:fit-content;min-height:3rem;overflow:hidden}
.quantity-control button{width:3rem;height:3rem;display:grid;place-items:center;background:transparent;border:0;transition:background .2s}
.quantity-control button:hover:not(:disabled){background:var(--color-wash)}
.quantity-control button:disabled{opacity:.3}
.quantity-control svg{width:1rem;height:1rem}
.quantity-control input{width:4rem;min-width:0;text-align:center;background:transparent;border:0;padding:var(--space-2);font-size:.875rem;color:var(--color-primary)}
.quantity-line{display:flex;justify-content:space-between;gap:var(--space-4);align-items:center}
.quantity-hint{font-size:.6875rem;color:var(--color-ink-muted);max-width:18rem}
.form-consent{display:flex;gap:var(--space-3);align-items:flex-start;font-size:.6875rem;color:var(--color-ink-muted)}
.form-consent input{accent-color:var(--color-primary);margin-block-start:var(--space-1);flex:none;width:1rem;height:1rem}
.purchase-submit{width:100%;border:0}
.purchase-submit svg{width:1.125rem;height:1.125rem}
.form-error{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:color-mix(in srgb,var(--color-error) 8%,var(--color-card));color:var(--color-error);font-size:.8125rem;line-height:1.9;border:1px solid color-mix(in srgb,var(--color-error) 25%,transparent)}
.form-honeypot{position:absolute;inset-inline-start:-9999px;width:1px;height:1px;overflow:hidden}
.purchase-success{padding:var(--space-8) var(--space-6);text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--space-5)}
.success-icon{width:4rem;height:4rem;border-radius:50%;display:grid;place-items:center;background:var(--color-lime-wash);color:var(--color-success)}
.success-icon svg{width:1.75rem;height:1.75rem}
.purchase-success h3{font-size:1.75rem}
.purchase-success p{font-size:.875rem;max-width:28rem}
.success-note{font-size:.75rem!important;color:var(--color-ink-muted)}
.is-spinning{animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes dialog-in{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes backdrop-in{from{opacity:0}to{opacity:1}}
.not-found{padding-block:calc(var(--header-height) + var(--space-9)) var(--space-9);min-height:75dvh;background:var(--color-wash);text-align:center;display:flex;align-items:center;justify-content:center}
.not-found h1{font-size:clamp(3rem,10vw,8rem)}
.not-found p{margin-block:var(--space-4) var(--space-6)}

@media(min-width:1600px){.hero-title{font-size:7rem}.hero-can-image{height:48rem}.hero-stage{max-width:86rem}}
@media(max-width:1100px){
  :root{--page-gutter:var(--space-6)}
  .hero-title{font-size:6.8vw}.hero-description{max-width:21rem}.hero-can-image{height:min(70svh,40rem)}
  .discovery-layout{gap:var(--space-6)}.discovery-can{height:34rem}.discovery-art{min-height:35rem}.discovery-title{font-size:3rem}
  .flavor-grid{gap:var(--space-4)}.flavor-card-info{padding:var(--space-4)}.flavor-card-info h3{font-size:1.4rem}
  .story-copy{padding:var(--space-6)}.story-layout{grid-template-columns:1.15fr 1fr}
}
@media(max-width:800px){
  .header-nav{gap:var(--space-5)}.header-nav-link{font-size:.75rem}.brand-word{font-size:1.25rem}
  .hero-title{font-size:6.6vw}.hero-description{font-size:.8125rem}.hero-cta{padding-inline:var(--space-5)}.scroll-hint span{max-width:7rem;white-space:normal}
  .flavor-tab{padding-inline:var(--space-3)}
  .discovery-layout{grid-template-columns:.9fr 1fr;gap:var(--space-5);min-height:36rem}.discovery-art{min-height:32rem}.discovery-can{height:30rem}.discovery-title{font-size:2.25rem}
  .discovery-body{font-size:.8125rem}.discovery-copy .flavor-tabs{gap:var(--space-1)}.discovery-copy .flavor-tab{font-size:.625rem;padding-inline:var(--space-2)}
  .collection-heading{gap:var(--space-6)}.collection-heading p{max-width:18rem;font-size:.8125rem}.flavor-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5)}
  .flavor-card-media{aspect-ratio:1/1.1}.flavor-card-info{padding:var(--space-5)}.flavor-card-info h3{font-size:1.7rem}.flavor-card-description{min-height:0}
  .story-layout{grid-template-columns:1fr}.story-visual{min-height:32rem}.story-copy{padding:var(--space-7)}.story-copy p{max-width:34rem}.story-title{font-size:3rem}
}
@media(max-width:600px){
  :root{--page-gutter:1.25rem;--header-height:4.5rem}
  .brand-logo{width:3.25rem;height:3.25rem}.brand-word{font-size:1.25rem}.brand-link{gap:var(--space-2)}.header-inner{gap:var(--space-3)}
  .header-nav{display:none}.header-buy{margin-inline-start:auto;min-height:2.75rem;font-size:.6875rem;padding:var(--space-2) var(--space-4);gap:var(--space-2)}.mobile-nav-toggle{display:flex}
  .hero-experience{height:290svh;min-height:100dvh}.hero-stage{height:100svh;min-height:0}
  .hero-content{display:flex;flex-direction:column;gap:0;align-items:stretch;min-height:0;flex:1}.hero-copy{padding-block:var(--space-4) 0;flex:none}
  .hero-kicker{font-size:.625rem;margin-block-end:var(--space-1);gap:var(--space-2)}
  .hero-title{font-size:clamp(2.75rem,11.5vw,4rem);line-height:1.7}.hero-main-word{font-size:1.22em}.hero-tagline{font-size:.72em}
  .hero-description{font-size:.75rem;line-height:1.9;min-height:0;max-width:22rem;margin-block:var(--space-2) var(--space-3)}
  .hero-cta{font-size:.6875rem;min-height:2.75rem;margin-block-start:0;padding:var(--space-2) var(--space-5)}
  .hero-art{flex:1;height:auto;min-height:0;margin-block-start:var(--space-1)}.hero-can-image{height:100%;max-height:43svh;max-width:none;width:auto}.hero-can-layer{height:100%}.hero-can-motion{max-height:100%;inset-inline:5%}
  .hero-splash-orbit{inset-inline:10%;inset-block:0}.hero-splash{height:100%;width:100%;max-height:100%;object-fit:contain}.hero-shadow{inset-block-end:5%;inset-inline:33%;height:var(--space-3)}
  .hero-bottom{min-height:5.75rem;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:var(--space-2);padding-block:var(--space-2)}
  .hero-bottom .flavor-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-1)}.hero-bottom .flavor-tab{min-height:2.75rem;font-size:.625rem;padding:var(--space-2) var(--space-1);gap:var(--space-1)}.flavor-tab-number{font-size:.5625rem}
  .scroll-hint{justify-content:center;font-size:.5625rem;gap:var(--space-2)}.scroll-hint span{max-width:none;white-space:nowrap}.scroll-hint svg{width:.75rem;height:.75rem}
  .discovery-section{padding-block:var(--space-7)}.discovery-layout{display:flex;flex-direction:column-reverse;gap:var(--space-5);min-height:0;align-items:stretch}.discovery-title{font-size:clamp(2rem,9vw,3rem)}.discovery-body{max-width:100%;font-size:.8125rem;margin-block-end:var(--space-5)}
  .discovery-copy .flavor-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-1)}.discovery-copy .flavor-tab{font-size:.625rem;min-height:2.75rem}.discovery-copy .flavor-tab-number{display:none}
  .discovery-art{min-height:25rem;height:25rem;width:100%;max-width:27rem;margin-inline:auto}.discovery-can{height:25rem}.discovery-ring{width:78%}.discovery-fruit{height:90%;width:90%}.flavor-note{min-height:0;padding:var(--space-4)}
  .spectrum-section{padding-block-start:var(--space-7)}.spectrum-title{font-size:clamp(2.5rem,10vw,3.75rem)}.spectrum-heading .z-eyebrow{font-size:.625rem}.spectrum-lineup{padding-inline:0;min-height:0;margin-block-start:var(--space-5);padding-block-end:var(--space-5);width:115%;margin-inline:-7.5%}.spectrum-item{flex-basis:35%;margin-inline:-5%}
  .spectrum-baseline{font-size:.625rem;gap:var(--space-3)}.spectrum-baseline .z-cta{font-size:.625rem;gap:var(--space-2)}
  .flavors-section{padding-block:var(--space-8)}.collection-heading{flex-direction:column;align-items:flex-start;gap:var(--space-4);margin-block-end:var(--space-6)}.collection-heading h2{font-size:2.75rem}.collection-heading p{max-width:100%;padding:0;font-size:.8125rem}
  .flavor-grid{grid-template-columns:1fr;gap:var(--space-6)}.flavor-card-media{aspect-ratio:1.12;max-height:24rem}.flavor-card-info{padding:var(--space-5)}.flavor-card-info h3{font-size:1.75rem}.card-eyebrow{font-size:.6875rem}.flavor-card-description{font-size:.8125rem}.flavor-facts{font-size:.75rem}.card-detail-link{font-size:.75rem;min-height:3rem}
  .story-section{padding-block-end:var(--space-8)}.story-layout{border-radius:var(--radius-md)}.story-visual{min-height:23rem}.story-visual img{object-position:55% center}.story-copy{padding:var(--space-6);gap:var(--space-4)}.story-title{font-size:2.5rem}.story-copy p{font-size:.8125rem}
  .finale-section{padding-block:var(--space-7)}.finale-title{font-size:clamp(2.25rem,10vw,3.5rem)}.finale-description{max-width:18rem;margin-inline:auto;font-size:.75rem}.finale-cans{width:112%;margin-inline:-6%;padding-inline:0;margin-block:var(--space-6)}.finale-can{flex-basis:31%;margin-inline:-3%}.finale-buy{min-height:3rem}
  .footer-inner{flex-direction:column;align-items:stretch;gap:var(--space-3);padding-block:var(--space-4)}.footer-brand{justify-content:space-between}.footer-logo{width:3.5rem;height:3.5rem}.footer-brand p{font-size:.625rem}.footer-links{justify-content:space-between;gap:var(--space-3);font-size:.625rem}
  .z-dialog{width:calc(100% - var(--space-5));max-height:calc(100dvh - var(--space-5));border-radius:var(--radius-lg)}.product-detail{grid-template-columns:1fr;min-height:0}.product-poster{min-height:0;height:auto;aspect-ratio:1.15}.product-poster img{object-position:50% 35%}.product-detail-copy{padding:var(--space-5)}.product-detail-copy h3{font-size:1.75rem}.product-detail-copy p{font-size:.8125rem}
  .purchase-content{padding:var(--space-7) var(--space-5) var(--space-5)}.purchase-heading h3{font-size:1.5rem}.purchase-heading p{font-size:.75rem}.purchase-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2)}.purchase-option{font-size:.75rem}.form-grid{grid-template-columns:1fr}.quantity-line{align-items:flex-start}.quantity-hint{max-width:11rem;font-size:.625rem}.quantity-control button{width:2.75rem}.quantity-control input{width:3rem}.purchase-form{gap:var(--space-4)}.purchase-success{padding:var(--space-8) var(--space-5)}
}
@media(max-width:600px) and (max-height:720px){.hero-description{display:none}.hero-kicker{margin:0}.hero-cta{margin-block-start:var(--space-2)}.hero-title{font-size:2.5rem}.hero-copy{padding-block-start:var(--space-2)}.hero-bottom{min-height:5.25rem}.hero-can-image{max-height:44svh}}
@media(min-width:601px) and (max-height:760px){.hero-title{font-size:clamp(3rem,6.4vw,5.5rem)}.hero-stage{min-height:36rem}.hero-can-image{height:72svh}.hero-bottom{min-height:4.5rem}.hero-description{margin-block:var(--space-2) var(--space-3)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.hero-can-motion,.hero-splash-orbit{will-change:auto}.hero-can-image{filter:drop-shadow(4px 14px 12px rgb(40 19 50 / .15))}}

/* SAZITO_PLATFORM_CONTAINER_FIX_SCRUM_4531 */
/* No author .container rule found; Tailwind's built-in .container
   utility never had a phone gutter in EITHER preview or a real build
   (width:100% + breakpoint max-width, no padding/margin, ever) — see
   platformContainerFix.ts for the full mechanism, verified both ways.
   Scoped to @layer components (not unlayered) so a REAL utility class the
   author DID apply — e.g. class="container px-8" — still wins: Tailwind's
   own @layer utilities (publish) and its unlayered runtime injection
   (preview) both outrank @layer components; this default only applies
   when nothing else sets padding/margin at all. */
@layer components {
  .container {
    margin-inline: auto;
    padding-inline: 1rem;
  }
  @media (min-width: 640px) {
    .container {
      padding-inline: 1.5rem;
    }
  }
}