/* billOn landing page. Palette F "Tomato and Cream". Poppins. */

@font-face{font-family:"Poppins Fallback";src:local("Arial");size-adjust:112%;ascent-override:93%;descent-override:31%;line-gap-override:9%}

:root{
  color-scheme:light;
  --tomato-50:#FDEADE;--tomato-100:#FBDBCF;--tomato-200:#F8BFB0;--tomato-300:#F39B89;--tomato-400:#EE705B;
  --tomato-500:#E8452C;--tomato-600:#C83E2A;--tomato-700:#A93827;--tomato-800:#853025;--tomato-900:#602922;--tomato-950:#3E221F;
  --teal-50:#ECEAE2;--teal-100:#D9DCD7;--teal-200:#B2C1BF;--teal-300:#829FA2;--teal-400:#49757F;
  --teal-500:#0F4C5C;--teal-600:#0E4453;--teal-700:#0C3D4A;--teal-800:#0B343F;--teal-900:#0A2C35;--teal-950:#08242B;
  --saffron-50:#FEF1DE;--saffron-100:#FEEBCE;--saffron-200:#FCDEAD;--saffron-300:#FACD84;--saffron-400:#F8BA54;
  --saffron-500:#F6A623;--saffron-600:#D49222;--saffron-700:#B37E21;--saffron-800:#8C671F;--saffron-900:#66501E;
  --cream-50:#FFFAF4;--cream-100:#FFF7EB;--cream-200:#FFF3E3;--cream-300:#F5E4D0;--cream-400:#ECD7BE;--cream-500:#CAB59E;
  --paper:#FFFBF7;

  --bg:var(--cream-200);--surface:var(--cream-50);--surface-2:var(--cream-100);
  --ink:var(--teal-500);--ink-strong:var(--teal-900);--ink-muted:#3E6770;
  --accent:var(--tomato-500);--accent-text:var(--tomato-700);
  --cta-bg:var(--tomato-600);--cta-bg-hover:var(--tomato-700);--cta-ink:var(--cream-200);
  --focus:var(--teal-900);
  --line:rgba(15,76,92,.14);--line-dash:rgba(15,76,92,.35);
  --wm-letters:var(--teal-500);--wm-plate:var(--tomato-500);--wm-cut:var(--cream-200);

  --r-xs:6px;--r-sm:10px;--r-md:16px;--r-lg:24px;--r-xl:32px;--r-pill:999px;
  --sh-1:0 1px 2px rgba(15,76,92,.08),0 2px 6px rgba(15,76,92,.06);
  --sh-2:0 4px 12px rgba(15,76,92,.10),0 12px 28px rgba(15,76,92,.08);
  --sh-3:0 12px 32px rgba(15,76,92,.14),0 32px 64px rgba(15,76,92,.12);
  --sh-paper:0 1px 0 rgba(15,76,92,.06),0 18px 40px -12px rgba(15,76,92,.28);
  --sh-dark:0 24px 60px -20px rgba(0,0,0,.45);
  --sh-cta:0 10px 24px -8px rgba(200,62,42,.55);

  --gutter:16px;
  --section-y:clamp(72px, 4rem + 8vw, 160px);
  --container:1240px;
  --hdr-h:60px;

  --ff:"Poppins","Poppins Fallback",system-ui,sans-serif;
  --ff-mono:ui-monospace,"SF Mono",Menlo,Consolas,"Roboto Mono",monospace;
  --fs-mega:clamp(3.4rem, 1rem + 10vw, 11rem);
  --fs-h1:clamp(2.9rem, 1.4rem + 6.2vw, 7.5rem);
  --fs-h2:clamp(2.125rem, 1.2rem + 3.8vw, 4.5rem);
  --fs-h3:clamp(1.25rem, 1rem + .8vw, 1.625rem);
  --fs-lede:clamp(1.0625rem, 1rem + .4vw, 1.3125rem);
  --fs-body:clamp(1rem, .95rem + .2vw, 1.0625rem);

  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-back:cubic-bezier(.34,1.56,.64,1);
}
@media (min-width:768px){:root{--gutter:32px}}
@media (min-width:1024px){:root{--gutter:48px;--hdr-h:72px}}

[data-zone="teal"],.hdr[data-theme="teal"]{
  --bg:var(--teal-500);--surface:var(--teal-700);--surface-2:var(--teal-800);
  --ink:var(--cream-200);--ink-strong:var(--cream-50);--ink-muted:var(--teal-200);
  --accent:var(--saffron-500);--accent-text:var(--saffron-500);--focus:var(--saffron-500);
  --line:rgba(255,243,227,.14);--line-dash:rgba(255,243,227,.3);
  --wm-letters:var(--cream-200);--wm-plate:var(--tomato-500);--wm-cut:var(--teal-500);
}
[data-zone="tomato"],.hdr[data-theme="tomato"]{
  --bg:var(--tomato-500);--ink:var(--cream-200);--ink-strong:var(--cream-50);--ink-muted:var(--cream-200);
  --accent-text:var(--cream-200);
  --cta-bg:var(--teal-500);--cta-bg-hover:var(--teal-700);--cta-ink:var(--cream-200);
  --line:rgba(255,243,227,.25);
  --wm-letters:var(--cream-200);--wm-plate:var(--cream-200);--wm-cut:var(--tomato-500);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hdr-h) + 8px)}
@media (prefers-reduced-motion:no-preference){html.is-static{scroll-behavior:smooth}}
@media (prefers-reduced-motion:reduce){html,html.is-static{scroll-behavior:auto}}
body{margin:0;background:var(--cream-200);color:var(--teal-500);font-family:var(--ff);font-size:var(--fs-body);line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
img{height:auto}
h1,h2,h3,h4,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:6px}
[tabindex="-1"]:focus{outline:none}
.nowrap{white-space:nowrap}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.wrap{width:100%;max-width:calc(var(--container) + var(--gutter)*2);margin-inline:auto;padding-inline:var(--gutter)}
.page{overflow-x:hidden}
@supports (overflow:clip){.page{overflow-x:clip}}
.skip{position:fixed;left:12px;top:-60px;z-index:200;background:var(--teal-900);color:var(--cream-200);padding:12px 18px;border-radius:12px;text-decoration:none;font-weight:600;transition:top .2s}
.skip:focus{top:12px}

/* ---------- wordmark ---------- */
.wm{height:1em;width:auto;overflow:visible}
.wm .bo-letters{fill:var(--wm-letters)}
.wm .bo-plate,.wm .bo-spoon{fill:var(--wm-plate)}
.wm .bo-glint{fill:none;stroke:var(--wm-cut);stroke-width:16;stroke-linecap:round;opacity:.55}
.wm .bo-plate-g{transform-box:fill-box;transform-origin:50% 50%}
.wm--mono .bo-letters,.wm--mono .bo-plate,.wm--mono .bo-spoon{fill:#161616}

/* ---------- type ---------- */
h2{font-size:var(--fs-h2);font-weight:800;line-height:1.02;letter-spacing:-.03em;color:var(--ink);text-wrap:balance}
h3{font-size:var(--fs-h3);font-weight:600;line-height:1.2;letter-spacing:-.01em}
.lede{font-size:var(--fs-lede);line-height:1.55;color:var(--ink-muted);max-width:38em;margin-top:20px;text-wrap:pretty}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-text);margin-bottom:18px}
.eyebrow::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--accent);box-shadow:inset 0 0 0 2px var(--bg),inset 0 0 0 3px var(--accent)}
.sec-head{max-width:860px;margin-bottom:clamp(40px,5vw,72px)}
.sec-head--center{margin-inline:auto;text-align:center}
.sec-head--center .lede{margin-inline:auto}
.closer{font-weight:800;font-size:clamp(1.35rem,1rem + 1.4vw,2.2rem);line-height:1.2;letter-spacing:-.02em;color:var(--ink);margin-top:48px;max-width:26em;text-wrap:balance}
.closer--center{text-align:center;margin-inline:auto}
.split-line{display:block}
.split-line-mask{display:block;padding-bottom:.2em;margin-bottom:-.2em}

/* ---------- buttons + chips ---------- */
.btn{font-family:var(--ff);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:var(--r-pill);font-weight:600;font-size:1rem;text-decoration:none;cursor:pointer;border:0;overflow:hidden;isolation:isolate;white-space:nowrap;-webkit-tap-highlight-color:transparent}
@media (min-width:1024px){.btn{min-height:56px;padding:0 30px;font-size:1.0625rem}}
.btn__fill{position:absolute;inset:0;z-index:-1;border-radius:inherit;transform:translateY(101%);transition:transform .45s var(--ease-out)}
.btn__label,.btn__icon{position:relative;display:inline-block}
.btn__icon{width:20px;height:20px;transition:transform .35s var(--ease-out)}
.btn:hover .btn__fill{transform:translateY(0)}
.btn:hover .btn__icon{transform:translateX(4px)}
.btn--primary{background:var(--cta-bg);color:var(--cta-ink);box-shadow:var(--sh-cta)}
.btn--primary .btn__fill{background:var(--cta-bg-hover)}
.btn--ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 2px currentColor}
.btn--ghost .btn__fill{background:var(--line)}
.btn--teal{background:var(--teal-500);color:var(--cream-200);box-shadow:0 10px 24px -10px rgba(8,36,43,.6)}
.btn--teal .btn__fill{background:var(--teal-700)}
.btn--sm{min-height:44px;padding:0 20px;font-size:.9375rem}
@media (min-width:1024px){.btn--sm{min-height:46px;padding:0 22px;font-size:.9375rem}}
.btn--block{width:100%}

.chip{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:4px 12px;border-radius:var(--r-pill);font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;line-height:1.2;white-space:nowrap;vertical-align:middle}
.chip--soon{background:var(--saffron-500);color:var(--teal-900)}
.chip--demo{background:var(--saffron-500);color:var(--teal-900);box-shadow:inset 0 0 0 1px var(--teal-900)}
.chip--xs{min-height:20px;padding:2px 8px;font-size:.625rem;letter-spacing:.1em}
.chip--eyebrow{background:var(--surface);color:var(--tomato-700);box-shadow:inset 0 0 0 1.5px var(--line);text-transform:none;letter-spacing:0;font-size:.875rem;font-weight:600;padding:6px 14px;white-space:normal;text-wrap:balance}
@media (max-width:479px){.chip--eyebrow{font-size:.75rem;padding:5px 12px}}
.chip--cream{background:var(--cream-200);color:var(--tomato-700);margin-bottom:22px}
.chip--inline{min-height:22px;padding:2px 9px;font-size:.6875rem;margin-left:4px}
.pulse{width:7px;height:7px;border-radius:50%;background:var(--teal-900)}

