/* Quayline POS preview (2026-10-19). Light theme, Quayline family tokens (navy + teal) with a warm accent
   taken from the Quayline logo (#E8742C). No external fonts or libraries. */
@font-face{font-family:"Space Grotesk";font-weight:400 700;font-display:swap;src:url(fonts/SpaceGrotesk-700-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:"Space Grotesk";font-weight:400 700;font-display:swap;src:url(fonts/SpaceGrotesk-700-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+20A0-20AB,U+20AD-20C4}

:root{
  --navy-950:#050d17;--navy-900:#0b1f33;--navy-800:#0f2942;--navy-700:#163551;--navy-600:#22486a;--navy-500:#356085;--navy-300:#8ba6bd;--navy-200:#c3d2df;--navy-100:#e2eaf1;--navy-50:#f3f7fa;
  --ink-900:#101820;--ink-700:#33414f;--ink-600:#4b5a69;--ink-500:#667684;--ink-400:#8c99a6;--ink-200:#d8dee4;--ink-50:#f4f6f7;
  --teal-50:#ecf8f7;--teal-100:#d6efee;--teal-200:#a9dedb;--teal-400:#35b7b0;--teal-500:#0e9c96;--teal-600:#0b8280;--teal-700:#0a6b68;
  --warm-50:#fff4ec;--warm-100:#ffe6d4;--warm-200:#fbc9a6;--warm-400:#f0904f;--warm-500:#e8742c;--warm-600:#c95a17;--warm-700:#a24612;
  --red-50:#fdf0ef;--red-500:#d64545;--red-700:#a52f2f;--green-50:#edf8f0;--green-500:#2f9e5b;--green-700:#1f7343;--yellow-50:#fff8e6;--yellow-500:#d99a12;
  --paper:#f8f8f5;--cream:#fdf8f2;--white:#fff;
  --radius:.875rem;--shadow-card:0 1px 2px #0b1f330a,0 8px 24px -12px #0b1f3329;--shadow-raised:0 2px 4px #0b1f330d,0 30px 60px -28px #0b1f3359;
  --sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI","Helvetica Neue",Helvetica,Arial,"Noto Sans",sans-serif;
  --display:"Space Grotesk",var(--sans);
  --mono:ui-monospace,"SFMono-Regular","SF Mono",Menlo,Consolas,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:8rem}
body{margin:0;font-family:var(--sans);color:var(--ink-700);background:var(--paper);line-height:1.6;font-size:1rem;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--display);color:var(--navy-900);margin:0;letter-spacing:-.025em;line-height:1.08;font-weight:700;text-wrap:balance}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--navy-900);color:#fff;padding:.5rem 1rem;border-radius:999px;z-index:100}
.skip:focus{left:12px}
:focus-visible{outline:2px solid var(--teal-500);outline-offset:2px;border-radius:4px}

.wrap{max-width:74rem;margin:0 auto;padding:0 20px}
@media(min-width:640px){.wrap{padding:0 32px}}

/* ---------- preview strip + header ---------- */
.strip{background:var(--navy-900);color:var(--navy-100);font-size:.78rem;text-align:center;padding:.45rem 1rem;line-height:1.4}
.strip b{color:#fff;font-weight:600}
.strip .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--warm-500);margin-right:.45rem;vertical-align:1px;animation:blink 1.8s ease-in-out infinite}
.site-head{position:sticky;top:0;z-index:50;background:#f8f8f5e8;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--navy-100);transition:box-shadow .25s,background-color .25s}
.site-head.scrolled{box-shadow:0 6px 24px -14px #0b1f3340;background:#fffffff2}
.head-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:4.25rem}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;flex-shrink:0}
.brand img{width:2.4rem;height:auto}
.brand-name{display:flex;flex-direction:column;line-height:1}
.brand-name b{font-family:var(--display);font-size:1.12rem;color:var(--navy-900);letter-spacing:-.02em}
.brand-name b span{color:var(--warm-500)}
.brand-name small{font-size:.66rem;color:var(--ink-500);margin-top:.3rem;font-weight:500;letter-spacing:.02em}
.nav{display:none;align-items:center;gap:.1rem}
.nav a{text-decoration:none;font-size:.88rem;font-weight:500;color:var(--ink-700);padding:.45rem .7rem;border-radius:999px;transition:background-color .15s,color .15s}
.nav a:hover{background:var(--navy-50);color:var(--navy-900)}
.nav a[aria-current="page"]{color:var(--teal-700);background:var(--teal-50)}
.head-cta{display:none}
.burger{display:inline-flex;align-items:center;justify-content:center;width:2.6rem;height:2.6rem;border:1px solid var(--navy-200);background:#fff;border-radius:.6rem;color:var(--navy-900);cursor:pointer}
.mnav{border-top:1px solid var(--navy-100);background:var(--paper)}
.mnav[hidden]{display:none}
.mnav nav{display:flex;flex-direction:column;padding:.5rem 0 1rem}
.mnav nav a{text-decoration:none;padding:.8rem 0;border-bottom:1px solid var(--navy-100);font-weight:500;color:var(--navy-900)}
.mnav .btn{margin-top:1rem;width:100%;justify-content:center}
@media(min-width:1180px){.nav{display:flex}.head-cta{display:inline-flex}.burger{display:none}.mnav{display:none!important}}
.progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:linear-gradient(90deg,var(--teal-500),var(--warm-500));transform:scaleX(0);transform-origin:left;pointer-events:none}

/* ---------- buttons, pills ---------- */
.btn{display:inline-flex;align-items:center;gap:.5rem;font-weight:600;font-size:.95rem;text-decoration:none;border-radius:999px;padding:.8rem 1.35rem;border:1px solid transparent;cursor:pointer;font-family:inherit;transition:background-color .15s,transform .18s,box-shadow .18s,border-color .15s;line-height:1.2}
.btn svg{width:1.05rem;height:1.05rem;transition:transform .2s}
.btn-primary{background:var(--teal-600);color:#fff}
.btn-primary:hover{background:var(--teal-700)}
.btn-warm{background:var(--warm-500);color:#fff}
.btn-warm:hover{background:var(--warm-600)}
.btn-ghost{background:#fff;color:var(--navy-900);border-color:var(--navy-200)}
.btn-sm{padding:.55rem 1rem;font-size:.86rem}
@media(hover:hover){.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 22px -10px rgba(14,156,150,.65)}.btn-warm:hover{transform:translateY(-2px);box-shadow:0 10px 22px -10px rgba(232,116,44,.65)}.btn-ghost:hover{transform:translateY(-2px);border-color:var(--teal-400)}.btn:hover svg{transform:translateX(4px)}}
.pill{display:inline-flex;align-items:center;gap:.45rem;border-radius:999px;padding:.25rem .75rem;font-size:.75rem;font-weight:600;letter-spacing:.01em;border:1px solid var(--teal-200);background:var(--teal-50);color:var(--teal-700)}
.pill-warm{border-color:var(--warm-200);background:var(--warm-50);color:var(--warm-700)}
.pill-navy{border-color:var(--navy-200);background:var(--navy-50);color:var(--navy-700)}
.pill .ping{position:relative;width:8px;height:8px;border-radius:50%;background:var(--warm-500)}
.pill .ping::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--warm-500);animation:ping 2.4s ease-out infinite}
.tagrow{display:flex;flex-wrap:wrap;gap:.4rem}
.tag{font-size:.7rem;font-weight:600;padding:.15rem .55rem;border-radius:999px;background:var(--ink-50);color:var(--ink-600);border:1px solid var(--ink-200)}
.tag.r{background:var(--warm-50);border-color:var(--warm-200);color:var(--warm-700)}
.tag.s{background:var(--teal-50);border-color:var(--teal-200);color:var(--teal-700)}
.tag.h{background:var(--navy-50);border-color:var(--navy-200);color:var(--navy-600)}

