@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/geist-var.woff2) format("woff2")}
@font-face{font-family:Poppins;font-style:normal;font-weight:300;font-display:swap;src:url(fonts/poppins-300.woff2) format("woff2")}
@font-face{font-family:Poppins;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/poppins-400.woff2) format("woff2")}
@font-face{font-family:Poppins;font-style:normal;font-weight:500;font-display:swap;src:url(fonts/poppins-500.woff2) format("woff2")}
@font-face{font-family:Poppins;font-style:normal;font-weight:600;font-display:swap;src:url(fonts/poppins-600.woff2) format("woff2")}
@font-face{font-family:Poppins;font-style:normal;font-weight:700;font-display:swap;src:url(fonts/poppins-700.woff2) format("woff2")}
@font-face{font-family:Poppins;font-style:normal;font-weight:800;font-display:swap;src:url(fonts/poppins-800.woff2) format("woff2")}
@font-face{font-family:Fraunces;font-style:normal;font-weight:600;font-display:swap;src:url(fonts/fraunces-brand.woff2) format("woff2")}

:root{
  --bg:#fff;--bg2:#f5f5f7;--ink:#1d1d1f;--ink2:#6e6e73;--ink3:#86868b;--line:#d2d2d7;--hair:rgba(0,0,0,.08);
  --acc:#0b7a52;--acc-d:#34d399;--ok:#0b7a52;
  --g-acc:linear-gradient(110deg,#053d2c 0%,#0b7a52 32%,#29b779 50%,#0b7a52 68%,#053d2c 100%);
  --g-acc-d:linear-gradient(110deg,#10b981 0%,#34d399 34%,#d1fae5 50%,#34d399 66%,#10b981 100%);
  --ease:cubic-bezier(.22,1,.36,1);--spring:cubic-bezier(.34,1.4,.64,1);
  --font:Poppins,-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif;
  --red:#d8261c;
  --ui:Geist,-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;overflow-x:clip;scroll-behavior:smooth;scroll-padding-top:52px}
body{font-family:var(--font);font-size:17px;line-height:1.5;letter-spacing:0;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input{font:inherit;color:inherit;background:none;border:0}
button{cursor:pointer}
.wrap{width:min(1120px,100% - 32px);margin-inline:auto}
.pad{padding-block:clamp(96px,13vw,172px)}
.center{text-align:center}
.i{width:1em;height:1em;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:6px}

/* type */
.h1{font-size:clamp(2.8rem,10vw,7rem);font-weight:600;letter-spacing:-.035em;line-height:1.05}
.h2{font-size:clamp(2.1rem,5.4vw,4.2rem);font-weight:600;letter-spacing:-.03em;line-height:1.08}
.h3{font-size:clamp(1.55rem,2.9vw,2.35rem);font-weight:600;letter-spacing:-.025em;line-height:1.14}
.sub{font-size:clamp(1.0625rem,1.75vw,1.375rem);font-weight:400;letter-spacing:-.005em;line-height:1.5;color:var(--ink2)}
.eyebrow{display:block;width:fit-content;font-size:1.0625rem;font-weight:600;color:var(--acc);letter-spacing:-.01em;margin-bottom:14px}
.center .eyebrow{margin-inline:auto}
/* accent: deep emerald gradient with a slow sheen */
.eyebrow,.link span,.step .tm,.badge,.keep b{background-image:var(--g-acc);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:sheen 7s var(--ease) infinite}
.dark .eyebrow,.close .eyebrow,.hfx .eyebrow,.keep b{background-image:var(--g-acc-d)}
@keyframes sheen{0%{background-position:115% 0}55%,100%{background-position:-15% 0}}
.us .ticks .i,.promise .i,.assure .i{stroke:url(#ag)}
.num{font-variant-numeric:tabular-nums}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.35em;min-height:50px;padding:12px 26px;border-radius:980px;background:var(--ink);color:#fff;font-size:1.0625rem;font-weight:500;line-height:1.2;text-align:center;transition:background .3s,transform .4s var(--ease),box-shadow .4s var(--ease)}
.btn:hover{background:#000;transform:scale(1.025)}
.btn:active{transform:scale(.98)}
.btn-w{background:#fff;color:var(--ink)}
.btn-w:hover{background:#fff;box-shadow:0 8px 30px rgba(255,255,255,.25)}
.btn-sm{min-height:32px;padding:0 15px;font-size:.8125rem;white-space:nowrap}
.link{display:inline-flex;align-items:center;gap:.15em;color:var(--acc);font-size:1.0625rem}
.link:hover{text-decoration:underline;text-underline-offset:3px}
.link .i{width:.75em;height:.75em;stroke-width:2.4}

/* nav */
.nav{position:sticky;top:0;z-index:60;height:52px;background:rgba(255,255,255,.76);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--hair)}
.nav .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:16px}
.logo{display:flex;align-items:center;gap:7px;color:var(--ink);white-space:nowrap}
.logo-svg{height:22px;width:calc(22px * 1975 / 370);flex:none}
.logo span{font-size:1.0625rem;font-weight:500;letter-spacing:-.02em;line-height:1;color:var(--ink3);transform:translateY(1px)}
.nav-links{display:flex;gap:34px;font-size:.8125rem;color:rgba(0,0,0,.8);white-space:nowrap}
.nav-links a:hover{color:#000}
.nav-r{display:flex;align-items:center;gap:6px}
@media(max-width:860px){.nav-links{display:none}}

/* hero */
.hero{position:relative;overflow:clip;padding:clamp(36px,5vw,64px) 0 clamp(64px,8vw,104px);background:linear-gradient(180deg,#fff,#fafaf8)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,572px);gap:clamp(56px,7vw,96px);align-items:center}
/* label strip: maple-red tag, black band, contour-line panel with an ink tendril breaking out */
.tagx{position:relative;display:inline-flex;align-items:stretch;margin-right:36px;font-size:.8125rem;line-height:1.3;box-shadow:0 10px 24px -14px rgba(17,17,19,.55)}
.tagx-k{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:46px;padding:4px 8px;background:var(--red);color:#fff}
.tagx-k b{font-size:1.25rem;font-weight:800;line-height:1}
.tagx-k small{font-size:.5625rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;line-height:1.2;margin-top:2px}
.tagx-t{display:flex;align-items:center;padding:9px 16px;background:#111113;color:#f5f5f7;font-weight:500;text-wrap:balance}
.tagx-t b{color:#ff8d82;font-weight:700}
.tagx-p{position:relative;flex:none;width:54px;overflow:hidden;background:var(--red)}
.tagx-p svg{position:absolute;inset:0;width:100%;height:100%}
.tagx-p use{fill:none;stroke:#111113;stroke-linecap:round;animation:tdrift 14s linear infinite}
@keyframes tdrift{to{transform:translateX(-120px)}}
.tagx-tail{position:absolute;left:100%;top:50%;width:44px;height:40px;margin-top:-8px;overflow:visible;fill:none;stroke:#111113;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:90;stroke-dashoffset:90}
.ready .tagx-tail{animation:tdraw 1.3s var(--ease) 1.1s forwards}
@keyframes tdraw{to{stroke-dashoffset:0}}
@media(max-width:480px){.tagx{margin-right:0;font-size:.75rem}.tagx-k{min-width:38px;padding:4px 6px}.tagx-k b{font-size:1.05rem}.tagx-t{padding:8px 11px}.tagx-p{width:30px}.tagx-tail{display:none}}
.dot{width:7px;height:7px;flex:none;border-radius:50%;background:radial-gradient(circle at 35% 35%,#6ee7b7,#0b7a52);box-shadow:0 0 0 0 rgba(48,192,106,.5);animation:pulse 2.2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(48,192,106,0)}100%{box-shadow:0 0 0 0 rgba(48,192,106,0)}}
.hero .h1{margin-top:22px;font-size:clamp(2.6rem,3.95vw,3.2rem);line-height:1.08}
.hero .sub{max-width:30em;margin-top:22px}
.ctas{display:flex;align-items:center;flex-wrap:wrap;gap:14px 28px;margin-top:32px}
.assure{display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:20px;font-size:.875rem;color:var(--ink2)}
.assure span{display:inline-flex;align-items:center;gap:6px}
.assure .i{color:var(--ok);stroke-width:2.2}
.seg{display:inline-flex;gap:2px;margin-top:28px;padding:3px;border-radius:99px;background:var(--bg2)}
.seg button{height:32px;padding:0 14px;border-radius:99px;font-size:.875rem;font-weight:500;color:var(--ink2);white-space:nowrap;transition:background .3s,color .3s,box-shadow .3s}
.seg button:hover{color:var(--ink)}
.seg button.on{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.12),0 0 0 .5px rgba(0,0,0,.04)}
@media(max-width:370px){.seg button{padding:0 10px}}
@media(max-width:1000px){.hero-grid{grid-template-columns:1fr;gap:56px}.hero-copy{text-align:center}.hero .sub{margin-inline:auto}.ctas,.assure{justify-content:center}.sc-col{width:min(100%,572px);margin-inline:auto}}
.w{display:inline-block}
.h1 .w{opacity:0;transform:translateY(.32em);filter:blur(10px);transition:opacity 1.1s var(--ease) var(--d),transform 1.1s var(--ease) var(--d),filter 1.1s var(--ease) var(--d)}
.ready .h1 .w{opacity:1;transform:none;filter:none}
.fade{opacity:0;transform:translateY(16px);transition:opacity 1s var(--ease) var(--d,.5s),transform 1s var(--ease) var(--d,.5s)}
.ready .fade{opacity:1;transform:none}

/* hero showcase: a live restaurant homepage with spinning plates */
.sc{--plate:300px;position:relative;height:560px;border-radius:34px;background:#e6eff6;box-shadow:0 44px 80px -52px rgba(50,35,20,.42),0 12px 30px -24px rgba(50,35,20,.25);container-type:inline-size;isolation:isolate}
@property --sc-a{syntax:"<color>";inherits:true;initial-value:#f5f9fc}
@property --sc-b{syntax:"<color>";inherits:true;initial-value:#d9e7f2}
@property --sc-c{syntax:"<color>";inherits:true;initial-value:#aecbe3}
.sc-bg,.mig-bg{position:absolute;inset:0;z-index:-1;overflow:hidden;border-radius:inherit;background:radial-gradient(60% 48% at 14% 45%,var(--sc-c),transparent 76%),linear-gradient(155deg,var(--sc-a) 16%,var(--sc-b) 100%);transition:--sc-a 1.3s var(--ease),--sc-b 1.3s var(--ease),--sc-c 1.3s var(--ease)}
.sc-bg::after,.mig-bg::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.7);pointer-events:none}
.sc-band{position:absolute;left:-30%;top:30%;width:160%;height:42%;background:linear-gradient(180deg,transparent,var(--sc-c) 52%,transparent);opacity:.34;transform:rotate(var(--rot,-18deg));transition:transform 1.4s var(--ease)}
.sc-band.b2{top:auto;bottom:-10%;height:34%;opacity:.3;background:linear-gradient(180deg,transparent,var(--sc-c));transform:rotate(calc(var(--rot,-18deg) * -.25))}
.sc-top{position:absolute;left:28px;top:22px;display:flex;align-items:center;gap:10px}
.sc-brand{font-family:Fraunces,Georgia,serif;font-size:1.0625rem;font-weight:600;letter-spacing:-.01em}
.sc-plates{position:absolute;left:calc(var(--plate) * -.22);top:92px;width:var(--plate);height:var(--plate)}
.sc-plate{position:absolute;inset:0;opacity:0;filter:drop-shadow(0 26px 26px rgba(40,30,20,.26)) drop-shadow(0 5px 7px rgba(40,30,20,.16));will-change:transform}
.sc-plate.on{opacity:1}
.sc-plate img{display:block;width:100%;height:100%;animation:spin 90s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.sc-info{position:absolute;left:calc(var(--plate) * .78 + 26px);right:26px;top:96px}
.sc-rank{font-size:.75rem;font-weight:700;letter-spacing:.01em;color:#55555a}
.sc-title{min-height:126px;margin-top:8px}
.sc-title span{display:block;text-transform:uppercase;will-change:clip-path}
.sc-title .l1{font-size:clamp(1.35rem,5cqi,1.9rem);font-weight:300;line-height:1.12;letter-spacing:-.02em;color:#3a3a3c}
.sc-title .l2{font-size:clamp(1.6rem,5.8cqi,2.1rem);font-weight:700;line-height:1.08;letter-spacing:-.02em;margin-top:2px}
.sc-meta{display:flex;gap:12px;align-items:flex-start;margin-top:14px}
.sc-rate{position:relative;flex:none;display:grid;place-items:center;width:58px;height:58px;border-radius:16px;background:var(--rc,#cfe2f1);transition:background .8s var(--ease)}
.sc-rate b{font-size:1.3rem;font-weight:800;letter-spacing:-.03em;margin-top:-6px}
.sc-rate svg{position:absolute;bottom:8px;width:10px;height:10px;fill:#1d1d1f;opacity:.7}
.sc-chef{min-width:0}
.sc-chef b{display:block;font-size:.9375rem;font-weight:700}
.sc-chef span{display:block;margin-top:2px;font-size:.8125rem;line-height:1.45;color:#4f4f54}
.sc-acts{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin-top:20px}
.sc-order{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 16px;border-radius:99px;color:#fff;font-size:.875rem;font-weight:600;white-space:nowrap;background:linear-gradient(135deg,#29b779,#0b7a52 55%,#053d2c);box-shadow:0 10px 24px -10px rgba(5,61,44,.7);transition:transform .3s var(--ease)}
.sc-order:hover{transform:translateY(-1px)}
.sc-order .i{width:17px;height:17px;stroke-width:2}
.sc-price{font-size:1.125rem;font-weight:700}
.sc-sel{position:absolute;left:16px;right:16px;bottom:16px;display:flex;align-items:center;gap:4px}
.sc-arrow{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--ink2);transition:background .2s,color .2s}
.sc-arrow:hover{background:rgba(255,255,255,.75);color:var(--ink)}
.sc-arrow .i{width:15px;height:15px;stroke-width:2.4}
.sc-thumbs{position:relative;flex:1;display:flex;justify-content:space-between;gap:2px;padding:4px 0;overflow-x:auto;scrollbar-width:none}
.sc-thumbs::-webkit-scrollbar{display:none}
.sc-ind{position:absolute;top:4px;left:0;width:var(--iw,72px);height:calc(100% - 8px);border-radius:18px;background:#fff;box-shadow:0 10px 22px -12px rgba(0,0,0,.35),0 0 0 1px rgba(0,0,0,.03);transform:translateX(var(--ix,0px));transition:transform .75s var(--spring),width .5s var(--ease)}
.sc-th{position:relative;flex:none;width:70px;display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 3px 7px;border-radius:18px;font-size:.6875rem;font-weight:600;line-height:1.2;color:#5f5f64;text-align:center;transition:color .3s}
.sc-th img{width:42px;height:42px;transition:transform .7s var(--spring)}
.sc-th span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:100%}
.sc-th:hover{color:var(--ink)}
.sc-th.on{color:var(--ink)}
.sc-th.on img{transform:scale(1.14) rotate(-24deg)}
.notif{position:absolute;z-index:3;display:flex;gap:11px;align-items:flex-start;padding:11px 14px 12px;border-radius:20px;background:rgba(250,250,252,.82);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);box-shadow:0 10px 40px -10px rgba(0,0,0,.3);text-align:left;opacity:0;transform:translateY(-14px) scale(.96);transition:opacity .8s var(--ease) var(--d),transform .9s var(--spring) var(--d)}
.ready .notif{opacity:1;transform:none}
.notif .app{width:36px;height:36px;border-radius:9px;flex:none;display:grid;place-items:center;color:#fff}
.notif .app .i{width:20px;height:20px;stroke-width:2}
.notif .top{display:flex;justify-content:space-between;font-size:.75rem;color:var(--ink2);line-height:1.3}
.notif .top b{font-weight:600;color:var(--ink);text-transform:uppercase;letter-spacing:.02em;font-size:.6875rem}
.notif p{font-size:.8125rem;line-height:1.35;color:var(--ink)}
.notif p b{font-weight:600}
.sc-notif{top:-24px;right:-20px;width:248px;--d:2s}
.sc-note{margin-top:16px;text-align:center;font-size:.8125rem;color:var(--ink2)}
@media(max-width:1100px){.sc-notif{right:-8px}}
@media(max-width:600px){
  .sc{--plate:min(250px,70vw);height:auto;padding:calc(var(--plate) + 64px) 18px 14px;border-radius:28px}
  .sc-bg{background:radial-gradient(82% 30% at 50% 24%,var(--sc-c),transparent 78%),linear-gradient(165deg,var(--sc-a) 16%,var(--sc-b) 100%)}
  .sc-top{left:18px;top:16px}
  .sc-plates{left:calc(50% - var(--plate) / 2);top:52px}
  .sc-info{position:static;text-align:center}
  .sc-title{min-height:0}
  .sc-meta{justify-content:center;text-align:left;max-width:320px;margin-inline:auto}
  .sc-acts{justify-content:center}
  .sc-sel{position:static;margin:18px -8px 0}
  .sc-arrow{display:none}
  .sc-thumbs{justify-content:flex-start}
  .sc-notif{display:none}
}

/* full-bleed photo with phone: widens to the edges as it scrolls into view */
.stage{--ix:4vw;--ir:30px;--is:1.1;--py:0px;position:relative;height:clamp(560px,90vh,900px);margin:0 0 clamp(80px,9vw,120px)}
.media{position:absolute;inset:0;clip-path:inset(0 var(--ix) round var(--ir));overflow:hidden;background:#2a1a10}
.media img{width:100%;height:100%;object-fit:cover;transform:scale(var(--is));will-change:transform}
.media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05) 0,rgba(0,0,0,.12) 55%,rgba(0,0,0,.42))}
.hero-phone{position:absolute;left:50%;bottom:-56px;z-index:2;transform:translate(-50%,var(--py));--w:clamp(236px,23vw,312px)}
.stage .notif{width:min(330px,calc(100% - 56px))}
.stage .notif p{font-size:.875rem}
.stage:not(.in) .notif{opacity:0;transform:translateY(-14px) scale(.96)}
.n1{left:calc(50% - 520px);top:24%;--d:.5s}
.n2{right:calc(50% - 520px);top:46%;--d:1.1s}
@media(max-width:1100px){.n1{left:6vw}.n2{right:6vw}}
@media(max-width:760px){.stage{--ix:16px;--ir:24px;height:740px;display:flex;flex-direction:column;gap:8px;padding:20px 28px 0}.stage .notif{position:relative;inset:auto;width:auto}}

/* iPhone */
.iphone{width:var(--w);aspect-ratio:9/19.4;border-radius:calc(var(--w)*.16);background:#121214;padding:calc(var(--w)*.034);position:relative;box-shadow:inset 0 0 0 1.5px #48484d,inset 0 0 0 4px #1c1c1f,0 0 0 1px rgba(0,0,0,.6),0 50px 100px -30px rgba(0,0,0,.55),0 30px 60px -40px rgba(0,0,0,.6)}
.island{position:absolute;z-index:6;top:calc(var(--w)*.062);left:50%;transform:translateX(-50%);width:31%;height:calc(var(--w)*.092);border-radius:99px;background:#000}
.scr{position:relative;height:100%;border-radius:calc(var(--w)*.126);overflow:hidden;background:#fff;color:#1d1d1f;font-size:calc(var(--w)*.042);font-family:var(--ui);letter-spacing:0;line-height:1.35;isolation:isolate}
.sb{position:absolute;z-index:5;top:0;left:0;right:0;height:3.5em;padding:.35em 2.1em 0 2.3em;display:flex;align-items:center;justify-content:space-between}
.sb b{font-weight:600;font-size:1.05em}
.sb span{display:flex;gap:.35em;align-items:center}
.sb svg{height:.8em;width:auto;fill:currentColor}
.sb.lt{color:#fff}
.hi{position:absolute;z-index:5;bottom:.5em;left:50%;width:36%;height:.32em;border-radius:99px;background:#1d1d1f;transform:translateX(-50%)}
.screen{position:absolute;inset:0;opacity:0;transform:scale(1.04);transition:opacity .6s var(--ease),transform .8s var(--ease)}
.screen.on{opacity:1;transform:none}

/* screen: home */
.home-img{height:50%;position:relative}
.home-img img{width:100%;height:100%;object-fit:cover}
.home-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.5),transparent 28%)}
.home-body{padding:1.15em 1.4em}
.m-loc{font-size:.72em;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:#86868b}
.m-name{font-family:Fraunces,Georgia,serif;font-size:2.15em;font-weight:600;letter-spacing:-.025em;line-height:1.02;margin-top:.12em}
.m-open{display:flex;align-items:center;gap:.4em;font-size:.8em;color:var(--ok);margin-top:.35em}
.m-open::before{content:"";width:.5em;height:.5em;flex:none;border-radius:50%;background:currentColor}
.m-btns{display:grid;grid-template-columns:1fr 1fr;gap:.5em;margin-top:.95em}
.m-b{min-height:2.85em;padding:.3em .4em;border-radius:.9em;display:grid;place-items:center;text-align:center;font-size:.8em;font-weight:600;line-height:1.2;border:1px solid #d2d2d7}
.m-b.dk{background:#1d1d1f;border-color:#1d1d1f;color:#fff}
.m-sec{font-size:.78em;font-weight:600;margin:1.1em 0 .55em}
.m-dishes{display:grid;grid-template-columns:repeat(3,1fr);gap:.5em}
.m-dishes img{aspect-ratio:1;width:100%;object-fit:cover;border-radius:.8em}
.m-dishes span{display:block;font-size:.66em;font-weight:500;line-height:1.25;margin-top:.35em}

/* screen: menu */
.s-menu{padding-top:3.5em}
.mh{display:flex;align-items:center;justify-content:space-between;padding:.35em 1.4em .75em}
.mh b{font-size:1.55em;font-weight:700;letter-spacing:-.03em}
.mh i{width:2.2em;height:2.2em;border-radius:50%;background:#f2f2f4;display:grid;place-items:center}
.mh .i{width:1em;height:1em;stroke-width:2}
.tabs{display:flex;gap:.4em;padding:0 1.4em .8em}
.tab{font-size:.75em;font-weight:500;padding:.45em .9em;border-radius:99px;background:#f2f2f4;white-space:nowrap}
.tab.on{background:#1d1d1f;color:#fff}
.item{display:flex;align-items:center;gap:.8em;padding:.7em 1.4em;border-top:1px solid #f0f0f2}
.item img{width:4.1em;height:4.1em;border-radius:.8em;object-fit:cover;flex:none}
.item .t{flex:1;min-width:0}
.item .n{display:flex;align-items:center;gap:.4em;font-size:.84em;font-weight:600;line-height:1.25}
.item .d{font-size:.68em;color:#86868b;margin-top:.15em}
.item .p{font-size:.78em;font-weight:600;margin-top:.25em}
.add{font-size:.7em;font-weight:600;padding:.4em .95em;border:1px solid #d2d2d7;border-radius:99px;white-space:nowrap}
.add.in{background:#1d1d1f;border-color:#1d1d1f;color:#fff}
.add.sold{border-color:#ececf0;color:#aeaeb2}
.cart{position:absolute;left:1em;right:1em;bottom:1.55em;display:flex;align-items:center;justify-content:space-between;gap:.6em;padding:.95em 1.1em;border-radius:1.1em;background:#1d1d1f;color:#fff;font-size:.8em}
.cart b{font-weight:600}


/* screen: search */
.s-g{padding-top:3.5em}
.gs{display:flex;align-items:center;gap:.6em;height:2.9em;margin:.35em 1.1em .6em;padding:0 1em;border-radius:99px;background:#f1f3f4;font-size:.84em;white-space:nowrap;overflow:hidden}
.gs .i{color:#70757a;stroke-width:2}
.gtabs{display:flex;gap:1.3em;padding:0 1.4em;font-size:.72em;color:#70757a;border-bottom:1px solid #ebebeb;white-space:nowrap;overflow:hidden}
.gtabs span{padding:.45em 0}
.gtabs .on{color:#1d1d1f;font-weight:600;box-shadow:inset 0 -2px #1d1d1f}
.map{position:relative;height:9.6em;background:
  linear-gradient(90deg,transparent 46%,#fff 46% 49%,transparent 49%),
  linear-gradient(0deg,transparent 57%,#fff 57% 60.5%,transparent 60.5%),
  linear-gradient(28deg,transparent 31%,#fbe3a6 31% 34%,transparent 34%),
  linear-gradient(-58deg,transparent 72%,#fff 72% 74%,transparent 74%),
  radial-gradient(circle at 18% 28%,#cfe3c4 0 13%,transparent 13.5%),
  radial-gradient(circle at 82% 80%,#cfe0ef 0 16%,transparent 16.5%),#eef1eb}
.pin{position:absolute;left:47.5%;top:30%;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center}
.pin svg{width:1.9em;height:2.4em;filter:drop-shadow(0 .2em .3em rgba(0,0,0,.25))}
.pin span{position:absolute;left:2.1em;top:.35em;white-space:nowrap;font-size:.66em;font-weight:700;color:#b3261e;text-shadow:0 0 3px #fff,0 0 3px #fff}
.mdot{position:absolute;width:.6em;height:.6em;border-radius:50%;background:#9aa0a6;border:2px solid #fff}
.res{padding:.85em 1.4em;border-bottom:1px solid #ebebeb}
.res b{font-size:.98em;font-weight:600}
.stars{display:flex;align-items:center;gap:.25em;margin-top:.15em;font-size:.72em;color:#70757a}
.stars svg{width:.9em;height:.9em;fill:#f4b400}
.res .mt{font-size:.72em;color:#70757a;margin-top:.1em}
.res .mt em{font-style:normal;color:#1e8e3e}
.racts{display:flex;gap:.4em;margin-top:.7em}
.ra{font-size:.7em;font-weight:500;padding:.45em .95em;border:1px solid #dadce0;border-radius:99px;white-space:nowrap}
.ra.pri{background:#1d1d1f;border-color:#1d1d1f;color:#fff}
.res.dim{opacity:.45}
.bar{height:.6em;border-radius:99px;background:#e8e8ed;margin-top:.45em}

/* statement */
#statement{font-size:clamp(1.75rem,4.3vw,3.3rem);font-weight:600;letter-spacing:-.025em;line-height:1.18;max-width:21em}
.statement .w{color:#d2d2d7;transition:color .4s}
.statement .w.lit{color:var(--ink)}

/* story */
.story{display:grid;grid-template-columns:1fr 1fr;gap:64px;margin-top:clamp(40px,6vw,72px)}
.story-phone{order:2;position:sticky;top:52px;height:calc(100vh - 52px);display:flex;align-items:center;justify-content:center}
.story-phone .iphone{--w:min(300px,calc((100vh - 140px) * .464))}
.story-steps{order:1}
.st{min-height:82vh;display:flex;flex-direction:column;justify-content:center;opacity:.25;transition:opacity .6s var(--ease)}
.st.on{opacity:1}
.st .h3{max-width:13em}
.st p{font-size:1.1875rem;color:var(--ink2);margin-top:16px;max-width:27em}
.st p b{color:var(--ink);font-weight:600}
.sdots{display:none}
@media(max-width:900px){
  .story{grid-template-columns:1fr;gap:28px}
  .story-phone{order:0;position:static;height:auto}
  .story-phone .iphone{--w:248px}
  .story-steps{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -16px;padding:0 16px;scrollbar-width:none}
  .story-steps::-webkit-scrollbar{display:none}
  .st{flex:0 0 86%;min-height:0;scroll-snap-align:center;padding:26px 24px;border-radius:24px;background:var(--bg2);opacity:1}
  .st .h3{font-size:1.5rem}
  .st p{font-size:1rem}
  .sdots{display:flex;justify-content:center;gap:7px;margin-top:20px}
  .sdots i{width:7px;height:7px;border-radius:99px;background:var(--line);transition:width .4s var(--ease),background .4s}
  .sdots i.on{width:20px;background:var(--ink)}
}

/* dark calculator */
.dark{background:#000;color:#f5f5f7}
.dark .sub{color:#a1a1a6}
.dark .eyebrow{color:var(--acc-d)}
.calc{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:clamp(44px,6vw,72px)}
.card-d{background:#161617;border-radius:30px;padding:clamp(28px,4vw,48px)}
.rng+.rng{margin-top:34px}
.rng label{display:flex;justify-content:space-between;gap:16px;font-size:1.0625rem;color:#a1a1a6;margin-bottom:10px}
.rng label b{color:#f5f5f7;font-weight:600}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;--p:50%}
input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(90deg,#f5f5f7 var(--p),#3a3a3c var(--p))}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;margin-top:-11px;border-radius:50%;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.5);transition:transform .2s}
input[type=range]:active::-webkit-slider-thumb{transform:scale(1.12)}
input[type=range]::-moz-range-track{height:4px;border-radius:4px;background:#3a3a3c}
input[type=range]::-moz-range-progress{height:4px;border-radius:4px;background:#f5f5f7}
input[type=range]::-moz-range-thumb{width:26px;height:26px;border:0;border-radius:50%;background:#fff}
.out{display:flex;flex-direction:column;justify-content:center}
.out small{font-size:1.0625rem;color:#a1a1a6}
.big-n{font-size:clamp(3.2rem,8vw,5.75rem);font-weight:700;letter-spacing:-.05em;line-height:1;margin:12px 0 8px}
.out hr{border:0;border-top:1px solid #333336;margin:28px 0}
.keep{font-size:1.1875rem;color:#a1a1a6;line-height:1.4}
.keep b{display:block;width:fit-content;font-size:clamp(1.9rem,3.6vw,2.6rem);color:var(--acc-d);font-weight:700;letter-spacing:-.035em;margin-top:6px}
.out .btn{margin-top:30px;align-self:flex-start}
.fine{max-width:62em;margin:22px auto 0;font-size:.8125rem;color:#98989d}
@media(max-width:860px){.calc{grid-template-columns:1fr}}

/* carousel */
.row-h{display:flex;justify-content:space-between;align-items:flex-end;gap:24px}
.arrows{display:flex;gap:12px}
.arrows button{width:40px;height:40px;border-radius:50%;background:#e8e8ed;display:grid;place-items:center;color:var(--ink);transition:background .3s,opacity .3s}
.arrows button:hover{background:#dcdce1}
.arrows button:disabled{opacity:.4;cursor:default}
.arrows .i{width:16px;height:16px;stroke-width:2.4}
.rail{--g:max(16px,calc((100vw - 1120px)/2));display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--g);padding:clamp(32px,5vw,56px) var(--g) 20px;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.pc{position:relative;flex:0 0 clamp(270px,30vw,372px);aspect-ratio:372/560;border-radius:28px;overflow:hidden;scroll-snap-align:start;color:#fff;background:#222;box-shadow:0 2px 12px rgba(0,0,0,.08)}
.pc img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.pc:hover img{transform:scale(1.05)}
.pc .cap{position:absolute;inset:0 0 auto;padding:28px 28px 80px;background:linear-gradient(180deg,rgba(0,0,0,.66),rgba(0,0,0,.3) 60%,transparent)}
.pc .cap small{display:block;font-size:.8125rem;font-weight:600;letter-spacing:.01em;opacity:.85;margin-bottom:6px}
.pc .cap b{display:block;font-size:1.5rem;font-weight:700;letter-spacing:-.028em;line-height:1.15}
.rail::after{content:"";flex:0 0 1px}

/* bento */
.gray{background:var(--bg2)}
.bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(250px,auto);gap:20px;margin-top:clamp(44px,6vw,72px)}
.tile{position:relative;overflow:hidden;background:#fff;border-radius:28px;padding:30px;display:flex;flex-direction:column}
.tile h3{font-size:1.3125rem;font-weight:600;letter-spacing:-.025em;line-height:1.2}
.tile p{font-size:1rem;color:var(--ink2);margin-top:6px}
.tile.ph{color:#fff;padding:0;justify-content:flex-end;background:#222}
.tile.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.tile.ph:hover img{transform:scale(1.04)}
.tile.ph .tx{position:relative;padding:34px;padding-top:110px;background:linear-gradient(0deg,rgba(0,0,0,.9),rgba(0,0,0,.72) 58%,transparent)}
.tile.ph h3{font-size:clamp(1.6rem,2.6vw,2.25rem);margin:0;letter-spacing:-.035em;line-height:1.08}
.tile.ph p{color:rgba(255,255,255,.82);font-size:1.0625rem;max-width:30em;margin-top:10px}
/* bento visuals */
.tile{container-type:inline-size}
.vis{position:relative;height:150px;margin:-8px -8px 24px;border-radius:20px;overflow:hidden;display:grid;place-items:center;font-size:clamp(9px,5.4cqi,12px);line-height:1.25;color:var(--ink);background:linear-gradient(160deg,#f4f7f5,#ecf1ee)}
.vis img{display:block}
.vis-qr,.vis-pay{background:radial-gradient(120% 90% at 50% 115%,#d3e7da,#f4f7f5 62%)}
.tent{display:flex;flex-direction:column;align-items:center;gap:.45em;width:8.6em;padding:.75em .8em .7em;border-radius:.9em;background:#fff;text-align:center;box-shadow:0 .1em .25em rgba(0,0,0,.06),0 1.4em 2.6em -1.1em rgba(5,61,44,.4);transform:perspective(32em) rotateX(9deg)}
.tent small{font-size:.72em;font-weight:600;line-height:1.2;color:var(--ink2)}
.tent b{font-size:.72em;font-weight:600;color:var(--ink3)}
.qrbox{position:relative;width:6.1em;height:6.1em;overflow:hidden}
.qrbox svg{width:100%;height:100%}
.qrbox::after{content:"";position:absolute;left:-15%;right:-15%;top:0;height:.22em;background:linear-gradient(90deg,transparent,#29b779 30% 70%,transparent);box-shadow:0 0 .7em .1em rgba(41,183,121,.7);animation:scan 3s var(--ease) infinite}
@keyframes scan{0%{transform:translateY(0);opacity:0}12%,80%{opacity:1}100%{transform:translateY(6.1em);opacity:0}}
.vis-pay{align-content:start;padding-top:1em}
.pay{position:relative;width:12em;padding:.8em .9em .85em;border-radius:1em;background:#fff;box-shadow:0 .1em .25em rgba(0,0,0,.05),0 1.4em 2.6em -1.2em rgba(5,61,44,.45)}
.pay-tag{position:absolute;top:.8em;right:.85em;font-size:.6em;font-weight:800;letter-spacing:.06em;padding:.2em .5em;border-radius:.4em;color:var(--ink2);box-shadow:inset 0 0 0 1px #d2d2d7}
.pay .to{display:flex;align-items:center;gap:.45em;padding-right:3em;font-size:.75em;color:var(--ink2);white-space:nowrap;overflow:hidden}
.pay .to img{width:1.9em;height:1.9em;flex:none;border-radius:50%;object-fit:cover}
.pay .to span{overflow:hidden;text-overflow:ellipsis}
.amt{font-size:1.9em;font-weight:700;letter-spacing:-.03em;line-height:1.1;margin-top:.3em}
.for{font-size:.72em;color:var(--ink3);margin-top:.1em}
.paid{position:absolute;left:50%;bottom:.85em;display:flex;align-items:center;gap:.4em;padding:.38em .85em .38em .4em;border-radius:99px;color:#fff;font-size:.8em;font-weight:600;white-space:nowrap;background:linear-gradient(135deg,#29b779,#0b7a52 55%,#053d2c);box-shadow:0 .6em 1.3em -.5em rgba(5,61,44,.6);transform:translateX(-50%);animation:paid 4.5s var(--spring) infinite}
.paid i{display:grid;place-items:center;width:1.5em;height:1.5em;border-radius:50%;background:#fff}
.paid svg{width:1em;height:1em;fill:none;stroke:#0b7a52;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
@keyframes paid{0%,12%{opacity:0;transform:translate(-50%,.7em) scale(.9)}22%,86%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,0) scale(1)}}
.vis-upd{align-content:center;justify-items:stretch;gap:.75em;padding:0 1em}
.efield{display:flex;align-items:center;gap:.6em;padding:.45em .45em .45em .8em;border-radius:.75em;background:#fff;font-size:.85em;box-shadow:inset 0 0 0 1.5px #0b7a52,0 0 0 .3em rgba(11,122,82,.12);animation:bub 6s var(--spring) infinite}
.efield small{flex:none;font-size:.82em;color:var(--ink3)}
.efield span{flex:1;font-weight:700}
.efield span i{display:inline-block;width:1.5px;height:1em;margin-left:1px;vertical-align:-.15em;background:#0b7a52;animation:blink 1s steps(1) infinite}
.efield em{font-style:normal;font-size:.78em;font-weight:700;color:#fff;padding:.35em .75em;border-radius:99px;background:linear-gradient(135deg,#29b779,#0b7a52)}
.mrow{position:relative;display:flex;align-items:center;gap:.55em;padding:.45em .7em .45em .45em;border-radius:.8em;background:#fff;box-shadow:0 .6em 1.3em -.6em rgba(0,0,0,.25)}
.mrow img{width:2.4em;height:2.4em;flex:none;border-radius:.55em;object-fit:cover}
.mrow .mn{flex:1;min-width:0;font-size:.86em;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrow s{font-size:.78em;color:var(--ink3)}
.mrow b{font-size:.9em;font-weight:700;color:#0b7a52;animation:newp 6s var(--ease) infinite}
.mrow .tag{position:absolute;top:-.75em;right:.6em;padding:.2em .6em;border-radius:99px;color:#fff;font-size:.66em;font-weight:700;white-space:nowrap;background:linear-gradient(135deg,#29b779,#0b7a52 60%,#053d2c);animation:newp 6s var(--spring) infinite}
@keyframes bub{0%{opacity:0;transform:translateY(.7em) scale(.94)}10%,88%{opacity:1;transform:none}100%{opacity:0;transform:none}}
@keyframes newp{0%,26%{opacity:0;transform:translateY(.4em)}36%,88%{opacity:1;transform:none}100%{opacity:0;transform:none}}
@keyframes grow{from{transform:scaleY(.06)}}
/* dashboard + finance mock-ups */
.db-tabs{margin-top:30px}
.win{margin-top:clamp(40px,5vw,60px);border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.06),0 40px 100px -40px rgba(30,30,40,.35),0 12px 30px -18px rgba(30,30,40,.2)}
.win-bar{display:flex;align-items:center;gap:7px;height:40px;padding:0 16px;background:#f6f6f8;border-bottom:1px solid #ececf0}
.win-bar i{width:11px;height:11px;border-radius:50%;background:#ff5f57}
.win-bar i:nth-child(2){background:#febc2e}.win-bar i:nth-child(3){background:#28c840}
.win-bar span{margin:0 auto;padding:4px 14px;border-radius:7px;background:#fff;font-size:.75rem;color:var(--ink3);box-shadow:inset 0 0 0 1px #ececf0;transform:translateX(-24px)}
.win-body{display:grid;grid-template-columns:188px minmax(0,1fr);min-height:480px}
.ds-side{display:flex;flex-direction:column;gap:2px;padding:16px 12px;border-right:1px solid #f0f0f3;background:#fbfbfc}
.ds-logo{display:block;padding:6px 10px 18px;color:var(--ink)}
.ds-logo svg{display:block;height:17px;width:calc(17px * 1975 / 370)}
.ds-nav{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;font-size:.8125rem;font-weight:500;color:var(--ink2);transition:background .3s,color .3s}
.ds-nav .i{width:17px;height:17px;stroke-width:1.7}
.ds-nav.on{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.04)}
.ds-nav.on .i{color:#0b7a52}
.ds-main,.fin-body{position:relative;min-width:0;padding:20px 22px}
.ds-view{display:none}
.ds-view.on{display:block;animation:dsin .6s var(--ease)}
@keyframes dsin{from{opacity:0;transform:translateY(10px)}}
.ds-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 14px;margin-bottom:16px}
.ds-head h4{font-size:1.125rem;font-weight:700;letter-spacing:-.02em}
.ds-hr{display:flex;align-items:center;gap:10px}
.ds-live{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:99px;background:#fff1e8;color:#c2410c;font-size:.75rem;font-weight:700}
.ds-live i{width:7px;height:7px;border-radius:50%;background:#ea580c;animation:blink 1.4s infinite}
@keyframes blink{50%{opacity:.25}}
.ds-bell{position:relative;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#f6f6f8}
.ds-bell .i{width:17px;height:17px}
.ds-bell b{position:absolute;top:-3px;right:-3px;min-width:17px;height:17px;padding:0 4px;border-radius:99px;background:#ea580c;color:#fff;font-size:.625rem;line-height:17px;text-align:center}
.board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.col{min-height:350px;padding:10px;border-radius:14px;background:#f6f6f8}
.col h5{display:flex;justify-content:space-between;align-items:center;padding:2px 4px 10px;font-size:.6875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink2)}
.col h5 b{padding:1px 8px;border-radius:99px;background:#fff;color:var(--ink)}
.ocard{margin-bottom:8px;padding:10px 11px;border-radius:12px;background:#fff;font-size:.75rem;box-shadow:0 1px 2px rgba(0,0,0,.06),0 0 0 1px rgba(0,0,0,.03)}
.ocard .o1{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:.8125rem;font-weight:700}
.src{padding:2px 7px;border-radius:99px;font-size:.625rem;font-weight:700;white-space:nowrap}
.ocard .items{margin:6px 0 8px;color:var(--ink2);line-height:1.45}
.ocard .o2{display:flex;justify-content:space-between;align-items:center;gap:6px}
.ocard .tot{font-weight:700;color:var(--ink)}
.ocard .tm{margin-left:6px;font-size:.6875rem;color:var(--ink3)}
.act{padding:5px 10px;border-radius:99px;background:#1d1d1f;color:#fff;font-size:.6875rem;font-weight:700;white-space:nowrap}
.col.prep .act{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px #d2d2d7}
.col.ready .act{background:linear-gradient(135deg,#29b779,#0b7a52 60%,#053d2c)}
.ocard.fresh{animation:fresh 1.8s var(--ease)}
@keyframes fresh{0%{opacity:0;transform:translateY(-14px) scale(.97);box-shadow:0 0 0 2px #f59e0b}35%{opacity:1;transform:none;box-shadow:0 0 0 2px #f59e0b}100%{box-shadow:0 1px 2px rgba(0,0,0,.06),0 0 0 1px rgba(0,0,0,.03)}}
.ds-toast{position:absolute;right:22px;bottom:18px;z-index:2;display:flex;align-items:center;gap:8px;max-width:calc(100% - 44px);padding:10px 14px;border-radius:12px;background:#1d1d1f;color:#fff;font-size:.8125rem;font-weight:600;box-shadow:0 14px 30px -12px rgba(0,0,0,.5);opacity:0;transform:translateY(10px);transition:opacity .4s var(--ease),transform .5s var(--spring);pointer-events:none}
.ds-toast.show{opacity:1;transform:none}
.ds-toast .i{width:16px;height:16px;flex:none;color:#fbbf24;stroke-width:2}
.dchips{display:flex;flex-wrap:wrap;gap:6px}
.dchip{padding:6px 12px;border-radius:99px;background:#f1f1f4;color:var(--ink2);font-size:.75rem;font-weight:600;white-space:nowrap}
.dchip.on{background:#1d1d1f;color:#fff}
.me-add{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:99px;color:#fff;font-size:.8125rem;font-weight:600;white-space:nowrap;background:linear-gradient(135deg,#29b779,#0b7a52 55%,#053d2c)}
.me-add .i{width:15px;height:15px;stroke-width:2.4}
.me-table{overflow:hidden;border:1px solid #f0f0f3;border-radius:14px}
.me-row{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr) 112px 132px;align-items:center;gap:12px;padding:10px 14px;border-top:1px solid #f0f0f3;font-size:.8125rem}
.me-row:first-child{border-top:0}
.me-row.hd{padding:8px 14px;background:#fafafb;color:var(--ink3);font-size:.6875rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.me-dish{display:flex;align-items:center;gap:10px;min-width:0}
.me-dish b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me-ph{position:relative;flex:none;width:40px;height:40px}
.me-ph img{width:100%;height:100%}
.me-ph em{position:absolute;inset:-3px;display:grid;place-items:center;border-radius:50%;background:rgba(29,29,31,.72);color:#fff;font-style:normal;font-size:.5rem;font-weight:700;line-height:1.1;text-align:center;opacity:0;transform:scale(.9);transition:opacity .3s,transform .4s var(--spring)}
.me-row.photo .me-ph em{opacity:1;transform:none}
.me-cat{color:var(--ink2)}
.me-price{display:inline-flex;align-items:center;width:96px;height:34px;padding:0 10px;border-radius:9px;font-weight:600;font-variant-numeric:tabular-nums;box-shadow:inset 0 0 0 1px #e3e3e8;transition:box-shadow .3s}
.me-price.edit{box-shadow:inset 0 0 0 2px #0b7a52,0 0 0 4px rgba(11,122,82,.12)}
.me-price i{width:1.5px;height:16px;margin-left:2px;background:#0b7a52;opacity:0}
.me-price.edit i{animation:blink 1s steps(1) infinite}
.av{display:flex;align-items:center;gap:8px}
.sw{position:relative;flex:none;width:40px;height:24px;border-radius:99px;background:linear-gradient(135deg,#29b779,#0b7a52);transition:background .3s}
.sw::after{content:"";position:absolute;top:2px;left:18px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:left .4s var(--spring)}
.sw.off{background:#d2d2d7}
.sw.off::after{left:2px}
.so{font-size:.6875rem;font-weight:700;color:#c2410c;opacity:0;transition:opacity .3s}
.sw.off+.so{opacity:1}
.pts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,36px);margin-top:clamp(36px,5vw,56px)}
.pts3{grid-template-columns:repeat(3,minmax(0,1fr))}
.pt h3{font-size:1.0625rem;font-weight:600;letter-spacing:-.02em}
.pt p{margin-top:6px;font-size:.9375rem;color:var(--ink2)}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.kpi{padding:14px 16px;border-radius:14px;background:#f6f6f8}
.kpi small{display:block;font-size:.75rem;font-weight:500;color:var(--ink2)}
.kpi b{display:block;margin:4px 0 2px;font-size:clamp(1.2rem,2.2vw,1.6rem);font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.kpi em{font-style:normal;font-size:.6875rem;font-weight:600;color:#0b7a52}
.fin-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);grid-template-areas:"chart tax" "top tax";gap:12px;margin-top:12px}
.card2{padding:16px;border-radius:14px;box-shadow:inset 0 0 0 1px #ececf0}
.card2 h5{margin-bottom:12px;font-size:.8125rem;font-weight:700}
.c-chart{grid-area:chart}.c-top{grid-area:top}.c-tax{grid-area:tax}
.fchart{display:flex;align-items:flex-end;gap:10px;height:170px}
.fchart div{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px;height:100%}
.fchart i{width:100%;height:var(--h);border-radius:8px 8px 4px 4px;background:linear-gradient(180deg,#bfe7d2,#8fd3b0);transform-origin:bottom}
.fchart i.pk{background:linear-gradient(180deg,#34c785,#0b7a52 60%,#053d2c)}
.fchart span{font-size:.6875rem;color:var(--ink3);white-space:nowrap}
.in .fchart i{animation:grow 1.2s var(--ease) both}
.fchart div:nth-child(2) i{animation-delay:.06s}.fchart div:nth-child(3) i{animation-delay:.12s}.fchart div:nth-child(4) i{animation-delay:.18s}.fchart div:nth-child(5) i{animation-delay:.24s}.fchart div:nth-child(6) i{animation-delay:.3s}.fchart div:nth-child(7) i{animation-delay:.36s}
.ti{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:10px;padding:6px 0;font-size:.8125rem}
.ti img{width:30px;height:30px}
.ti b{font-weight:600}
.ti small{font-size:.75rem;color:var(--ink3);white-space:nowrap}
.bar2{display:block;height:5px;margin-top:5px;overflow:hidden;border-radius:9px;background:#eef1ef}
.bar2 i{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,#29b779,#0b7a52)}
.grw{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px dashed #e6e6ea;font-size:.8125rem;color:var(--ink2)}
.grw:first-of-type{border-top:0}
.grw b{color:var(--ink);font-variant-numeric:tabular-nums}
.grw.tot{border-top:1px solid #dcdce2;color:var(--ink);font-weight:700}
.grw.tot b{font-weight:800}
.tax-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.gbtn{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:99px;background:#1d1d1f;color:#fff;font-size:.75rem;font-weight:700;white-space:nowrap}
.gbtn .i{width:15px;height:15px;stroke-width:2.2}
.gbtn.alt{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px #d2d2d7}
@media(max-width:1000px){.pts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
  .win{border-radius:14px}
  .win-bar span{transform:none}
  .win-body{grid-template-columns:1fr;min-height:0}
  .ds-side{display:none}
  .win-bar{height:32px;padding:0 12px;gap:6px}
  .win-bar i{width:9px;height:9px}
  .win-bar span{padding:3px 10px;font-size:.6875rem}
  .ds-main,.fin-body{padding:14px 12px}
  .ds-head{margin-bottom:12px}
  .ds-head h4{font-size:1rem}
  /* phones: status groups stack into one list, cards go compact */
  .board{display:flex;flex-direction:column;gap:10px}
  .col{min-height:0;padding:8px}
  .col h5{padding:2px 4px 8px}
  .ocard{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 10px;margin-bottom:6px;padding:9px 10px}
  .ocard:last-child{margin-bottom:0}
  .ocard .o1{justify-content:flex-start;gap:8px}
  .ocard .items{grid-column:1;margin:0;font-size:.6875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ocard .o2{grid-column:2;grid-row:1/span 2;flex-direction:column;align-items:flex-end;gap:5px}
  .ds-view .ds-head{flex-wrap:nowrap}
  .dchips{flex:1;min-width:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent)}
  .dchips::-webkit-scrollbar{display:none}
  .fin-body .dchips{flex:none;overflow:visible;-webkit-mask-image:none;mask-image:none}
  .me-add{flex:none;justify-content:center;width:34px;height:34px;padding:0}
  .me-add span{display:none}
  .me-row{grid-template-columns:minmax(0,1fr) auto auto;gap:10px;padding:10px}
  .me-row.hd,.me-row .me-cat,.so{display:none}
  .me-row:nth-child(2){border-top:0}
  .me-dish b{white-space:normal;line-height:1.25}
  .me-price{width:66px;height:32px;padding:0 8px}
  .sw{width:36px;height:22px}
  .sw::after{width:18px;height:18px;left:16px}
  .sw.off::after{left:2px}
  .kpis{grid-template-columns:1fr 1fr;gap:8px}
  .kpi{padding:12px}
  .kpi em{display:block;line-height:1.3}
  .fin-grid{grid-template-columns:1fr;grid-template-areas:"chart" "tax" "top";gap:8px;margin-top:8px}
  .card2{padding:14px 12px}
  .fchart{height:120px;gap:6px}
  .tax-btns .gbtn{flex:1;justify-content:center}
  .pts{grid-template-columns:1fr 1fr;gap:22px 16px}
  .pt h3{font-size:.9375rem}
  .pt p{font-size:.8125rem}
  .pts3{grid-template-columns:1fr}
  .ds-toast{left:12px;right:12px;bottom:12px;max-width:none}
}
@media(max-width:340px){.pts{grid-template-columns:1fr}}
.t-a{grid-column:span 2;grid-row:span 2;min-height:520px}
.t-f{grid-column:span 2}
@media(max-width:900px){.bento{grid-template-columns:1fr 1fr}.t-a{grid-row:span 1;min-height:440px}}
@media(max-width:560px){.bento{gap:12px;grid-auto-rows:auto}.t-a{min-height:460px}.t-f{min-height:340px}.tile:not(.ph){padding:22px 20px;border-radius:22px}.vis{height:120px;margin:-8px -6px 16px;border-radius:15px}.tile:not(.ph) h3{font-size:1.0625rem;margin-top:0}.tile:not(.ph) p{font-size:.875rem}.tile.ph .tx{padding:26px 24px}}

/* pricing */
.plan.us{background:#fff;box-shadow:0 0 0 1px var(--hair),0 40px 90px -45px rgba(0,0,0,.35)}
.plan .nm{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px 12px;font-size:1.0625rem;font-weight:600}
.badge{position:relative;isolation:isolate;font-size:.75rem;font-weight:600;color:var(--acc);padding:5px 11px;border-radius:99px}
.badge::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:rgba(11,122,82,.09);box-shadow:inset 0 0 0 1px rgba(11,122,82,.14)}
.price small{font-size:1rem;font-weight:500;letter-spacing:-.01em;color:var(--ink2);display:inline-block;margin-left:6px}
.plan .note{color:var(--ink2);font-size:1rem}
.ticks{list-style:none;display:grid;gap:14px;margin:30px 0 34px}
.ticks li{display:flex;gap:12px;font-size:1.0625rem;line-height:1.35}
.ticks .i{width:20px;height:20px;margin-top:1px;stroke-width:2.2;color:var(--ok)}
.plan .btn{width:100%;margin-top:auto}
.promise{display:flex;gap:14px;align-items:flex-start;margin-top:18px;padding:18px 20px;border-radius:18px;background:var(--bg2);font-size:.9375rem;color:var(--ink2)}
.promise .i{width:24px;height:24px;color:var(--ok);stroke-width:1.8}
.promise b{color:var(--ink);font-weight:600}

/* process */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,56px);margin-top:clamp(44px,6vw,72px)}
.step{border-top:1px solid var(--line);padding-top:26px}
.step .k{font-size:3.5rem;font-weight:300;letter-spacing:-.04em;line-height:1;color:var(--ink3)}
.step .tm{display:block;width:fit-content;font-size:.875rem;font-weight:600;color:var(--acc);margin:22px 0 6px}
.step h3{font-size:1.5rem;font-weight:600;letter-spacing:-.028em;line-height:1.2}
.step p{color:var(--ink2);margin-top:8px}
@media(max-width:820px){.steps{grid-template-columns:1fr}}

/* faq */
.faq{max-width:820px;margin:clamp(40px,5vw,60px) auto 0;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 0;font-size:clamp(1.125rem,1.8vw,1.3125rem);font-weight:600;letter-spacing:-.02em}
.faq summary::-webkit-details-marker{display:none}
.faq summary .i{width:18px;height:18px;stroke-width:2;color:var(--ink2);transition:transform .45s var(--ease)}
.faq details[open] summary .i{transform:rotate(180deg)}
.faq .a{overflow:hidden;color:var(--ink2);font-size:1.0625rem;max-width:44em}
.faq .a p{padding:0 0 26px}

/* closing form */
.close{position:relative;overflow:hidden;background:#000;color:#f5f5f7}
.close .bg{position:absolute;inset:0}
.close .bg img{width:100%;height:100%;object-fit:cover;object-position:50% 60%;opacity:.92}
.close .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,6,12,.72) 0,rgba(10,6,12,.46) 58%,rgba(10,6,12,.22)),linear-gradient(0deg,rgba(10,6,12,.55),transparent 42%)}
.close .wrap{position:relative;display:grid;grid-template-columns:1fr minmax(0,470px);gap:clamp(40px,6vw,88px);align-items:center}
.close .sub{color:#f2f2f7;margin-top:20px;max-width:26em}
.close .eyebrow{color:#fff;background-image:none;-webkit-text-fill-color:#fff;animation:none}
.slots{display:inline-flex;align-items:center;gap:9px;margin-top:28px;font-size:.9375rem;color:#f2f2f7}
.fcard{background:#fff;color:var(--ink);border-radius:30px;padding:clamp(24px,3.6vw,38px);box-shadow:0 50px 120px -40px rgba(0,0,0,.8)}
.fhead{display:flex;justify-content:space-between;gap:12px;font-size:.875rem;font-weight:600}
.fhead span{color:var(--ink2);font-weight:500;white-space:nowrap}
.prog{height:4px;border-radius:4px;background:#e8e8ed;margin-top:12px;overflow:hidden}
.prog i{display:block;height:100%;width:33%;border-radius:4px;background:var(--ink);transition:width .7s var(--ease)}
.fstep{display:none}
.fstep.on{display:block;animation:slide .6s var(--ease)}
@keyframes slide{from{opacity:0;transform:translateX(22px)}}
.fstep h3{font-size:1.5rem;font-weight:600;letter-spacing:-.03em;line-height:1.2;margin:26px 0 18px}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.opt{display:flex;align-items:center;gap:12px;min-height:56px;padding:14px 16px;border-radius:14px;border:1px solid var(--line);text-align:left;font-size:1rem;font-weight:500;line-height:1.25;transition:border-color .25s,box-shadow .25s,background .25s}
.opt::before{content:"";width:18px;height:18px;flex:none;border-radius:50%;border:1.5px solid #c7c7cc;transition:border .25s}
.opt:hover{border-color:#86868b}
.opt.sel{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.opt.sel::before{border:5.5px solid var(--ink)}
.back{margin-top:16px;font-size:.9375rem;color:var(--ink2);display:inline-flex;align-items:center;gap:4px}
.back .i{width:14px;height:14px;stroke-width:2.2}
.fl{position:relative;margin-bottom:12px}
.fl input{width:100%;height:60px;padding:24px 16px 8px;border:1px solid var(--line);border-radius:14px;font-size:1.0625rem;outline:none;transition:border-color .25s,box-shadow .25s}
.fl input:focus{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.fl label{position:absolute;left:17px;top:19px;font-size:1.0625rem;color:var(--ink3);pointer-events:none;white-space:nowrap;transition:all .25s var(--ease)}
.fl input:focus+label,.fl input:not(:placeholder-shown)+label,.fl.tel label{top:8px;font-size:.75rem}
.fl.tel input{padding-left:52px}
.fl.tel .pre{position:absolute;left:17px;top:25px;font-size:1.0625rem;color:var(--ink2)}
.fl.bad input{border-color:#e5484d;box-shadow:inset 0 0 0 1px #e5484d}
.err{font-size:.875rem;color:#d93036;min-height:1.3em;margin:2px 0 6px}
.fsubmit{width:100%;min-height:56px}
.fsubmit[disabled]{opacity:.6}
.trust{display:flex;gap:8px;align-items:flex-start;margin-top:16px;font-size:.8125rem;color:var(--ink2);line-height:1.45}
.trust a{text-decoration:underline;text-underline-offset:2px}
.trust .i{width:15px;height:15px;margin-top:1px;stroke-width:2}
.done{text-align:center;padding:24px 4px 8px}
.done .ok{width:64px;height:64px;border-radius:50%;background:rgba(31,143,78,.1);color:var(--ok);display:grid;place-items:center;margin:0 auto 22px}
.done .ok .i{width:30px;height:30px;stroke-width:2.4}
.done h3{font-size:1.75rem;font-weight:600;letter-spacing:-.03em;line-height:1.25}
.done p{color:var(--ink2);margin:10px auto 26px;max-width:24em}
@media(max-width:900px){.close .wrap{grid-template-columns:1fr}.close .bg::after{background:linear-gradient(180deg,rgba(10,6,12,.5),rgba(10,6,12,.7) 45%,rgba(10,6,12,.92))}}
@media(max-width:400px){.opts{grid-template-columns:1fr}}

footer{background:var(--bg2);color:var(--ink2);font-size:.75rem;line-height:1.5;padding:22px 0 calc(28px + env(safe-area-inset-bottom))}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px 24px;border-top:1px solid var(--line);padding-top:18px}
footer nav{display:flex;flex-wrap:wrap;gap:6px 20px}
footer a:hover{text-decoration:underline}
footer p{width:100%;color:var(--ink2)}
footer p a{text-decoration:underline;text-underline-offset:2px}

/* mobile action bar */
.mbar{position:fixed;z-index:70;left:0;right:0;bottom:0;display:none;align-items:center;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.82);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-top:1px solid var(--hair);transform:translateY(105%);transition:transform .55s var(--ease)}
.mbar.show{transform:none}
.mbar div{flex:1;min-width:0;line-height:1.25}
.mbar b{display:block;font-size:.9375rem;font-weight:600}
.mbar small{font-size:.8125rem;color:var(--ink2)}
.mbar .btn{min-height:42px;padding:0 18px;font-size:.9375rem;white-space:nowrap}
@media(max-width:760px){.mbar{display:flex}footer{padding-bottom:calc(92px + env(safe-area-inset-bottom))}}

/* reveal */
.rv{opacity:0;transform:translateY(28px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}


/* ---------- OrderFlow Canada ---------- */
@media(max-width:420px){.nav .wrap{gap:8px}.logo-svg{height:19px;width:calc(19px * 1975 / 370)}.logo span{font-size:.9375rem}.btn-sm{padding:0 12px}}
.btn-o{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.btn-o:hover{background:#fff;box-shadow:inset 0 0 0 1px var(--ink)}
@media(min-width:401px){.opts .opt:last-child:nth-child(odd){grid-column:span 2}}

/* survey figures under the statement */
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px);margin-top:clamp(56px,7vw,88px);padding-top:clamp(28px,3vw,40px);border-top:1px solid var(--line)}
.stat b{display:block;font-size:clamp(2.6rem,5vw,4rem);font-weight:600;letter-spacing:-.045em;line-height:1}
.stat p{margin-top:12px;font-size:1.0625rem;line-height:1.45;color:var(--ink2);max-width:22em}
.src-note{margin-top:28px;font-size:.8125rem;color:var(--ink2)}
.src-note a{text-decoration:underline;text-underline-offset:2px}
@media(max-width:760px){.stats{grid-template-columns:1fr;gap:26px}.stat{display:grid;grid-template-columns:96px minmax(0,1fr);gap:14px;align-items:baseline}.stat b{font-size:2.4rem}.stat p{margin-top:0;font-size:1rem}}

/* phone screen: checkout */
.s-check{padding:3.5em 1.4em 0}
.ck-t{font-size:1.55em;font-weight:700;letter-spacing:-.03em;line-height:1.2;margin-top:.25em}
.ck-s{font-size:.76em;color:#86868b}
.lbl{font-size:.66em;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#86868b;margin:1.15em 0 .5em}
.slots-g{display:grid;grid-template-columns:repeat(3,1fr);gap:.4em}
.tt{text-align:center;font-size:.72em;font-weight:500;padding:.6em 0;border:1px solid #e5e5ea;border-radius:.75em;white-space:nowrap}
.tt.on{background:#1d1d1f;border-color:#1d1d1f;color:#fff}
.tt.off{color:#c7c7cc;text-decoration:line-through}
.ck-li{display:flex;justify-content:space-between;gap:1em;font-size:.78em;padding:.26em 0}
.ck-li span:last-child{font-variant-numeric:tabular-nums}
.ck-li.m{color:#6e6e73}
.ck-li.t{margin-top:.35em;padding-top:.65em;border-top:1px solid #ececf0;font-size:.88em;font-weight:700}
.ck-card{display:flex;align-items:center;gap:.6em;padding:.7em .85em;border:1px solid #e5e5ea;border-radius:.9em;font-size:.76em}
.ck-card i{display:block;width:2.2em;height:1.45em;flex:none;border-radius:.25em;background:linear-gradient(135deg,#1d1d1f,#55555a)}
.ck-pay{position:absolute;left:1.15em;right:1.15em;bottom:1.7em;padding:.95em;border-radius:1em;background:#1d1d1f;color:#fff;font-size:.84em;font-weight:600;text-align:center}

/* phone screen: order status */
.s-track{padding:3.5em 1.4em 0}
.tr-n{margin-top:.4em;font-size:.76em;color:#86868b}
.tr-h{margin-top:.1em;font-size:1.55em;font-weight:700;letter-spacing:-.03em;line-height:1.15}
.tr-img{display:grid;place-items:center;height:13em;margin:.9em 0 1.2em;border-radius:1.1em;background:#fbe9de}
.tr-img img{width:11em;height:11em;animation:spin 90s linear infinite}
.tr-steps{list-style:none}
.tr-steps li{position:relative;display:flex;gap:.8em;padding-bottom:1em;font-size:.8em;font-weight:600;line-height:1.25}
.tr-steps li:last-child{padding-bottom:0}
.tr-steps li::before{content:"";position:absolute;left:.62em;top:1.3em;bottom:-.1em;width:1.5px;background:#e5e5ea}
.tr-steps li:last-child::before{display:none}
.tr-steps i{position:relative;z-index:1;display:grid;place-items:center;width:1.3em;height:1.3em;flex:none;border-radius:50%;background:#e5e5ea}
.tr-steps small{display:block;font-size:.85em;font-weight:400;color:#86868b}
.tr-d i{background:var(--ok)}
.tr-d::before{background:var(--ok)!important}
.tr-d i svg{width:.8em;height:.8em;fill:none;stroke:#fff;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.tr-c i{background:var(--ok);box-shadow:0 0 0 0 rgba(11,122,82,.45);animation:trp 2s infinite}
@keyframes trp{70%{box-shadow:0 0 0 .55em rgba(11,122,82,0)}100%{box-shadow:0 0 0 0 rgba(11,122,82,0)}}
.tr-c i::after{content:"";width:.42em;height:.42em;border-radius:50%;background:#fff}

/* how it fits: flow from checkout to kitchen */
.flow{display:grid;grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr) 34px minmax(0,1fr) 34px minmax(0,1fr);align-items:stretch;margin-top:clamp(44px,6vw,72px)}
.fnode{display:flex;flex-direction:column;min-width:0;padding:20px;border-radius:24px;background:var(--bg2)}
.fnode h3{margin-top:18px;font-size:1.0625rem;font-weight:600;letter-spacing:-.02em;line-height:1.25}
.fnode p{margin-top:6px;font-size:.875rem;line-height:1.45;color:var(--ink2)}
.fnode.core{background:#111113;color:#f5f5f7}
.fnode.core p{color:#a1a1a6}
.fvis{display:flex;flex-direction:column;justify-content:center;gap:7px;min-height:112px;font-size:.75rem;line-height:1.3}
.fln{display:flex;align-items:center;gap:8px;min-width:0;padding:8px 10px;border-radius:11px;background:#fff;box-shadow:0 8px 18px -12px rgba(0,0,0,.28)}
.fln img{width:28px;height:28px;flex:none}
.fln span{flex:1;min-width:0;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fln b{font-weight:700;font-variant-numeric:tabular-nums}
.fln .act{padding:3px 9px;font-size:.625rem}
.fchip{align-self:flex-start;padding:4px 10px;border-radius:99px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);font-size:.6875rem;font-weight:600;white-space:nowrap}
.fcore{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:11px;background:#1f1f22;font-weight:500;white-space:nowrap}
.fcore .i{width:14px;height:14px;color:var(--acc-d);stroke-width:2.6}
.fticket{padding:10px 11px;border-radius:4px;background:#fff;box-shadow:0 8px 18px -12px rgba(0,0,0,.28);font-size:.6875rem}
.fticket b{display:flex;justify-content:space-between;gap:8px;padding-bottom:5px;margin-bottom:5px;border-bottom:1px dashed var(--line);font-size:.75rem}
.fticket span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.flink{position:relative;align-self:center;height:2px;background-image:repeating-linear-gradient(90deg,var(--acc) 0 6px,transparent 6px 12px);background-size:24px 2px;animation:flowx 1s linear infinite}
@keyframes flowx{to{background-position:24px 0}}
.fopt{display:flex;align-items:center;gap:14px;margin-top:14px;padding:16px 20px;border-radius:18px;border:1.5px dashed var(--line);font-size:.9375rem;color:var(--ink2)}
.fopt b{color:var(--ink);font-weight:600}
@media(max-width:1000px){
  .flow{grid-template-columns:minmax(0,1fr)}
  .fnode{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:18px;align-items:center}
  .fvis{grid-row:1/span 2;min-height:0}
  .fnode h3{margin-top:0;align-self:end}
  .fnode p{align-self:start}
  .flink{justify-self:center;width:2px;height:28px;background-image:repeating-linear-gradient(180deg,var(--acc) 0 6px,transparent 6px 12px);background-size:2px 24px;animation-name:flowy}
  @keyframes flowy{to{background-position:0 24px}}
}
@media(max-width:480px){.fnode{grid-template-columns:minmax(0,1fr)}.fvis{grid-row:auto}.fnode h3{margin-top:16px}}

/* calculator: plan picker and line items */
.dark .seg{display:flex;width:100%;margin:0;background:#2a2a2c}
.dark .seg button{flex:1;padding:0 6px;color:#a1a1a6}
.dark .seg button:hover{color:#f5f5f7}
.dark .seg button.on{background:#f5f5f7;color:#111113;box-shadow:none}
.lines{margin-top:24px;border-top:1px solid #333336}
.lines div{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid #2a2a2c;font-size:.9375rem;color:#a1a1a6}
.lines b{color:#f5f5f7;font-weight:500;font-variant-numeric:tabular-nums}
.big-n.neg{color:#ff8d82}
.calc-note{margin-top:18px;font-size:1rem;line-height:1.45;color:#a1a1a6}
.calc-note b{color:#f5f5f7;font-weight:600}

/* order chips on the live board */
.src.take{background:#eef3ff;color:#3352c2}

/* report KPI */
.kpi.tax{background:linear-gradient(135deg,#fff7e8,#ffe6bd)}
.kpi.tax em{color:#9a4708}

/* bento visuals */
.vis-slots{align-content:center;justify-items:center;gap:.65em;padding:0 .9em}
.pick-d{font-size:.78em;font-weight:600;color:var(--ink2)}
.pick-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.45em;width:100%;max-width:17em}
.pick-g span{padding:.55em 0;border-radius:.7em;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.05);font-size:.82em;font-weight:600;text-align:center;white-space:nowrap}
.pick-g .on{color:#fff;background:linear-gradient(135deg,#29b779,#0b7a52 55%,#053d2c);box-shadow:0 .6em 1.2em -.6em rgba(5,61,44,.7);animation:pk 6s var(--spring) infinite}
.pick-g .off{color:#b9b9be;text-decoration:line-through}
@keyframes pk{0%,100%{transform:none}8%{transform:scale(1.08)}16%{transform:none}}
.vis-msg{align-content:center;justify-items:stretch;gap:.5em;padding:0 .9em}
.msg{display:flex;gap:.65em;align-items:flex-start;padding:.6em .75em;border-radius:.95em;background:#fff;box-shadow:0 .7em 1.5em -.8em rgba(0,0,0,.3);font-size:.84em;line-height:1.3;animation:bub 7s var(--spring) infinite}
.msg:nth-child(2){animation-name:bub2}
.msg i{display:grid;place-items:center;width:2em;height:2em;flex:none;border-radius:.55em;color:#fff;background:linear-gradient(135deg,#29b779,#0b7a52 60%,#053d2c)}
.msg i svg{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.msg b{display:block;font-weight:600}
.msg small{font-size:.86em;color:var(--ink2)}
@keyframes bub2{0%,26%{opacity:0;transform:translateY(.7em) scale(.94)}36%,88%{opacity:1;transform:none}100%{opacity:0;transform:none}}
.vis-promo{align-content:center}
.ticket{position:relative;display:flex;align-items:stretch;background:#fff;border-radius:.8em;box-shadow:0 .9em 1.8em -.9em rgba(5,61,44,.45);transform:rotate(-3deg)}
.ticket::before,.ticket::after{content:"";position:absolute;left:5.1em;width:.9em;height:.9em;border-radius:50%;background:#eef2ef;transform:translateX(-50%)}
.ticket::before{top:-.45em}.ticket::after{bottom:-.45em}
.ticket em{display:grid;place-items:center;width:5.1em;padding:.8em 0;font-style:normal;font-size:1em;font-weight:800;letter-spacing:-.03em;color:#0b7a52;border-right:1.5px dashed #dfe5e1}
.ticket div{padding:.65em 1em .65em .9em}
.ticket b{display:block;font-size:.95em;font-weight:700;letter-spacing:.02em}
.ticket small{font-size:.74em;color:var(--ink2)}

/* pricing */
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:clamp(44px,6vw,72px);align-items:stretch}
.plan{background:var(--bg2)}
.plan.us{background:#fff;box-shadow:0 0 0 1px var(--hair),0 40px 90px -45px rgba(0,0,0,.35)}
.plan{display:flex;flex-direction:column;border-radius:30px;padding:clamp(26px,3vw,38px)}
.price{font-size:clamp(2.8rem,4.6vw,3.6rem);font-weight:700;letter-spacing:-.05em;line-height:1;margin:22px 0 8px}
.plan .note{font-size:.9375rem;line-height:1.45;min-height:2.9em}
.ticks{gap:12px;margin:26px 0 30px}
.ticks li{font-size:1rem}
.ticks .lead{font-weight:600}
.ticks .lead .i{display:none}
.cost-h{margin-top:clamp(64px,8vw,104px);font-size:clamp(1.5rem,2.6vw,2rem);font-weight:600;letter-spacing:-.025em;text-align:center}
@media(max-width:900px){.plans{grid-template-columns:1fr}.plan.us{order:-1}.plan .note{min-height:0}}

/* GloriaFood band: the label strip at full size */
.gfb{display:grid;grid-template-columns:auto minmax(0,1fr) auto 74px;align-items:stretch;background:#111113;color:#f5f5f7;box-shadow:0 24px 50px -30px rgba(17,17,19,.7);transition:transform .5s var(--ease)}
.gfb:hover{transform:translateY(-2px)}
.gfb-k{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:128px;padding:20px 16px;background:var(--red);color:#fff}
.gfb-k b{font-size:clamp(2.4rem,4vw,3.25rem);font-weight:800;letter-spacing:-.04em;line-height:1}
.gfb-k small{margin-top:5px;font-size:.6875rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.gfb-t{align-self:center;padding:26px clamp(20px,3vw,36px)}
.gfb-t strong{display:block;font-size:clamp(1.25rem,2.2vw,1.625rem);font-weight:600;letter-spacing:-.025em;line-height:1.2}
.gfb-t span{display:block;margin-top:8px;max-width:40em;font-size:.9375rem;line-height:1.45;color:#a1a1a6}
.gfb-go{display:inline-flex;align-items:center;gap:4px;align-self:center;padding-right:28px;font-size:.9375rem;font-weight:500;white-space:nowrap}
.gfb-go .i{width:13px;height:13px;stroke-width:2.6}
.gfb-p{position:relative;overflow:hidden;background:var(--red)}
.gfb-p svg{position:absolute;inset:0;width:100%;height:100%}
.gfb-p use{fill:none;stroke:#111113;stroke-linecap:round;animation:tdrift 14s linear infinite}
@media(max-width:820px){
  .gfb{grid-template-columns:auto minmax(0,1fr)}
  .gfb-k{min-width:96px;grid-row:1/span 2}
  .gfb-t{padding:20px 20px 10px}
  .gfb-go{justify-self:start;padding:0 20px 20px}
  .gfb-p{display:none}
}

/* Halifax founding band */
.hfx{position:relative;overflow:hidden;background:#0b1622;color:#f5f5f7}
.hfx>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 62%}
.hfx::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,14,24,.88),rgba(6,14,24,.56) 50%,rgba(6,14,24,.08))}
.hfx .wrap{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:center;min-height:clamp(560px,72vh,720px);padding-block:clamp(72px,9vw,120px)}
.hfx .sub{max-width:27em;margin-top:20px;color:#d1d1d6}
.hfx ul{list-style:none;display:grid;gap:10px;margin:26px 0 32px}
.hfx li{display:flex;gap:10px;font-size:1.0625rem;line-height:1.35}
.hfx li .i{width:20px;height:20px;margin-top:1px;color:var(--acc-d);stroke-width:2.2}
.hfx .btn{align-self:flex-start}
.hfx small{display:block;margin-top:16px;font-size:.875rem;color:#c7c7cc}
@media(max-width:760px){.hfx::after{background:linear-gradient(180deg,rgba(6,14,24,.86),rgba(6,14,24,.72) 62%,rgba(6,14,24,.4))}.hfx>img{object-position:70% 60%}}

/* form additions */
.consent{display:flex;gap:10px;align-items:flex-start;margin:6px 0 4px;font-size:.875rem;line-height:1.4;color:var(--ink2);cursor:pointer}
.consent input{appearance:none;-webkit-appearance:none;position:relative;width:20px;height:20px;flex:none;margin-top:1px;border:1.5px solid #c7c7cc;border-radius:6px;background:#fff;cursor:pointer;transition:background .2s,border-color .2s}
.consent input:checked{background:var(--ink);border-color:var(--ink)}
.consent input:checked::after{content:"";position:absolute;left:5.5px;top:2px;width:5px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(42deg)}
.done p a{text-decoration:underline;text-underline-offset:2px}
.fsubmit{margin-top:6px}

/* GloriaFood page */
.mig{position:relative;min-height:540px;padding:30px;border-radius:34px;background:#fbe9de;box-shadow:0 44px 80px -52px rgba(50,35,20,.42),0 12px 30px -24px rgba(50,35,20,.25);isolation:isolate}
.mig-bg{--sc-a:#fff6ef;--sc-b:#fbdfcf;--sc-c:#f5b999;background:radial-gradient(62% 52% at 88% 84%,var(--sc-c),transparent 76%),linear-gradient(155deg,var(--sc-a) 16%,var(--sc-b) 100%)}
.mig-plate{position:absolute;right:-92px;bottom:-84px;width:330px;height:330px;filter:drop-shadow(0 26px 26px rgba(40,30,20,.26))}
.mig-plate img{width:100%;height:100%;animation:spin 90s linear infinite}
.mig-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:.8125rem;font-weight:600;color:var(--ink2)}
.mig .prog{background:rgba(0,0,0,.08)}
.mig .prog i{width:0;background-image:linear-gradient(90deg,#29b779,#0b7a52 60%,#053d2c);transition:width 3.4s cubic-bezier(.3,.5,.3,1) .6s}
.ready .mig .prog i{width:100%}
.mig-l{list-style:none;display:grid;gap:9px;margin-top:22px;max-width:300px}
.mig-l li{display:flex;align-items:center;gap:10px;padding:10px 14px 10px 10px;border-radius:13px;background:rgba(255,255,255,.72);font-size:.9375rem;font-weight:500;opacity:.42;transition:opacity .5s var(--ease),background .5s;transition-delay:var(--t);box-shadow:0 0 0 1px rgba(0,0,0,.03)}
.mig-l i{display:grid;place-items:center;width:22px;height:22px;flex:none;border-radius:50%;background:#dcdcd8;color:#fff;transition:background .4s;transition-delay:var(--t)}
.mig-l i svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.mig-l small{margin-left:auto;font-size:.8125rem;font-weight:500;color:var(--ink2)}
.ready .mig-l li{opacity:1;background:#fff}
.ready .mig-l i{background:#0b7a52}
.mig-n{top:-22px;right:-18px;width:252px;--d:4s}
@media(max-width:1100px){.mig-n{right:-8px}}
@media(max-width:600px){.mig{min-height:0;padding:22px 18px 200px;border-radius:28px}.mig-l{max-width:none}.mig-plate{right:-50px;bottom:-70px;width:250px;height:250px}.mig-n{display:none}}
.moves{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:clamp(44px,6vw,72px)}
.moves .plan h3{font-size:1.5rem;font-weight:600;letter-spacing:-.028em;line-height:1.2}
.moves .plan{background:#fff}
.moves .ticks{margin-bottom:0}
.moves .ticks small{display:block;margin-top:2px;font-size:.875rem;color:var(--ink2)}
.moves .soft .ticks .i{stroke:currentColor;color:var(--ink3)}
.do-now{margin-top:20px;background:#fff}
.gfb-center{text-align:center}
@media(max-width:820px){.moves{grid-template-columns:1fr}}

/* privacy page */
.legal{max-width:720px;margin-inline:auto;padding-block:clamp(56px,8vw,96px)}
.legal h1{font-size:clamp(2.2rem,5vw,3.25rem);font-weight:600;letter-spacing:-.03em;line-height:1.08}
.legal .upd{margin-top:12px;font-size:.9375rem;color:var(--ink2)}
.legal .lede{margin-top:28px;font-size:1.1875rem;line-height:1.5;color:var(--ink)}
.legal h2{margin-top:44px;font-size:1.3125rem;font-weight:600;letter-spacing:-.022em;line-height:1.25}
.legal p,.legal li{font-size:1.0625rem;line-height:1.55;color:var(--ink2)}
.legal p{margin-top:10px}
.legal ul{margin-top:10px;padding-left:1.15em}
.legal li{margin-top:6px}
.legal a{color:var(--acc);text-decoration:underline;text-underline-offset:2px}

/* product UI: anything drawn as an app screen uses Geist; marketing copy stays in Poppins */
.win,.scr,.notif,.fvis,.vis,.mig-l,.mig-h{font-family:var(--ui)}
.win-bar span{font-size:.8125rem}
.ds-nav{font-size:.875rem}
.ds-head h4{font-weight:600;letter-spacing:-.015em}
.ds-live{font-size:.8125rem;font-weight:500}
.col h5{font-size:.75rem;font-weight:500;letter-spacing:.04em}
.ocard{font-size:.8125rem}
.ocard .o1{font-size:.875rem;font-weight:600}
.src{font-size:.6875rem;font-weight:500}
.ocard .tot{font-weight:600;font-variant-numeric:tabular-nums}
.ocard .tm{font-size:.75rem}
.act{font-size:.75rem;font-weight:500}
.dchip{font-size:.8125rem;font-weight:500}
.me-add{font-size:.875rem;font-weight:500}
.me-row{font-size:.875rem}
.me-row.hd{font-size:.75rem;font-weight:500}
.me-dish b{font-weight:500}
.me-price{font-weight:500}
.so{font-size:.75rem;font-weight:500}
.kpi small{font-size:.8125rem;font-weight:400}
.kpi b{font-weight:600;letter-spacing:-.022em}
.kpi em{font-size:.75rem;font-weight:500}
.card2 h5{font-size:.875rem;font-weight:600}
.fchart span{font-size:.75rem}
.ti{font-size:.875rem}
.ti b{font-weight:500}
.ti small{font-size:.8125rem}
.grw{font-size:.875rem}
.grw b{font-weight:500}
.grw.tot{font-weight:600}
.grw.tot b{font-weight:600}
.gbtn{font-size:.8125rem;font-weight:500}
.ds-toast{font-size:.875rem;font-weight:500}
.notif p{font-size:.875rem}
.scr{font-size:calc(var(--w)*.044)}
.mh b,.ck-t,.tr-h{font-weight:600}
.m-b,.tab,.add,.ra,.cart b,.ck-pay{font-weight:500}
.vis{font-size:clamp(9.5px,5.7cqi,12.5px)}
.tent small,.pick-g span,.go,.efield em,.mrow .tag{font-weight:500}
.amt,.mrow b,.efield span,.ticket b,.ticket em,.pay-tag{font-weight:600}
.fln span,.fchip{font-weight:500}
.fln b{font-weight:600}
.mig-h{font-weight:500}
@media(max-width:760px){.ocard .items{font-size:.75rem}}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .rv,.fade,.notif,.h1 .w{opacity:1;transform:none;filter:none}
  .mig-l li{opacity:1;background:#fff}
  .mig-l i{background:#0b7a52}
  .mig .prog i{width:100%}
  .tagx-tail{stroke-dashoffset:0}
  .statement .w{color:var(--ink)}
}