:root {
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #181c20;
  background: #fff9f1;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  --primary: #d93822;
  --primary-dark: #b92d1c;
  --orange: #f58216;
  --background: #fff9f1;
  --surface: #fffdf9;
  --surface-warm: #fff1e2;
  --ink: #181c20;
  --ink-muted: #655c55;
  --border: #ebcdb0;
  --success: #257a3e;
  --sidebar: #191e23;
  --sidebar-muted: #aeb1b2;
  --table: #073f5e;
  --pickup: #69477b;
  --delivery: #c25814;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --shadow: 0 12px 28px rgba(111, 53, 28, 0.13);
  --page: min(1280px, calc(100vw - 56px));
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; overflow-x: hidden; }
body { margin: 0; min-width: 320px; min-height: 100vh; overflow-x: hidden; color: var(--ink); background: var(--background); font-size: 16px; line-height: 1.55; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input { color: inherit; font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
::selection { color: var(--surface); background: var(--primary); }
:focus-visible { outline: 3px solid rgba(245, 130, 22, .55); outline-offset: 3px; }

.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.skip-link { position: fixed; z-index: 1000; top: 10px; left: 10px; padding: 10px 16px; color: var(--surface); background: var(--sidebar); border-radius: var(--radius-sm); transform: translateY(-150%); transition: transform 160ms ease; }
.skip-link:focus { transform: none; }
.scroll-progress { position: fixed; z-index: 120; inset: 0 0 auto; height: 3px; pointer-events: none; }
.scroll-progress span { display: block; width: 0; height: 100%; background: var(--primary); }

.site-header { position: fixed; z-index: 100; inset: 0 0 auto; display: grid; grid-template-columns: 180px 1fr auto; min-height: 76px; align-items: center; padding: 10px max(28px, calc((100vw - 1360px) / 2)); border-bottom: 1px solid transparent; transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
.site-header.is-scrolled { background: rgba(255, 249, 241, .94); border-color: rgba(235, 205, 176, .78); box-shadow: 0 8px 24px rgba(111, 53, 28, .08); backdrop-filter: blur(12px); }
.brand { width: 118px; }
.brand img { width: 100%; height: auto; }
.main-nav { display: flex; align-items: center; justify-content: center; gap: clamp(22px, 3vw, 46px); }
.main-nav a { min-height: 42px; display: inline-flex; align-items: center; color: var(--ink-muted); font-size: .8rem; font-weight: 750; transition: color 150ms ease; }
.main-nav a:hover { color: var(--primary); }
.nav-toggle { display: none; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; }
.nav-toggle > span:not(.sr-only) { display: block; width: 21px; height: 2px; margin: 5px auto; background: var(--ink); transition: transform 160ms ease, opacity 160ms ease; }

.button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 0 22px; border: 0; border-radius: 999px; color: var(--surface); background: var(--primary); box-shadow: 0 10px 22px rgba(217, 56, 34, .18); font-size: .86rem; font-weight: 780; white-space: nowrap; transition: transform 160ms ease, background 160ms ease, box-shadow 160ms ease; }
.button:hover { background: var(--primary-dark); box-shadow: 0 13px 26px rgba(217, 56, 34, .24); transform: translateY(-1px); }
.button:active { transform: scale(.98); }
.button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.button--small { min-height: 44px; padding-inline: 18px; font-size: .78rem; }
.button--wide { width: 100%; }
.button--light { color: var(--primary); background: var(--surface); box-shadow: none; }
.button--light:hover { color: var(--surface); background: var(--sidebar); }
.text-link { min-height: 48px; display: inline-flex; align-items: center; color: var(--primary); font-size: .82rem; font-weight: 780; }
.text-link:hover { color: var(--primary-dark); }

.hero { position: relative; display: grid; grid-template-columns: minmax(400px, .78fr) minmax(600px, 1.22fr); min-height: 840px; gap: clamp(36px, 5vw, 78px); padding: 138px max(28px, calc((100vw - 1360px) / 2)) 154px; overflow: hidden; isolation: isolate; }
.hero::before, .hero::after { content: ""; position: absolute; z-index: -1; border-radius: 50%; pointer-events: none; }
.hero::before { width: 560px; height: 560px; top: -360px; right: 18%; border: 84px solid rgba(245, 130, 22, .08); }
.hero::after { width: 330px; height: 330px; left: -230px; bottom: 20px; background: var(--surface-warm); }
.hero-copy { align-self: center; max-width: 630px; }
.hero-badge { width: fit-content; display: flex; align-items: center; gap: 8px; margin: 0 0 22px; padding: 8px 12px; color: var(--primary-dark); background: var(--surface-warm); border-radius: 999px; font-size: .7rem; font-weight: 800; }
.hero-badge span { width: 7px; height: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 4px rgba(37, 122, 62, .11); }
.hero h1 { max-width: 11ch; margin: 0; font-size: clamp(3.4rem, 5.7vw, 5.55rem); font-weight: 850; letter-spacing: -.04em; line-height: .94; }
.hero h1 span { color: var(--primary); }
.hero-lead { max-width: 610px; margin: 26px 0 0; color: var(--ink-muted); font-size: 1.03rem; line-height: 1.72; }
.hero-action { display: flex; align-items: center; gap: 24px; margin-top: 32px; }
.hero-price { display: flex; align-items: center; gap: 22px; margin-top: 30px; padding-top: 24px; border-top: 1px solid var(--border); }
.hero-price > strong { white-space: nowrap; font-size: 2rem; font-weight: 850; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.hero-price > strong span { margin-right: 3px; font-size: .7rem; letter-spacing: 0; }
.hero-price > strong small { color: var(--ink-muted); font-size: .72rem; font-weight: 650; letter-spacing: 0; }
.hero-price p { margin: 0; color: var(--ink-muted); font-size: .72rem; line-height: 1.5; }
.hero-price p b { color: var(--success); }

.hero-visual { position: relative; min-height: 590px; align-self: center; padding: 22px; overflow: hidden; background: var(--surface-warm); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: 0 24px 64px rgba(111, 53, 28, .16); }
.hero-visual::before { content: ""; position: absolute; width: 220px; height: 220px; top: -90px; right: -70px; border-radius: 50%; background: rgba(245, 130, 22, .16); }
.product-app { position: relative; display: grid; grid-template-columns: 56px 1fr; width: 100%; min-width: 700px; height: 544px; overflow: hidden; background: var(--background); border: 1px solid rgba(235, 205, 176, .88); border-radius: var(--radius-lg); box-shadow: 0 16px 38px rgba(111, 53, 28, .16); }
.product-sidebar { display: flex; flex-direction: column; align-items: center; gap: 9px; padding: 15px 7px 10px; color: #c9cccd; background: var(--sidebar); }
.product-sidebar > img { width: 35px; height: 35px; margin-bottom: 8px; object-fit: contain; filter: brightness(0) invert(1); }
.product-sidebar > span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 11px; }
.product-sidebar > span.is-selected { color: var(--ink); background: var(--surface-warm); }
.product-sidebar svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.product-sidebar i { flex: 1; }
.product-main { min-width: 0; }
.product-topbar { min-height: 68px; display: flex; align-items: center; gap: 10px; padding: 0 18px; border-bottom: 1px solid var(--border); }
.product-topbar > strong { margin-right: auto; font-size: .92rem; }
.operation-pill, .product-stop { min-height: 34px; display: inline-flex; align-items: center; padding: 0 12px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); font-size: .54rem; font-weight: 760; }
.product-sync { display: flex; align-items: center; gap: 5px; color: var(--ink-muted); font-size: .5rem; }
.product-sync i { width: 7px; height: 7px; border-radius: 50%; background: var(--success); }
.product-stop { color: var(--primary); border-color: rgba(217, 56, 34, .4); }
.product-toolbar { min-height: 52px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; }
.product-toolbar b { padding: 7px 10px; background: var(--surface); border-radius: 999px; font-size: .62rem; box-shadow: 0 5px 14px rgba(111, 53, 28, .09); }
.product-toolbar b span { color: var(--primary); }
.product-toolbar small { color: var(--ink-muted); font-size: .48rem; }
.product-columns { display: grid; grid-template-columns: repeat(5, minmax(124px, 1fr)); gap: 7px; height: 408px; padding: 0 9px 9px; }
.product-columns > section { min-width: 0; padding: 0 6px 6px; background: #f7eadb; border: 1px solid #ecd5bf; border-radius: var(--radius-sm); }
.product-columns > section:nth-child(2) { background: #f8ecdf; }
.product-columns > section:nth-child(3) { background: #f5e7d8; }
.product-columns > section:nth-child(4) { background: #f3e5d7; }
.product-columns > section:nth-child(5) { background: #eee7dc; }
.product-columns header { min-height: 62px; display: grid; grid-template-columns: 22px 1fr auto; align-items: center; gap: 6px; border-bottom: 1px solid rgba(187, 132, 84, .25); }
.product-columns header > span, .product-columns header > i { display: grid; place-items: center; border-radius: 50%; background: var(--surface); font-size: .48rem; font-style: normal; }
.product-columns header > span { width: 22px; height: 22px; color: var(--primary); font-weight: 850; }
.product-columns header > i { width: 20px; height: 20px; color: var(--ink-muted); }
.product-columns header b, .product-columns header small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-columns header b { font-size: .52rem; }
.product-columns header small { margin-top: 2px; color: var(--ink-muted); font-size: .4rem; }
.mock-order { margin-top: 8px; padding: 10px; background: var(--surface); border-radius: var(--radius-sm); box-shadow: 0 7px 17px rgba(111, 53, 28, .11); }
.mock-order > em { width: fit-content; display: block; margin-bottom: 7px; padding: 4px 6px; border-radius: 999px; color: #fff; font-size: .42rem; font-style: normal; font-weight: 800; }
.mock-order--pickup { border: 1px solid rgba(105, 71, 123, .25); }.mock-order--pickup > em { background: var(--pickup); }
.mock-order--table { border: 1px solid rgba(7, 63, 94, .25); }.mock-order--table > em { background: var(--table); }
.mock-order--delivery { border: 1px solid rgba(194, 88, 20, .25); }.mock-order--delivery > em { background: var(--delivery); }
.mock-order > b, .mock-order > strong, .mock-order > small, .mock-order footer { display: block; }
.mock-order > b { font-size: .48rem; }
.mock-order > strong { margin-top: 10px; font-size: .54rem; }
.mock-order > small { margin-top: 3px; color: var(--ink-muted); font-size: .43rem; }
.mock-order footer { margin-top: 16px; padding-top: 8px; border-top: 1px solid var(--border); text-align: right; font-size: .48rem; font-weight: 850; }

.living-menu { position: absolute; right: max(28px, calc((100vw - 1360px) / 2)); bottom: 24px; left: max(28px, calc((100vw - 1360px) / 2)); display: grid; grid-template-columns: repeat(4, 1fr); overflow: hidden; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.living-menu article { display: grid; grid-template-columns: 42px 1fr; min-height: 94px; align-items: center; gap: 13px; padding: 16px 20px; border-right: 1px solid var(--border); }
.living-menu article:last-child { border: 0; }
.living-menu article > span { width: 40px; height: 40px; display: grid; place-items: center; color: var(--primary); background: var(--surface-warm); border-radius: var(--radius-sm); }
.living-menu article > span svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.living-menu article strong, .living-menu article small { display: block; }
.living-menu article strong { font-size: .78rem; }
.living-menu article small { margin-top: 3px; color: var(--ink-muted); font-size: .59rem; line-height: 1.4; }

.proof-line { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--surface-warm); }
.proof-line p { width: var(--page); display: grid; grid-template-columns: repeat(4, 1fr); margin: 0 auto; }
.proof-line span { min-height: 52px; display: flex; align-items: center; justify-content: center; gap: 9px; padding: 0 12px; color: var(--ink-muted); border-right: 1px solid var(--border); font-size: .67rem; font-weight: 760; text-align: center; }
.proof-line span:last-child { border: 0; }
.proof-line span::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--primary); }

.section { width: var(--page); margin: 0 auto; padding: clamp(88px, 9vw, 132px) 0; }
.eyebrow { width: fit-content; margin: 0 0 14px; padding: 6px 9px; color: var(--primary-dark); background: var(--surface-warm); border-radius: 999px; font-size: .64rem; font-weight: 820; letter-spacing: .02em; }
.section-heading { max-width: 760px; margin-bottom: 48px; }
.section-heading--wide { max-width: none; display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, .45fr); align-items: end; gap: 64px; }
.section-heading--wide .eyebrow { grid-column: 1 / -1; }
.section-heading h2, .payments h2, .pricing h2, .final-cta h2 { margin: 0; font-size: clamp(2.35rem, 4.5vw, 4.65rem); font-weight: 850; letter-spacing: -.04em; line-height: 1; }
.section-heading h2 em, .payments h2 em, .pricing h2 em, .final-cta h2 em { color: var(--primary); font-style: normal; }
.section-heading > p:last-child { margin: 0; color: var(--ink-muted); font-size: .9rem; line-height: 1.7; }

.story-layout { display: grid; grid-template-columns: minmax(330px, .72fr) minmax(520px, 1.28fr); min-height: 590px; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius-xl); background: var(--surface); box-shadow: var(--shadow); }
.story-steps { padding: 18px; border-right: 1px solid var(--border); }
.story-step { width: 100%; display: grid; grid-template-columns: 36px 1fr; align-items: start; gap: 14px; padding: 20px 14px; color: inherit; background: transparent; border: 0; border-bottom: 1px solid var(--border); cursor: pointer; opacity: .58; text-align: left; transition: opacity 180ms ease, background 180ms ease, transform 180ms ease; }
.story-step:last-child { border: 0; }
.story-step:hover, .story-step:focus-visible, .story-step.is-active { opacity: 1; background: var(--surface-warm); border-radius: var(--radius-md); transform: translateX(3px); }
.story-step > span:first-child { width: 30px; height: 30px; display: grid; place-items: center; color: var(--primary); background: var(--surface); border: 1px solid var(--border); border-radius: 50%; font-size: .65rem; font-weight: 850; }
.story-step.is-active > span:first-child { color: #fff; background: var(--primary); border-color: var(--primary); }
.story-step-copy { display: block; min-width: 0; }
.story-step-copy strong { display: block; margin: 1px 0 6px; font-size: .94rem; font-weight: 820; line-height: 1.25; }
.story-step-copy small { display: block; color: var(--ink-muted); font-size: .69rem; line-height: 1.55; }
.story-stage { position: relative; min-height: 590px; overflow: hidden; background: var(--surface-warm); }
[data-story-panel] { position: absolute; opacity: 0; pointer-events: none; transform: translateY(18px) scale(.985); transition: opacity 300ms ease, transform 420ms cubic-bezier(.16, 1, .3, 1); }
[data-story-panel].is-active { opacity: 1; pointer-events: auto; transform: none; }
.phone-shell { top: 48px; left: 50%; width: 300px; min-height: 470px; padding: 18px 17px; background: var(--surface); border: 8px solid var(--sidebar); border-radius: 24px; box-shadow: 0 18px 40px rgba(111, 53, 28, .18); transform: translateX(-50%) translateY(18px) scale(.985); }
.phone-shell.is-active { transform: translateX(-50%); }
.phone-shell::before { content: ""; position: absolute; top: 8px; left: 50%; width: 62px; height: 5px; border-radius: 999px; background: var(--sidebar); transform: translateX(-50%); }
.phone-top { display: grid; grid-template-columns: 26px 1fr; align-items: center; gap: 8px; padding-top: 13px; }
.phone-top img { width: 23px; height: 23px; object-fit: contain; }
.phone-top b { font-size: .67rem; }.phone-top span { grid-column: 2; color: var(--ink-muted); font-size: .54rem; }
.phone-title { margin: 24px 0 16px; font-size: 1.42rem; font-weight: 850; letter-spacing: -.03em; }
.dish-row { display: grid; grid-template-columns: 62px 1fr 28px; align-items: center; gap: 9px; margin-bottom: 10px; padding: 8px; border: 1px solid var(--border); border-radius: var(--radius-md); }
.dish-thumb { width: 62px; height: 68px; border-radius: var(--radius-sm); background: radial-gradient(circle at 50% 60%, #a24316 0 21%, #f6b23d 22% 35%, #5d3119 36% 45%, #d96b1d 46% 59%, #f8bf59 60% 67%, #40241b 68%); }
.dish-thumb--two { filter: hue-rotate(8deg) saturate(.8); }
.dish-row b, .dish-row small, .dish-row strong { display: block; }
.dish-row b { font-size: .65rem; }.dish-row small { margin: 3px 0; overflow: hidden; color: var(--ink-muted); font-size: .5rem; text-overflow: ellipsis; white-space: nowrap; }.dish-row strong { color: var(--primary); font-size: .62rem; }
.dish-row button { width: 28px; height: 28px; padding: 0; color: #fff; background: var(--primary); border: 0; border-radius: 50%; font-weight: 800; }
.service-float { top: 50%; left: 50%; width: min(520px, calc(100% - 56px)); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding: 18px; background: var(--surface); border-radius: var(--radius-md); box-shadow: var(--shadow); transform: translate(-50%, calc(-50% + 18px)) scale(.985); }
.service-float.is-active { transform: translate(-50%, -50%); }
.bell-icon { width: 48px; height: 48px; display: grid; place-items: center; color: #fff; background: var(--primary); border-radius: 50%; }
.bell-icon svg { width: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.service-float b, .service-float small { display: block; }.service-float b { font-size: .9rem; }.service-float small { color: var(--ink-muted); font-size: .66rem; }
.service-float button { min-height: 40px; padding: 0 15px; color: #fff; background: var(--success); border: 0; border-radius: 999px; font-size: .68rem; font-weight: 780; }
.pipeline-mini { inset: 48px 28px; padding: 16px; background: var(--background); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.pipeline-toolbar { display: flex; justify-content: space-between; padding-bottom: 12px; border-bottom: 1px solid var(--border); font-size: .68rem; font-weight: 800; }.pipeline-toolbar small { color: var(--ink-muted); font-size: .56rem; }
.pipeline-grid { height: calc(100% - 45px); display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding-top: 10px; }
.pipeline-grid div { padding: 10px 7px; color: var(--ink-muted); background: #f7eadb; border: 1px solid #ecd5bf; border-radius: var(--radius-sm); font-size: .55rem; }.pipeline-grid .active { color: var(--ink); background: #f5e7d8; }
.order-card { position: absolute; top: 138px; left: calc(50% + 16px); width: 160px; padding: 12px; background: var(--surface); border: 1px solid rgba(7, 63, 94, .25); border-radius: var(--radius-sm); box-shadow: 0 8px 20px rgba(7, 63, 94, .12); }.order-card span, .order-card strong, .order-card small, .order-card b { display: block; }.order-card span, .order-card small { color: var(--ink-muted); font-size: .5rem; }.order-card strong { margin: 7px 0 3px; font-size: .62rem; }.order-card b { margin-top: 14px; color: var(--primary); font-size: .48rem; }
.finish-board { top: 50%; left: 50%; width: 320px; padding: 28px; background: var(--surface); border-radius: var(--radius-lg); box-shadow: var(--shadow); transform: translate(-50%, calc(-50% + 18px)) scale(.985); }.finish-board.is-active { transform: translate(-50%, -50%); }.finish-board > p { margin: 0; color: var(--success); font-size: .64rem; font-weight: 820; }.finish-board > strong { display: block; margin: 4px 0 22px; font-size: 2rem; font-weight: 850; }.finish-board div { display: flex; justify-content: space-between; padding: 8px 0; border-top: 1px solid var(--border); font-size: .66rem; }.finish-board div span { color: var(--ink-muted); }.finish-board svg { width: 54px; height: 54px; display: block; margin: 24px auto 0; fill: none; stroke: var(--success); stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }

.feature-editorial { display: grid; gap: 18px; }
.feature-lead { display: grid; grid-template-columns: minmax(320px, .75fr) minmax(460px, 1.25fr); gap: 60px; align-items: center; padding: 42px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: var(--shadow); }
.feature-lead h3, .feature-item h3, .feature-wide h3 { margin: 0; font-size: clamp(1.8rem, 3vw, 3.25rem); font-weight: 850; letter-spacing: -.04em; line-height: 1.02; }
.feature-lead > div > p:not(.eyebrow), .feature-item > p:last-child, .feature-wide > div > p:last-child { color: var(--ink-muted); font-size: .82rem; line-height: 1.72; }
.check-list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px; margin: 22px 0 0; padding: 0; list-style: none; }.check-list li { position: relative; padding-left: 20px; color: #3e3934; font-size: .69rem; font-weight: 720; }.check-list li::before { content: "✓"; position: absolute; left: 0; color: var(--success); }
.menu-board { padding: 20px; background: var(--surface-warm); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.menu-board-label { color: var(--primary); font-size: .6rem; font-weight: 820; }
.menu-board > div { display: flex; justify-content: space-between; align-items: center; margin: 10px 0 8px; padding: 13px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); }.menu-board > div b { font-size: 1rem; }.menu-board > div i { color: var(--ink-muted); font-size: .6rem; font-style: normal; }
.menu-board > p { display: flex; justify-content: space-between; align-items: center; gap: 18px; margin: 8px 0 0; padding: 13px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); }.menu-board > p span { font-size: .78rem; font-weight: 800; }.menu-board > p small { display: block; margin-top: 2px; color: var(--ink-muted); font-size: .54rem; font-weight: 500; }.menu-board > p > b { color: var(--primary); font-size: .72rem; }
.feature-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.feature-item { min-height: 390px; padding: 40px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-xl); }
.feature-item--dark { color: var(--surface); background: var(--sidebar); border-color: var(--sidebar); }.feature-item--dark .eyebrow { color: var(--surface); background: #30373d; }.feature-item--dark > p:last-child { color: var(--sidebar-muted); }
.line-icon { width: 50px; height: 50px; display: grid; place-items: center; margin-bottom: 64px; color: var(--primary); background: var(--surface-warm); border-radius: var(--radius-md); }.line-icon svg { width: 25px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.feature-item--dark .line-icon { color: var(--surface); background: #30373d; }
.feature-wide { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; padding: 38px 42px; background: var(--surface-warm); border: 1px solid var(--border); border-radius: var(--radius-xl); }
.channel-ribbon { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; }.channel { display: flex; align-items: center; gap: 8px; padding: 11px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 999px; font-size: .68rem; font-weight: 780; }.channel i { width: 8px; height: 8px; border-radius: 50%; }.channel--table i { background: var(--table); }.channel--pickup i { background: var(--pickup); }.channel--delivery i { background: var(--delivery); }

.payments { width: 100%; display: grid; grid-template-columns: minmax(320px, .76fr) minmax(500px, 1.24fr); gap: 84px; margin-top: 100px; padding: 86px max(40px, calc((100vw - 1280px) / 2)); color: var(--surface); background: var(--sidebar); }
.payments .eyebrow { color: var(--surface); background: #30373d; }.payments h2 em { color: var(--orange); }.payments-copy > p:not(.eyebrow) { max-width: 540px; color: var(--sidebar-muted); }.provider-note { margin-top: 30px; font-size: .68rem; }
.payment-ledger { overflow: hidden; background: #252b30; border: 1px solid #343b41; border-radius: var(--radius-lg); }
.payment-ledger article { display: grid; grid-template-columns: 50px 1fr auto; align-items: center; gap: 15px; padding: 20px; border-bottom: 1px solid #3a4147; }.payment-ledger article:last-child { border: 0; }.payment-ledger article > p { grid-column: 2 / 4; margin: -4px 0 0; color: var(--sidebar-muted); font-size: .61rem; }.payment-ledger article > div b, .payment-ledger article > div small { display: block; }.payment-ledger article > div b { font-size: .94rem; }.payment-ledger article > div small { margin-top: 2px; color: var(--sidebar-muted); font-size: .58rem; }.payment-ledger article > strong { color: var(--orange); font-size: 1.25rem; text-align: right; }.payment-ledger article > strong small { display: block; color: var(--sidebar-muted); font-size: .48rem; }
.payment-mark { width: 46px; height: 46px; display: grid; place-items: center; border-radius: var(--radius-md); font-size: .62rem; font-weight: 850; }.payment-mark--pix { color: #fff; background: #1b9d91; transform: rotate(45deg); border-radius: var(--radius-sm); }.payment-mark--pix::after { content: "PIX"; transform: rotate(-45deg); }.payment-mark--nu { color: #fff; background: #820ad1; font-size: 1.15rem; }.payment-mark--card { color: var(--sidebar); background: var(--orange); }.payment-mark--card svg { width: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.comparison-table-wrap { overflow: auto; border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.comparison-table { width: 100%; min-width: 850px; border-collapse: collapse; background: var(--surface); font-size: .74rem; }.comparison-table th, .comparison-table td { padding: 17px 19px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); text-align: left; }.comparison-table tr:last-child th, .comparison-table tr:last-child td { border-bottom: 0; }.comparison-table tr > *:last-child { border-right: 0; }.comparison-table thead th { background: var(--surface-warm); font-size: .66rem; }.comparison-table thead th:first-child { width: 25%; }.comparison-table .is-prato { color: #fff; background: var(--table); }.comparison-table thead .is-prato { background: var(--primary); }.comparison-table thead img { width: 76px; }.comparison-table tbody th { font-size: .67rem; }.comparison-table td { color: var(--ink-muted); }.comparison-table td.is-prato { color: #e6f0f6; }.comparison-table .yes { color: #76d992; font-weight: 850; }
.comparison-note { margin: 13px 0 0; color: var(--ink-muted); font-size: .59rem; text-align: right; }.comparison-mobile-hint { display: none; }

.pricing { display: grid; grid-template-columns: 1fr minmax(420px, .78fr); gap: 90px; align-items: center; }
.pricing-copy > p:not(.eyebrow) { max-width: 520px; color: var(--ink-muted); }.pricing-footnote { margin-top: 34px; font-size: .61rem; }.price-panel { position: relative; padding: 36px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: var(--shadow); }.price-panel-top > span { color: var(--primary); font-size: .68rem; font-weight: 820; }.price-panel-top strong { display: block; margin-top: 8px; font-size: 3rem; font-weight: 850; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }.price-panel-top strong small { font-size: .76rem; }.price-panel-top strong i { color: var(--ink-muted); font-size: .7rem; font-style: normal; font-weight: 650; letter-spacing: 0; }.price-panel-top p { margin: 10px 0 22px; color: var(--success); font-size: .68rem; font-weight: 800; }.price-panel ul { margin: 0 0 24px; padding: 20px 0 0; border-top: 1px solid var(--border); list-style: none; }.price-panel li { position: relative; padding: 7px 0 7px 23px; color: #45403b; font-size: .69rem; }.price-panel li::before { content: "✓"; position: absolute; left: 0; color: var(--success); font-weight: 850; }.price-panel > small { display: block; margin-top: 13px; color: var(--ink-muted); font-size: .54rem; line-height: 1.5; text-align: center; }

.faq { display: grid; grid-template-columns: .64fr 1.36fr; gap: 80px; }
.faq-list { border-top: 1px solid var(--border); }.faq-list details { border-bottom: 1px solid var(--border); }.faq-list summary { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 18px 6px; cursor: pointer; font-size: .98rem; font-weight: 780; list-style: none; }.faq-list summary::-webkit-details-marker { display: none; }.faq-list summary span { position: relative; flex: 0 0 32px; width: 32px; height: 32px; border: 1px solid var(--border); border-radius: 50%; }.faq-list summary span::before, .faq-list summary span::after { content: ""; position: absolute; top: 50%; left: 50%; width: 10px; height: 1px; background: var(--primary); transform: translate(-50%, -50%); }.faq-list summary span::after { transform: translate(-50%, -50%) rotate(90deg); transition: transform 160ms ease; }.faq-list details[open] summary span::after { transform: translate(-50%, -50%); }.faq-list details p { max-width: 700px; margin: -3px 48px 23px 6px; color: var(--ink-muted); font-size: .76rem; }

.final-cta { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 70px; align-items: end; overflow: hidden; padding: 92px max(40px, calc((100vw - 1280px) / 2)); color: #fff; background: var(--primary); isolation: isolate; }.final-cta::before, .final-cta::after { content: ""; position: absolute; z-index: -1; border-radius: 50%; }.final-cta::before { width: 380px; height: 380px; top: -180px; right: 8%; background: var(--orange); opacity: .72; }.final-cta::after { width: 460px; height: 460px; left: -250px; bottom: -280px; border: 70px solid rgba(255, 253, 249, .12); }.final-cta .eyebrow { color: #fff; background: rgba(255,255,255,.14); }.final-cta h2 em { color: #fff; }.final-cta-action { display: flex; flex-direction: column; gap: 18px; }.final-cta-action > div { color: #fff; font-size: .68rem; }.final-cta-action > div strong, .final-cta-action > div span { display: block; }.final-cta-action > div strong { font-size: 1.35rem; font-weight: 850; }
.site-footer { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 38px; padding: 38px max(28px, calc((100vw - 1280px) / 2)); color: var(--sidebar-muted); background: var(--sidebar); }.footer-brand { width: 96px; }.site-footer p, .site-footer small { margin: 0; font-size: .6rem; }.site-footer nav { display: flex; gap: 22px; font-size: .64rem; font-weight: 720; }.site-footer a:hover { color: #fff; }

[data-reveal] { opacity: 1; transform: none; }
.motion-ready [data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity 460ms ease, transform 520ms cubic-bezier(.16, 1, .3, 1); }
.motion-ready [data-reveal].is-visible { opacity: 1; transform: none; }
.motion-ready [data-delay="1"] { transition-delay: 60ms; }.motion-ready [data-delay="2"] { transition-delay: 120ms; }.motion-ready [data-delay="3"] { transition-delay: 180ms; }.motion-ready [data-delay="4"] { transition-delay: 240ms; }
.motion-ready .hero-visual { opacity: 0; transform: translateY(14px) scale(.985); transition: opacity 600ms 120ms ease, transform 700ms 120ms cubic-bezier(.16, 1, .3, 1); }.motion-ready.is-loaded .hero-visual { opacity: 1; transform: none; }

@media (max-width: 1120px) {
  :root { --page: min(100% - 40px, 1040px); }
  .hero { grid-template-columns: minmax(360px, .8fr) minmax(520px, 1.2fr); gap: 34px; padding-inline: 20px; }
  .product-app { min-width: 680px; }
  .living-menu { right: 20px; left: 20px; }
  .living-menu article { padding-inline: 14px; }
  .story-layout { grid-template-columns: .8fr 1.2fr; }
  .feature-lead { gap: 36px; }
  .payments { gap: 50px; padding-inline: 30px; }
  .pricing { gap: 54px; }
}

@media (max-width: 860px) {
  :root { --page: calc(100vw - 36px); }
  html { scroll-padding-top: 74px; }
  .site-header { min-height: 68px; grid-template-columns: 1fr auto; padding: 8px 18px; background: rgba(255, 249, 241, .96); border-bottom-color: var(--border); }
  .brand { width: 108px; }.header-cta { display: none; }.nav-toggle { display: none; grid-column: 2; grid-row: 1; }.motion-ready .nav-toggle { display: block; }
  .main-nav { position: static; grid-column: 1 / -1; display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 12px 18px 20px; background: var(--background); border-bottom: 1px solid var(--border); }
  .motion-ready .main-nav { position: absolute; top: 67px; right: 0; left: 0; opacity: 0; visibility: hidden; transform: translateY(-8px); box-shadow: 0 18px 25px rgba(74, 34, 12, .1); transition: opacity 180ms ease, transform 180ms ease, visibility 180ms; }.motion-ready .main-nav.is-open { opacity: 1; visibility: visible; transform: none; }.main-nav a { min-height: 48px; border-bottom: 1px solid var(--border); }.nav-toggle[aria-expanded="true"] > span:nth-child(1) { transform: translateY(7px) rotate(45deg); }.nav-toggle[aria-expanded="true"] > span:nth-child(2) { opacity: 0; }.nav-toggle[aria-expanded="true"] > span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .hero { display: flex; min-height: 0; flex-direction: column; padding: 112px 18px 32px; }
  .hero-copy { max-width: none; }.hero h1 { max-width: 12ch; font-size: clamp(3rem, 10.5vw, 4.6rem); }.hero-lead { max-width: 700px; }.hero-visual { min-height: 500px; margin-top: 20px; }.product-app { min-width: 700px; }
  .living-menu { position: relative; right: auto; bottom: auto; left: auto; grid-template-columns: 1fr 1fr; margin-top: 16px; }.living-menu article:nth-child(2) { border-right: 0; }.living-menu article:nth-child(-n+2) { border-bottom: 1px solid var(--border); }
  .proof-line p { grid-template-columns: 1fr 1fr; }.proof-line span:nth-child(2) { border-right: 0; }.proof-line span:nth-child(-n+2) { border-bottom: 1px solid var(--border); }
  .section { padding: 88px 0; }.section-heading--wide { display: block; }.section-heading--wide > p:last-child { margin-top: 22px; }
  .story-layout { display: block; }.story-steps { display: grid; grid-template-columns: 1fr 1fr; border-right: 0; border-bottom: 1px solid var(--border); }.story-step:nth-child(odd) { border-right: 1px solid var(--border); }.story-stage { min-height: 530px; }
  .feature-lead { grid-template-columns: 1fr; gap: 34px; padding: 34px; }.feature-pair { grid-template-columns: 1fr; }.feature-item { min-height: 0; }.feature-wide { grid-template-columns: 1fr; gap: 30px; }.channel-ribbon { justify-content: flex-start; }
  .payments { grid-template-columns: 1fr; gap: 44px; margin-top: 50px; padding: 76px 28px; }.comparison-mobile-hint { display: block; margin: -26px 0 12px; color: var(--primary-dark); font-size: .66rem; font-weight: 780; }.pricing { grid-template-columns: 1fr; gap: 44px; }.faq { grid-template-columns: 1fr; gap: 14px; }
  .final-cta { grid-template-columns: 1fr; gap: 40px; padding: 76px 28px; }.final-cta-action { align-items: flex-start; }.site-footer { grid-template-columns: 1fr auto; gap: 18px; }.site-footer p { grid-column: 1 / -1; }.site-footer nav { grid-column: 1 / -1; grid-row: 3; }
}

@media (max-width: 540px) {
  :root { --page: calc(100vw - 28px); }
  .hero { padding: 96px 14px 24px; }.hero-badge { margin-bottom: 16px; }.hero h1 { font-size: 3rem; }.hero-lead { margin-top: 18px; font-size: .92rem; }.hero-action { flex-direction: column; align-items: stretch; gap: 8px; margin-top: 24px; }.hero-action .text-link { justify-content: center; }.hero-price { align-items: flex-start; gap: 14px; margin-top: 20px; padding-top: 18px; }.hero-price > strong { font-size: 1.72rem; }
  .hero-visual { min-height: 400px; margin-top: 22px; padding: 12px; }.product-app { width: 700px; min-width: 700px; height: 520px; transform: scale(.53); transform-origin: top left; }.product-topbar { padding-inline: 12px; }.living-menu { grid-template-columns: 1fr; }.living-menu article, .living-menu article:nth-child(2) { min-height: 78px; border-right: 0; border-bottom: 1px solid var(--border); }.living-menu article:last-child { border-bottom: 0; }
  .proof-line p { grid-template-columns: 1fr; }.proof-line span { border-right: 0; border-bottom: 1px solid var(--border); }.proof-line span:last-child { border-bottom: 0; }
  .section-heading h2, .payments h2, .pricing h2, .final-cta h2 { font-size: 2.35rem; }.story-steps { grid-template-columns: 1fr; padding: 10px; }.story-step:nth-child(odd) { border-right: 0; }.story-stage { min-height: 500px; }.phone-shell { width: 286px; }.service-float { grid-template-columns: auto 1fr; }.service-float button { grid-column: 1 / -1; }.pipeline-mini { inset: 34px 10px; padding: 10px; }.pipeline-grid { gap: 3px; }.pipeline-grid div { padding: 8px 3px; font-size: .46rem; }.order-card { left: calc(50% + 2px); }
  .feature-lead, .feature-item, .feature-wide { padding: 26px 22px; }.check-list { grid-template-columns: 1fr; }.menu-board { padding: 14px; }.line-icon { margin-bottom: 42px; }.payments { padding: 68px 18px; }.payment-ledger article { grid-template-columns: 46px 1fr auto; gap: 10px; padding: 16px 13px; }.payment-mark { width: 42px; height: 42px; }.price-panel { padding: 28px 22px; }.faq-list summary { font-size: .9rem; }.final-cta { padding: 68px 20px; }.final-cta-action, .final-cta-action .button { width: 100%; }.site-footer { display: flex; flex-direction: column; align-items: flex-start; }
}

@media (max-height: 760px) and (min-width: 861px) {
  .site-header { min-height: 66px; }.hero { min-height: 730px; padding-top: 105px; padding-bottom: 125px; }.hero h1 { font-size: clamp(3.25rem, 5vw, 4.8rem); }.hero-visual { min-height: 530px; }.product-app { height: 484px; }.product-columns { height: 348px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }.motion-ready [data-reveal], .motion-ready .hero-visual { opacity: 1; transform: none; }
}