.card{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:28px}
.card--dark{background:var(--teal-700);box-shadow:none;border:1px solid var(--line)}

/* ---------- paper + zigzag ---------- */
.paper{position:relative;background:var(--paper);box-shadow:var(--sh-paper)}
.paper::after{content:"";position:absolute;left:0;right:0;bottom:1px;height:10px;transform:translateY(100%);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10'%3E%3Cpath d='M0 0 L8 10 L16 0 Z' fill='%23FFFBF7'/%3E%3C/svg%3E") repeat-x;background-size:16px 10px}
.paper--both::before{content:"";position:absolute;left:0;right:0;top:1px;height:10px;transform:translateY(-100%);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10'%3E%3Cpath d='M0 10 L8 0 L16 10 Z' fill='%23FFFBF7'/%3E%3C/svg%3E") repeat-x;background-size:16px 10px}
.paper--flat::after{display:none}

/* ---------- header ---------- */
.hdr{position:fixed;inset:0 0 auto 0;z-index:50;height:var(--hdr-h);color:var(--ink)}
.is-shot .hdr{position:absolute}
.hdr__bg{position:absolute;inset:0;opacity:0;transition:opacity .35s ease}
.hdr.is-hidden .hdr__cta,.hdr.is-hidden .hdr__bg{box-shadow:none}
.hdr__bg--cream{background:rgba(255,243,227,.94);box-shadow:0 1px 0 var(--line)}
.hdr__bg--teal{background:rgba(15,76,92,.95);box-shadow:0 1px 0 rgba(255,243,227,.1)}
.hdr__bg--tomato{background:rgba(200,62,42,.98);box-shadow:0 1px 0 rgba(255,243,227,.2)}
.hdr[data-theme="cream"] .hdr__bg--cream,.hdr[data-theme="teal"] .hdr__bg--teal,.hdr[data-theme="tomato"] .hdr__bg--tomato{opacity:1}
.hdr__in{position:relative;height:100%;display:flex;align-items:center;gap:24px}
.hdr__logo{display:block;font-size:26px;line-height:0;flex:none;padding:4px 0}
@media (max-width:1023px){.hdr__logo{font-size:22px}}
.hdr__logo:hover .bo-plate-g{transform:rotate(360deg);transition:transform .9s var(--ease-out)}
.hdr__nav{display:none;margin-left:auto;gap:4px}
.hdr__nav a{position:relative;text-decoration:none;font-size:.9375rem;font-weight:500;padding:10px 12px;border-radius:10px;white-space:nowrap}
.hdr__nav a::after{content:"";position:absolute;left:12px;right:12px;bottom:6px;height:2px;background:currentColor;border-radius:2px;transform:scaleX(0);transform-origin:right;transition:transform .35s var(--ease-out)}
.hdr__nav a:hover::after,.hdr__nav a.is-current::after{transform:scaleX(1);transform-origin:left}
.hdr__cta{margin-left:auto}
@media (min-width:1100px){.hdr__nav{display:flex}.hdr__cta{margin-left:8px}}
@media (min-width:1100px) and (max-width:1240px){.hdr__nav a{padding:10px 8px;font-size:.875rem}.hdr__nav a::after{left:8px;right:8px}}
.hdr__burger{display:inline-flex;flex-direction:column;justify-content:center;gap:6px;width:44px;height:44px;border-radius:12px;border:0;background:transparent;cursor:pointer;padding:0 10px;margin-left:4px}
.hdr__burger span{display:block;height:2.5px;background:currentColor;border-radius:2px;transition:transform .35s var(--ease-out)}
.hdr__burger[aria-expanded="true"] span:first-child{transform:translateY(4.25px) rotate(45deg)}
.hdr__burger[aria-expanded="true"] span:last-child{transform:translateY(-4.25px) rotate(-45deg)}
@media (min-width:1100px){.hdr__burger{display:none}}
@media (max-width:479px){.hdr__cta{display:none}.hdr__burger{margin-left:auto}}
.hdr__progress{position:absolute;left:0;right:0;bottom:0;height:2px;overflow:hidden}
.hdr__progress span{display:block;height:100%;background:var(--saffron-500);transform-origin:left;transform:scaleX(0)}
.is-static .hdr__progress{display:none}

.menu{--focus:var(--saffron-500);position:fixed;inset:0;z-index:80;background:var(--teal-500);color:var(--cream-200);padding:calc(var(--hdr-h) + 24px) var(--gutter) 32px;display:flex;flex-direction:column;justify-content:space-between;overflow-y:auto}
.menu[hidden]{display:none}
.menu nav{display:flex;flex-direction:column}
.menu nav a{font-size:clamp(1.9rem,1.2rem + 3vw,3rem);font-weight:800;letter-spacing:-.03em;text-decoration:none;padding:6px 0;line-height:1.15}
.menu__cta{--cta-bg:var(--tomato-600);--cta-bg-hover:var(--tomato-700);margin-top:32px}
body.menu-open .hdr{z-index:90;--focus:var(--saffron-500);--ink:var(--cream-200);--wm-letters:var(--cream-200);--wm-cut:var(--teal-500)}
body.menu-open .hdr__bg{opacity:0!important}
body.menu-open{overflow:hidden}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:clamp(640px,100svh,1000px);padding:calc(var(--hdr-h) + 40px) 0 72px;overflow:hidden;background:var(--cream-200)}
@supports (overflow:clip){.hero{overflow:clip}}
.hero__grid{position:relative;z-index:2;display:grid;gap:48px;align-items:start}
@media (min-width:1024px){
  .hero{padding-top:calc(var(--hdr-h) + 56px)}
  .hero__grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:32px}
  .hero__text{grid-column:1 / span 7;padding-top:12px}
  .hero__visual{grid-column:8 / span 5}
}
.hero__title{font-size:var(--fs-h1);font-weight:800;line-height:.95;letter-spacing:-.035em;color:var(--teal-500);margin:22px 0 0}
.h1-line{display:block}
.h1-line--2{color:var(--tomato-500)}
.swoosh-wrap{position:relative;display:inline-block;white-space:nowrap}
.swoosh{position:absolute;left:0;right:0;bottom:-.14em;width:100%;height:.22em;z-index:-1;overflow:visible}
.swoosh-cover{position:absolute;left:-2%;right:-2%;bottom:-.2em;height:.3em;background:var(--cream-200);transform-origin:right;transform:scaleX(0);z-index:-1}
.hero__lede{font-size:var(--fs-lede);color:var(--ink-muted);max-width:34em;margin-top:28px;line-height:1.55}
.hero__ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
@media (max-width:599px){.hero__ctas .btn{width:100%}}
.hero__early{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-top:22px;font-size:.9375rem;font-weight:600;color:var(--teal-700)}
.proof{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:32px;font-size:.9375rem;font-weight:500;color:var(--teal-700)}
.proof li{display:flex;align-items:center;gap:10px}
.tick{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--tomato-600);color:var(--cream-200)}
.tick svg{width:14px;height:14px}