/* ---------- sections ---------- */
.sec{padding:4.5rem 0;position:relative}
@media(min-width:900px){.sec{padding:6.5rem 0}}
.sec-white{background:#fff;border-top:1px solid var(--navy-100);border-bottom:1px solid var(--navy-100)}
.sec-cream{background:var(--cream)}
.sec-paper{background:var(--paper)}
.eyebrow{display:flex;align-items:center;gap:.6rem;font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-700);margin-bottom:1rem}
.eyebrow::before{content:"";width:2.25rem;height:2px;border-radius:2px;background:var(--teal-500);transition:width .7s cubic-bezier(.2,.7,.2,1)}
.eyebrow.warm{color:var(--warm-700)}.eyebrow.warm::before{background:var(--warm-500)}
.h2{font-size:clamp(1.75rem,1.05rem + 2.4vw,2.85rem)}
.lead{font-size:1.08rem;color:var(--ink-600);max-width:44rem;margin-top:1rem;line-height:1.65}
.sec-head{margin-bottom:2.75rem}
.sec-head.center{text-align:center}.sec-head.center .lead{margin-left:auto;margin-right:auto}.sec-head.center .eyebrow{justify-content:center}
.hl{color:var(--teal-600)}
.hw{color:var(--warm-600);position:relative;white-space:nowrap}
.hw::after{content:"";position:absolute;left:0;right:0;bottom:.02em;height:.16em;background:var(--warm-200);opacity:.7;z-index:-1;border-radius:3px}
.note{font-size:.82rem;color:var(--ink-500)}
.small{font-size:.88rem}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;padding:3.25rem 0 4rem;background:linear-gradient(180deg,#fff 0%,var(--paper) 100%)}
@media(min-width:900px){.hero{padding:5rem 0 6rem}}
.hero::before,.hero::after{content:"";position:absolute;pointer-events:none;border-radius:50%;filter:blur(10px)}
.hero::before{width:40rem;height:40rem;left:-12rem;top:-16rem;background:radial-gradient(closest-side,rgba(14,156,150,.17),rgba(14,156,150,0));animation:drift 16s ease-in-out infinite alternate}
.hero::after{width:38rem;height:38rem;right:-12rem;bottom:-16rem;background:radial-gradient(closest-side,rgba(232,116,44,.16),rgba(232,116,44,0));animation:drift 20s ease-in-out -6s infinite alternate-reverse}
.grid-bg{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(90deg,#0b1f330d 1px,transparent 1px),linear-gradient(#0b1f330d 1px,transparent 1px);background-size:32px 32px;animation:gridmove 60s linear infinite;-webkit-mask-image:radial-gradient(ellipse at 60% 40%,#000 25%,transparent 78%);mask-image:radial-gradient(ellipse at 60% 40%,#000 25%,transparent 78%)}
.hero .wrap{position:relative;z-index:1}
.hero-grid{display:grid;gap:3rem;align-items:center}
@media(min-width:1024px){.hero-grid{grid-template-columns:1.02fr 1fr;gap:3.5rem}}
.hero h1{font-size:clamp(2.2rem,1.2rem + 3.7vw,3.85rem);line-height:1.04;letter-spacing:-.03em;margin-top:1.1rem}
.hero h1::after{content:"";display:block;width:4.5rem;height:4px;margin-top:1.2rem;border-radius:4px;background:linear-gradient(90deg,var(--teal-500),var(--warm-400));transform-origin:left;animation:grow .9s .35s cubic-bezier(.2,.7,.2,1) both}
.hero .lead{font-size:1.12rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}
.hero-points{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;margin-top:1.75rem;font-size:.86rem;color:var(--ink-600)}
.hero-points li{display:flex;align-items:center;gap:.4rem}
.hero-points svg{width:1rem;height:1rem;color:var(--teal-600)}
.rise>*{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
.rise>:nth-child(2){animation-delay:.08s}.rise>:nth-child(3){animation-delay:.18s}.rise>:nth-child(4){animation-delay:.28s}.rise>:nth-child(5){animation-delay:.38s}.rise>:nth-child(6){animation-delay:.46s}
.hero-visual{position:relative;animation:rise .9s .2s cubic-bezier(.2,.7,.2,1) both;min-width:0}
.page-hero{padding:3rem 0 3.5rem}
@media(min-width:900px){.page-hero{padding:4.5rem 0 5rem}}
.page-hero h1{font-size:clamp(2rem,1.2rem + 3vw,3.3rem)}

/* ---------- cards ---------- */
.grid{display:grid;gap:1.25rem}
@media(min-width:640px){.g2,.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.card{position:relative;overflow:hidden;background:#fff;border:1px solid var(--navy-100);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow-card);display:flex;flex-direction:column;gap:.7rem;transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s,border-color .25s}
.card::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--teal-500),var(--teal-400) 60%,var(--teal-200));transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.card.warm::before{background:linear-gradient(90deg,var(--warm-500),var(--warm-400) 60%,var(--warm-200))}
.card.on::before{transform:scaleX(1)}
.card h3{font-size:1.15rem;letter-spacing:-.015em}
.card p{font-size:.93rem;color:var(--ink-600);line-height:1.6}
.card .more{margin-top:auto;padding-top:.4rem;font-weight:600;font-size:.9rem;color:var(--teal-700);text-decoration:none;display:inline-flex;gap:.35rem;align-items:center}
.card .more svg{width:1rem;height:1rem;transition:transform .2s}
.ico{width:2.75rem;height:2.75rem;border-radius:.7rem;display:inline-flex;align-items:center;justify-content:center;background:var(--teal-50);border:1px solid var(--teal-100);color:var(--teal-700);flex-shrink:0;transition:background-color .25s,color .25s,border-color .25s,transform .25s}
.ico svg{width:1.35rem;height:1.35rem}
.ico.warm{background:var(--warm-50);border-color:var(--warm-100);color:var(--warm-600)}
.ico.navy{background:var(--navy-50);border-color:var(--navy-100);color:var(--navy-600)}
@media(hover:hover){
  .card:hover{transform:translateY(-5px);border-color:var(--teal-200);box-shadow:0 2px 4px #0b1f330d,0 24px 44px -22px #0b1f3352}
  .card.warm:hover{border-color:var(--warm-200)}
  .card:hover::before{transform:scaleX(1)}
  .card:hover .ico{background:var(--teal-600);border-color:var(--teal-600);color:#fff;transform:rotate(-4deg) scale(1.05)}
  .card.warm:hover .ico{background:var(--warm-500);border-color:var(--warm-500)}
  .card:hover .more svg{transform:translateX(4px)}
}
a.card{text-decoration:none;color:inherit}
.checks{display:grid;gap:.55rem;font-size:.93rem}
.checks li{display:flex;gap:.55rem;align-items:flex-start;line-height:1.5}
.checks li::before{content:"";flex:0 0 1.1rem;height:1.1rem;margin-top:.15rem;border-radius:50%;background:var(--teal-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8280' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/70% no-repeat;border:1px solid var(--teal-200)}
.checks.warm li::before{background-color:var(--warm-50);border-color:var(--warm-200);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c95a17' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E")}

/* vertical chooser */
.vcard{padding:0;gap:0}
.vcard .vtop{padding:1.6rem 1.6rem 1.2rem;display:flex;flex-direction:column;gap:.7rem}
.vcard .vtop h3{font-size:1.45rem}
.vcard .vbody{padding:0 1.6rem 1.6rem;display:flex;flex-direction:column;gap:1rem;flex:1}
.vcard .vband{height:6px}
.vcard.r .vband{background:linear-gradient(90deg,var(--warm-500),var(--warm-200))}
.vcard.s .vband{background:linear-gradient(90deg,var(--teal-500),var(--teal-200))}
.vcard.h .vband{background:linear-gradient(90deg,var(--navy-600),var(--navy-200))}
.vcard::before{display:none}

/* problem vs answer */
.vs{display:grid;gap:1.25rem}
@media(min-width:900px){.vs{grid-template-columns:1fr 1fr}}
.vs-box{border-radius:var(--radius);padding:1.75rem;border:1px solid var(--navy-100);background:#fff}
.vs-box h3{font-size:1.2rem;margin-bottom:1rem}
.vs-box.bad{background:linear-gradient(180deg,#fff,var(--ink-50))}
.vs-box.good{border-color:var(--teal-200);box-shadow:0 18px 36px -22px rgba(14,156,150,.45)}
.apps{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.1rem}
.apps span{font-size:.8rem;font-weight:600;padding:.4rem .7rem;border-radius:.5rem;background:#fff;border:1px dashed var(--ink-400);color:var(--ink-600)}
.apps.one span{border:1px solid var(--teal-200);background:var(--teal-50);color:var(--teal-700)}
.xlist{display:grid;gap:.55rem;font-size:.93rem}
.xlist li{display:flex;gap:.55rem;line-height:1.5}
.xlist li::before{content:"×";flex:0 0 1.1rem;height:1.1rem;margin-top:.15rem;border-radius:50%;background:var(--red-50);color:var(--red-500);font-weight:700;font-size:.85rem;line-height:1.1rem;text-align:center;border:1px solid #f3c9c9}

/* steps */
.steps{display:grid;gap:1.25rem;counter-reset:s;position:relative}
@media(min-width:640px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.steps{grid-template-columns:repeat(4,1fr)}}
.steps li{position:relative;background:#fff;border:1px solid var(--navy-100);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow-card)}
.steps .num{width:2.3rem;height:2.3rem;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:var(--mono);font-weight:700;font-size:.9rem;background:var(--teal-50);color:var(--teal-700);border:1px solid var(--teal-200);transition:background-color .4s,color .4s;margin-bottom:.9rem}
.steps li.in .num,.no-reveal .steps .num{background:var(--teal-600);border-color:var(--teal-600);color:#fff}
.steps h3{font-size:1.08rem;margin-bottom:.4rem}
.steps p{font-size:.92rem;color:var(--ink-600)}

/* ---------- connected system diagram ---------- */
.system{position:relative;max-width:62rem;margin:0 auto}
.sys-grid{position:relative;display:grid;gap:.9rem;grid-template-columns:1fr}
.sys-node{position:relative;z-index:1;background:#fff;border:1px solid var(--navy-100);border-radius:.85rem;padding:.9rem 1rem;display:flex;gap:.75rem;align-items:center;box-shadow:var(--shadow-card);transition:border-color .4s,box-shadow .4s,transform .25s}
.sys-node .ico{width:2.4rem;height:2.4rem}
.sys-node b{display:block;font-family:var(--display);color:var(--navy-900);font-size:.98rem;letter-spacing:-.01em;line-height:1.2}
.sys-node span.s{display:block;font-size:.78rem;color:var(--ink-500);line-height:1.35;margin-top:.15rem}
.sys-node .soon{font-size:.62rem;font-weight:700;color:var(--warm-700);background:var(--warm-50);border:1px solid var(--warm-200);border-radius:999px;padding:.05rem .4rem;margin-left:.25rem;vertical-align:2px;letter-spacing:.02em;white-space:nowrap}
.sys-core{z-index:2;background:linear-gradient(160deg,var(--navy-900),var(--navy-700));border:0;color:#fff;padding:1.4rem;flex-direction:column;align-items:flex-start;box-shadow:0 30px 60px -28px #0b1f3399}
.sys-core b{color:#fff;font-size:1.3rem}
.sys-core span.s{color:var(--navy-200);font-size:.86rem}
.sys-core .ico{background:#ffffff14;border-color:#ffffff26;color:var(--teal-200)}
.sys-core ul{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.4rem}
.sys-core li{font-size:.72rem;padding:.2rem .55rem;border-radius:999px;background:#ffffff12;border:1px solid #ffffff22;color:var(--navy-100)}
.sys-lines{display:none}
@media(max-width:899px){
  .sys-core{order:-1}
  .sys-grid::before{content:"";position:absolute;left:1.95rem;top:2rem;bottom:2rem;width:2px;background:repeating-linear-gradient(180deg,var(--teal-400) 0 6px,transparent 6px 12px);animation:dashy 1.2s linear infinite}
}
@media(min-width:900px){
  .sys-grid{grid-template-columns:1fr 1.25fr 1fr;grid-template-rows:repeat(3,auto);gap:2.2rem 4rem;align-items:center}
  .sys-core{grid-column:2;grid-row:1/4;align-self:center}
  .sys-lines{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:0;overflow:visible}
  .sys-lines path{fill:none;stroke:var(--teal-400);stroke-width:2;stroke-dasharray:6 7;animation:dash 1.4s linear infinite;vector-effect:non-scaling-stroke}
  .sys-lines path.w{stroke:var(--warm-400)}
}
.system.in .sys-node:not(.sys-core),.no-reveal .sys-node:not(.sys-core){border-color:var(--teal-200);box-shadow:0 6px 18px -12px rgba(14,156,150,.5)}
.sys-caption{text-align:center;margin-top:1.75rem}

/* ---------- swipe rows on phones ---------- */
.swipe-hint{display:none}
@media(max-width:639px){
  .swipe{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px!important;margin-left:-20px;margin-right:-20px;padding:4px 20px 16px;scroll-padding-left:20px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .swipe::-webkit-scrollbar{display:none}
  .swipe>*{flex:0 0 84%;max-width:84%;scroll-snap-align:start}
  .swipe>.card::before{transform:scaleX(.18)}
  .swipe-hint{display:flex;align-items:center;gap:.35rem;font-size:12px;color:var(--ink-500);margin-top:.1rem;animation:nudge 2.6s ease-in-out 1.5s infinite}
}

/* ---------- feature rows (module / vertical pages) ---------- */
.feat{display:grid;gap:2.5rem;align-items:center}
@media(min-width:1024px){.feat{grid-template-columns:1fr 1.1fr;gap:4rem}.feat.flip>.feat-text{order:2}}
.feat-text h2{font-size:clamp(1.6rem,1rem + 2vw,2.4rem)}
.feat-text .lead{font-size:1rem}
.feat-text .checks{margin-top:1.4rem}
.feat-text .tagrow{margin-top:1.2rem}
.feat-visual{min-width:0}
.modnav{position:sticky;top:4.25rem;z-index:40;background:#fffffff2;backdrop-filter:blur(8px);border-bottom:1px solid var(--navy-100)}
.modnav ul{display:flex;gap:.35rem;overflow-x:auto;padding:.6rem 0;scrollbar-width:none}
.modnav ul::-webkit-scrollbar{display:none}
.modnav a{white-space:nowrap;display:block;text-decoration:none;font-size:.82rem;font-weight:600;color:var(--ink-600);padding:.4rem .8rem;border-radius:999px;border:1px solid var(--navy-100);background:#fff;transition:all .15s}
.modnav a:hover{border-color:var(--teal-200);color:var(--teal-700)}
.modnav a.active{background:var(--teal-600);border-color:var(--teal-600);color:#fff}
.group-title{display:flex;align-items:center;gap:.8rem;margin-bottom:.5rem}
.group-title .ico{width:2.4rem;height:2.4rem}
.mod{padding:3.5rem 0;border-top:1px solid var(--navy-100)}
.mod:first-of-type{border-top:0}
@media(min-width:900px){.mod{padding:4.5rem 0}}
.mod-mini{display:grid;gap:1rem}
@media(min-width:640px){.mod-mini{grid-template-columns:1fr 1fr}}
.callout{border-radius:var(--radius);padding:1.1rem 1.25rem;background:var(--warm-50);border:1px solid var(--warm-200);color:var(--warm-700);font-size:.9rem;display:flex;gap:.7rem;align-items:flex-start}
.callout svg{width:1.2rem;height:1.2rem;flex-shrink:0;margin-top:.15rem}
.callout.teal{background:var(--teal-50);border-color:var(--teal-200);color:var(--teal-700)}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:.75rem;max-width:52rem}
.faq.center{margin:0 auto}
.faq details{background:#fff;border:1px solid var(--navy-100);border-radius:.8rem;transition:border-color .2s,box-shadow .2s}
.faq details[open]{border-color:var(--teal-200);box-shadow:var(--shadow-card)}
.faq summary{cursor:pointer;list-style:none;padding:1.05rem 3rem 1.05rem 1.2rem;font-weight:600;color:var(--navy-900);position:relative;line-height:1.4}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:1.1rem;top:50%;width:1.5rem;height:1.5rem;margin-top:-.75rem;border-radius:50%;background:var(--teal-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8280' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center/60% no-repeat;transition:transform .25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .a{padding:0 1.2rem 1.15rem;color:var(--ink-600);font-size:.95rem}
.faq .a p+p{margin-top:.6rem}
.faq-group{margin-top:2.5rem}
.faq-group h2{font-size:1.35rem;margin-bottom:1rem}

/* ---------- CTA band ---------- */
.cta-band{position:relative;overflow:hidden;border-radius:1.25rem;padding:2.25rem 1.5rem;background:linear-gradient(135deg,#fff 0%,var(--teal-50) 55%,var(--warm-50) 100%);border:1px solid var(--teal-200);box-shadow:var(--shadow-raised)}
@media(min-width:900px){.cta-band{padding:3.5rem}}
.cta-band::before{content:"";position:absolute;width:30rem;height:30rem;right:-10rem;top:-14rem;background:radial-gradient(closest-side,rgba(232,116,44,.18),rgba(232,116,44,0));animation:drift 18s ease-in-out infinite alternate;pointer-events:none}
.cta-band>*{position:relative}
.cta-grid{display:grid;gap:2rem;align-items:center}
@media(min-width:900px){.cta-grid{grid-template-columns:1.4fr 1fr}}
.cta-band h2{font-size:clamp(1.6rem,1rem + 2vw,2.5rem)}
.cta-actions{display:flex;flex-wrap:wrap;gap:.75rem}

/* ---------- form ---------- */
.form{background:#fff;border:1px solid var(--navy-100);border-top:3px solid var(--teal-500);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow-raised);display:grid;gap:1rem}
@media(min-width:640px){.form{padding:2rem}.form .two{display:grid;grid-template-columns:1fr 1fr;gap:1rem}}
.form .two{display:grid;gap:1rem}
.field{display:grid;gap:.35rem}
.field label,.field legend{font-size:.85rem;font-weight:600;color:var(--navy-900)}
.field input,.field select,.field textarea{font:inherit;font-size:.95rem;padding:.7rem .85rem;border:1px solid var(--navy-200);border-radius:.6rem;background:var(--paper);color:var(--ink-900);width:100%;min-width:0}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--teal-500);box-shadow:0 0 0 3px var(--teal-100);background:#fff}
.field textarea{min-height:7rem;resize:vertical}
fieldset.field{border:0;padding:0;margin:0}
.chips{display:flex;flex-wrap:wrap;gap:.45rem}
.chips label{font-weight:500;font-size:.85rem;display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .75rem;border:1px solid var(--navy-200);border-radius:999px;background:#fff;cursor:pointer;color:var(--ink-700)}
.chips input{accent-color:var(--teal-600);width:auto;margin:0}
.chips label:has(input:checked){border-color:var(--teal-400);background:var(--teal-50);color:var(--teal-700)}
.form-note{font-size:.8rem;color:var(--ink-500)}
.form-ok{display:none;border-radius:.6rem;padding:.8rem 1rem;background:var(--green-50);color:var(--green-700);font-size:.9rem;border:1px solid #bfe3cb}
.form-ok.show{display:block}

/* ---------- footer ---------- */
.foot{background:var(--navy-900);color:var(--navy-200);margin-top:0}
.foot .wrap{padding-top:3.5rem;padding-bottom:2rem}
.foot-grid{display:grid;gap:2.5rem;grid-template-columns:1fr 1fr}
.foot-grid>:first-child{grid-column:1/-1}
@media(min-width:1024px){.foot-grid{grid-template-columns:1.6fr 1fr 1fr 1fr;}.foot-grid>:first-child{grid-column:auto}}
.foot .brand-name b{color:#fff}
.foot .brand-name small{color:var(--navy-300)}
.foot h2{font-family:var(--sans);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;margin-bottom:1rem}
.foot ul{display:grid;gap:.55rem}
.foot a{text-decoration:none;font-size:.9rem;color:var(--navy-200)}
.foot a:hover{color:#fff}
.foot p{font-size:.88rem;line-height:1.6;max-width:24rem;margin-top:1rem}
.foot-bottom{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;justify-content:space-between;border-top:1px solid var(--navy-800);margin-top:2.5rem;padding-top:1.25rem;font-size:.78rem;color:var(--navy-300)}

/* ---------- legal ---------- */
.prose{max-width:46rem}
.prose h2{font-size:1.35rem;margin:2rem 0 .6rem}
.prose p,.prose li{color:var(--ink-600);margin-bottom:.8rem}
.prose ul{list-style:disc;padding-left:1.25rem}

/* ================= MOCKUPS (light UI, sample data) ================= */
.mock{position:relative;font-family:var(--sans);color:var(--ink-900);-webkit-user-select:none;user-select:none}
.mock *{line-height:1.25}
.sample{position:absolute;z-index:5;top:-.7rem;right:1rem;font-size:.66rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--warm-500);color:#fff;border-radius:999px;padding:.2rem .6rem;box-shadow:0 4px 10px -4px rgba(232,116,44,.6)}
.device{background:#1b2633;border-radius:1.4rem;padding:.65rem;box-shadow:var(--shadow-raised),inset 0 0 0 1.5px #3a4756}
.device .scr{background:#fff;border-radius:.85rem;overflow:hidden}
.win{background:#fff;border:1px solid var(--navy-100);border-radius:.9rem;box-shadow:var(--shadow-raised);overflow:hidden}
.win-bar{display:flex;align-items:center;gap:.4rem;padding:.55rem .8rem;border-bottom:1px solid var(--navy-100);background:var(--paper)}
.win-bar i{width:.6rem;height:.6rem;border-radius:50%;background:var(--ink-200)}
.win-bar i:nth-child(1){background:#f0a0a0}.win-bar i:nth-child(2){background:#f3d18d}.win-bar i:nth-child(3){background:#9fd8b4}
.win-bar span{margin-left:.6rem;font-size:.72rem;color:var(--ink-500);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.float{animation:float 7s ease-in-out 1.2s infinite}

/* app chrome */
.abar{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.55rem .75rem;border-bottom:1px solid var(--navy-100);font-size:.72rem;background:#fff}
.abar b{font-size:.8rem;color:var(--navy-900)}
.abar .on{display:inline-flex;align-items:center;gap:.3rem;color:var(--green-700);font-weight:600}
.abar .on::before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:var(--green-500);animation:blink 1.8s ease-in-out infinite}
.abar .who{color:var(--ink-500)}
.chip{display:inline-block;font-size:.6rem;font-weight:700;padding:.12rem .4rem;border-radius:999px;white-space:nowrap}
.chip.red{background:var(--red-50);color:var(--red-700)}.chip.amb{background:var(--yellow-50);color:#8a5d00}.chip.grn{background:var(--green-50);color:var(--green-700)}.chip.teal{background:var(--teal-50);color:var(--teal-700)}.chip.warm{background:var(--warm-50);color:var(--warm-700)}.chip.gray{background:var(--ink-50);color:var(--ink-600)}

/* POS restaurant */
.pos{display:grid;grid-template-columns:5.6rem 1fr 9.6rem;min-height:18.5rem;font-size:.7rem}
.pos-cats{background:var(--paper);border-right:1px solid var(--navy-100);padding:.45rem;display:grid;gap:.3rem;align-content:start}
.pos-cats span{padding:.42rem .45rem;border-radius:.4rem;color:var(--ink-600);font-weight:600;font-size:.64rem}
.pos-cats span.act{background:var(--warm-500);color:#fff}
.pos-items{padding:.5rem;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;align-content:start}
.pos-item{border:1px solid var(--navy-100);border-radius:.5rem;padding:.45rem;display:flex;flex-direction:column;gap:.35rem;min-height:3.6rem;background:#fff;position:relative}
.pos-item b{font-size:.66rem;color:var(--navy-900);font-weight:600}
.pos-item em{font-style:normal;color:var(--ink-500);font-size:.62rem;margin-top:auto}
.pos-item::before{content:"";height:3px;border-radius:2px;background:var(--c,var(--teal-400));width:1.4rem}
.pos-item.hit{border-color:var(--teal-400);box-shadow:0 0 0 2px var(--teal-100)}
.pos-item .low{position:absolute;right:.35rem;top:.35rem}
.pos-tick{border-left:1px solid var(--navy-100);display:flex;flex-direction:column;background:#fff}
.pos-tick h5{margin:0;padding:.5rem .6rem;border-bottom:1px solid var(--navy-100);font-size:.72rem;color:var(--navy-900);display:flex;justify-content:space-between}
.pos-tick ul{padding:.35rem .6rem;display:grid;gap:.38rem;flex:1;align-content:start}
.pos-tick li{display:flex;justify-content:space-between;gap:.3rem;font-size:.64rem}
.pos-tick li small{display:block;color:var(--warm-600);font-size:.58rem}
.pos-tick li.course{color:var(--ink-400);font-size:.56rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700;border-bottom:1px dashed var(--navy-100);padding-bottom:.15rem}
.pos-tick li.new{animation:row .6s 1s both}
.pos-total{padding:.5rem .6rem;border-top:1px solid var(--navy-100);display:flex;justify-content:space-between;font-weight:700;font-size:.74rem;color:var(--navy-900)}
.pos-btns{display:grid;grid-template-columns:1fr 1fr;gap:.3rem;padding:0 .5rem .5rem}
.pos-btns span{text-align:center;padding:.45rem .2rem;border-radius:.4rem;font-weight:700;font-size:.6rem;background:var(--ink-50);color:var(--ink-700)}
.pos-btns span.go{grid-column:1/-1;background:var(--teal-600);color:#fff}
.pos-btns span.pay{background:var(--warm-500);color:#fff}

/* waiter phone */

/* KDS */
.kds{background:#f2f4f6;padding:.6rem;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;font-size:.66rem}
.kt{background:#fff;border-radius:.55rem;overflow:hidden;border:1px solid var(--navy-100);display:flex;flex-direction:column}
.kt-h{padding:.4rem .5rem;display:flex;justify-content:space-between;align-items:center;font-weight:700;color:#fff;font-size:.66rem}
.kt.g .kt-h{background:var(--green-500)}.kt.a .kt-h{background:var(--yellow-500)}.kt.r .kt-h{background:var(--red-500)}
.kt-h span{font-family:var(--mono);font-size:.64rem}
.kt-m{padding:.3rem .5rem;font-size:.58rem;color:var(--ink-500);border-bottom:1px solid var(--navy-100)}
.kt ul{padding:.35rem .5rem;display:grid;gap:.3rem;flex:1}
.kt li{display:flex;gap:.3rem;align-items:flex-start;font-size:.62rem}
.kt li b{min-width:1.1rem;color:var(--navy-900)}
.kt li small{display:block;color:var(--warm-600);font-weight:600;font-size:.56rem}
.kt li.done{color:var(--ink-400);text-decoration:line-through}
.kt-f{padding:.35rem .5rem .45rem}
.kt-f span{display:block;text-align:center;background:var(--navy-900);color:#fff;border-radius:.35rem;padding:.3rem;font-weight:700;font-size:.58rem}

/* data tables (stock, NIR, retail) */
.dt{width:100%;border-collapse:collapse;font-size:.68rem}
.dt th{text-align:left;font-weight:700;color:var(--ink-500);font-size:.58rem;text-transform:uppercase;letter-spacing:.06em;padding:.45rem .6rem;border-bottom:1px solid var(--navy-100);background:var(--paper);white-space:nowrap}
.dt td{padding:.48rem .6rem;border-bottom:1px solid var(--navy-50);color:var(--ink-700);white-space:nowrap}
.dt td b{color:var(--navy-900);font-weight:600}
.dt tr.alert td{background:#fff8f6}
.dt .num{text-align:right;font-family:var(--mono);font-size:.64rem}
.app{display:grid;grid-template-columns:7.4rem 1fr;min-height:17rem}
.side{background:var(--navy-900);color:var(--navy-200);padding:.7rem .55rem;font-size:.64rem;display:grid;gap:.2rem;align-content:start}
.side b{color:#fff;font-family:var(--display);font-size:.78rem;padding:.1rem .4rem .6rem;display:flex;align-items:center;gap:.35rem}
.side b::before{content:"";width:.55rem;height:.55rem;border-radius:50%;background:var(--warm-500)}
.side span{padding:.38rem .45rem;border-radius:.35rem}
.side span.act{background:#ffffff18;color:#fff}
.main{padding:.75rem;min-width:0;display:grid;gap:.6rem;align-content:start;background:#fbfcfd}
.main h5{margin:0;font-family:var(--display);font-size:.88rem;color:var(--navy-900);display:flex;justify-content:space-between;align-items:center;gap:.5rem}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.45rem}
.kpi{background:#fff;border:1px solid var(--navy-100);border-radius:.5rem;padding:.45rem .5rem}
.kpi small{display:block;font-size:.56rem;color:var(--ink-500);font-weight:600}
.kpi b{font-family:var(--display);font-size:.9rem;color:var(--navy-900)}
.kpi.w b{color:var(--warm-600)}
.bars{display:flex;align-items:flex-end;gap:.25rem;height:3.6rem;padding:.4rem .5rem;background:#fff;border:1px solid var(--navy-100);border-radius:.5rem}
.bars i{flex:1;background:linear-gradient(180deg,var(--teal-400),var(--teal-200));border-radius:.2rem .2rem 0 0;height:var(--h);transform-origin:bottom;animation:barup .8s cubic-bezier(.2,.7,.2,1) both}
.bars i:nth-child(odd){animation-delay:.1s}.bars i.now{background:linear-gradient(180deg,var(--warm-500),var(--warm-200))}
.alerts{display:grid;gap:.35rem}
.al{display:flex;gap:.45rem;align-items:flex-start;background:#fff;border:1px solid var(--navy-100);border-left:3px solid var(--warm-500);border-radius:.45rem;padding:.4rem .5rem;font-size:.62rem;color:var(--ink-700)}
.al.r{border-left-color:var(--red-500)}.al.t{border-left-color:var(--teal-500)}
.al b{color:var(--navy-900)}
.boxes{background:#fff;border:1px solid var(--navy-100);border-radius:.5rem;overflow:hidden}
.ai-box{border-radius:.55rem;padding:.55rem .65rem;background:linear-gradient(135deg,var(--teal-50),var(--warm-50));border:1px solid var(--teal-200);font-size:.64rem;color:var(--ink-700);display:flex;gap:.5rem}
.ai-box b{color:var(--teal-700)}
.ai-box .spark{flex:0 0 1.2rem;height:1.2rem;border-radius:.35rem;background:var(--teal-600);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.7rem}

/* NIR */
.nir{display:grid;grid-template-columns:1fr auto 1.25fr;gap:.6rem;align-items:center;padding:.8rem;background:#fbfcfd}
.doc{background:#fff;border:1px solid var(--navy-100);border-radius:.6rem;padding:.6rem;font-size:.62rem;box-shadow:var(--shadow-card);min-width:0}
.doc h6{margin:0 0 .35rem;font-size:.7rem;color:var(--navy-900);font-family:var(--display);display:flex;justify-content:space-between;gap:.3rem;align-items:center}
.doc p{color:var(--ink-500);font-size:.58rem;margin-bottom:.4rem}
.doc .ln{display:flex;justify-content:space-between;gap:.3rem;padding:.25rem 0;border-top:1px dashed var(--navy-100)}
.doc .ln span:last-child{font-family:var(--mono);color:var(--ink-600)}
.arrow{display:flex;flex-direction:column;align-items:center;gap:.3rem;font-size:.55rem;color:var(--teal-700);font-weight:700;text-align:center}
.arrow i{width:2rem;height:2rem;border-radius:50%;background:var(--teal-600);color:#fff;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:.9rem;animation:pulse 2s ease-in-out infinite}
.doc .ok{color:var(--green-700)}
.doc .btnm{margin-top:.5rem;text-align:center;background:var(--teal-600);color:#fff;border-radius:.4rem;padding:.35rem;font-weight:700}

/* shifts */
.shifts{padding:.7rem;background:#fbfcfd;display:grid;gap:.5rem}
.sh-grid{display:grid;grid-template-columns:4.4rem repeat(7,minmax(0,1fr));gap:.2rem;font-size:.6rem;align-items:center}
.sh-grid .d{text-align:center;font-weight:700;color:var(--ink-500);font-size:.55rem}
.sh-grid .n{font-weight:600;color:var(--navy-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sh-grid .c{height:1.35rem;border-radius:.3rem;background:var(--ink-50);font-size:.52rem;display:flex;align-items:center;justify-content:center;color:var(--ink-400)}
.sh-grid .c.m{background:var(--teal-100);color:var(--teal-700);font-weight:700}
.sh-grid .c.e{background:var(--warm-100);color:var(--warm-700);font-weight:700}
.sh-grid .c.x{background:var(--navy-100);color:var(--navy-600);font-weight:700}
.tips{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}

/* retail POS */
.rpos{display:grid;grid-template-columns:1.35fr 1fr;min-height:18rem;font-size:.68rem}
.rpos-l{padding:.6rem;display:grid;gap:.5rem;align-content:start;background:#fbfcfd}
.scan{display:flex;align-items:center;gap:.5rem;border:1.5px solid var(--teal-400);border-radius:.5rem;padding:.45rem .6rem;background:#fff;font-family:var(--mono);font-size:.66rem;color:var(--ink-700);position:relative;overflow:hidden}
.scan::after{content:"";position:absolute;left:0;top:0;width:45%;height:100%;background:linear-gradient(90deg,transparent,rgba(214,69,69,.16),transparent);animation:scanl 2.4s ease-in-out infinite}
.rpos-r{border-left:1px solid var(--navy-100);display:flex;flex-direction:column}
.rpos-r .sum{padding:.6rem;display:grid;gap:.3rem;font-size:.66rem}
.rpos-r .sum div{display:flex;justify-content:space-between}
.rpos-r .sum .tot{font-weight:800;font-size:.95rem;color:var(--navy-900);border-top:1px solid var(--navy-100);padding-top:.4rem;margin-top:.2rem;font-family:var(--display)}
.pay{display:grid;grid-template-columns:1fr 1fr;gap:.35rem;padding:0 .6rem .6rem;margin-top:auto}
.pay span{text-align:center;padding:.5rem .2rem;border-radius:.4rem;font-weight:700;font-size:.62rem;background:var(--ink-50);color:var(--ink-700)}
.pay span.card{background:var(--teal-600);color:#fff}
.pay span.cash{background:var(--navy-900);color:#fff}
.loyal{margin:0 .6rem .5rem;border:1px dashed var(--teal-400);border-radius:.45rem;padding:.4rem .5rem;font-size:.6rem;color:var(--teal-700);background:var(--teal-50)}

/* hotel room plan */
.hotel{padding:.6rem;background:#fbfcfd;display:grid;gap:.5rem}
.hp{display:grid;grid-template-columns:4rem repeat(7,minmax(0,1fr));font-size:.58rem;border:1px solid var(--navy-100);border-radius:.5rem;overflow:hidden;background:#fff}
.hp>div{border-bottom:1px solid var(--navy-50);border-right:1px solid var(--navy-50);height:1.75rem;display:flex;align-items:center;padding:0 .3rem;position:relative}
.hp .hd{background:var(--paper);font-weight:700;color:var(--ink-500);justify-content:center;font-size:.55rem}
.hp .hd.today{color:var(--warm-700);background:var(--warm-50)}
.hp .rm{font-weight:700;color:var(--navy-900);gap:.25rem}
.hp .rm i{width:.42rem;height:.42rem;border-radius:50%;background:var(--green-500)}
.hp .rm i.dirty{background:var(--warm-500)}.hp .rm i.oos{background:var(--ink-400)}
.bk{position:absolute;z-index:1;top:.22rem;bottom:.22rem;left:.15rem;border-radius:.3rem;font-size:.54rem;font-weight:700;color:#fff;display:flex;align-items:center;padding:0 .35rem;white-space:nowrap;overflow:hidden;width:calc(var(--n)*100% + (var(--n) - 1)*1px - .3rem)}
.bk.a{background:var(--teal-500)}.bk.b{background:var(--navy-500)}.bk.c{background:var(--warm-500)}.bk.d{background:#8a6bbf}
.hotel-legend{display:flex;flex-wrap:wrap;gap:.6rem;font-size:.56rem;color:var(--ink-500)}
.hotel-legend span{display:inline-flex;align-items:center;gap:.25rem}
.hotel-legend i{width:.5rem;height:.5rem;border-radius:50%;display:inline-block}

/* hero composite */
@media(max-width:639px){
  .app{grid-template-columns:1fr}
  .side{display:none}
  .kpis{grid-template-columns:repeat(2,1fr)}
}

/* mockups on narrow screens: scale font a bit, allow horizontal scroll inside data tables */
.mock-scroll{overflow-x:auto;scrollbar-width:thin}
@media(max-width:639px){
  .pos{grid-template-columns:4.2rem 1fr;min-height:0}
  .pos-tick{grid-column:1/-1;border-left:0;border-top:1px solid var(--navy-100)}
  .pos-items{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kds{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kds .kt:nth-child(3){display:none}
  .nir{grid-template-columns:1fr;justify-items:stretch}
  .arrow{flex-direction:row;justify-content:center}
  .arrow i{transform:rotate(90deg)}
  .rpos{grid-template-columns:1fr}
  .rpos-r{border-left:0;border-top:1px solid var(--navy-100)}
  .sh-grid{grid-template-columns:3.6rem repeat(7,minmax(0,1fr))}
  .hp{grid-template-columns:3.1rem repeat(7,minmax(0,1fr))}
  .bk{font-size:0}
  .bk::after{content:attr(data-s);font-size:.52rem}
  .device{padding:.4rem;border-radius:1rem}
}

/* ---------- reveal ---------- */
.reveal-on [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.reveal-on [data-reveal].in{opacity:1;transform:none}
.reveal-on .card[data-reveal].in.done{transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s,border-color .25s;transition-delay:0s}
.reveal-on .eyebrow::before{width:.75rem}
.reveal-on .in .eyebrow::before,.reveal-on .eyebrow.in::before{width:2.25rem}

@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes row{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes drift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(5rem,3rem,0) scale(1.12)}}
@keyframes gridmove{from{background-position:0 0}to{background-position:320px 320px}}
@keyframes ping{0%{transform:scale(.6);opacity:.8}80%,100%{transform:scale(1.9);opacity:0}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes nudge{0%,70%,100%{transform:none}80%{transform:translateX(6px)}90%{transform:translateX(0)}}
@keyframes dash{to{stroke-dashoffset:-26}}
@keyframes dashy{to{background-position:0 12px}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(47,158,91,.0)}50%{box-shadow:0 0 0 4px rgba(47,158,91,.18)}}
@keyframes barup{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes scanl{0%,100%{transform:translateX(-100%)}50%{transform:translateX(230%)}}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  [data-reveal]{opacity:1!important;transform:none!important}
}

/* customer-facing branded app (fictional brand colours on purpose: deep green + cream) */
.ca .scr{background:#fbf7ef}
.swipe-hint svg{width:14px;height:14px}
.chips-links{display:flex;flex-wrap:wrap;gap:.6rem}
.chips-links a{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;font-weight:600;font-size:.92rem;color:var(--navy-900);background:#fff;border:1px solid var(--navy-100);border-radius:999px;padding:.55rem 1rem .55rem .6rem;box-shadow:var(--shadow-card);transition:transform .2s,border-color .2s}
.chips-links a .ico{width:2rem;height:2rem;border-radius:50%}
.chips-links a .ico svg{width:1rem;height:1rem}
@media(hover:hover){.chips-links a:hover{transform:translateY(-3px);border-color:var(--teal-200)}}
.mods a.card{padding:1.2rem;gap:.5rem}
.mods a.card h3{font-size:1rem}
.mods a.card p{font-size:.86rem}
.btn.head-cta{display:none}
@media(min-width:1180px){.btn.head-cta{display:inline-flex}}
.nw{white-space:nowrap}
.dt td.wr{white-space:normal;min-width:8rem}
@media(max-width:639px){.dt .hide-m{display:none}}
.checks li,.xlist li{display:block;position:relative;padding-left:1.7rem}
.checks li::before,.xlist li::before{position:absolute;left:0;top:.17rem;margin-top:0;width:1.1rem}
@media(min-width:900px){
  .sys-node.n1{grid-column:1;grid-row:1}.sys-node.n2{grid-column:1;grid-row:2}.sys-node.n3{grid-column:1;grid-row:3}
  .sys-node.n4{grid-column:3;grid-row:1}.sys-node.n5{grid-column:3;grid-row:2}.sys-node.n6{grid-column:3;grid-row:3}
}
.kpi b{white-space:nowrap}
@media(min-width:640px){.feat-text .steps{grid-template-columns:1fr 1fr}}
.prose a{color:var(--teal-700)}
.prose a.btn-primary,.prose a.btn-warm{color:#fff}
.faq .a a,.lead a{color:var(--teal-700)}
.pos-item .low{position:static;align-self:flex-start;order:3}
@media(max-width:639px){
  .mod-mini{grid-template-columns:1fr 1fr;gap:.6rem}
  .mod-mini .card{padding:.9rem;gap:.4rem}
  .mod-mini .card h3{font-size:.92rem}
  .mod-mini .card p{font-size:.8rem;line-height:1.45}
  .mod-mini .ico{width:2.1rem;height:2.1rem}
}
.pill svg{width:1rem;height:1rem;flex-shrink:0}.pill{white-space:nowrap}
@media(max-width:1023px){.pilot-feat .feat-visual{order:-1}}

/* ================= v2 (2026-10-19 evening): realistic phones, photos, big POS, Bord logo ================= */

/* ---------- logo in header / footer ---------- */
.brand .logo-word{height:1.55rem;width:auto;display:block}
.brand .endorse{display:block;font-size:.66rem;color:var(--ink-500);margin-top:.28rem;font-weight:500;letter-spacing:.02em;line-height:1}
.brand-stack{display:flex;flex-direction:column;align-items:flex-start}
.foot .brand .endorse{color:var(--navy-300)}

/* ---------- realistic phone (19.5:9) ---------- */
.phone{--pw:16.5rem;width:var(--pw);aspect-ratio:9/19.5;position:relative;flex:0 0 auto;font-size:calc(var(--pw)*.052);
  border-radius:calc(var(--pw)*.17);padding:calc(var(--pw)*.03);
  background:linear-gradient(150deg,#3a4552 0%,#141b23 38%,#0c1117 70%,#2b3540 100%);
  box-shadow:inset 0 0 0 1.5px #4b5664,inset 0 0 0 3px #0a0e13,0 2px 3px rgba(11,31,51,.18),0 26px 48px -18px rgba(11,31,51,.5),0 60px 90px -50px rgba(11,31,51,.45)}
.phone::before,.phone::after{content:"";position:absolute;width:3px;border-radius:2px;background:linear-gradient(90deg,#1b232c,#3b4652)}
.phone::before{left:-2px;top:21%;height:6.5%;box-shadow:0 calc(var(--pw)*.17) 0 #26303a}
.phone::after{right:-2px;top:27%;height:11%}
.phone .scr{position:relative;height:100%;border-radius:calc(var(--pw)*.142);overflow:hidden;background:#fff;display:flex;flex-direction:column}
.phone .scr::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:6;background:linear-gradient(118deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,.05) 28%,rgba(255,255,255,0) 42%)}
.phone .island{position:absolute;z-index:7;top:calc(var(--pw)*.028);left:50%;width:31%;height:calc(var(--pw)*.088);border-radius:999px;background:#05080b;transform:translateX(-50%)}
.phone .sbar{flex:0 0 auto;height:calc(var(--pw)*.145);display:flex;align-items:center;justify-content:space-between;padding:calc(var(--pw)*.02) 9% 0;font-size:.82em;font-weight:700;color:#111;letter-spacing:-.01em;position:relative;z-index:5}
.phone .sbar .ic{display:flex;gap:.3em;align-items:center}
.phone .sbar svg{height:.85em;width:auto}
.phone .homebar{position:absolute;z-index:7;bottom:calc(var(--pw)*.022);left:50%;width:36%;height:.32em;border-radius:1em;background:#0b1f33;opacity:.75;transform:translateX(-50%)}
.phone.dark .homebar{background:#fff}
.phone .body{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}
.phone .grow{flex:1}

/* phone groups: two phones at different depths */
.phones{display:flex;justify-content:center;align-items:flex-start;gap:1.5rem;flex-wrap:wrap;padding:.5rem 0 1rem}
.phone-pair{display:flex;justify-content:center;align-items:flex-start;padding:0 0 2.5rem}
.phone-pair>.mock:nth-child(2){margin-left:-3.2rem;margin-top:2.8rem;z-index:1}
.phone-pair>.mock:nth-child(2) .phone{--pw:15rem}
.phone-pair>.mock:first-child{z-index:2}
@media(max-width:1100px) and (min-width:1024px){.phone{--pw:15rem}.phone-pair>.mock:nth-child(2) .phone{--pw:13.6rem}}
@media(max-width:639px){
  .phone{--pw:15rem}
  .phone-pair .phone{--pw:12.4rem}
  .phone-pair>.mock:nth-child(2) .phone{--pw:11.4rem}
  .phone-pair>.mock:nth-child(2){margin-left:-2.6rem;margin-top:2.2rem}
}
.phone-pair .sample{display:none}
.phone-pair>.mock:first-child .sample{display:block}

/* screen content (em = scales with the phone) */
.ph-head{padding:.35em 1.1em .7em}
.ph-head b{display:block;font-family:var(--display);font-size:1.35em;color:var(--navy-900);letter-spacing:-.02em;line-height:1.15}
.ph-head small{display:block;color:var(--ink-500);font-size:.8em;margin-top:.15em}
.ph-tabs{display:flex;gap:.35em;padding:0 1.1em .7em;flex-wrap:nowrap;overflow:hidden}
.ph-tabs span{font-size:.78em;font-weight:700;padding:.35em .75em;border-radius:999px;background:var(--ink-50);color:var(--ink-600);white-space:nowrap}
.ph-tabs span.act{background:var(--navy-900);color:#fff}
.tables{display:grid;grid-template-columns:repeat(3,1fr);gap:.55em;padding:.1em 1.1em .9em}
.tbl{border-radius:.8em;padding:.6em .3em;text-align:center;border:1px solid var(--navy-100);background:#fff;font-size:.74em;color:var(--ink-500);line-height:1.2}
.tbl b{display:block;font-size:1.55em;color:var(--navy-900);font-family:var(--display);line-height:1.15}
.tbl.busy{background:var(--teal-50);border-color:var(--teal-200);color:var(--teal-700)}
.tbl.bill{background:var(--warm-50);border-color:var(--warm-200);color:var(--warm-700)}
.tbl.ready{background:var(--green-50);border-color:#bfe3cb;color:var(--green-700);animation:pulse 2s ease-in-out infinite}
.toast{margin:0 .8em .8em;border-radius:1em;background:var(--navy-900);color:#fff;padding:.75em .85em;font-size:.8em;display:flex;gap:.6em;align-items:flex-start;box-shadow:0 10px 20px -10px #0b1f3399;animation:rise .6s 1.4s both;line-height:1.3}
.toast i{flex:0 0 .7em;height:.7em;border-radius:50%;background:var(--green-500);margin-top:.25em}
.toast b{display:block;font-size:1.05em;margin-bottom:.1em}
.ph-nav{display:flex;justify-content:space-around;border-top:1px solid var(--navy-100);padding:.7em 0 1.6em;font-size:.7em;color:var(--ink-500);font-weight:600;background:#fff}
.ph-nav span{display:flex;flex-direction:column;align-items:center;gap:.3em}
.ph-nav span::before{content:"";width:1.6em;height:1.6em;border-radius:.45em;background:var(--ink-200)}
.ph-nav span.act{color:var(--teal-700)}
.ph-nav span.act::before{background:var(--teal-500)}
.ph-list{display:grid;gap:.5em;padding:0 1.1em .8em}
.ph-row{display:flex;gap:.6em;align-items:flex-start;background:#fff;border:1px solid var(--navy-100);border-left:.25em solid var(--warm-500);border-radius:.7em;padding:.6em .7em;font-size:.8em;color:var(--ink-700);line-height:1.3}
.ph-row.t{border-left-color:var(--teal-500)}.ph-row.r{border-left-color:var(--red-500)}.ph-row.g{border-left-color:var(--green-500)}
.ph-row b{color:var(--navy-900)}
.ph-row .qty{font-weight:800;color:var(--navy-900);min-width:1.6em}
.ph-row small{display:block;color:var(--warm-600);font-weight:600;font-size:.9em;margin-top:.15em}
.ph-row .st{margin-left:auto;font-size:.82em;font-weight:700;white-space:nowrap}
.ph-sec{font-size:.68em;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-400);padding:.2em 1.6em .4em}
.ph-btn{margin:.2em 1.1em .5em;border-radius:.9em;padding:.85em;text-align:center;font-weight:800;font-size:.86em;background:var(--teal-600);color:#fff}
.ph-btn.warm{background:var(--warm-500)}
.ph-btn.ghost{background:var(--ink-50);color:var(--navy-900)}
.ph-btns{display:grid;grid-template-columns:1fr 1fr;gap:.5em;margin:0 1.1em .5em}
.ph-btns .ph-btn{margin:0}
/* branded customer app (fictional brand) */
.ca .scr{background:#fbf7ef}
.ca .sbar{background:#1f4d3a;color:#fff}
.ca-hero{display:flex;gap:.75em;align-items:center;padding:.3em 1.1em 1em;background:#1f4d3a;color:#fff}
.ca-hero b{font-family:var(--display);font-size:1.3em;display:block;line-height:1.1}
.ca-hero small{font-size:.75em;color:#cfe3d6}
.ca-logo{flex:0 0 2.7em;height:2.7em;border-radius:.8em;background:#f2c14e;color:#1f4d3a;font-weight:800;font-family:var(--display);display:flex;align-items:center;justify-content:center;font-size:1em}
.ca-tabs{display:flex;gap:.4em;padding:.9em 1.1em .5em}
.ca-tabs span{font-size:.76em;font-weight:700;padding:.4em .75em;border-radius:999px;background:#efe7d6;color:#5b513e;white-space:nowrap}
.ca-tabs span.act{background:#1f4d3a;color:#fff}
.ca-pts{margin:.3em 1.1em .7em;padding:.6em .75em;border-radius:.7em;background:#fff3cf;color:#7a5a00;font-size:.76em;font-weight:600;line-height:1.3}
.ca-list{display:grid;gap:.55em;padding:0 1.1em .7em}
.ca-item{display:grid;grid-template-columns:3em 1fr auto 1.7em;gap:.6em;align-items:center;background:#fff;border-radius:.8em;padding:.5em;box-shadow:0 1px 2px #0000000f;font-size:.82em;line-height:1.25}
.ca-item i{height:3em;border-radius:.6em}
.ca-item b{display:block;color:#1d2a22;font-size:1em}
.ca-item small{color:#7a776c;font-size:.82em}
.ca-item span{font-weight:700;color:#1f4d3a}
.ca-item em{font-style:normal;width:1.7em;height:1.7em;border-radius:50%;background:#1f4d3a;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}
.ca-cart{margin:.2em 1.1em 1.8em;border-radius:1em;background:#f2c14e;color:#1f4d3a;padding:.85em 1em;display:flex;justify-content:space-between;font-size:.84em;animation:rise .6s 1.2s both}
.map{margin:0 1.1em;border-radius:.9em;overflow:hidden;background:#f6f8fa;border:1px solid var(--navy-100);height:9.5em}
.map svg{width:100%;height:100%}
.map .route{animation:dash 1.4s linear infinite}
/* home screen with app icons (logo page) */
.home-scr{background:linear-gradient(160deg,#cfe7e5 0%,#f6e3d3 60%,#f3d0b7 100%)}
.home-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1em .6em;padding:1.4em 1.1em}
.app-ic{display:flex;flex-direction:column;align-items:center;gap:.35em;font-size:.68em;color:#1b2633;font-weight:600}
.app-ic i,.app-ic img{width:4.4em;height:4.4em;border-radius:1em;display:block;box-shadow:0 2px 4px rgba(0,0,0,.12)}
.home-dock{margin:auto 1em 1.9em;padding:.8em;border-radius:1.6em;background:rgba(255,255,255,.45);display:flex;justify-content:space-around}

/* ---------- photos ---------- */
.photo{position:relative;border-radius:1.2rem;overflow:hidden;box-shadow:var(--shadow-raised);background:var(--navy-100)}
.photo img{display:block;width:100%;height:100%;object-fit:cover}
.photo figcaption{position:absolute;left:.8rem;bottom:.8rem;font-size:.75rem;font-weight:700;color:#fff;background:rgba(11,31,51,.62);backdrop-filter:blur(6px);padding:.3rem .7rem;border-radius:999px}
.combo{position:relative;padding:0 0 3rem 0}
.combo .photo{aspect-ratio:4/3;width:88%}
.combo .over{position:absolute;right:0;bottom:0;z-index:2}
.combo .over.phone-over{bottom:-1rem}
.combo .over.phone-over .phone{--pw:12.5rem}
.combo .over.win-over{width:66%}
.combo .over.card-over{width:auto;max-width:17rem}
.combo.tl .over{right:auto;left:0}.combo.tl .photo{margin-left:auto}
.float-card{background:#fff;border:1px solid var(--navy-100);border-radius:1rem;padding:.9rem 1rem;box-shadow:var(--shadow-raised);font-size:.85rem;display:grid;gap:.3rem}
.float-card small{color:var(--ink-500);font-size:.72rem;font-weight:600}
.float-card b{font-family:var(--display);font-size:1.25rem;color:var(--navy-900)}
.float-card .chip{justify-self:start}
.float-card.top{position:absolute;left:-1rem;top:1.5rem;z-index:3}
@media(max-width:639px){
  .combo{padding-bottom:2.2rem}
  .combo .photo{width:100%}
  .combo .over.phone-over{right:-.3rem;bottom:-1.5rem}
  .combo .over.phone-over .phone{--pw:9.6rem}
  .combo .over.win-over{width:86%;right:-.4rem}
  .float-card.top{left:.5rem;top:.5rem;transform:scale(.88);transform-origin:left top}
}
.vcard .vphoto{aspect-ratio:16/9;overflow:hidden;background:var(--navy-100)}
.vcard .vphoto img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
@media(hover:hover){.vcard:hover .vphoto img{transform:scale(1.05)}}
.photo-strip{display:grid;gap:1rem;grid-template-columns:repeat(4,minmax(0,1fr))}
.photo-strip .photo{aspect-ratio:3/4}
@media(max-width:900px){.photo-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- big POS showcase ---------- */
.showcase{background:linear-gradient(180deg,var(--paper),#eef3f6);border-top:1px solid var(--navy-100);border-bottom:1px solid var(--navy-100);overflow:hidden}
.monitor{position:relative;max-width:68rem;margin:0 auto;padding-bottom:4.2rem}
.monitor .bezel{background:#151d26;border-radius:1.25rem;padding:.85rem;box-shadow:inset 0 0 0 1.5px #3a4756,0 2px 4px rgba(11,31,51,.2),0 40px 80px -36px rgba(11,31,51,.55)}
.monitor .bezel::before{content:"";display:block;width:.45rem;height:.45rem;border-radius:50%;background:#2c3946;margin:-.45rem auto .4rem}
.monitor .neck{position:absolute;left:50%;bottom:1rem;width:7rem;height:3.4rem;transform:translateX(-50%);background:linear-gradient(90deg,#9aa6b2,#d9dfe5 50%,#9aa6b2);clip-path:polygon(18% 0,82% 0,100% 100%,0 100%);z-index:-1}
.monitor .base{position:absolute;left:50%;bottom:0;width:17rem;height:1.1rem;transform:translateX(-50%);border-radius:50%/100% 100% 0 0;background:linear-gradient(180deg,#d9dfe5,#9aa6b2);box-shadow:0 14px 24px -10px rgba(11,31,51,.45)}
.bp{background:#f7f9fb;border-radius:.55rem;overflow:hidden;font-size:14px;color:var(--ink-900);display:grid;grid-template-rows:auto 1fr}
.bp-top{display:flex;align-items:center;gap:1rem;padding:.6rem 1rem;background:var(--navy-900);color:#fff;font-size:.82rem}
.bp-top .logo{height:1.05rem;width:auto}
.bp-top b{font-family:var(--display);font-size:.98rem}
.bp-top .sp{flex:1}
.bp-top .pill2{background:#ffffff1a;border:1px solid #ffffff2a;border-radius:999px;padding:.2rem .65rem;font-weight:600;white-space:nowrap}
.bp-top .on{display:inline-flex;align-items:center;gap:.35rem;color:#9fe3bd;font-weight:700}
.bp-top .on::before{content:"";width:.5rem;height:.5rem;border-radius:50%;background:#3fcf7f;animation:blink 1.8s ease-in-out infinite}
.bp-main{display:grid;grid-template-columns:minmax(0,1fr) 22.5rem;min-height:31rem}
.bp-left{padding:.8rem;display:grid;grid-template-rows:auto auto 1fr;gap:.7rem;min-width:0}
.bp-tabs{display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none}
.bp-tabs span{flex:0 0 auto;padding:.6rem 1rem;border-radius:.6rem;background:#fff;border:1px solid var(--navy-100);font-weight:700;font-size:.88rem;color:var(--ink-700)}
.bp-tabs span.act{background:var(--warm-500);border-color:var(--warm-500);color:#fff}
.bp-sub{display:flex;gap:.4rem;flex-wrap:wrap;font-size:.78rem}
.bp-sub span{padding:.25rem .65rem;border-radius:999px;background:var(--navy-50);color:var(--navy-700);font-weight:600}
.bp-sub span.act{background:var(--navy-900);color:#fff}
.bp-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem;align-content:start}
.bp-it{position:relative;background:#fff;border:1px solid var(--navy-100);border-radius:.7rem;padding:.7rem .75rem .65rem;min-height:5.6rem;display:flex;flex-direction:column;gap:.25rem;box-shadow:0 1px 2px #0b1f330a}
.bp-it::before{content:"";width:1.8rem;height:4px;border-radius:3px;background:var(--c,var(--warm-500))}
.bp-it b{font-size:.88rem;line-height:1.25;color:var(--navy-900)}
.bp-it small{color:var(--ink-500);font-size:.72rem}
.bp-it em{font-style:normal;margin-top:auto;font-weight:700;font-size:.86rem;color:var(--navy-900)}
.bp-it .chip{position:absolute;right:.5rem;top:.5rem;font-size:.62rem}
.bp-it.tap{border-color:var(--teal-400);box-shadow:0 0 0 3px var(--teal-100);animation:tap 3.2s ease-in-out 1.2s infinite}
.bp-it.out{opacity:.5}
.bp-tick{background:#fff;border-left:1px solid var(--navy-100);display:flex;flex-direction:column;min-width:0}
.bp-th{padding:.75rem 1rem .6rem;border-bottom:1px solid var(--navy-100)}
.bp-th .r1{display:flex;justify-content:space-between;align-items:baseline}
.bp-th b{font-family:var(--display);font-size:1.15rem;color:var(--navy-900)}
.bp-th small{color:var(--ink-500);font-size:.76rem}
.bp-lines{flex:1;padding:.35rem 1rem;display:grid;gap:.1rem;align-content:start;font-size:.84rem}
.bp-course{font-size:.66rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-400);padding:.55rem 0 .2rem;display:flex;justify-content:space-between;border-bottom:1px dashed var(--navy-100)}
.bp-ln{display:grid;grid-template-columns:1.6rem 1fr auto;gap:.4rem;padding:.38rem 0;border-bottom:1px solid var(--navy-50);align-items:start}
.bp-ln .q{font-weight:800;color:var(--navy-900)}
.bp-ln .n{color:var(--navy-900);font-weight:600;line-height:1.3}
.bp-ln .n small{display:block;font-weight:600;color:var(--warm-600);font-size:.74rem}
.bp-ln .n .seat{display:inline-block;font-size:.64rem;font-weight:700;background:var(--navy-50);color:var(--navy-600);border-radius:.3rem;padding:0 .3rem;margin-left:.25rem;vertical-align:1px}
.bp-ln .p{text-align:right;font-family:var(--mono);font-size:.8rem;color:var(--ink-700)}
.bp-ln .p .chip{display:block;margin-top:.2rem;font-family:var(--sans)}
.bp-ln.new{background:linear-gradient(90deg,var(--teal-50),transparent);animation:row .6s 1s both}
.bp-tot{padding:.6rem 1rem;border-top:1px solid var(--navy-100);display:grid;gap:.2rem;font-size:.82rem}
.bp-tot div{display:flex;justify-content:space-between;color:var(--ink-600)}
.bp-tot .big{font-family:var(--display);font-size:1.3rem;font-weight:700;color:var(--navy-900);padding-top:.2rem}
.bp-act{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.4rem;padding:0 .8rem .8rem}
.bp-act span{display:flex;align-items:center;justify-content:center;text-align:center;min-height:2.6rem;border-radius:.6rem;font-weight:800;font-size:.76rem;background:var(--ink-50);color:var(--navy-900);border:1px solid var(--navy-100);line-height:1.15;padding:.2rem}
.bp-act span.send{grid-column:1/-1;background:var(--teal-600);border-color:var(--teal-600);color:#fff;font-size:.9rem;min-height:3rem}
.bp-act span.card{background:var(--navy-900);border-color:var(--navy-900);color:#fff}
.bp-act span.cash{background:#fff}
.bp-act span.fis{background:var(--warm-500);border-color:var(--warm-500);color:#fff}
.bp-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:2rem}
.bp-notes div{display:flex;gap:.6rem;align-items:flex-start;font-size:.9rem;color:var(--ink-600)}
.bp-notes b{color:var(--navy-900)}
.bp-notes i{flex:0 0 1.6rem;height:1.6rem;border-radius:50%;background:var(--warm-500);color:#fff;font-style:normal;font-weight:800;font-size:.8rem;display:flex;align-items:center;justify-content:center}
@keyframes tap{0%,100%{transform:none}8%{transform:scale(.96)}16%{transform:none}}
@media(max-width:1100px){.bp-main{grid-template-columns:minmax(0,1fr) 19rem}.bp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){
  .monitor{padding-bottom:0}
  .monitor .neck,.monitor .base{display:none}
  .monitor .bezel{padding:.45rem;border-radius:1rem}
  .monitor .bezel::before{display:none}
  .bp{font-size:13px}
  .bp-top{flex-wrap:wrap;gap:.4rem .7rem;padding:.55rem .7rem}
  .bp-top .sp{display:none}
  .bp-main{grid-template-columns:1fr;min-height:0}
  .bp-tick{border-left:0;border-top:1px solid var(--navy-100)}
  .bp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bp-grid .bp-it:nth-child(n+7){display:none}
  .bp-notes{grid-template-columns:1fr}
}

/* ---------- logo page ---------- */
.lg-opt{background:#fff;border:1px solid var(--navy-100);border-radius:1.25rem;box-shadow:var(--shadow-card);padding:1.5rem;display:grid;gap:1.25rem}
.lg-opt+.lg-opt{margin-top:1.75rem}
.lg-opt h2{font-size:1.4rem;display:flex;align-items:center;gap:.7rem}
.lg-opt h2 .lt{width:2.2rem;height:2.2rem;border-radius:.6rem;background:var(--navy-900);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem}
.lg-opt.rec{border-color:var(--warm-200);box-shadow:0 18px 36px -22px rgba(232,116,44,.45)}
.lg-grid{display:grid;gap:1rem;grid-template-columns:1.3fr 1fr 15rem;align-items:stretch}
.lg-panel{border-radius:1rem;padding:1.5rem;display:flex;flex-direction:column;justify-content:center;gap:1rem;min-height:11rem;border:1px solid var(--navy-100)}
.lg-panel.light{background:var(--paper)}
.lg-panel.dark{background:var(--navy-900);border-color:var(--navy-900)}
.lg-panel img.wm{width:min(100%,19rem);height:auto}
.lg-sizes{display:flex;align-items:flex-end;gap:1rem;flex-wrap:wrap}
.lg-sizes img{display:block}
.lg-hdr{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--navy-100);border-radius:.8rem;padding:.6rem 1rem}
.lg-hdr .brand-stack img{height:1.45rem}
.lg-hdr span.fake{font-size:.75rem;color:var(--ink-500)}
.lg-phone{display:flex;justify-content:center;align-items:center}
.lg-phone .phone{--pw:12rem}
@media(max-width:1023px){.lg-grid{grid-template-columns:1fr 1fr}.lg-phone{grid-column:1/-1}}
@media(max-width:639px){.lg-grid{grid-template-columns:1fr}}
.halo-live .bord-halo{transform-origin:center;transform-box:fill-box;animation:halo 2.2s ease-out infinite}
@keyframes halo{0%{transform:scale(.6);opacity:.7}80%,100%{transform:scale(1.5);opacity:0}}
.phone.home .scr{background:linear-gradient(160deg,#cfe7e5 0%,#f6e3d3 60%,#f3d0b7 100%)}.home-scr{background:none!important}
/* fixes after review */
.hero .combo .photo{aspect-ratio:1/1.08;width:80%}
@media(max-width:639px){.hero .combo .photo{aspect-ratio:4/3.4;width:100%}}
.monitor{isolation:isolate}
.monitor .bezel{position:relative;z-index:1}
.monitor .neck{z-index:0;bottom:.9rem}
.bp-left{grid-template-rows:auto auto auto 1fr}
.bp-it{min-height:6.4rem}
.bp-tables{background:#fff;border:1px solid var(--navy-100);border-radius:.7rem;padding:.7rem .8rem;display:grid;gap:.55rem;align-self:end}
.bp-tables h6{margin:0;font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-400);display:flex;justify-content:space-between}
.bp-tables .row{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:.4rem}
.bp-tables .t{border-radius:.5rem;border:1px solid var(--navy-100);padding:.4rem .2rem;text-align:center;font-size:.68rem;color:var(--ink-500);line-height:1.2}
.bp-tables .t b{display:block;font-family:var(--display);font-size:1rem;color:var(--navy-900)}
.bp-tables .t.busy{background:var(--teal-50);border-color:var(--teal-200);color:var(--teal-700)}
.bp-tables .t.cur{background:var(--warm-500);border-color:var(--warm-500);color:#fff}.bp-tables .t.cur b{color:#fff}
.bp-tables .t.bill{background:var(--warm-50);border-color:var(--warm-200);color:var(--warm-700)}
.bp-tables .t.ready{background:var(--green-50);border-color:#bfe3cb;color:var(--green-700)}
@media(max-width:1100px){.bp-tables .row{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){.bp-tables{display:none}}
.combo .over.win-over{width:72%}
/* hero with full-width background photo (text on a light gradient) */
.hero-photo{background:var(--paper)}
.hero-photo .grid-bg,.hero-photo::after{display:none}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center;z-index:0}
.hero-shade{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,rgba(248,248,245,.97) 0%,rgba(248,248,245,.94) 36%,rgba(248,248,245,.6) 54%,rgba(248,248,245,.08) 74%,rgba(248,248,245,0) 100%)}
.hero-photo::before{z-index:0}
.hero-photo .lead{color:var(--ink-700)}
.hero-over{position:relative;display:flex;justify-content:flex-end;align-items:flex-end;min-height:30rem}
.hero-over .phone{--pw:14.5rem}
.hero-over .float-card{position:absolute;left:8%;top:12%;z-index:3}
.hero-over.card-only{align-items:flex-end;min-height:24rem}
.hero-over.card-only .float-card{position:static}
@media(max-width:1023px){
  .hero-shade{background:linear-gradient(180deg,rgba(248,248,245,.95) 0%,rgba(248,248,245,.9) 55%,rgba(248,248,245,.55) 100%)}
  .hero-over{justify-content:center;min-height:0}
  .hero-over .float-card{left:0;top:1rem}
}
@media(max-width:639px){
  .hero-bg{object-position:70% center}
  .hero-over .phone{--pw:13rem}
  .hero-over .float-card{transform:scale(.86);transform-origin:left top}
}
@media(max-width:639px){.hero-over:not(.card-only) .float-card{display:none}}

/* ---------- product photos in mockups ---------- */
.bp-it{padding:.5rem .55rem .6rem;min-height:0}
.bp-it::before{display:none}
.bp-img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:.5rem;margin-bottom:.35rem;background:var(--navy-50)}
.bp-it .chip{top:.85rem;right:.85rem;box-shadow:0 1px 3px rgba(0,0,0,.18)}
.bp-it.out{opacity:1}
.bp-it.out .bp-img{filter:grayscale(1) contrast(.85);opacity:.55}
.bp-it.out b,.bp-it.out em,.bp-it.out small{opacity:.55}
.bp-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(min-width:1101px){.bp-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.bp-it b{font-size:.8rem}.bp-it small{font-size:.66rem}.bp-it em{font-size:.8rem}}
.ln-img{width:2rem;height:2rem;border-radius:.4rem;object-fit:cover;float:left;margin:0 .5rem 0 0}
.bp-ln .n{overflow:hidden}
.ph-th{flex:0 0 2.7em;width:2.7em;height:2.7em;border-radius:.55em;object-fit:cover}
.ph-row{align-items:center}
.ca-img{width:3em;height:3em;border-radius:.6em;object-fit:cover}
.rp-cell{display:flex;align-items:center;gap:.5rem;white-space:normal!important}
.rp-img{flex:0 0 2rem;width:2rem;height:2rem;border-radius:.4rem;object-fit:cover}
.rm-img{width:1.25rem;height:1.25rem;border-radius:.25rem;object-fit:cover}
.hp .rm{gap:.3rem}
.hotel-legend span .rm-img{width:1rem;height:1rem}
/* hotel guest app */
.ga .sbar{position:absolute;left:0;right:0;top:0;color:#fff}
.ga-hero{position:relative;height:11em;color:#fff}
.ga-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ga-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,31,51,.15),rgba(11,31,51,.75))}
.ga-hero div{position:absolute;left:1.1em;bottom:.9em;z-index:1}
.ga-hero small{font-size:.72em;opacity:.85}.ga-hero b{display:block;font-family:var(--display);font-size:1.3em}.ga-hero span{font-size:.75em}
.ga-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:.5em;padding:.8em 1.1em .6em}
.ga-tiles div{background:#fff;border:1px solid var(--navy-100);border-radius:.8em;overflow:hidden;font-size:.74em}
.ga-tiles img{width:100%;aspect-ratio:1/0.8;object-fit:cover;display:block}
.ga-tiles b{display:block;padding:.35em .5em 0;color:var(--navy-900)}.ga-tiles small{display:block;padding:0 .5em .45em;color:var(--ink-500);font-size:.85em}
.ga-cart{background:var(--navy-900);color:#fff}
/* room editor */
.re{display:grid;grid-template-columns:1.05fr 1fr;gap:1rem;padding:1rem;background:#fbfcfd;font-size:.8rem}
.re h6{margin:0 0 .45rem;font-size:.72rem;font-weight:800;color:var(--navy-900);display:flex;justify-content:space-between;gap:.5rem}
.re h6 small{font-weight:500;color:var(--ink-500)}
.re-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem;margin-bottom:.9rem}
.re-ph{position:relative;border-radius:.5rem;overflow:hidden;aspect-ratio:1/1}
.re-ph img{width:100%;height:100%;object-fit:cover;display:block}
.re-ph.cover{grid-column:span 2;grid-row:span 2;aspect-ratio:auto;outline:2px solid var(--warm-500);outline-offset:-2px}
.re-ph span{position:absolute;left:.4rem;top:.4rem;background:var(--warm-500);color:#fff;font-size:.62rem;font-weight:800;border-radius:999px;padding:.1rem .45rem}
.re-up{border:2px dashed var(--teal-400);border-radius:.5rem;background:var(--teal-50);color:var(--teal-700);font-size:.62rem;font-weight:600;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:.3rem;aspect-ratio:1/1;line-height:1.2}
.re-up b{font-size:1.4rem;line-height:1}
.re-video{position:relative;border-radius:.6rem;overflow:hidden;aspect-ratio:16/8}
.re-video img{width:100%;height:100%;object-fit:cover;display:block}
.re-video i,.rp-gal .vid i{position:absolute;left:50%;top:50%;width:2.6rem;height:2.6rem;margin:-1.3rem 0 0 -1.3rem;border-radius:50%;background:rgba(255,255,255,.92);color:var(--navy-900);display:flex;align-items:center;justify-content:center;font-style:normal;font-size:.9rem;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.re-video span,.rp-gal .vid span{position:absolute;left:.5rem;bottom:.45rem;color:#fff;font-size:.66rem;font-weight:700;text-shadow:0 1px 3px rgba(0,0,0,.5)}
.re-form{display:grid;gap:.55rem;align-content:start}
.re-form label{display:grid;gap:.2rem;font-size:.64rem;font-weight:800;color:var(--ink-500);text-transform:uppercase;letter-spacing:.06em}
.re-form label span{font-size:.8rem;font-weight:600;color:var(--navy-900);text-transform:none;letter-spacing:0;background:#fff;border:1px solid var(--navy-100);border-radius:.45rem;padding:.4rem .55rem}
.re-form label span.ta{font-weight:500;line-height:1.4}
.re-two{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.re-am{display:flex;flex-wrap:wrap;gap:.3rem}
.re-am span{font-size:.68rem;font-weight:600;padding:.2rem .55rem;border-radius:999px;background:var(--teal-50);color:var(--teal-700);border:1px solid var(--teal-200)}
.re-am span.add{background:#fff;border-style:dashed;color:var(--ink-500)}
.re-pub{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin-top:.3rem}
.re-pub b{margin-left:auto;background:var(--teal-600);color:#fff;border-radius:.45rem;padding:.4rem .9rem;font-size:.78rem}
/* public room page */
.win.site .url{background:#fff;border:1px solid var(--navy-100);border-radius:999px;padding:.1rem .7rem;font-weight:500}
.rp{background:#fff;font-size:.82rem}
.rp-nav{display:flex;align-items:center;gap:1rem;padding:.6rem 1rem;border-bottom:1px solid var(--navy-100);font-size:.74rem;color:var(--ink-600)}
.rp-nav b{font-family:Georgia,serif;font-size:1rem;color:#2b2118;margin-right:auto;letter-spacing:.02em}
.rp-nav em{font-style:normal;background:#2b2118;color:#fff;border-radius:.3rem;padding:.3rem .7rem;font-weight:700}
.rp-gal{display:grid;grid-template-columns:2fr 1fr;gap:.35rem;padding:.35rem}
.rp-gal img{width:100%;height:100%;object-fit:cover;display:block;border-radius:.35rem}
.rp-gal .big{aspect-ratio:16/10}
.rp-gal .side{display:grid;grid-template-rows:1fr 1fr;gap:.35rem}
.rp-gal .vid{position:relative}
.rp-body{display:grid;grid-template-columns:1.4fr 1fr;gap:1rem;padding:.8rem 1rem 1rem}
.rp-body h4{font-family:Georgia,serif;font-size:1.25rem;color:#2b2118;letter-spacing:0;margin-bottom:.3rem}
.rp-body p{color:var(--ink-600);font-size:.8rem;line-height:1.5}
.rp-am{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.6rem}
.rp-am span{font-size:.7rem;padding:.25rem .55rem;border-radius:.35rem;background:#f6f1ea;color:#5a4a3a}
.rp-book{border:1px solid #eadfd2;border-radius:.6rem;padding:.7rem;display:grid;gap:.35rem;align-content:start;background:#fdfaf6}
.rp-book small{font-size:.66rem;color:var(--ink-500)}
.rp-book b{font-family:var(--display);font-size:1.35rem;color:#2b2118}.rp-book b span{font-size:.75rem;color:var(--ink-500);font-weight:500}
.rp-dates{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.25rem}
.rp-dates span{font-size:.64rem;border:1px solid #eadfd2;border-radius:.3rem;padding:.25rem;text-align:center;background:#fff}
.rp-book em{font-style:normal;text-align:center;background:var(--warm-500);color:#fff;font-weight:800;border-radius:.4rem;padding:.5rem}
.rp-book .ok{color:var(--green-700);font-weight:600}
.site-pair{display:grid;gap:2rem}
@media(min-width:1024px){.site-pair{grid-template-columns:1fr 1fr;align-items:start}}
@media(max-width:639px){
  .re{grid-template-columns:1fr}
  .rp-body{grid-template-columns:1fr}
  .rp-nav span{display:none}
  .bp-it small{display:none}
}

/* restaurant website ordering */
.wo{background:#fbf7ef;font-size:.8rem;color:#1d2a22}
.wo-nav{display:flex;align-items:center;gap:.6rem;padding:.6rem 1rem;background:#1f4d3a;color:#fff}
.wo-nav .ca-logo{flex:0 0 2rem;height:2rem;font-size:.75rem}
.wo-nav b{font-family:var(--display);font-size:1rem;margin-right:auto}
.wo-tabs{display:flex;gap:.3rem}.wo-tabs em{font-style:normal;font-size:.72rem;font-weight:700;padding:.25rem .65rem;border-radius:999px;background:#ffffff1f}.wo-tabs em.act{background:#f2c14e;color:#1f4d3a}
.wo-dl{font-size:.7rem;font-weight:700;border:1px solid #ffffff55;border-radius:999px;padding:.25rem .65rem}
.wo-main{display:grid;grid-template-columns:1fr 16.5rem;gap:.8rem;padding:.8rem}
.wo-cats{display:flex;gap:.3rem;flex-wrap:wrap;margin-bottom:.6rem}.wo-cats span{font-size:.7rem;font-weight:700;padding:.25rem .65rem;border-radius:999px;background:#efe7d6;color:#5b513e}.wo-cats span.act{background:#1f4d3a;color:#fff}
.wo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem}
.wo-it{background:#fff;border-radius:.7rem;padding:.4rem;box-shadow:0 1px 2px #0000000f;display:flex;flex-direction:column;gap:.15rem}
.wo-it img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:.5rem;margin-bottom:.2rem}
.wo-it b{font-size:.78rem}.wo-it small{font-size:.64rem;color:#7a776c}
.wo-it span{display:flex;justify-content:space-between;align-items:center;margin-top:.2rem}.wo-it em{font-style:normal;font-weight:800;color:#1f4d3a}
.wo-it i{font-style:normal;width:1.4rem;height:1.4rem;border-radius:50%;background:#1f4d3a;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}
.wo-cart{background:#fff;border-radius:.8rem;padding:.7rem;box-shadow:0 1px 3px #0000001a;display:grid;gap:.5rem;align-content:start}
.wo-cart h6{margin:0;font-family:var(--display);font-size:.9rem;color:#1d2a22}
.wo-ln{display:grid;grid-template-columns:2rem 1fr auto;gap:.45rem;align-items:center;font-size:.72rem}
.wo-ln img{width:2rem;height:2rem;border-radius:.4rem;object-fit:cover}.wo-ln small{display:block;color:var(--warm-600);font-size:.62rem}
.wo-f{display:grid;gap:.25rem;border-top:1px dashed #e6dfd0;padding-top:.45rem}
.wo-f label{font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:#7a776c}
.wo-f>span{font-size:.74rem;font-weight:600;background:#fbf7ef;border:1px solid #e6dfd0;border-radius:.4rem;padding:.35rem .5rem}
.wo-f .ok{color:var(--green-700);font-weight:700;font-size:.66rem}
.wo-slots{display:flex;flex-wrap:wrap;gap:.25rem}.wo-slots span{font-size:.66rem;font-weight:700;border:1px solid #e6dfd0;border-radius:.4rem;padding:.25rem .5rem}.wo-slots span.act{border-color:#1f4d3a;background:#1f4d3a;color:#fff}
.wo-tot{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid #e6dfd0;padding-top:.45rem}.wo-tot b{font-family:var(--display);font-size:1.1rem}
.wo-btn{text-align:center;background:#f2c14e;color:#1f4d3a;font-weight:800;border-radius:.5rem;padding:.55rem}
.wo-foot{display:flex;gap:1rem;align-items:center;padding:.8rem 1rem;border-top:1px solid #e6dfd0;background:#fff}
.wo-foot .qr{width:4.6rem;height:4.6rem}
.wo-foot b{display:block;font-family:var(--display);font-size:.9rem}.wo-foot small{display:block;color:#7a776c;font-size:.7rem;margin:.15rem 0 .45rem}
.badges{display:flex;gap:.4rem;flex-wrap:wrap}
.badge{display:inline-flex;align-items:center;gap:.4rem;background:#0b0b0b;color:#fff;border-radius:.45rem;padding:.3rem .6rem;font-size:.78rem;font-weight:700;line-height:1.05}
.badge svg{width:1.05rem;height:1.05rem}.badge small{display:block;font-size:.55rem;font-weight:500;opacity:.85}
.smart-banner{display:flex;align-items:center;gap:.55em;padding:.55em .8em;background:#f4f1ea;border-bottom:1px solid #e6dfd0;font-size:.8em}
.smart-banner .ca-logo{flex:0 0 2.3em;height:2.3em;font-size:.85em}
.smart-banner b{display:block;font-size:1em}.smart-banner small{display:block;font-size:.8em;color:#7a776c;line-height:1.2}
.smart-banner em{font-style:normal;margin-left:auto;background:#1f4d3a;color:#fff;font-weight:800;border-radius:999px;padding:.4em .8em;font-size:.85em}
.ph-url{text-align:center;font-size:.68em;color:var(--ink-500);padding:.35em;background:#fff;border-bottom:1px solid var(--navy-100)}
.pwa{margin:.2em 1.1em .5em;border:1px dashed var(--teal-400);color:var(--teal-700);background:var(--teal-50);border-radius:.7em;padding:.5em;text-align:center;font-size:.74em;font-weight:700}
.track{display:grid;gap:.1em;padding:1em 1.4em .4em}
.track div{display:flex;gap:.8em;align-items:flex-start;position:relative;padding-bottom:.7em;font-size:.82em}
.track div::before{content:"";position:absolute;left:.45em;top:1.1em;bottom:-.1em;width:2px;background:var(--navy-100)}
.track div:last-child::before{display:none}
.track i{flex:0 0 1em;height:1em;border-radius:50%;border:2px solid var(--navy-200);background:#fff;margin-top:.15em;z-index:1}
.track .done i{background:var(--green-500);border-color:var(--green-500)}.track .done::before{background:var(--green-500)}
.track .now i{background:var(--warm-500);border-color:var(--warm-500);box-shadow:0 0 0 .3em var(--warm-100)}
.track b{display:block;color:var(--navy-900)}.track small{display:block;color:var(--ink-500);font-size:.85em}
.ph-dl{display:flex;gap:.7em;align-items:center;margin:0 1.1em 1.9em;padding:.6em;border-radius:.9em;background:var(--navy-50);font-size:.78em}
.ph-dl .qr{width:3.6em;height:3.6em;display:block}
.ph-dl b{display:block;color:var(--navy-900)}.ph-dl small{color:var(--ink-500);font-size:.85em}
.web-trio{display:grid;gap:2rem}
.web-trio .phones{gap:2rem}
@media(max-width:900px){.wo-main{grid-template-columns:1fr}.wo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.wo-grid .wo-it:nth-child(n+5){display:none}}
@media(max-width:639px){.wo-nav .wo-dl,.wo-nav .wo-tabs{display:none}.wo-foot{flex-direction:column;align-items:flex-start}}
.pk .card .btn{margin-top:auto;align-self:flex-start}.pk .checks{margin:.3rem 0 .8rem}
.bp-img,.wo-it img,.ga-tiles img,.re-ph img{height:auto}.re-ph img{height:100%}
@media(max-width:1100px){.bp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.bp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bp-it b{font-size:.82rem;overflow-wrap:anywhere}}
/* cafe POS */
.cp{display:grid;grid-template-columns:1.3fr 1fr;min-height:17rem;font-size:.72rem}
.cp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.45rem;padding:.6rem;align-content:start;background:#fbfcfd}
.cp-it{background:#fff;border:1px solid var(--navy-100);border-radius:.55rem;padding:.35rem;display:flex;flex-direction:column;gap:.1rem}
.cp-it img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:.4rem;margin-bottom:.2rem}
.cp-it b{font-size:.72rem;color:var(--navy-900)}.cp-it em{font-style:normal;font-weight:700;color:var(--ink-700)}
.cp-it.tap{border-color:var(--teal-400);box-shadow:0 0 0 2px var(--teal-100)}
.cp-tick{border-left:1px solid var(--navy-100);display:flex;flex-direction:column;gap:.45rem;padding:.6rem}
.cp-mods{display:flex;flex-wrap:wrap;gap:.25rem}.cp-mods span{font-size:.62rem;font-weight:700;padding:.2rem .5rem;border-radius:999px;background:var(--ink-50);color:var(--ink-600)}.cp-mods span.act{background:var(--warm-500);color:#fff}
.cp-ln{display:grid;grid-template-columns:2rem 1fr auto;gap:.4rem;align-items:center}
.cp-ln img{width:2rem;height:2rem;border-radius:.35rem;object-fit:cover}.cp-ln small{display:block;color:var(--warm-600);font-size:.6rem}
.cp-loy{background:var(--teal-50);border:1px dashed var(--teal-400);color:var(--teal-700);border-radius:.45rem;padding:.4rem .5rem;font-size:.64rem}
.cp-tot{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--navy-100);padding-top:.35rem;margin-top:auto}.cp-tot b{font-family:var(--display);font-size:1rem;color:var(--navy-900)}
.cp .pay{padding:0}
.stamps{margin:.6em 1.1em .7em;background:#fff;border-radius:.9em;padding:.7em .8em;box-shadow:0 1px 2px #0000000f;font-size:.8em}
.stamps div{display:grid;grid-template-columns:repeat(5,1fr);gap:.3em;margin:.45em 0}
.stamps i{font-style:normal;text-align:center;border-radius:50%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;background:#efe7d6;opacity:.45}
.stamps i.on{background:#f2c14e;opacity:1}
.stamps small{color:#7a776c}
/* production / cake / label */
.ck{display:grid;grid-template-columns:11rem 1fr;gap:.9rem;padding:.9rem;background:#fbfcfd;font-size:.78rem}
.ck-img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:.7rem}
.ck-f h5{margin:0 0 .4rem;font-family:var(--display);font-size:1rem;color:var(--navy-900)}
.ck-row{display:flex;justify-content:space-between;gap:.6rem;padding:.3rem 0;border-bottom:1px solid var(--navy-50)}.ck-row span{color:var(--ink-500)}.ck-row b{color:var(--navy-900);text-align:right}
.ck-pay{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem;margin:.6rem 0}.ck-pay div{background:#fff;border:1px solid var(--navy-100);border-radius:.45rem;padding:.35rem .45rem}.ck-pay small{display:block;font-size:.6rem;color:var(--ink-500)}.ck-pay b{font-family:var(--display);color:var(--navy-900)}
.ck-st{display:flex;flex-wrap:wrap;gap:.3rem}
.lbl{max-width:24rem;margin:0 auto;background:#fff;border:1px solid var(--navy-200);border-radius:.6rem;padding:1rem 1.1rem;box-shadow:var(--shadow-raised);font-size:.78rem;color:var(--ink-900);transform:rotate(-1.2deg)}
.lbl-h{display:flex;justify-content:space-between;align-items:baseline;border-bottom:2px solid var(--ink-900);padding-bottom:.35rem;margin-bottom:.5rem}.lbl-h b{font-family:var(--display);font-size:1.1rem}.lbl-h span{font-size:.7rem;color:var(--ink-500)}
.lbl p{margin:.35rem 0;line-height:1.45}.lbl u{text-decoration:none;font-weight:800}
.lbl-g{display:grid;grid-template-columns:repeat(4,1fr);gap:.3rem;margin:.6rem 0;font-size:.6rem;color:var(--ink-500)}.lbl-g span{border:1px solid var(--navy-100);border-radius:.3rem;padding:.25rem .3rem}.lbl-g b{display:block;font-size:.78rem;color:var(--ink-900)}
.lbl-b{display:flex;align-items:center;gap:.6rem;font-size:.62rem;color:var(--ink-500)}.lbl-b svg{width:7rem;height:1.8rem}
@media(max-width:639px){.cp{grid-template-columns:1fr}.cp-tick{border-left:0;border-top:1px solid var(--navy-100)}.ck{grid-template-columns:1fr}.ck-img{max-width:12rem}.lbl-g{grid-template-columns:repeat(2,1fr)}}

/* ---------- floor plan ---------- */
.fp-top{display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap;padding:.6rem .8rem;border-bottom:1px solid var(--navy-100);background:#fff}
.fp-zones{display:flex;gap:.3rem}.fp-zones span{font-size:.78rem;font-weight:700;padding:.35rem .85rem;border-radius:999px;background:var(--ink-50);color:var(--ink-600)}.fp-zones span.act{background:var(--navy-900);color:#fff}
.fp-edit{display:flex;gap:.3rem;flex-wrap:wrap}.fp-edit span{font-size:.72rem;font-weight:600;padding:.3rem .65rem;border-radius:.45rem;border:1px dashed var(--teal-400);color:var(--teal-700);background:var(--teal-50)}
.fp-room{position:relative;aspect-ratio:16/8.4;margin:.8rem;border:3px solid #c9d3dc;border-radius:.6rem;background:linear-gradient(0deg,#f7f4ee,#fbf9f5);background-image:linear-gradient(#ece6da 1px,transparent 1px),linear-gradient(90deg,#ece6da 1px,transparent 1px);background-size:28px 28px}
.fp-win{position:absolute;top:-3px;height:3px;background:#9fd0e6}.fp-win.w1{left:6%;width:14%}.fp-win.w2{left:28%;width:14%}.fp-win.w3{left:52%;width:14%}
.fp-bar{position:absolute;right:2.5%;top:12%;width:8%;height:52%;background:#e3d6c2;border-radius:.5rem;display:flex;align-items:center;justify-content:center}
.fp-bar span,.fp-pass span,.fp-door span,.fp-ter span{font-size:.62rem;font-weight:700;color:#7d6a50;letter-spacing:.05em;text-transform:uppercase}
.fp-bar span{writing-mode:vertical-rl}
.fp-pass{position:absolute;right:2.5%;bottom:6%;width:18%;height:12%;background:#dfe7ee;border-radius:.4rem;display:flex;align-items:center;justify-content:center}.fp-pass span{color:#5b6b78}
.fp-door{position:absolute;left:46%;bottom:-3px;width:9%;height:3px;background:#f7f4ee;display:flex;justify-content:center}.fp-door span{position:absolute;top:-1.1rem}
.fp-ter{position:absolute;left:-3px;top:38%;width:3px;height:16%;background:#f7f4ee}.fp-ter span{position:absolute;left:.4rem;top:30%;white-space:nowrap;color:var(--teal-700)}
.tb{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px solid;background:#fff;color:var(--navy-900);line-height:1.05;box-shadow:0 3px 8px rgba(11,31,51,.12);transition:transform .25s}
.tb.r{border-radius:50%;width:8.5%;aspect-ratio:1}.tb.s{border-radius:.5rem;width:9.5%;aspect-ratio:1.25}
.tb.s6,.tb.s8{width:12%}.tb.r.s8{width:11%}.tb.s2.r{width:7%}
.tb b{font-family:var(--display);font-size:.95rem}.tb small{font-size:.58rem;font-weight:700;opacity:.85}
.tb em{position:absolute;right:-.45rem;top:-.45rem;font-style:normal;font-size:.55rem;font-weight:800;background:var(--navy-900);color:#fff;border-radius:999px;padding:.1rem .3rem}
.tb i{position:absolute;left:50%;top:50%;width:.45rem;height:.45rem;border-radius:50%;background:#cfd8e0;transform:translate(-50%,-50%) rotate(var(--a)) translateY(calc(-50% - 1.05rem)) }
.tb.s i{display:none}
.tb.free{border-color:#b9c6d2;color:var(--ink-500)}
.tb.busy{border-color:var(--teal-500);background:var(--teal-50);color:var(--teal-700)}
.tb.sent{border-color:var(--yellow-500);background:var(--yellow-50);color:#8a5d00}
.tb.bill{border-color:var(--warm-500);background:var(--warm-50);color:var(--warm-700)}
.tb.res{border-color:#8a6bbf;background:#f3effa;color:#5d4590;border-style:dashed}
.tb.clean{border-color:var(--ink-400);background:repeating-linear-gradient(45deg,#f4f6f7 0 6px,#e8ecef 6px 12px);color:var(--ink-600)}
.tb.cur{border-color:var(--warm-500);background:var(--warm-500);color:#fff;box-shadow:0 0 0 5px rgba(232,116,44,.22)}
@media(hover:hover){.fp:not(.fp-sm) .tb:hover{transform:translate(-50%,-50%) scale(1.08)}}
.fp-leg{display:flex;flex-wrap:wrap;gap:.35rem .9rem;padding:0 .9rem .8rem;font-size:.72rem;color:var(--ink-600)}
.fp-leg span{display:inline-flex;align-items:center;gap:.35rem}.fp-leg span::before{content:"";width:.8rem;height:.8rem;border-radius:.25rem;border:2px solid}
.fp-leg .free::before{border-color:#b9c6d2}.fp-leg .busy::before{border-color:var(--teal-500);background:var(--teal-50)}.fp-leg .sent::before{border-color:var(--yellow-500);background:var(--yellow-50)}.fp-leg .bill::before{border-color:var(--warm-500);background:var(--warm-50)}.fp-leg .res::before{border-color:#8a6bbf;border-style:dashed}.fp-leg .clean::before{border-color:var(--ink-400);background:#e8ecef}
.fp-sm .fp-room{margin:.5rem}.fp-sm .tb b{font-size:.7rem}.fp-sm .fp-leg{font-size:.6rem}.fp-sm .fp-bar span,.fp-sm .fp-pass span,.fp-sm .fp-door span,.fp-sm .fp-ter span{font-size:.48rem}
@media(max-width:639px){.fp .tb b{font-size:.62rem}.fp .tb small,.fp .tb em{display:none}.fp .tb i{display:none}.fp-bar span,.fp-pass span,.fp-door span,.fp-ter span{font-size:.45rem}}

/* ---------- integrations map ---------- */
.im{position:relative;aspect-ratio:16/9;max-width:70rem;margin:0 auto}
.im-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.im-lines path{stroke:var(--teal-400);stroke-width:.35;fill:none;stroke-dasharray:1.4 1.2;opacity:.75}
.im-lines .pulse{fill:var(--warm-500)}
.im-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;background:linear-gradient(160deg,var(--navy-900),var(--navy-700));color:#fff;border-radius:1.2rem;padding:1.1rem 1.4rem;text-align:center;box-shadow:0 30px 60px -28px #0b1f3399;display:grid;justify-items:center;gap:.25rem;min-width:12rem}
.im-core img{height:1.6rem;width:auto}.im-core b{font-family:var(--display);font-size:1.15rem}.im-core small{font-size:.75rem;color:var(--navy-200)}
.im-core::after{content:"";position:absolute;inset:-10px;border-radius:1.6rem;border:2px solid rgba(14,156,150,.35);animation:ping 2.8s ease-out infinite}
.im-n{position:absolute;transform:translate(-50%,-50%);z-index:1;display:flex;gap:.55rem;align-items:center;background:#fff;border:1px solid var(--navy-100);border-radius:.85rem;padding:.55rem .7rem;box-shadow:var(--shadow-card);width:14.5rem;transition:transform .25s,border-color .25s}
.im-n .ico{width:2.2rem;height:2.2rem}.im-n .ico svg{width:1.1rem;height:1.1rem}
.im-n b{display:block;font-family:var(--display);font-size:.9rem;color:var(--navy-900);line-height:1.15}
.im-n small{display:block;font-size:.7rem;color:var(--ink-500);line-height:1.3;margin-top:.1rem}
.im-n.o{border-color:var(--warm-200);box-shadow:0 14px 30px -18px rgba(232,116,44,.55)}
@media(hover:hover){.im-n:hover{transform:translate(-50%,-50%) translateY(-4px);border-color:var(--teal-200)}}
.im-c{aspect-ratio:16/8}.im-c .im-n{width:auto;padding:.45rem .65rem}.im-c .im-n .ico{width:1.9rem;height:1.9rem}
.im-note{text-align:center;margin-top:.8rem}
@media(max-width:1100px){.im-n{width:12rem}.im-n small{display:none}}
@media(max-width:899px){
  .im{aspect-ratio:auto;display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
  .im-lines{display:none}
  .im-core{position:relative;left:auto;top:auto;transform:none;grid-column:1/-1;margin-bottom:.4rem}
  .im-n{position:relative;left:auto!important;top:auto!important;transform:none;width:auto}
  .im-n small{display:block}
  @media(hover:hover){.im-n:hover{transform:translateY(-3px)}}
}
@media(max-width:480px){.im{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.im-lines .pulse{display:none}}

/* ---------- zones map ---------- */
.zm{position:relative;padding:.7rem;background:#fbfcfd}
.zm svg{display:block;width:100%;height:auto;border-radius:.6rem}
.zm .route{animation:dash 1.4s linear infinite}
.zm-leg{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.6rem;font-size:.72rem}
.zm-leg div{display:grid;grid-template-columns:.8rem 1fr;column-gap:.4rem;align-items:center}
.zm-leg i{width:.8rem;height:.8rem;border-radius:50%;grid-row:span 2}.zm-leg b{color:var(--navy-900)}.zm-leg span{color:var(--ink-500);grid-column:2}
.zm-card{position:absolute;right:1.4rem;top:1.4rem}
@media(max-width:639px){.zm-leg{grid-template-columns:1fr}.zm-card{transform:scale(.8);transform-origin:right top;right:1rem;top:1rem}}

/* ---------- photo compositions ---------- */
.stack2{position:relative;padding:0 0 3rem 0;min-height:22rem}
.stack2 .s-a{width:78%;aspect-ratio:4/3}
.stack2 .s-b{position:absolute;right:0;bottom:0;width:46%;aspect-ratio:1;border:6px solid #fff;z-index:2}
.stack2 .s-c{position:absolute;left:-1rem;bottom:1.5rem;z-index:3}
.stack2 img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:639px){.stack2{min-height:0;padding-bottom:2rem}.stack2 .s-a{width:88%}.stack2 .s-c{left:.4rem;transform:scale(.86);transform-origin:left bottom}}
[data-parallax]{will-change:transform}

/* zig-zag: on phones the visual comes first */
@media(max-width:1023px){.feat .feat-visual{order:-1}}

/* ---------- Domenii dropdown ---------- */
.nav .dd{position:relative}
.nav .dd>button{font:inherit;font-size:.88rem;font-weight:500;color:var(--ink-700);background:none;border:0;padding:.45rem .7rem;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:.25rem}
.nav .dd>button:hover,.nav .dd:focus-within>button{background:var(--navy-50);color:var(--navy-900)}
.nav .dd>button.cur{color:var(--teal-700);background:var(--teal-50)}
.nav .dd-menu{position:absolute;left:0;top:100%;padding-top:.5rem;display:none;z-index:60}
.nav .dd:hover .dd-menu,.nav .dd:focus-within .dd-menu{display:block}
.nav .dd-box{background:#fff;border:1px solid var(--navy-100);border-radius:1rem;box-shadow:var(--shadow-raised);padding:.6rem;display:grid;grid-template-columns:1fr 1fr;gap:.2rem .6rem;width:30rem}
.nav .dd-box h6{grid-column:span 1;margin:.3rem .5rem .2rem;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-400)}
.nav .dd-box a{display:flex;gap:.6rem;align-items:center;border-radius:.6rem;padding:.5rem;font-size:.86rem}
.nav .dd-box a .ico{width:2rem;height:2rem}.nav .dd-box a .ico svg{width:1rem;height:1rem}
.nav .dd-box a small{display:block;font-size:.7rem;color:var(--ink-500);font-weight:400}
.nav .dd-col{display:grid;gap:.1rem;align-content:start}
.mnav .msub{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-400);padding:.9rem 0 .2rem;border-bottom:0}
.more-link{display:inline-flex;align-items:center;gap:.4rem;font-weight:700;color:var(--teal-700);text-decoration:none}
.more-link svg{width:1rem;height:1rem;transition:transform .2s}
@media(hover:hover){.more-link:hover svg{transform:translateX(4px)}}

/* ---------- interactive order flow ---------- */
.fl{background:#fff;border:1px solid var(--navy-100);border-radius:1.25rem;box-shadow:var(--shadow-raised);padding:1rem}
.fl-bar{display:flex;justify-content:space-between;align-items:center;gap:.8rem;flex-wrap:wrap;margin-bottom:1rem}
.fl-kind{display:flex;gap:.3rem;background:var(--ink-50);padding:.25rem;border-radius:999px}
.fl-kind button{font:inherit;font-size:.86rem;font-weight:700;border:0;background:none;color:var(--ink-600);padding:.45rem .95rem;border-radius:999px;cursor:pointer}
.fl-kind button[aria-pressed="true"]{background:var(--navy-900);color:#fff}
.fl-ctrl{display:flex;gap:.4rem;align-items:center}
.fl-prev,.fl-next{font:inherit;width:2.4rem;height:2.4rem;border-radius:50%;border:1px solid var(--navy-200);background:#fff;font-size:1.2rem;cursor:pointer;color:var(--navy-900)}
.fl-body{display:grid;grid-template-columns:1.55fr 1fr;gap:1rem}
.fl-stage{position:relative;aspect-ratio:16/11;border-radius:1rem;background:var(--paper);overflow:visible}
.fl-venue{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:6px;padding:6px;border-radius:1rem;overflow:hidden}
.fl-venue span{border:1.5px dashed #d9e1e8;border-radius:.8rem;font-size:.62rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#b3c0cb;padding:.5rem .6rem;background:repeating-linear-gradient(0deg,transparent 0 26px,#eef2f5 26px 27px)}
.fl-venue .z2,.fl-venue .z4{text-align:right}
.fl-lines{position:absolute;inset:0;width:100%;height:100%}
.fl-lines line{stroke:var(--teal-200);stroke-width:.5;stroke-dasharray:1.2 1.2;vector-effect:non-scaling-stroke;stroke-width:2}
.fl-lines line.on{stroke:var(--warm-500);stroke-dasharray:none;stroke-width:3}
.fl-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:linear-gradient(160deg,var(--navy-900),var(--navy-700));color:#fff;border-radius:1rem;padding:.8rem 1.1rem;display:grid;justify-items:center;gap:.2rem;z-index:2;box-shadow:0 20px 40px -20px #0b1f3399}
.fl-core img{height:1.3rem;width:auto}.fl-core b{font-family:var(--display);font-size:.95rem}
.fl-node{position:absolute;transform:translate(-50%,-50%);z-index:3;font:inherit;text-align:left;display:flex;gap:.5rem;align-items:center;background:#fff;border:1px solid var(--navy-100);border-radius:.8rem;padding:.45rem .6rem;box-shadow:var(--shadow-card);cursor:pointer;width:11.5rem;transition:transform .25s,border-color .25s,box-shadow .25s}
.fl-node i{font-style:normal;flex:0 0 2rem;height:2rem;border-radius:.6rem;background:var(--teal-50);display:flex;align-items:center;justify-content:center;font-size:1rem}
.fl-node b{display:block;font-family:var(--display);font-size:.84rem;color:var(--navy-900);line-height:1.15}.fl-node small{display:block;font-size:.66rem;color:var(--ink-500);line-height:1.25}
.fl-node:hover,.fl-node:focus-visible{border-color:var(--teal-300,#7fd0cb);transform:translate(-50%,-50%) translateY(-3px)}
.fl-node.on{border-color:var(--warm-500);box-shadow:0 0 0 4px rgba(232,116,44,.18),var(--shadow-card)}
.fl-node.on i{background:var(--warm-500)}
.fl-token{position:absolute;left:50%;top:50%;width:1.1rem;height:1.1rem;margin:-.55rem 0 0 -.55rem;border-radius:50%;background:var(--warm-500);box-shadow:0 0 0 6px rgba(232,116,44,.25);z-index:4;opacity:0;transition:left .9s cubic-bezier(.4,.1,.2,1),top .9s cubic-bezier(.4,.1,.2,1),opacity .3s;pointer-events:none}
.fl-tip{position:absolute;z-index:6;width:240px;background:var(--navy-900);color:#fff;border-radius:.8rem;padding:.7rem .8rem;box-shadow:0 18px 30px -12px #0b1f3380;font-size:.8rem}
.fl-tip b{font-family:var(--display);font-size:.95rem;display:block}.fl-tip small{color:var(--navy-200);font-size:.7rem}
.fl-tip ul{margin:.4rem 0 0;padding-left:1rem;list-style:disc;display:grid;gap:.15rem}
.fl-side{display:grid;grid-template-rows:auto 1fr;gap:.7rem;min-width:0}
.fl-card{border-radius:.9rem;padding:.8rem .9rem;background:linear-gradient(135deg,var(--warm-50),#fff);border:1px solid var(--warm-200);display:grid;gap:.2rem;min-height:6.2rem}
.fl-card small{font-size:.7rem;font-weight:700;color:var(--warm-700)}.fl-card b{font-family:var(--display);font-size:1.1rem;color:var(--navy-900)}.fl-card span{font-size:.88rem;color:var(--ink-700)}
.fl-steps{display:grid;gap:.25rem;max-height:24rem;overflow:auto;padding-right:.2rem}
.fl-steps button{font:inherit;width:100%;text-align:left;display:flex;gap:.6rem;align-items:flex-start;background:none;border:0;border-radius:.6rem;padding:.4rem .5rem;cursor:pointer;color:var(--ink-700)}
.fl-steps button:hover{background:var(--navy-50)}
.fl-steps .n{flex:0 0 1.5rem;height:1.5rem;border-radius:50%;background:var(--ink-50);color:var(--ink-600);font-size:.72rem;font-weight:800;display:flex;align-items:center;justify-content:center;font-family:var(--mono)}
.fl-steps b{display:block;font-size:.86rem;color:var(--navy-900)}.fl-steps small{display:block;font-size:.7rem;color:var(--ink-500)}
.fl-steps em{display:none;font-style:normal;font-size:.8rem;color:var(--ink-600);margin-top:.15rem}
.fl-steps li.past .n{background:var(--teal-100);color:var(--teal-700)}
.fl-steps li.on button{background:var(--warm-50)}.fl-steps li.on .n{background:var(--warm-500);color:#fff}
@media(max-width:1023px){
  .fl-body{grid-template-columns:1fr}
  .fl-stage{display:none}
  .fl-steps{max-height:none}
  .fl-steps em{display:block}
  .fl-steps li{border-left:2px solid var(--navy-100);margin-left:.75rem}
  .fl-steps li button{margin-left:-.8rem}
}
@media(prefers-reduced-motion:reduce){.fl-steps em{display:block}}
.tab-phone{position:relative;padding-bottom:2.5rem}
.tab-phone .tp-tab{width:92%}
.tab-phone .tp-tab .mock .win{box-shadow:none;border:0;border-radius:.6rem}
.tab-phone .tp-ph{position:absolute;right:-.5rem;bottom:-1.5rem;z-index:2}
.tab-phone .tp-ph .phone{--pw:11.5rem}
@media(max-width:639px){.tab-phone .tp-tab{width:100%}.tab-phone .tp-ph .phone{--pw:8.8rem}.tab-phone .tp-ph{right:-.4rem;bottom:-2rem}}
/* packages */
.pk2{display:grid;gap:1.5rem}
@media(min-width:900px){.pk2{grid-template-columns:1fr 1fr;align-items:stretch}}
.pk-card{position:relative;background:#fff;border:1px solid var(--navy-100);border-radius:1.25rem;padding:1.75rem;box-shadow:var(--shadow-card);display:flex;flex-direction:column;gap:.9rem;transition:transform .25s,box-shadow .25s}
.pk-card h3{font-size:1.35rem}
.pk-tag{font-family:var(--display);font-weight:700;font-size:.95rem;color:var(--teal-700);letter-spacing:.02em}
.pk-pre{border:2px solid var(--warm-400);box-shadow:0 26px 50px -28px rgba(232,116,44,.55);background:linear-gradient(180deg,#fff 60%,var(--warm-50))}
.pk-pre .pk-tag{color:var(--warm-700)}
.pk-rec{position:absolute;top:-.8rem;right:1.4rem;background:var(--warm-500);color:#fff;font-size:.75rem;font-weight:800;padding:.3rem .8rem;border-radius:999px;box-shadow:0 6px 14px -6px rgba(232,116,44,.7)}
.pk-eq{display:flex;gap:.5rem;align-items:center;font-size:.86rem;color:var(--ink-600);border-top:1px dashed var(--navy-100);padding-top:.8rem;margin-top:auto}
.pk-eq svg{width:1.1rem;height:1.1rem;color:var(--teal-600)}
.pk-card .btn{align-self:flex-start}
@media(hover:hover){.pk-card:hover{transform:translateY(-4px)}}
.cmp-wrap{overflow-x:auto;background:#fff;border:1px solid var(--navy-100);border-radius:1.1rem;box-shadow:var(--shadow-card)}
.cmp{width:100%;border-collapse:collapse;font-size:.92rem;min-width:34rem}
.cmp th,.cmp td{padding:.7rem 1rem;border-bottom:1px solid var(--navy-50);text-align:left}
.cmp td{text-align:center;width:9rem}
.cmp thead th{font-family:var(--display);font-size:1.05rem;color:var(--navy-900);text-align:center;padding:1rem;position:sticky;top:0;background:#fff}
.cmp thead th.pre{color:var(--warm-700)}
.cmp td.pre,.cmp thead th.pre{background:var(--warm-50)}
.cmp tbody th{font-weight:500;color:var(--ink-700)}
.cmp tr.grp th{background:var(--paper);font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--teal-700);padding:.6rem 1rem}
.cmp .ck{display:inline-flex;width:1.5rem;height:1.5rem;border-radius:50%;align-items:center;justify-content:center;background:var(--teal-50);color:var(--teal-700);font-weight:800;border:1px solid var(--teal-200)}
.cmp td.pre .ck{background:var(--warm-100);color:var(--warm-700);border-color:var(--warm-200)}
.cmp .dash{color:var(--ink-400);font-size:1.4rem;line-height:1}
.cmp .txt{font-size:.78rem;font-weight:700;color:var(--ink-600)}
.cmp tfoot td{padding:1rem}
@media(max-width:639px){.cmp{font-size:.82rem;min-width:0}.cmp td{width:5.2rem;padding:.6rem .4rem}.cmp th{padding:.6rem .6rem}.cmp thead th{font-size:.9rem;padding:.7rem .3rem}.cmp tfoot .btn{padding:.45rem .6rem;font-size:.72rem}}
@media(max-width:639px){.cmp tfoot{display:none}}
/* demo form: GDPR consent, honeypot, error; thank-you page states (2026-10-19) */
.consent{display:flex;gap:.6rem;align-items:flex-start;font-size:.85rem;line-height:1.5;color:var(--ink-700,#3d4b59)}
.consent input{margin-top:.2rem;width:1.05rem;height:1.05rem;flex:none;accent-color:var(--teal-600)}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.form-err{display:none;border-radius:.6rem;padding:.8rem 1rem;background:var(--red-50);color:var(--red-700);font-size:.9rem;border:1px solid #f1c4c4}
.form-err.show{display:block}
.form button[disabled]{opacity:.6;cursor:wait}
.ack{display:none}.ack.show{display:block}
/* composite photos */
.cph{position:relative;padding-bottom:1.5rem}
.cph .photo{aspect-ratio:3/2}
.cph .photo img{width:100%;height:100%;object-fit:cover}
.cph-card{position:absolute;left:-1rem;bottom:0;z-index:2}
.cph.right .cph-card{left:auto;right:-1rem}
.cph.prod .photo{background:#fff;box-shadow:var(--shadow-card);border:1px solid var(--navy-100)}
.cph.prod .photo img{object-fit:contain;padding:1rem}
.cph.small{max-width:34rem;margin-left:auto}
@media(max-width:639px){.cph-card{left:.4rem;transform:scale(.88);transform-origin:left bottom}.cph.right .cph-card{right:.4rem;transform-origin:right bottom}}
.hero-combo{position:relative;padding-bottom:2.5rem}
.hero-combo .cph{padding-bottom:0}
.hero-combo .phone-over{position:absolute;right:-1rem;bottom:-1.5rem;z-index:3}
.hero-combo .phone-over .phone{--pw:11.5rem}
@media(max-width:639px){.hero-combo .phone-over .phone{--pw:8.6rem}.hero-combo .phone-over{right:-.4rem;bottom:-1.8rem}}
figure{margin:0}.cph .photo{margin:0;width:100%}
@media(max-width:639px){.combo .over.win-over{position:relative;width:100%;right:auto;bottom:auto;margin-top:-2.5rem}.combo:has(.win-over){padding-bottom:0}}
.cph.prod .photo{aspect-ratio:4/3}.cph.prod .photo img{padding:1.5rem}
@media(max-width:1023px){.hero-over.card-only{min-height:0;justify-content:flex-start}}
.hero-grid>*{min-width:0}.hero .pill{max-width:100%;white-space:normal;line-height:1.3}
/* live QA fixes 2026-10-20 */
.dt td.st{white-space:normal}
.dt td.st .acts{display:flex;gap:.25rem;margin-top:.25rem;flex-wrap:wrap}
.dt td .chip{white-space:normal;line-height:1.25}
.dt td.wr{min-width:6.5rem}
@media(max-width:639px){
  .dt th,.dt td{padding:.42rem .38rem}
  .dt td .chip{font-size:.56rem;padding:.1rem .3rem}
  .dt td.st .acts{display:none}
  .rp-cell{gap:.35rem}.rp-img{flex-basis:1.6rem;width:1.6rem;height:1.6rem}
  .sec+.sec:has(.cta-band){padding-top:.5rem}
}
.fl-node{width:10.5rem}
.cmp tfoot .btn{white-space:nowrap;font-size:.8rem;padding:.5rem .8rem}