.hero__visual{position:relative;min-height:560px}
.hero__photo{position:absolute;inset:0 0 0 12%;border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--sh-3);background:var(--cream-300)}
.hero__photo-in{position:absolute;inset:-8% 0;}
.hero__photo img{width:100%;height:100%;object-fit:cover;object-position:78% 50%}
.printer{position:relative;z-index:2;width:min(300px,78vw);margin-top:36px}
@media (min-width:1024px){.hero__visual{min-height:680px}.printer{margin-top:40px;margin-left:-6px}}
@media (max-width:1023px){
  .hero__visual{min-height:0;display:flex;flex-direction:column;align-items:center}
  .hero__photo{position:relative;inset:auto;width:100%;height:260px}
  .hero__photo-in{inset:-10% 0}
  .printer{margin-top:-120px;width:min(320px,84vw)}
}
.printer__body{position:relative;height:84px;border-radius:22px;background:linear-gradient(180deg,#155868,var(--teal-700));box-shadow:0 16px 30px -12px rgba(8,36,43,.55),inset 0 -6px 0 rgba(0,0,0,.18);z-index:3}
.printer__hl{position:absolute;left:18px;right:18px;top:8px;height:3px;border-radius:3px;background:var(--teal-400);opacity:.7}
.printer__led{position:absolute;left:22px;top:26px;width:10px;height:10px;border-radius:50%;background:var(--saffron-500);box-shadow:0 0 0 3px rgba(246,166,35,.25)}
.printer__btn{position:absolute;right:22px;top:22px;width:34px;height:16px;border-radius:8px;background:var(--tomato-500)}
.printer__slot{position:absolute;left:7%;right:7%;bottom:12px;height:7px;border-radius:4px;background:var(--teal-950)}
.printer__clip{position:relative;z-index:2;margin:-16px auto 0;width:86%;padding:0 6px 18px;overflow:hidden}
.receipt{padding:18px 16px 16px;font-family:var(--ff-mono);font-size:clamp(11px,3.1vw,12.5px);line-height:1.5;color:#1d2a2e;font-variant-numeric:tabular-nums;transform-origin:50% 0}
.rl{display:flex;justify-content:space-between;gap:8px;min-height:1.5em}
.rl .q{margin-left:auto;margin-right:6px;opacity:.8}
.rl--c{justify-content:center;text-align:center}
.rl--logo{justify-content:center;padding:2px 0 8px}
.rl--logo .wm{font-size:30px}
.rl--rule{min-height:0;height:1px;border-top:1.5px dashed rgba(29,42,46,.4);margin:7px 0}
.rl--total{font-weight:800;font-size:1.35em;align-items:baseline;margin:2px 0}
.rl--sm{font-size:.9em;opacity:.8}
.rl--bar{justify-content:center;padding-top:8px}
.barcode{display:block;width:78%;height:34px;background:repeating-linear-gradient(90deg,#1d2a2e 0 2px,transparent 2px 4px,#1d2a2e 4px 5px,transparent 5px 8px,#1d2a2e 8px 11px,transparent 11px 12px,#1d2a2e 12px 13px,transparent 13px 16px)}
.amt{display:inline-block;align-self:center;width:6ch;height:.5em;border-radius:3px;background:rgba(29,42,46,.22)}
.amt--s{width:4ch}
.amt--total{width:7ch;height:.62em;background:rgba(29,42,46,.55)}
.stamp--paid{position:absolute;right:8%;bottom:10px;padding:2px 12px;border:2.5px solid var(--tomato-600);color:var(--tomato-600);border-radius:8px;font-family:var(--ff);font-weight:800;font-size:1.6em;letter-spacing:.08em;transform:rotate(-10deg);background:rgba(255,251,247,.35)}

/* hero decorations: placed against the hero grid (--cx = outer gutter, content edge to viewport edge).
   Desktop: spoons live in the side gutters, the croissant in the strip above the headline, donut and samosa
   only where the gutter is wide enough. Mobile: beside the short headline and beside the receipt.
   main.js (fitDecor) then measures every one against the text, chips, photo and viewport, including its
   scroll travel, rotation and pointer drift, and hides any that would touch. */
.parallax{position:absolute;inset:0;z-index:1;pointer-events:none;--cx:max(var(--gutter),(100% - var(--container))/2)}
.js .parallax{opacity:0;transition:opacity .5s ease}
.js .parallax.is-fit{opacity:1}
.is-static .parallax{transition:none}
.px{position:absolute;width:var(--w);height:var(--h);margin-left:calc(var(--w)/-2)}
.px.is-off{visibility:hidden}
.px__in,.px svg{width:100%;height:100%}
.px--c1,.px--d1,.px--m1{filter:saturate(.7) blur(.6px);opacity:.85}
.px svg{overflow:visible}
/* mobile and tablet: single column */
.px--s1{--w:18px;--h:52px;left:calc(100% - var(--gutter) - 92px);top:calc(var(--hdr-h) + 136px)}
.px--s2{display:none}
.px--c1{--w:56px;--h:38px;left:calc(100% - var(--gutter) - 32px);top:calc(var(--hdr-h) + 90px)}
.px--d1{--w:48px;--h:48px;left:calc(var(--gutter) + 28px);top:auto;bottom:96px}
.px--m1{--w:42px;--h:38px;left:calc(100% - var(--gutter) - 24px);top:auto;bottom:80px}
@media (min-width:600px) and (max-width:1023px){
  .px--s1{--w:22px;--h:64px;left:calc(100% - var(--gutter) - 124px)}
  .px--c1{--w:72px;--h:48px;left:calc(100% - var(--gutter) - 44px)}
  .px--d1{--w:56px;--h:56px;left:calc(var(--gutter) + 34px)}
  .px--m1{--w:48px;--h:44px;left:calc(100% - var(--gutter) - 30px)}
}
@media (max-width:359px){.px{display:none}}
/* desktop: two columns, decorations in the gutters and above the headline */
@media (min-width:1024px){
  .px--s1{--w:20px;--h:58px;left:calc(var(--cx)/2);top:calc(var(--hdr-h) + 84px)}
  .px--s2{display:block;--w:18px;--h:52px;left:calc(100% - var(--cx)/2);top:calc(var(--hdr-h) + 300px)}
  .px--c1{--w:76px;--h:51px;left:calc(var(--cx) + (100% - 2*var(--cx))*.49);top:calc(var(--hdr-h) + 20px)}
  .px--d1,.px--m1{display:none}
}
@media (min-width:1440px){
  .px--s1{--w:28px;--h:82px}
  .px--s2{--w:24px;--h:70px}
  .px--c1{--w:88px;--h:59px;top:calc(var(--hdr-h) + 18px)}
  .px--d1{display:block;--w:56px;--h:56px;left:calc(var(--cx)/2);top:calc(var(--hdr-h) + 420px);bottom:auto}
  .px--m1{display:block;--w:48px;--h:43px;left:calc(100% - var(--cx)/2);top:calc(var(--hdr-h) + 520px);bottom:auto}
}
@media (min-width:1600px){
  .px--s1{--w:36px;--h:104px}
  .px--s2{--w:28px;--h:80px}
  .px--d1{--w:76px;--h:76px}
  .px--m1{--w:62px;--h:56px}
}
.scrollcue{position:absolute;left:var(--gutter);bottom:22px;z-index:3;display:none;width:18px;height:48px;background:var(--paper);box-shadow:var(--sh-1);text-decoration:none}
.scrollcue span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-90deg);font-size:.625rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-500)}
@media (min-width:1024px){.scrollcue{display:block;left:max(var(--gutter),calc((100vw - var(--container))/2 - 40px))}}

.motion-pending [data-hero-in],.motion-pending .hero__title{opacity:0}

/* ---------- TICKER ---------- */
.ticker{position:relative;height:190px;display:grid;place-items:center;overflow:hidden;background:var(--cream-200)}
@supports (overflow:clip){.ticker{overflow:clip}}
.ribbon{position:absolute;left:-6vw;width:112vw;height:64px;display:flex;align-items:center;overflow:hidden}
.ribbon--a{background:var(--tomato-500);color:var(--cream-200);transform:rotate(-3deg);z-index:2;box-shadow:0 10px 30px -14px rgba(96,41,34,.45)}
.ribbon--b{background:var(--saffron-500);color:var(--teal-900);transform:rotate(2deg);z-index:1}
.ribbon__track{display:flex;width:max-content;will-change:transform}
.ribbon__list{display:flex;flex:none}
.ribbon__list li{display:flex;align-items:center;gap:22px;padding-right:22px;font-weight:800;font-size:clamp(1.25rem,1rem + 1vw,1.75rem);letter-spacing:-.01em;white-space:nowrap}
.ribbon__list li::after{content:"";flex:none;width:.62em;height:.62em;border-radius:50%;background:currentColor;box-shadow:inset 0 0 0 .1em currentColor,inset 0 0 0 .15em var(--rb, var(--tomato-500)),inset 0 0 0 .5em currentColor}
.ribbon--b .ribbon__list li{--rb:var(--saffron-500)}
.ribbon__pause{position:absolute;right:calc(6vw + var(--gutter));top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;border:0;background:var(--cream-200);color:var(--tomato-700);display:grid;place-items:center;cursor:pointer;box-shadow:0 2px 8px rgba(96,41,34,.3)}
.ribbon__pause span{width:10px;height:12px;border-left:3px solid currentColor;border-right:3px solid currentColor}
.ribbon__pause[aria-pressed="true"] span{width:0;height:0;border:0;border-left:11px solid currentColor;border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:3px}
.is-static .ribbon__pause{display:none}
@media (max-width:767px){.ticker{height:120px}.ribbon{height:52px}.ribbon--b{display:none}}

/* ---------- SOUND FAMILIAR ---------- */
.why{position:relative;padding:var(--section-y) 0 calc(var(--section-y) * .6);background:var(--cream-200)}
.why__grid{display:grid;gap:48px}
@media (min-width:1024px){
  .why__grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:32px}
  .why__head{grid-column:1 / span 5;position:sticky;top:120px;align-self:start}
  .pains{grid-column:6 / span 7}
}
.pains{display:grid;gap:20px;align-items:start}
@media (min-width:640px){
  .pains{grid-template-columns:1fr 1fr;padding-bottom:80px}
  .pain:nth-child(even){top:80px}
}
.pain{position:relative;background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:26px 24px 26px;display:flex;flex-direction:column}
.pain__no{font-family:var(--ff-mono);font-weight:700;font-size:.8125rem;color:var(--tomato-700);letter-spacing:.06em}
.pain__t{font-size:.8125rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--teal-500);margin:6px 0 14px;line-height:1.5}
.pain__t .chip{margin-left:4px;letter-spacing:.06em}
.pain__p{font-size:1.125rem;font-weight:500;line-height:1.45;color:var(--teal-700);letter-spacing:-.005em}
.strike{--sk:100%;--sy:88%;--sh:.62em;--sa:.14;background:linear-gradient(rgba(232,69,44,var(--sa)),rgba(232,69,44,var(--sa))) no-repeat 0 var(--sy)/var(--sk) var(--sh);padding:0 2px 1px;margin:0 -2px;border-radius:3px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.pain__fix{display:flex;gap:12px;align-items:flex-start;margin-top:18px;padding-top:18px;border-top:1.5px dashed var(--line-dash)}
.pain__fix p{font-size:.975rem;color:var(--teal-700);line-height:1.55}
.pain__fix b{color:var(--tomato-700);font-weight:600}
.pain__ok{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--tomato-600);color:var(--cream-200);margin-top:1px}
.pain__ok svg{width:16px;height:16px}
.pain--soon .pain__ok{background:var(--saffron-500);color:var(--teal-900)}
.pain__fix .chip--inline{margin-left:2px;margin-top:8px}
.pains__more{display:none}
@media (max-width:639px){
  .pains.is-collapsed .pain:nth-child(n+5){display:none}
  .pains__more{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:52px;margin-top:16px;border:0;border-radius:var(--r-pill);background:var(--teal-500);color:var(--cream-200);font-weight:600;cursor:pointer}
  .pains__more svg{width:18px;height:18px;transition:transform .3s var(--ease-out)}
  .pains__more[aria-expanded="true"] svg{transform:rotate(45deg)}
}
.pain__img{margin:-4px 0 16px;border-radius:var(--r-md);overflow:hidden;aspect-ratio:16/9}
.pain__img img{width:100%;height:100%;object-fit:cover;object-position:50% 45%}

/* ---------- TEAL ZONE ---------- */
.zone{position:relative}
.zone--teal{background:var(--teal-500);color:var(--cream-200);z-index:3}
.zone--teal::before,.zone--teal::after{content:"";position:absolute;left:0;right:0;height:14px;background-repeat:repeat-x;background-size:22px 14px;pointer-events:none}
.zone--teal::before{top:-13px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='14'%3E%3Cpath d='M0 14 L11 0 L22 14 Z' fill='%230F4C5C'/%3E%3C/svg%3E")}
.zone--teal::after{bottom:-13px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='14'%3E%3Cpath d='M0 0 L11 14 L22 0 Z' fill='%230F4C5C'/%3E%3C/svg%3E")}
.zone--cream2{background:var(--cream-200);z-index:2}
.zone--tomato{background:var(--tomato-500);color:var(--cream-200);z-index:2}

/* ---------- OFFLINE ---------- */
.offline{padding:var(--section-y) 0 calc(var(--section-y) * .6)}
.offline__stage{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;align-items:center}
@media (min-width:1024px){
  .offline__stage{grid-template-columns:repeat(12,minmax(0,1fr));gap:32px}
  .offline__text{grid-column:1 / span 5}
  .scene{grid-column:6 / span 7}
  .has-pin .offline{padding-top:0}
  .has-pin .offline__stage{min-height:100vh;padding-top:calc(var(--hdr-h) + 24px);padding-bottom:32px}
}
.steps3{display:grid;gap:12px;margin-top:32px}
.steps3 li{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border-radius:var(--r-md);background:rgba(255,243,227,.05);border:1px solid var(--line);transition:opacity .4s ease,background-color .4s ease,border-color .4s ease}
.steps3 p{color:var(--teal-100);font-size:.975rem;line-height:1.5}
.steps3 b{color:var(--cream-50);font-weight:600}
.steps3__n{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--saffron-500);color:var(--teal-900);font-weight:800;font-size:.875rem}
.has-gsap .steps3 li{opacity:.5}
.has-gsap .steps3 li.is-active{opacity:1;background:rgba(246,166,35,.1);border-color:rgba(246,166,35,.45)}

.scene{position:relative;min-width:0;background:var(--teal-800);border-radius:var(--r-xl);box-shadow:var(--sh-dark);padding:22px;border:1px solid var(--line)}
@media (min-width:768px){.scene{padding:28px}}
.scene__top{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.scene__label{font-weight:600;font-size:1.0625rem;color:var(--cream-50)}
.switch{position:relative;flex:none;width:88px;height:48px;border-radius:var(--r-pill);border:0;padding:0;cursor:pointer;overflow:hidden;background:transparent}
.switch__on,.switch__off{position:absolute;inset:0;border-radius:inherit;transition:opacity .35s ease}
.switch__on{background:var(--saffron-500);opacity:0}
.switch__off{background:var(--teal-400)}
.switch__knob{position:absolute;left:4px;top:4px;width:40px;height:40px;border-radius:50%;background:var(--cream-50);box-shadow:0 3px 8px rgba(0,0,0,.25);transition:transform .45s var(--ease-back)}
.scene__cloud{position:relative;margin-left:auto;display:flex;align-items:center;gap:6px;color:var(--teal-200);font-size:.8125rem}
.scene__cloud svg{width:34px;height:34px}
.scene__cloud b{font-weight:600;letter-spacing:.08em}
.scene__cloudok{position:absolute;left:18px;top:-6px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--saffron-500);color:var(--teal-900);transform:scale(0);transition:transform .4s var(--ease-back)}
.scene__cloudok svg{width:12px;height:12px}
.pos{background:var(--teal-950);border-radius:20px;padding:10px;position:relative}
.pos__bar{display:flex;align-items:center;gap:10px;background:var(--cream-100);border-radius:12px 12px 0 0;padding:10px 12px;color:var(--teal-900);border-bottom:1px solid var(--line)}
.pos__brand{font-weight:600;font-size:.8125rem;white-space:nowrap}
@media (max-width:479px){.pp{font-size:.625rem;padding:3px 8px}.pos__bar{gap:6px;padding:8px 10px}}
.pos__print{white-space:nowrap}
@media (max-width:419px){.scene .pos__body{grid-template-columns:minmax(0,1fr)}.scene .pos__items span{font-size:.625rem;white-space:nowrap;letter-spacing:-.01em}.scene .pos__print{margin-top:6px}}
@media (max-width:359px){.scene .pp{white-space:normal;line-height:1.2}.scene .pos__pill{min-width:0;flex:1}.switch{width:76px;height:42px}.switch__knob{width:34px;height:34px}.scene.is-online .switch__knob,.scene.is-synced .switch__knob{transform:translateX(34px)}.scene{padding:16px}.scene .pos__body{grid-template-columns:1fr}.scene .pos__items{grid-template-columns:repeat(3,minmax(0,1fr))}}
.pos__wifi{position:relative;width:22px;height:22px;margin-left:auto}
.pos__wifi svg{width:22px;height:22px}
.pos__wifi .arc,.pos__wifi .dot{transition:opacity .35s ease,transform .35s ease;transform-box:fill-box;transform-origin:50% 100%}
.pos__slash{position:absolute;left:-2px;right:-2px;top:50%;height:3px;border-radius:2px;background:var(--tomato-500);transform:rotate(45deg) scaleX(0);transition:transform .35s var(--ease-out)}
.pos__pill{position:relative;display:grid;font-size:.75rem;font-weight:600}
.pp{grid-area:1/1;display:flex;align-items:center;justify-content:center;padding:4px 10px;border-radius:var(--r-pill);white-space:nowrap;opacity:0;transition:opacity .3s ease;text-align:center}
.pp--on{background:var(--teal-700);color:var(--teal-100)}
.pp--off{background:var(--saffron-500);color:var(--teal-900)}
.pp--sync{background:var(--teal-700);color:var(--cream-50)}
.pos__body{position:relative;display:grid;grid-template-columns:1.6fr 1fr;gap:10px;background:var(--cream-50);border-radius:0 0 12px 12px;padding:12px;overflow:hidden}
.pos__items{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pos__items span{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 4px;border-radius:10px;background:var(--cream-200);font-size:.6875rem;font-weight:600;color:var(--teal-900);text-align:center;line-height:1.2}
.pos__items svg{width:34px;height:26px}
.pos__cart{display:flex;flex-direction:column;gap:7px;padding:10px;border-radius:10px;background:var(--cream-100);border:1px solid var(--line)}
.pos__line{height:8px;border-radius:4px;background:var(--teal-100)}
.pos__line--s{width:60%}
.pos__print{margin-top:auto;text-align:center;font-size:.75rem;font-weight:600;background:var(--tomato-600);color:var(--cream-200);padding:7px 6px;border-radius:8px}
.pos__vignette{position:absolute;inset:0;background:var(--teal-950);opacity:0;pointer-events:none;transition:opacity .4s ease}
.scene__slot{position:relative;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-top:18px;min-height:112px}
.minis{position:relative;width:170px;height:104px}
.mr{position:absolute;left:0;bottom:0;width:70px;height:92px;background:var(--paper);border-radius:4px 4px 0 0;padding:12px 10px;display:flex;flex-direction:column;gap:7px;opacity:0;transform:translate(var(--ox),-20px) scale(.9) rotate(var(--r));transition:transform .45s var(--ease-back),opacity .3s ease;box-shadow:0 6px 14px -6px rgba(0,0,0,.45)}
.mr::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:6px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0 L5 6 L10 0 Z' fill='%23FFFBF7'/%3E%3C/svg%3E") repeat-x;background-size:10px 6px}
.mr i{display:block;height:5px;border-radius:3px;background:var(--teal-100)}
.mr i:nth-child(2){width:70%}
.mr i:nth-child(3){margin-top:auto;height:7px;background:var(--teal-300)}
.mr--1{--r:-4deg;--ox:0px}.mr--2{--r:3deg;--ox:28px}.mr--3{--r:-2deg;--ox:56px}.mr--4{--r:5deg;--ox:84px}
.mr.show{opacity:1;transform:translate(var(--ox),0) scale(1) rotate(var(--r))}
.scene__count{font-size:.875rem;color:var(--teal-200);text-align:right}
.scene__n{display:inline-block;min-width:1.2ch;color:var(--saffron-500);font-size:1.4em;font-weight:800;margin-left:4px;font-variant-numeric:tabular-nums}
/* states */
.scene.is-online .switch__on,.scene.is-synced .switch__on{opacity:1}
.scene.is-online .switch__knob,.scene.is-synced .switch__knob{transform:translateX(40px)}
.scene.is-online .pp--on,.scene.is-offline .pp--off,.scene.is-synced .pp--sync{opacity:1}
.scene.is-offline .pos__slash{transform:rotate(45deg) scaleX(1)}
.scene.is-offline .pos__wifi .arc3{opacity:0;transform:scale(.6) translateY(4px)}
.scene.is-offline .pos__wifi .arc2{opacity:0;transform:scale(.6) translateY(4px);transition-delay:.06s}
.scene.is-offline .pos__wifi .arc1{opacity:.35;transition-delay:.12s}
.scene.is-offline .pos__vignette{opacity:.12}
.scene.is-synced .mr.show{opacity:0;transform:translate(var(--fx,300px),var(--fy,-360px)) scale(.3) rotate(0deg);transition:transform .7s cubic-bezier(.65,0,.35,1),opacity .6s ease .15s}
.scene.is-synced .mr--2{transition-delay:.08s}.scene.is-synced .mr--3{transition-delay:.16s}.scene.is-synced .mr--4{transition-delay:.24s}
.scene.is-synced .scene__cloudok{transform:scale(1);transition-delay:.7s}
.scene.is-synced .scene__cloud{color:var(--saffron-500)}
.scene__replay{display:none;margin:14px auto 0;background:none;border:0;color:var(--saffron-500);font-weight:600;text-decoration:underline;text-underline-offset:4px;cursor:pointer;padding:8px 12px;min-height:44px}
.has-gsap .scene__replay{display:block}
@media (min-width:1024px){.has-pin .scene__replay{display:none}}

.offline__more{display:grid;gap:20px;margin-top:56px}
@media (min-width:768px){.offline__more{grid-template-columns:1fr 1fr}.offline__more .closer{grid-column:1 / -1}}
.works h3{display:flex;align-items:center;gap:12px;font-size:1.1875rem;color:var(--cream-50);margin-bottom:16px;flex-wrap:wrap}
.works h3 svg{width:30px;height:30px;padding:6px;border-radius:50%;background:var(--saffron-500);color:var(--teal-900)}
.works--wait h3 svg{background:var(--teal-400);color:var(--cream-50)}
.works__sub{font-weight:500;color:var(--teal-200);font-size:.9375rem}
.works ul{display:grid;gap:10px}
.works li{position:relative;padding-left:22px;color:var(--teal-100)}
.works li::before{content:"";position:absolute;left:0;top:.62em;width:9px;height:9px;border-radius:50%;background:var(--saffron-500)}
.works--wait li::before{background:transparent;box-shadow:inset 0 0 0 2px var(--teal-200)}
.offline .closer{color:var(--cream-50)}

/* ---------- KITCHEN ---------- */
.kitchen{position:relative;padding:calc(var(--section-y)*.5) 0 calc(var(--section-y)*.5)}
.kitchen__viewport{width:100%;max-width:calc(var(--container) + var(--gutter)*2);margin-inline:auto;padding-inline:var(--gutter)}
.kitchen-track{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
@media (min-width:768px){.kitchen-track{grid-template-columns:repeat(2,minmax(0,1fr))}.kpanel--intro{grid-column:1 / -1}}
@media (min-width:1024px){.kitchen-track{grid-template-columns:repeat(6,minmax(0,1fr))}.kitchen-track .kpanel{grid-column:span 2}.kitchen-track .kpanel:nth-child(5),.kitchen-track .kpanel:nth-child(6){grid-column:span 3}.kitchen-track .kpanel--intro{grid-column:1 / -1}}
.kpanel{position:relative;min-width:0;max-width:100%;background:var(--teal-800);border:1px solid var(--line);border-radius:var(--r-xl);padding:28px;display:flex;flex-direction:column;gap:22px}
.kpanel--intro{background:transparent;border:0;padding:0 0 12px;display:grid;gap:28px}
@media (min-width:768px){.kpanel--intro{grid-template-columns:1.1fr 1fr;align-items:center}}
.kpanel--intro .lede{max-width:30em}
.kpanel__photo{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:3/2;box-shadow:var(--sh-dark);position:relative}
.kpanel__photo-in{position:absolute;inset:-8% 0}
.kpanel__photo img{width:100%;height:100%;object-fit:cover}
.kpanel__no{display:block;font-family:var(--ff-mono);font-weight:700;font-size:clamp(2.5rem,2rem + 2vw,4rem);line-height:1;color:var(--saffron-500);margin-bottom:12px;letter-spacing:-.04em}
.kpanel h3{color:var(--cream-50);font-size:clamp(1.4rem,1.1rem + 1vw,2rem);font-weight:800;letter-spacing:-.02em}
.kpanel__text p{color:var(--teal-100);margin-top:10px;max-width:30em}
.kmock{position:relative;background:var(--cream-50);color:var(--teal-900);border-radius:20px;padding:22px 18px 18px;box-shadow:var(--sh-dark);font-size:.8125rem;margin-top:auto}
.kmock__chip{position:absolute;right:12px;top:-10px}
.ind{display:grid;gap:8px}
.ind__o{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-radius:12px;background:var(--cream-200)}
.ind__o b{font-weight:600}
.ind__chip small{font-size:.9em;font-weight:500;opacity:.85}
.ind__chip{display:inline-block;flex:none;padding:3px 10px;border-radius:var(--r-pill);background:var(--tomato-600);color:var(--cream-200);font-weight:600;font-size:.75rem;white-space:nowrap}
.inbox{display:flex;align-items:center;gap:10px;margin-top:12px;padding:12px;border-radius:12px;background:var(--teal-500);color:var(--cream-200);font-weight:600}
.inbox svg{width:22px;height:22px}
.inbox__badge{margin-left:auto;display:grid;place-items:center;min-width:28px;height:28px;border-radius:14px;background:var(--saffron-500);color:var(--teal-900);font-weight:800}
.plan{display:grid;gap:2px}
.plan__h,.plan__r{display:grid;grid-template-columns:1.1fr .6fr 1.6fr;gap:8px;padding:8px 10px;border-radius:8px;align-items:center}
.plan__h{font-size:.6875rem;text-transform:uppercase;letter-spacing:.1em;font-weight:600;color:#3E6770;background:var(--cream-200)}
.plan__r{border-bottom:1px dashed rgba(15,76,92,.2)}
.plan__r span:first-child{font-weight:600}
.plan__r span:last-child{color:#3E6770;font-size:.75rem}
.mono{font-family:var(--ff-mono);font-weight:700;font-variant-numeric:tabular-nums}
.disp{padding:14px 14px 10px;font-family:var(--ff-mono);font-size:.75rem;border-radius:8px}
.disp__h{display:flex;justify-content:space-between;gap:8px;padding-bottom:8px;margin-bottom:6px;border-bottom:1.5px dashed rgba(15,76,92,.35)}
.disp__r{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:10px;padding:4px 0}
.disp__r span{white-space:nowrap}
.disp__r .exp{color:var(--tomato-700);font-weight:700;text-align:right}
/* a narrow sheet (phones, and the slim desktop panel): item + qty on one line, batch + expiry under it,
   so a long name never runs into the qty. Container query where supported, width fallback otherwise. */
.disp{container-type:inline-size}
@container (max-width:380px){.disp__h{flex-wrap:wrap}.disp__r{grid-template-columns:minmax(0,1fr) auto;gap:0 8px;padding:5px 0}.disp__r span:nth-child(2){text-align:right}.disp__r span:nth-child(3){opacity:.7}.disp__r + .disp__r{border-top:1px dotted rgba(15,76,92,.2)}}
@supports not (container-type:inline-size){@media (max-width:1279px){.disp__h{flex-wrap:wrap}.disp__r{grid-template-columns:minmax(0,1fr) auto;gap:0 8px;padding:5px 0}.disp__r span:nth-child(2){text-align:right}.disp__r span:nth-child(3){opacity:.7}.disp__r + .disp__r{border-top:1px dotted rgba(15,76,92,.2)}}}
@media (max-width:359px){.ind__o{flex-wrap:wrap;gap:4px 8px}.ind__chip{flex:0 1 auto;white-space:normal}}
@media (max-width:479px){.disp{padding:12px 10px 8px;font-size:.6875rem}.disp__r{gap:6px}.kpanel:not(.kpanel--intro){padding:20px}.kmock{padding:20px 14px 14px}}
.road{position:relative;height:44px;margin-top:12px;border-bottom:2px dashed rgba(15,76,92,.3)}
.road__van{position:absolute;right:6px;bottom:2px;width:64px;height:36px}
.recv{display:grid;gap:8px}
.recv li{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:10px;padding:10px 12px;border-radius:12px;background:var(--cream-200);font-weight:600}
.recv em{grid-column:2;font-style:normal;font-weight:500;color:#3E6770;font-size:.75rem}
.recv__ok{grid-row:span 2;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--teal-500);color:var(--cream-200);font-weight:800}
.recv__ok svg{width:14px;height:14px}
.recv .is-short{background:var(--saffron-100);box-shadow:inset 0 0 0 1.5px var(--saffron-500)}
.recv .is-short .recv__ok{background:var(--saffron-500);color:var(--teal-900)}
.recv__tag{grid-column:2;justify-self:start;margin-top:4px;padding:2px 8px;border-radius:var(--r-pill);background:var(--teal-900);color:var(--saffron-300);font-size:.6875rem;text-transform:uppercase;letter-spacing:.08em}
.flowbars{display:grid;gap:10px}
.fb__legend{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;font-size:.6875rem;font-weight:600;color:#3E6770}
.fb__legend span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.fb__legend i{width:10px;height:10px;border-radius:3px}
.fb__row{display:grid;grid-template-columns:96px 1fr;gap:10px;align-items:end}
.fb__row b{font-weight:600;font-size:.75rem;padding-bottom:2px}
.fb__bars{display:flex;align-items:flex-end;gap:5px;height:58px;padding:0 4px;border-bottom:1.5px solid rgba(15,76,92,.25)}
.fb__bars i{flex:1;height:calc(var(--h)*100%);border-radius:4px 4px 0 0;transform-origin:50% 100%;min-height:3px}
.c1{background:var(--teal-300)}.c2{background:var(--teal-500)}.c3{background:var(--saffron-500)}.c4{background:var(--tomato-500)}.c5{background:var(--tomato-900)}
.rail{display:none}
.kitchen .closer--big{font-size:clamp(1.9rem,1.1rem + 3vw,3.6rem);letter-spacing:-.03em;max-width:calc(var(--container) + var(--gutter)*2);margin-top:64px;color:var(--cream-50)}
.kitchen .closer--big span{color:var(--saffron-500)}

/* horizontal (desktop, motion only) */
@media (min-width:1024px){
  .has-hscroll .kitchen{padding:0 0 var(--section-y)}
  .has-hscroll .kitchen__pin{position:relative;height:100vh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding-top:var(--hdr-h)}
  .has-hscroll .kitchen__viewport{max-width:none;padding:0}
  .has-hscroll .kitchen-track{--kg:calc(max(0px,(100% - var(--container) - var(--gutter)*2) / 2) + var(--gutter));display:flex;width:max-content;gap:4vw;padding:0 var(--kg);align-items:center;will-change:transform}
  .has-hscroll .kitchen-track .kpanel{grid-column:auto}
  .has-hscroll .kpanel--intro{width:40vw;max-width:620px;display:flex;flex-direction:column;justify-content:center;gap:20px}
  .has-hscroll .kpanel--intro .kpanel__photo{max-height:30vh;aspect-ratio:auto;height:30vh}
  .has-hscroll .kpanel--intro h2{font-size:clamp(2.2rem,1rem + 2.6vw,3.6rem)}
  .has-hscroll .kpanel{width:min(70vw,1040px);height:auto;min-height:min(52vh,460px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:40px;align-items:center;padding:48px}
  .has-hscroll .kpanel.kpanel--intro{height:auto;padding:0;display:flex;flex-direction:column;justify-content:center;gap:24px;grid-template-columns:none}
  .has-hscroll .kpanel--intro .kpanel__photo{width:100%}
  .has-hscroll .kmock{margin-top:0}
  .has-hscroll .kmock__chip{top:-10px}
  .has-hscroll .rail{display:block;position:relative;flex:none;height:40px;margin:28px auto 0;width:min(70vw,900px)}
  .rail__line{position:absolute;left:0;right:0;top:50%;border-top:2px dashed rgba(255,243,227,.3)}
  .rail__fill{position:absolute;left:0;right:0;top:calc(50% - 1px);height:3px;background:var(--saffron-500);border-radius:2px;transform-origin:left;transform:scaleX(0)}
  .rail__dot{position:absolute;top:50%;left:calc(var(--i)*25%);width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--teal-300);transition:transform .3s var(--ease-back),background-color .3s}
  .rail__dot.is-on{background:var(--saffron-500);transform:scale(1.4)}
  .rail__van{position:absolute;left:0;top:50%;width:56px;height:32px;margin:-30px 0 0 -28px}
}
@media (min-width:1280px){.has-hscroll .kmock{zoom:1.15}}
@media (min-width:1440px){.has-hscroll .kmock{zoom:1.3}}

/* ---------- FEATURES ---------- */
.features{padding:calc(var(--section-y)*.7) 0 calc(var(--section-y)*.5)}
.fgrid{display:grid;gap:16px;grid-auto-flow:dense}
@media (max-width:639px){.fgrid{grid-template-columns:minmax(0,1fr);gap:10px;align-items:start}.fcard{padding:16px 18px}.fcard__ic{width:40px;height:40px;border-radius:12px;margin-bottom:12px}.fcard__ic svg{width:20px;height:20px}.fcard:not(.fcard--hero):not(.fcard--wide){display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:14px;align-items:start}.fcard:not(.fcard--hero):not(.fcard--wide) .fcard__ic{grid-row:span 2;margin:2px 0 0}.fcard h3{font-size:1rem;line-height:1.3;margin-bottom:4px}.fcard p{font-size:.875rem;line-height:1.45}.fcard--hero h3{font-size:1.375rem}}
@media (min-width:640px){.fgrid{grid-template-columns:repeat(2,1fr)}.fcard--hero{grid-column:span 2}.fcard--wide{grid-column:span 2}}
@media (min-width:1024px){.fgrid{grid-template-columns:repeat(4,1fr);gap:20px}.fcard--hero{grid-column:span 2;grid-row:span 2}.fcard--wide{grid-column:span 2}}
.fcard{position:relative;background:var(--teal-700);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px;transition:transform .45s var(--ease-out)}
.fcard::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 24px 48px -18px rgba(0,0,0,.55);opacity:0;transition:opacity .45s ease;pointer-events:none}
@media (hover:hover) and (pointer:fine){.fcard:hover{transform:translateY(-4px)}.fcard:hover::after{opacity:1}}
.fcard__ic{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:rgba(246,166,35,.14);color:var(--saffron-500);margin-bottom:18px}
.fcard__ic svg{width:24px;height:24px}
.fcard h3{font-size:1.1875rem;color:var(--cream-50);margin-bottom:8px}
.fcard p{color:var(--teal-100);font-size:.9375rem;line-height:1.55}
.fcard--hero{display:flex;flex-direction:column;background:linear-gradient(160deg,var(--teal-700),var(--teal-800))}
.fcard--hero h3{font-size:clamp(1.5rem,1.2rem + 1vw,2rem);font-weight:800}
.minipos{display:grid;grid-template-columns:1.5fr 1fr;gap:10px;margin-top:auto;padding-top:24px}
.minipos__grid{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;background:var(--cream-50);padding:10px;border-radius:14px}
.minipos__grid span{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px;border-radius:10px;background:var(--cream-200);color:var(--teal-900);font-size:.6875rem;font-weight:600;text-align:center;line-height:1.2}
.minipos__grid svg{width:40px;height:30px}
.ripple{position:absolute;left:0;top:0;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:var(--tomato-500);opacity:0;pointer-events:none}
.minipos__cart{display:flex;flex-direction:column;gap:8px;background:var(--cream-50);border-radius:14px;padding:12px;color:var(--teal-900);font-size:.75rem}
.minipos__cart b{font-weight:800;font-size:.8125rem}
.mc{display:flex;justify-content:space-between;gap:6px;padding:6px 8px;border-radius:8px;background:var(--cream-200);font-weight:600}
.mc em{font-style:normal;color:#3E6770}
.minipos__print{margin-top:auto;text-align:center;padding:8px;border-radius:9px;background:var(--tomato-600);color:var(--cream-200);font-weight:600}
@media (max-width:479px){.minipos{grid-template-columns:1fr}}
.miniflow{display:flex;align-items:center;gap:6px;margin-top:18px;flex-wrap:wrap}
.miniflow span{padding:6px 12px;border-radius:var(--r-pill);background:var(--cream-200);color:var(--teal-900);font-size:.8125rem;font-weight:600}
.miniflow i{width:18px;height:2px;background:var(--saffron-500);border-radius:2px}
@media (max-width:479px){.miniflow i{display:none}.miniflow span{font-size:.75rem;padding:5px 10px}.miniflow span:not(:last-of-type)::after{content:"\203A";margin-left:6px;color:var(--saffron-700);font-weight:800}}
.soon{margin-top:clamp(48px,6vw,80px);padding:clamp(24px,3vw,40px);border-radius:var(--r-xl);border:1.5px dashed var(--line-dash)}
.soon__t{font-size:clamp(1.4rem,1.1rem + 1vw,2rem);font-weight:800;color:var(--cream-50);margin-bottom:22px}
.soon__list{display:grid;gap:16px}
@media (min-width:768px){.soon__list{grid-template-columns:repeat(3,1fr)}}
.scard{position:relative;background:var(--teal-800);border-radius:var(--r-lg);padding:24px}
.scard__ic{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--teal-600);color:var(--cream-100);margin-bottom:14px}
.scard__ic svg{width:22px;height:22px}
.scard .chip{position:absolute;right:18px;top:22px}
.scard h4{font-size:1.0625rem;font-weight:600;color:var(--cream-50);margin-bottom:6px}
.scard p{color:var(--teal-100);font-size:.9375rem}

/* ---------- OWNER ---------- */
.owner{padding:calc(var(--section-y)*.6) 0 var(--section-y)}
.dash-wrap{perspective:1200px}
.dash{max-width:1100px;margin:0 auto;background:var(--cream-50);color:var(--teal-900);border-radius:var(--r-xl);box-shadow:var(--sh-dark),0 0 0 1px rgba(255,243,227,.2);overflow:hidden;transform-origin:50% 0}
.dash__bar{display:flex;align-items:center;gap:14px;padding:12px 16px;background:var(--cream-200);border-bottom:1px solid rgba(15,76,92,.12)}
.dash__dots{display:flex;gap:6px}
.dash__dots i{width:10px;height:10px;border-radius:50%;background:var(--cream-400)}
.dash__dots i:first-child{background:var(--tomato-400)}
.dash__dots i:nth-child(2){background:var(--saffron-400)}
.dash__title{font-weight:600;font-size:.8125rem;margin-right:auto}
.dash__body{display:grid}
@media (min-width:900px){.dash__body{grid-template-columns:190px 1fr}}
.dash__side{display:none;flex-direction:column;gap:4px;padding:18px 14px;border-right:1px solid rgba(15,76,92,.1);background:var(--cream-100);font-size:.8125rem}
@media (min-width:900px){.dash__side{display:flex}}
.dash__side b{font-size:.6875rem;text-transform:uppercase;letter-spacing:.12em;color:#3E6770;margin-bottom:6px}
.dash__side span{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;font-weight:600}
.dash__side span:first-of-type{background:var(--cream-300)}
.dash__side .dash__check{background:transparent!important}
.live{width:8px;height:8px;border-radius:50%;background:var(--teal-500);box-shadow:0 0 0 3px rgba(15,76,92,.18)}
.dash__side .dash__side-h{margin-top:14px}
.dash__side .dash__check{font-weight:500;font-size:.75rem;padding:6px 10px;background:transparent}
.dash__tick{flex:none;width:14px;height:14px;border-radius:50%;background:var(--teal-500);box-shadow:inset 0 0 0 3px var(--cream-100)}
.dash__check--wait .dash__tick{background:var(--saffron-500)}
.dash__tiles{display:grid;gap:12px;padding:14px}
@media (min-width:600px){.dash__tiles{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.dash__tiles{grid-template-columns:repeat(3,1fr);padding:18px;gap:14px}}
.tile{display:flex;flex-direction:column;background:var(--cream-100);border:1px solid rgba(15,76,92,.08);border-radius:16px;padding:16px;min-height:170px}
.tile__cta{align-self:flex-start;margin-top:auto;padding:6px 12px;border-radius:var(--r-pill);background:var(--teal-500);color:var(--cream-100);font-size:.6875rem;font-weight:600;letter-spacing:.04em}
.tile--waste .exp-list{margin-bottom:12px}
.tile h4{font-size:.8125rem;font-weight:600;color:var(--teal-700);margin-bottom:14px}
.hbars{display:grid;gap:8px}
.hbars span{display:grid;grid-template-columns:86px 1fr;gap:8px;align-items:center;font-size:.6875rem;font-weight:600}
.hbars em{font-style:normal;color:#3E6770;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hbars i,.best i{display:block;height:9px;width:calc(var(--w)*100%);border-radius:5px;background:var(--tomato-500);transform-origin:0 50%}
.donut-wrap{display:flex;align-items:center;gap:18px}
.donut{flex:none;width:96px;height:96px;border-radius:50%;background:conic-gradient(var(--tomato-500) 0 46%,var(--teal-500) 46% 76%,var(--saffron-500) 76% 100%);-webkit-mask:radial-gradient(circle,transparent 52%,#000 53%);mask:radial-gradient(circle,transparent 52%,#000 53%)}
.legend{display:grid;gap:8px;font-size:.75rem;font-weight:600}
.legend li{display:flex;align-items:center;gap:8px}
.legend i{width:12px;height:12px;border-radius:4px}
.l1{background:var(--tomato-500)}.l2{background:var(--teal-500)}.l3{background:var(--saffron-500)}
.best{display:grid;gap:9px;counter-reset:b}
.best li{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;align-items:center;font-size:.75rem;font-weight:600;counter-increment:b}
.best li::before{content:counter(b);grid-row:span 2;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--teal-500);color:var(--cream-200);font-size:.625rem}
.best i{background:var(--saffron-500);height:6px}
.vs{display:flex;justify-content:space-between;gap:8px;flex:1;min-height:92px;align-items:flex-end}
.vs__i{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%}
.vs__b{flex:1;width:100%;display:flex;justify-content:center;align-items:flex-end;gap:3px;border-bottom:1.5px solid rgba(15,76,92,.25)}
.vs__b i{width:12px;height:calc(var(--h)*100%);border-radius:3px 3px 0 0;transform-origin:50% 100%}
.vs .m,.vs__key .m{background:var(--teal-500)}
.vs .s,.vs__key .s{background:var(--tomato-500)}
.vs em{font-style:normal;font-size:.6875rem;font-weight:600;color:#3E6770}
.vs__key{display:flex;align-items:center;gap:6px;margin-top:10px;font-size:.6875rem;font-weight:600;color:#3E6770}
.vs__key i{width:10px;height:10px;border-radius:3px;margin-left:6px}
.exp-list,.close-list{display:grid;gap:7px;font-size:.75rem;font-weight:600}
.exp-list li,.close-list li{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 10px;border-radius:9px;background:var(--cream-50)}
.exp-chip{padding:2px 8px;border-radius:var(--r-pill);background:var(--saffron-200);color:var(--teal-900);font-size:.625rem;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}
.exp-chip--today{background:var(--tomato-600);color:var(--cream-100)}
.st{display:inline-flex;align-items:center;gap:6px;font-size:.6875rem}
.st::before{content:"";width:8px;height:8px;border-radius:50%}
.st--ok{color:var(--teal-500)}.st--ok::before{background:var(--teal-500)}
.st--wait{color:var(--saffron-800)}.st--wait::before{background:var(--saffron-500)}
.owner .closer{color:var(--cream-50);margin-top:56px}

/* ---------- SUPPORT ---------- */
.support{padding:calc(var(--section-y) + 20px) 0 var(--section-y)}
.path{position:relative}
.path__steps{position:relative;z-index:1;display:grid;gap:28px}
.pstep{position:relative;padding-left:84px;min-height:64px}
.pstep h3{text-wrap:balance;font-size:1.1875rem;font-weight:800;letter-spacing:-.015em;color:var(--teal-500);margin-bottom:6px}
.pstep p{color:var(--ink-muted);font-size:.975rem}
.pstep__n{position:absolute;left:0;top:0;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--cream-50);box-shadow:inset 0 0 0 2.5px var(--teal-500);color:var(--cream-200)}
.pstep__n i{position:absolute;inset:7px;border-radius:50%;background:var(--tomato-500);transition:transform .5s var(--ease-back)}
.pstep__n svg{position:relative;width:26px;height:26px;transition:color .3s}
.pstep h3,.pstep p{transition:opacity .4s ease}
.has-gsap .pstep:not(.is-on) .pstep__n i{transform:scale(0)}
.has-gsap .pstep:not(.is-on) .pstep__n svg{color:var(--teal-500)}
.has-gsap .pstep:not(.is-on) h3,.has-gsap .pstep:not(.is-on) p{opacity:.45}
.path__line{position:absolute;left:31px;top:32px;bottom:32px;width:0;border-left:2.5px dashed var(--line-dash)}
.path__fill{position:absolute;left:-2.5px;top:0;width:2.5px;height:100%;background:var(--tomato-500);transform-origin:50% 0}
.path__token{position:absolute;left:-18px;top:-18px;width:36px;height:36px;z-index:0;display:none}
.path__token svg{width:100%;height:100%}
.has-gsap .path__token{display:block}
@media (min-width:1024px){
  .path__steps{grid-template-columns:repeat(5,1fr);gap:28px}
  .pstep{padding:92px 0 0}
  .path__line{left:32px;right:32px;top:31px;bottom:auto;width:auto;height:0;border-left:0;border-top:2.5px dashed var(--line-dash);right:calc(20% - 32px + 5.6px)}
  .path__fill{left:0;top:-2.5px;height:2.5px;width:100%;transform-origin:0 50%}
}

/* ---------- BUILT FOR ---------- */
.built{padding:0 0 var(--section-y)}
.bgrid{display:grid;gap:16px}
@media (min-width:640px){.bgrid{grid-template-columns:repeat(2,1fr)}.bcard--art{grid-column:1 / -1}}
@media (min-width:1024px){.bgrid{grid-template-columns:repeat(6,1fr);gap:20px}.bcard--tall{grid-column:span 3;min-height:480px}.bcard:not(.bcard--tall){grid-column:span 2}.bcard--art{grid-column:span 2}}
.bcard{position:relative;border-radius:var(--r-xl);overflow:hidden;min-height:380px;display:flex;flex-direction:column;justify-content:flex-end;background:var(--cream-300);isolation:isolate}
.bcard__img{position:absolute;inset:0;z-index:-1;overflow:hidden}
.bcard__img img{position:absolute;left:0;top:-10%;width:100%;height:120%;object-fit:cover}
.bcard__txt{margin:12px;padding:18px 20px;border-radius:20px;background:rgba(255,250,244,.96);box-shadow:var(--sh-2)}
.bcard__txt h3{font-size:1.3125rem;font-weight:800;letter-spacing:-.02em;color:var(--teal-500);margin-bottom:4px}
.bcard__txt p{color:var(--ink-muted);font-size:.9375rem;line-height:1.5}
.bcard--art{background:var(--tomato-500)}
.bcard__art{position:absolute;inset:0 0 40% 0;display:flex;align-items:center;justify-content:center;gap:4%;z-index:-1}
.bcard__plate{width:min(42%,190px);aspect-ratio:1;height:auto}
.bcard__spoon{width:min(8%,40px);height:auto;aspect-ratio:1/3}
@media (max-width:639px){.bcard{min-height:0}.bcard__img{position:relative;inset:auto;height:220px}.bcard__txt{position:relative;margin:-36px 12px 12px}.bcard--art{min-height:300px}}

/* ---------- PLATE REVEAL ---------- */
.reveal-stage{display:none}
.has-reveal .reveal-stage{display:block;position:relative;z-index:4;height:100vh;background:var(--cream-200);overflow:hidden}
.has-reveal .zone--tomato{margin-top:-100vh}
/* tomato fill above the zone top, inside the pin spacer, so the stage can fade out onto solid tomato */
.has-reveal .zone--tomato::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:var(--rv-p,70vh);background:var(--tomato-500);pointer-events:none}
/* the stage and its pin spacer sit above the pricing section: never catch clicks */
.has-reveal .reveal-stage,.pin-spacer:has(> .reveal-stage){pointer-events:none}
.reveal-stage__in{position:absolute;inset:0;display:grid;place-items:center}
.reveal-disc{position:absolute;left:50%;top:50%;width:150vmax;height:150vmax;margin:-75vmax 0 0 -75vmax;border-radius:50%;background:var(--tomato-500);transform:scale(.02)}
.reveal-disc__rim{position:absolute;inset:4%;border-radius:50%;border:.6vmax solid var(--cream-200)}
.reveal-disc__glint{position:absolute;left:17%;top:17%;width:22%;height:22%;border-radius:50%;border-top:1vmax solid rgba(255,243,227,.6);transform:rotate(-40deg)}
.reveal-spoon{position:absolute;left:50%;top:50%;width:var(--sw,60px);height:var(--sh,260px);margin:calc(var(--sh,260px) / -2) 0 0 calc(var(--sw,60px) / -2);color:var(--tomato-500);opacity:0}

/* ---------- TOMATO ZONE ---------- */
.zone--tomato h2{color:var(--cream-50)}
.pricing{padding:var(--section-y) 0 calc(var(--section-y)*.7)}
.pricing__grid{display:grid;gap:56px;align-items:center}
@media (min-width:1024px){.pricing__grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:32px}.pricing__text{grid-column:1 / span 6}.pricing__receipt{grid-column:8 / span 5}}
.pricing__body{margin-top:24px;font-size:1.25rem;font-weight:700;line-height:1.5;color:var(--cream-50);max-width:30em}
.note-card{margin-top:28px;background:var(--cream-50);color:var(--teal-900);border-radius:var(--r-lg);padding:20px 22px;max-width:34em}
.note-card ul{display:grid;gap:10px}
.note-card li{position:relative;padding-left:22px;font-size:.9375rem;line-height:1.5}
.note-card li::before{content:"";position:absolute;left:0;top:.55em;width:9px;height:9px;border-radius:50%;background:var(--tomato-600)}
.preceipt{padding:34px 26px 30px;margin:10px 0;font-family:var(--ff-mono);color:#1d2a2e;font-size:clamp(12px,1.2vw + 6px,14.5px);transform:rotate(-2deg);box-shadow:0 30px 60px -24px rgba(62,34,31,.55)}
@media (max-width:767px){.preceipt{transform:none}}
.pl{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:6px 0;line-height:1.35}
.pl span:last-child{text-align:right;color:#3E6770}
.pl--c{justify-content:center}
.pl--h span{font-weight:800;letter-spacing:.2em;color:#1d2a2e!important;font-size:1.1em}
.pl--rule{padding:0;margin:8px 0;border-top:1.5px dashed rgba(29,42,46,.4)}
.nstamp{display:inline-block;padding:1px 12px;border:2.5px solid var(--tomato-600);border-radius:8px;color:var(--tomato-600)!important;font-family:var(--ff);font-weight:800;text-transform:uppercase;letter-spacing:.12em;transform:rotate(-8deg);font-size:.95em}
.pl--total{font-weight:800}
.pl--total span:first-child{font-size:1.1em}
/* narrow phones: a value that does not fit beside its label drops under it, right aligned, never squeezed */
@media (max-width:419px){.pl{flex-wrap:wrap;gap:2px 12px}.pl span:last-child{margin-left:auto}.pl--c span:last-child{margin-left:0}}
.uline{color:#1d2a2e!important;background:linear-gradient(var(--saffron-500),var(--saffron-500)) no-repeat 0 100%/100% 5px;padding-bottom:2px;font-weight:700}
.preceipt__btn{margin-top:22px;width:100%}

.faq{padding:calc(var(--section-y)*.6) 0 var(--section-y)}
.faq__grid{display:grid;gap:40px}
@media (min-width:1024px){.faq__grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:32px}.faq__head{grid-column:1 / span 4;position:sticky;top:120px;align-self:start}.faq__list{grid-column:5 / span 8}}
.faq__list{display:grid;gap:12px}
.qa{background:var(--cream-50);color:var(--teal-900);border-radius:var(--r-md);box-shadow:0 10px 30px -18px rgba(62,34,31,.5)}
.qa summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 22px;cursor:pointer;list-style:none;font-weight:600;font-size:clamp(1rem,.95rem + .3vw,1.1875rem);line-height:1.35;border-radius:var(--r-md);min-height:44px}
.qa summary::-webkit-details-marker{display:none}
.qa__ic{flex:none;width:32px;height:32px;padding:6px;border-radius:50%;background:var(--tomato-50);color:var(--tomato-700);transition:transform .35s var(--ease-out),background-color .3s}
.qa[open] .qa__ic{transform:rotate(45deg);background:var(--tomato-600);color:var(--cream-100)}
.qa__a{padding:0 22px 22px}
.qa__a p{color:#3E6770;max-width:44em}

.demo{padding:calc(var(--section-y)*.5) 0 var(--section-y)}
.mega{font-weight:800;font-size:var(--fs-mega);line-height:.98;letter-spacing:-.045em;color:var(--cream-50);padding:0 var(--gutter);margin-bottom:clamp(48px,6vw,96px);overflow:visible;overflow-x:clip;max-width:calc(var(--container) + var(--gutter)*2);margin-inline:auto}
.mega__in{display:block}
.mega__l{display:block;white-space:nowrap}
@supports not (overflow:clip){.mega{overflow:hidden;padding-bottom:.28em}}
.mega__plate{display:inline-block;width:.74em;height:.74em;vertical-align:-.02em;margin:0 .01em 0 .02em;overflow:visible}
.mega__plate path:first-child{fill:var(--cream-50)}
.mega__plate .bo-glint{fill:none;stroke:var(--tomato-500);stroke-width:18;stroke-linecap:round;opacity:.7}
.mega__plate .bo-plate-g{transform-box:fill-box;transform-origin:50% 50%}
.demo__grid{display:grid;gap:40px;align-items:start}
.demo__pitch h2{font-size:clamp(2rem,1.2rem + 2.4vw,3.25rem);line-height:1.05}
@media (min-width:1024px){.demo__grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:32px}.demo__pitch{grid-column:1 / span 5;padding-top:12px}.formcard{grid-column:7 / span 6}}
.demo__sub{margin-top:24px;font-size:1.25rem;font-weight:700;line-height:1.5;color:var(--cream-50)}
.demo__early{display:flex;gap:14px;align-items:flex-start;margin-top:28px;padding:18px 20px;border-radius:var(--r-lg);background:var(--cream-50);color:var(--teal-900);font-size:1rem;font-weight:500;line-height:1.5}
.demo__early svg{flex:none;width:36px;height:30px;color:var(--tomato-500);margin-top:2px}
.formcard{background:var(--cream-50);color:var(--teal-900);border-radius:var(--r-xl);box-shadow:0 40px 80px -30px rgba(62,34,31,.6);padding:clamp(22px,3vw,40px)}
.form__t{font-size:clamp(1.5rem,1.2rem + 1vw,2rem);font-weight:800;letter-spacing:-.02em;line-height:1.15;margin-bottom:8px;color:var(--teal-500);text-wrap:balance}
.form__req{margin-bottom:22px;font-size:.9375rem;color:#3E6770}
.field{display:grid;gap:7px;margin-bottom:16px;min-width:0}
.field label{font-weight:600;font-size:.9375rem;color:var(--teal-900)}
.field input,.field select{width:100%;min-height:50px;padding:0 16px;border-radius:var(--r-md);border:1.5px solid rgba(15,76,92,.22);background:#fff;color:var(--teal-900);font-size:1rem;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
.field input::placeholder{color:#6f8a90}
.field input:focus,.field select:focus{outline:3px solid var(--teal-900);outline-offset:1px;border-color:var(--teal-900);box-shadow:0 0 0 6px var(--saffron-300)}
.field [aria-invalid="true"]{border-color:var(--tomato-700)}
.field-row{display:grid;gap:0 14px}
@media (min-width:560px){.field-row{grid-template-columns:1fr 1fr}}
.select{position:relative}
.select::after{content:"";position:absolute;right:18px;top:50%;width:9px;height:9px;border-right:2px solid var(--teal-500);border-bottom:2px solid var(--teal-500);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.select select{padding-right:44px;cursor:pointer}
.phone{display:flex;align-items:stretch;border-radius:var(--r-md)}
.phone__cc{display:grid;place-items:center;padding:0 14px;border:1.5px solid rgba(15,76,92,.22);border-right:0;border-radius:var(--r-md) 0 0 var(--r-md);background:var(--cream-200);font-weight:600}
.phone input{border-radius:0 var(--r-md) var(--r-md) 0}
.field__err{color:var(--tomato-700);font-size:.875rem;font-weight:500}
.form .btn{margin-top:8px}
.form__small{margin-top:12px;font-size:.875rem;color:#3E6770;text-align:center}
.form__err{margin-top:12px;padding:12px 14px;border-radius:12px;background:var(--tomato-50);color:var(--tomato-800);font-weight:600;font-size:.9375rem}
.success{text-align:center;padding:40px 12px}
.success:focus{outline:none}
.success__plate{width:96px;height:96px;margin:0 auto 22px}
.success__msg{font-size:clamp(1.25rem,1rem + 1vw,1.625rem);font-weight:600;line-height:1.4;color:var(--teal-500)}

/* ---------- FOOTER ---------- */
.ftr{position:relative;background:var(--teal-950);color:var(--teal-200);overflow:hidden;padding:clamp(56px,7vw,96px) 0 28px;--focus:var(--saffron-500);--wm-letters:var(--cream-200);--wm-plate:var(--tomato-500);--wm-cut:var(--teal-950)}
.ftr__in{position:relative;display:grid;gap:40px}
@media (min-width:900px){.ftr__in{grid-template-columns:1fr 1.2fr;align-items:start}}
.ftr__logo{display:inline-block;font-size:44px;line-height:0}
.ftr__tag{margin-top:18px;font-weight:800;font-size:1.375rem;color:var(--cream-100);letter-spacing:-.01em}
.ftr__made{margin-top:10px}
.ftr__nav{display:grid;grid-template-columns:repeat(2,1fr);gap:4px 24px}
@media (min-width:600px){.ftr__nav{grid-template-columns:repeat(3,1fr)}}
.ftr__nav a{text-decoration:none;color:var(--cream-200);font-weight:500;padding:8px 0}
.ftr__nav a:hover{color:var(--saffron-500)}
.ftr__legal{position:relative;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px;margin-top:56px;padding-top:22px;border-top:1px solid rgba(255,243,227,.12);font-size:.875rem}
.ftr__links{display:flex;gap:20px}
.ftr__links a{text-decoration:none;color:var(--teal-200);padding:4px 0}
.ftr__links a:hover{color:var(--cream-100)}

/* ---------- mobile CTA bar ---------- */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));transform:translateY(110%);transition:transform .45s var(--ease-out)}
/* the bar follows the zone behind it, like the header: cream, teal, tomato */
.mbar__bg{position:absolute;inset:0;opacity:0;transition:opacity .35s ease;pointer-events:none}
.mbar__bg--cream{background:linear-gradient(180deg,rgba(255,243,227,0),rgba(255,243,227,.96) 35%)}
.mbar__bg--teal{background:linear-gradient(180deg,rgba(15,76,92,0),rgba(15,76,92,.96) 35%)}
.mbar__bg--tomato{background:linear-gradient(180deg,rgba(232,69,44,0),rgba(232,69,44,.96) 35%)}
.mbar[data-theme="cream"] .mbar__bg--cream,.mbar[data-theme="teal"] .mbar__bg--teal,.mbar[data-theme="tomato"] .mbar__bg--tomato{opacity:1}
.mbar .btn{transition:background-color .35s ease,color .35s ease,box-shadow .35s ease}
.mbar[data-theme="teal"]{--focus:var(--saffron-500)}
.mbar[data-theme="teal"] .btn--primary{box-shadow:0 10px 24px -10px rgba(0,0,0,.5)}
.mbar[data-theme="tomato"]{--cta-bg:var(--teal-500);--cta-bg-hover:var(--teal-700);--cta-ink:var(--cream-200);--focus:var(--cream-50)}
.mbar[data-theme="tomato"] .btn--primary{box-shadow:0 10px 24px -10px rgba(8,36,43,.6)}
.mbar.is-shown{transform:none}
.mbar.is-shown a{pointer-events:auto}
@media (min-width:768px){.mbar{display:none}}
.is-shot .mbar,.no-js .mbar{display:none}

/* ---------- cursor ---------- */
.cursor{display:none}
.has-cursor .cursor{display:block;position:fixed;left:0;top:0;z-index:90;pointer-events:none;opacity:0}
.cursor__dot{position:fixed;left:-4px;top:-4px;width:8px;height:8px;border-radius:50%;background:var(--saffron-500)}
.cursor__ring{position:fixed;left:-20px;top:-20px;width:40px;height:40px;border-radius:50%;border:1.5px solid var(--cring,var(--tomato-600));display:grid;place-items:center;transition:border-color .3s}
.cursor__label{font-size:6px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--cring,var(--tomato-600));opacity:0;transition:opacity .2s}
.cursor.is-label .cursor__label{opacity:1}

/* ---------- static / reduced ---------- */
.is-static .hero__photo-in,.is-static .kpanel__photo-in{inset:0}
.is-static .bcard__img img{top:0;height:100%}

/* ---------- no JS: nav as a scrolling row ---------- */
@media (max-width:1099px){
  .no-js .hdr__burger{display:none}
  .no-js .hdr__nav{display:flex;margin-left:12px;overflow-x:auto;min-width:0;scrollbar-width:none}
  .no-js .hdr__cta{display:none}
}

/* ---------- reduced motion: no CSS transitions or animations ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;transition-delay:0s!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
  .hdr__logo:hover .bo-plate-g{transform:none}
  .fcard:hover{transform:none}
}