:root {
  --bg: #08090b;
  --surface: #111318;
  --surface-2: #171a20;
  --line: rgba(255, 255, 255, .11);
  --line-strong: rgba(255, 255, 255, .2);
  --text: #f5f6f1;
  --muted: #a6a9ad;
  --lime: #c9f46c;
  --lime-dark: #17210a;
  --purple: #9663e6;
  --purple-dark: #20152f;
  --yellow: #f4d869;
  --container: 1240px;
  --radius: 26px;
  --header-h: 78px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: "Manrope", system-ui, sans-serif; font-size: 16px; line-height: 1.6; overflow-x: hidden; }
body.no-scroll { overflow: hidden; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.container { width: min(var(--container), calc(100% - 48px)); margin-inline: auto; }
.section { padding-block: 120px; }
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 1000; padding: 10px 16px; background: var(--lime); color: #0c0e08; transform: translateY(-150%); transition: transform .2s; }
.skip-link:focus { transform: translateY(0); }

.announcement { min-height: 34px; display: flex; align-items: center; justify-content: center; gap: 16px; background: var(--lime); color: #11150a; font-size: .77rem; letter-spacing: .04em; }
.announcement span { font-weight: 800; text-transform: uppercase; }
.announcement p { margin: 0; }
.announcement a { font-weight: 800; border-bottom: 1px solid currentColor; }

.site-header { height: var(--header-h); display: flex; align-items: center; gap: 48px; padding-inline: max(24px, calc((100vw - var(--container))/2)); border-bottom: 1px solid var(--line); background: rgba(8,9,11,.82); backdrop-filter: blur(18px); position: sticky; top: 0; z-index: 100; }
.brand { margin-right: auto; }
.brand img { width: 156px; height: auto; }
.desktop-nav { display: flex; align-items: center; gap: 30px; }
.desktop-nav a { color: #b9bdc0; font-size: .9rem; transition: color .2s; }
.desktop-nav a:hover { color: var(--text); }
.header-actions { display: flex; align-items: center; gap: 10px; }
.cart-button { height: 45px; display: inline-flex; align-items: center; gap: 9px; padding: 0 13px 0 15px; border: 1px solid var(--line-strong); border-radius: 999px; background: #121419; cursor: pointer; transition: border-color .2s, transform .2s; }
.cart-button:hover { border-color: var(--lime); transform: translateY(-1px); }
.cart-button svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cart-button > span:nth-of-type(1) { font-size: .88rem; }
.cart-count { min-width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: var(--lime); color: #11150a; font-size: .75rem; font-weight: 800; }
.icon-button { width: 43px; height: 43px; border: 1px solid var(--line); border-radius: 50%; background: transparent; display: none; place-items: center; cursor: pointer; }
.menu-button span { position: absolute; width: 17px; height: 1px; background: currentColor; transition: transform .2s; }
.menu-button span:first-child { transform: translateY(-3px); }
.menu-button span:last-child { transform: translateY(3px); }
.menu-button[aria-expanded="true"] span:first-child { transform: rotate(45deg); }
.menu-button[aria-expanded="true"] span:last-child { transform: rotate(-45deg); }
.mobile-nav { display: none; }

.product-hero { position: relative; min-height: 790px; padding: 64px 0 82px; isolation: isolate; overflow: hidden; background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size: 48px 48px; }
.product-hero::after { content: ""; position: absolute; inset: 0; z-index: -2; background: radial-gradient(circle at 62% 28%, rgba(149, 99, 230, .08), transparent 34%), linear-gradient(180deg, transparent 70%, var(--bg)); }
.ambient { position: absolute; border-radius: 50%; filter: blur(100px); opacity: .15; z-index: -1; pointer-events: none; }
.ambient-one { width: 430px; height: 430px; background: var(--lime); left: -220px; top: 180px; }
.ambient-two { width: 380px; height: 380px; background: var(--purple); right: -170px; bottom: -80px; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(430px, .95fr); gap: clamp(56px, 6vw, 100px); align-items: center; }
.product-visual { min-width: 0; }
.visual-label { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; color: #b8bcc0; font-size: .75rem; text-transform: uppercase; letter-spacing: .14em; font-weight: 700; }
.visual-label span { width: 8px; height: 8px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 14px var(--lime); }
.product-image-shell { position: relative; margin: 0; aspect-ratio: 1; border: 1px solid var(--line); border-radius: 30px; overflow: hidden; background: #050505; box-shadow: 0 40px 100px rgba(0,0,0,.5); }
.product-image-shell::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(255,255,255,.03); pointer-events: none; }
.product-image-shell img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.8,.2,1), object-position .6s; }
.product-image-shell[data-view="dashboard"] img { transform: scale(1.72); object-position: 49% 69%; }
.product-image-shell[data-view="mobile"] img { transform: scale(2.18); object-position: 78% 66%; }
.image-badge { position: absolute; z-index: 1; padding: 10px 14px; border-radius: 12px; border: 1px solid rgba(255,255,255,.16); background: rgba(9,10,13,.8); backdrop-filter: blur(12px); font-size: .76rem; font-weight: 700; box-shadow: 0 12px 32px rgba(0,0,0,.25); }
.badge-excel { left: 22px; bottom: 22px; color: var(--lime); }
.badge-download { right: 22px; top: 22px; }
.product-thumbs { display: flex; gap: 10px; margin-top: 14px; }
.thumb { width: 64px; height: 52px; padding: 0; border: 1px solid var(--line); border-radius: 11px; overflow: hidden; background: #0d0e10; cursor: pointer; transition: border-color .2s, transform .2s; }
.thumb:hover, .thumb.is-active { border-color: var(--lime); transform: translateY(-2px); }
.thumb span { display: block; width: 100%; height: 100%; background-image: url("assets/product-hero.jpg"); background-repeat: no-repeat; }
.thumb-full { background-size: cover; }
.thumb-dashboard { background-size: 180%; background-position: 50% 73%; }
.thumb-mobile { background-size: 235%; background-position: 80% 70%; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; color: var(--lime); text-transform: uppercase; font-size: .72rem; font-weight: 800; letter-spacing: .14em; }
.eyebrow-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.product-copy h1 { margin: 18px 0 18px; font-family: "Space Grotesk", sans-serif; font-size: clamp(2.85rem, 5.2vw, 5rem); line-height: .96; letter-spacing: -.055em; font-weight: 600; }
.product-copy h1 span { color: var(--purple); display: block; }
.hero-lede { max-width: 580px; margin: 0; color: #c2c5c7; font-size: clamp(1.03rem, 1.5vw, 1.23rem); line-height: 1.65; }
.rating-row { display: flex; align-items: center; gap: 9px; margin: 25px 0; font-size: .8rem; color: #92969a; }
.stars { color: var(--yellow); letter-spacing: 2px; font-size: .82rem; }
.rating-row strong { color: var(--text); }
.quick-benefits { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 10px; }
.quick-benefits li { color: #dde0df; font-size: .95rem; }
.quick-benefits span { display: inline-grid; place-items: center; width: 20px; height: 20px; margin-right: 9px; background: rgba(201,244,108,.11); border-radius: 50%; color: var(--lime); font-size: .72rem; }
.buy-panel { padding-top: 25px; border-top: 1px solid var(--line); }
.price-block { display: flex; align-items: baseline; gap: 12px; margin-bottom: 18px; }
.old-price { color: #777b7f; text-decoration: line-through; font-size: 1rem; }
.price-block strong { font: 600 2.2rem/1 "Space Grotesk", sans-serif; }
.launch-label { padding: 5px 9px; border-radius: 99px; background: rgba(150,99,230,.15); color: #caa9fb; font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.primary-button, .secondary-button, .ghost-button { border: 0; border-radius: 14px; cursor: pointer; font-weight: 800; transition: transform .2s, box-shadow .2s, background .2s; }
.primary-button { min-height: 54px; padding: 0 22px; background: var(--lime); color: #101509; display: inline-flex; align-items: center; justify-content: center; gap: 18px; box-shadow: 0 12px 40px rgba(201,244,108,.09); }
.primary-button:hover { transform: translateY(-2px); box-shadow: 0 16px 42px rgba(201,244,108,.17); background: #d5ff7c; }
.add-button { width: 100%; justify-content: space-between; }
.add-button svg { width: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.delivery-note { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; color: #82868a; font-size: .77rem; }
.delivery-note svg { width: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.trust-bar { border-block: 1px solid var(--line); background: #0c0e12; }
.trust-grid { min-height: 114px; display: grid; grid-template-columns: repeat(4,1fr); }
.trust-grid > div { display: flex; align-items: center; gap: 15px; padding: 22px 25px; border-right: 1px solid var(--line); }
.trust-grid > div:first-child { border-left: 1px solid var(--line); }
.trust-icon { display: grid; place-items: center; flex: 0 0 39px; height: 39px; border-radius: 11px; border: 1px solid var(--line-strong); color: var(--lime); font-family: "Space Grotesk"; font-weight: 700; font-size: .8rem; }
.trust-grid p { margin: 0; color: var(--muted); font-size: .72rem; line-height: 1.45; }
.trust-grid strong { display: block; color: var(--text); font-size: .88rem; margin-bottom: 2px; }
.section-index { color: #73777d; font-size: .7rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.manifesto-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 80px; align-items: end; margin-top: 34px; }
.manifesto h2, .section-heading h2, .inside h2, .faq h2 { margin: 0; font: 600 clamp(2.4rem,5vw,4.8rem)/1.03 "Space Grotesk", sans-serif; letter-spacing: -.055em; }
.manifesto h2 span, .section-heading h2 span, .inside h2 span { color: var(--purple); }
.manifesto-grid > div p { margin: 0 0 24px; color: #aeb2b5; line-height: 1.8; }
.text-link { display: inline-flex; align-items: center; gap: 12px; padding-bottom: 5px; border-bottom: 1px solid var(--line-strong); font-weight: 700; font-size: .9rem; }

.showcase { background: #0d0f13; border-block: 1px solid var(--line); }
.section-heading { display: flex; justify-content: space-between; gap: 60px; align-items: end; margin-bottom: 50px; }
.section-heading h2 { max-width: 800px; margin-top: 24px; }
.section-heading > p { width: 340px; margin: 0 0 8px; color: #969a9f; line-height: 1.75; }
.feature-layout { display: grid; grid-template-columns: 1.25fr .75fr; grid-template-rows: auto auto; gap: 16px; }
.feature-card { position: relative; min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: #14171c; }
.feature-main { grid-row: span 2; display: grid; grid-template-rows: auto 1fr; min-height: 720px; padding: 34px 34px 0; }
.feature-copy { display: grid; grid-template-columns: 50px 1fr; gap: 20px; margin-bottom: 24px; }
.feature-number { color: #73787c; font: 600 .72rem "Space Grotesk"; }
.feature-card h3 { margin: 0 0 10px; font: 600 1.45rem "Space Grotesk"; letter-spacing: -.025em; }
.feature-card p { margin: 0; color: #999ea2; line-height: 1.7; font-size: .91rem; }
.dashboard-crop { align-self: end; height: 480px; border: 1px solid rgba(255,255,255,.13); border-bottom: 0; border-radius: 18px 18px 0 0; background-image: linear-gradient(to top, rgba(8,9,11,.1), transparent), url("assets/product-hero.jpg"); background-size: 181%; background-position: 49% 73%; box-shadow: 0 30px 90px rgba(0,0,0,.4); }
.feature-small { min-height: 352px; padding: 30px; display: flex; flex-direction: column; }
.feature-small .feature-number { margin-bottom: auto; }
.purple-card { background: linear-gradient(145deg, #211532, #15111d); }
.mini-chart { height: 114px; margin: 22px -10px 24px; }
.mini-chart svg { width: 100%; height: 100%; overflow: visible; }
.mini-chart path { fill: none; stroke: var(--purple); stroke-width: 3; vector-effect: non-scaling-stroke; }
.mini-chart .chart-fill { stroke: none; fill: var(--purple); opacity: .18; }
.progress-preview { margin: auto 0 26px; padding: 20px; background: #0d0f12; border-radius: 15px; border: 1px solid var(--line); }
.progress-preview div { display: flex; justify-content: space-between; margin: 10px 0 8px; color: #a7aaad; font-size: .7rem; }
.progress-preview strong { color: var(--text); }
.progress-preview i { display: block; height: 7px; border-radius: 20px; background: #22252a; overflow: hidden; }
.progress-preview b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--purple), var(--lime)); }

.inside-panel { min-height: 660px; display: grid; grid-template-columns: 1fr .85fr; border: 1px solid var(--line); border-radius: 32px; background: linear-gradient(135deg, #13161b 0%, #0d0f13 60%); overflow: hidden; }
.inside-copy { padding: 70px; }
.inside h2 { margin-top: 22px; }
.inside-copy > p { max-width: 600px; color: #a7abad; margin: 26px 0 32px; }
.inside-copy ul { list-style: none; padding: 0; margin: 0 0 36px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 22px; }
.inside-copy li { color: #d6d8d7; font-size: .88rem; }
.inside-copy li span { color: var(--lime); margin-right: 8px; }
.secondary-button { min-height: 52px; padding: 0 20px; background: transparent; color: var(--text); border: 1px solid var(--line-strong); }
.secondary-button:hover { transform: translateY(-2px); border-color: var(--lime); }
.phone-visual { position: relative; display: grid; place-items: end center; min-height: 660px; background: radial-gradient(circle at 60% 60%, rgba(201,244,108,.12), transparent 46%), linear-gradient(180deg, rgba(150,99,230,.08), transparent); overflow: hidden; }
.phone-frame { width: 280px; height: 555px; margin-bottom: -48px; padding: 10px; border: 1px solid rgba(255,255,255,.35); border-radius: 43px; background: #070708; box-shadow: 0 40px 100px rgba(0,0,0,.6); transform: rotate(3deg); }
.phone-notch { position: absolute; width: 85px; height: 21px; left: 50%; transform: translateX(-50%); top: 16px; border-radius: 30px; background: #050505; z-index: 2; }
.phone-screen { width: 100%; height: 100%; border-radius: 34px; background-image: url("assets/product-hero.jpg"); background-size: 247%; background-position: 79% 68%; }
.floating-stat { position: absolute; min-width: 140px; padding: 14px 17px; background: rgba(18,21,25,.88); backdrop-filter: blur(15px); border: 1px solid var(--line-strong); border-radius: 15px; box-shadow: 0 18px 45px rgba(0,0,0,.35); }
.floating-stat span { display: block; color: #9a9da1; font-size: .68rem; }
.floating-stat strong { font: 600 1.35rem "Space Grotesk"; color: var(--lime); }
.stat-one { left: 22px; top: 180px; }
.stat-two { right: 24px; bottom: 90px; }

.steps { border-block: 1px solid var(--line); background: #0c0e11; }
.steps .section-heading { margin-bottom: 42px; }
.steps-grid { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line); }
.step { padding: 38px 40px 15px 0; border-right: 1px solid var(--line); }
.step + .step { padding-left: 40px; }
.step:last-child { border-right: 0; }
.step > span { display: inline-block; margin-bottom: 70px; color: var(--lime); font: 600 .78rem "Space Grotesk"; }
.step h3 { margin: 0 0 10px; font: 600 1.55rem "Space Grotesk"; }
.step p { margin: 0; color: #95999d; }

.future-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.future-card { min-height: 360px; padding: 25px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--line); border-radius: 23px; background: #121419; overflow: hidden; transition: transform .25s, border-color .25s; }
.future-card:hover { transform: translateY(-6px); border-color: var(--line-strong); }
.future-top { display: flex; justify-content: space-between; align-items: start; }
.future-top span { padding: 6px 9px; border-radius: 99px; border: 1px solid var(--line); color: #a3a7aa; font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.future-top b { display: grid; place-items: center; width: 62px; height: 62px; border: 1px solid var(--line); border-radius: 18px; font: 500 1.65rem "Space Grotesk"; color: var(--lime); }
.future-card h3 { margin: 0 0 10px; font: 600 1.35rem "Space Grotesk"; }
.future-card p { margin: 0; color: #8f9397; font-size: .85rem; }
.savings { background: radial-gradient(circle at 100% 0, rgba(201,244,108,.1), transparent 38%), #121419; }
.meals { background: radial-gradient(circle at 100% 0, rgba(150,99,230,.14), transparent 38%), #121419; }
.fitness { background: radial-gradient(circle at 100% 0, rgba(255,255,255,.06), transparent 38%), #121419; }
.pack { background: var(--lime); color: #101508; }
.pack .future-top span, .pack .future-top b { border-color: rgba(16,21,8,.18); color: #101508; }
.pack p { color: rgba(16,21,8,.68); }
.quote-section { text-align: center; border-top: 1px solid var(--line); }
.quote-section p { max-width: 950px; margin: 0 auto 34px; font: 500 clamp(2rem,4vw,3.9rem)/1.15 "Space Grotesk"; letter-spacing: -.04em; }
.quote-section img { width: 130px; height: auto; margin: auto; }

.faq { display: grid; grid-template-columns: .72fr 1.28fr; gap: 100px; border-top: 1px solid var(--line); }
.faq h2 { margin: 24px 0 20px; }
.faq-intro p { color: #93979b; margin-bottom: 30px; }
.accordion details { border-top: 1px solid var(--line); }
.accordion details:last-child { border-bottom: 1px solid var(--line); }
.accordion summary { list-style: none; cursor: pointer; padding: 25px 0; display: flex; justify-content: space-between; align-items: center; gap: 16px; font-weight: 700; }
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary span { font-size: 1.4rem; font-weight: 400; transition: transform .2s; }
.accordion details[open] summary span { transform: rotate(45deg); }
.accordion details p { margin: -5px 40px 26px 0; color: #969a9e; max-width: 650px; }

.final-cta { padding: 100px 0; background: var(--purple); color: #0e0b12; }
.final-cta-inner { display: flex; justify-content: space-between; align-items: end; gap: 50px; }
.final-cta-inner > div > span { font-size: .7rem; letter-spacing: .14em; font-weight: 800; }
.final-cta h2 { margin: 20px 0 0; font: 600 clamp(3rem,6vw,6rem)/.92 "Space Grotesk"; letter-spacing: -.06em; }
.final-cta h2 em { color: var(--lime); font-style: normal; }
.final-buy { width: 330px; }
.final-buy p { margin: 0 0 15px; display: flex; align-items: baseline; gap: 13px; }
.final-buy s { opacity: .55; }
.final-buy strong { font: 600 2rem "Space Grotesk"; }
.final-buy .primary-button { width: 100%; }
.final-buy small { display: block; margin-top: 10px; opacity: .7; font-size: .68rem; }

.site-footer { padding: 76px 0 22px; background: #07080a; }
.footer-main { display: grid; grid-template-columns: .85fr 1.15fr; gap: 90px; padding-bottom: 65px; }
.footer-brand img { width: 165px; height: auto; }
.footer-brand p { max-width: 350px; margin: 24px 0 0; color: #82868a; }
.footer-links { display: grid; grid-template-columns: repeat(3,1fr); gap: 35px; }
.footer-links h3 { margin: 0 0 18px; color: #777b80; font-size: .68rem; text-transform: uppercase; letter-spacing: .14em; }
.footer-links a, .footer-links button { display: block; margin: 0 0 10px; padding: 0; border: 0; background: none; color: #b5b8ba; font-size: .8rem; text-align: left; cursor: pointer; }
.footer-links a:hover, .footer-links button:hover { color: var(--lime); }
.footer-bottom { display: flex; justify-content: space-between; padding-top: 20px; border-top: 1px solid var(--line); color: #686c70; font-size: .67rem; }

.overlay { position: fixed; inset: 0; z-index: 200; background: rgba(0,0,0,.72); backdrop-filter: blur(6px); opacity: 0; transition: opacity .25s; }
.overlay.is-visible { opacity: 1; }
.cart-drawer { position: fixed; inset: 0 0 0 auto; z-index: 210; width: min(460px, 100%); display: grid; grid-template-rows: auto 1fr auto; background: #101216; border-left: 1px solid var(--line); transform: translateX(105%); transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.cart-drawer.is-open { transform: translateX(0); }
.drawer-header { display: flex; justify-content: space-between; align-items: start; padding: 28px 28px 23px; border-bottom: 1px solid var(--line); }
.drawer-header span { color: var(--lime); font-size: .66rem; text-transform: uppercase; letter-spacing: .13em; font-weight: 800; }
.drawer-header h2 { margin: 3px 0 0; font: 600 1.8rem "Space Grotesk"; }
.close-button { width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 50%; background: transparent; font-size: 1.55rem; font-weight: 300; cursor: pointer; }
.drawer-body { min-height: 0; overflow-y: auto; padding: 28px; }
.empty-cart { min-height: 100%; display: grid; place-content: center; text-align: center; color: #95999c; }
.empty-cart b { display: grid; place-items: center; width: 70px; height: 70px; margin: 0 auto 18px; border-radius: 50%; border: 1px solid var(--line); color: var(--lime); font: 500 1.4rem "Space Grotesk"; }
.empty-cart h3 { margin: 0 0 8px; color: var(--text); font: 600 1.3rem "Space Grotesk"; }
.empty-cart p { margin: 0; font-size: .85rem; }
.cart-item { display: grid; grid-template-columns: 94px 1fr; gap: 16px; }
.cart-item img { width: 94px; height: 94px; object-fit: cover; border-radius: 13px; border: 1px solid var(--line); }
.cart-item h3 { margin: 0 0 5px; font-size: .9rem; line-height: 1.35; }
.cart-item p { margin: 0 0 12px; color: #85898d; font-size: .7rem; }
.cart-item-bottom { display: flex; justify-content: space-between; align-items: center; }
.qty { display: flex; align-items: center; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
.qty button { width: 30px; height: 29px; border: 0; background: transparent; cursor: pointer; }
.qty span { width: 25px; text-align: center; font-size: .75rem; }
.remove-item { margin-top: 18px; padding: 0; border: 0; background: transparent; color: #7e8285; font-size: .72rem; text-decoration: underline; cursor: pointer; }
.drawer-footer { padding: 24px 28px 28px; border-top: 1px solid var(--line); }
.total-row, .discount-row { display: flex; justify-content: space-between; align-items: center; }
.total-row { font-size: 1rem; }
.total-row strong { font: 600 1.3rem "Space Grotesk"; }
.discount-row { margin: 7px 0 20px; color: #8e9296; font-size: .72rem; }
.discount-row strong { color: var(--lime); }
.checkout-button { width: 100%; justify-content: space-between; }
.drawer-footer small { display: block; margin-top: 10px; color: #75797c; text-align: center; font-size: .65rem; }

.modal { position: fixed; left: 50%; top: 50%; z-index: 220; width: min(520px, calc(100% - 30px)); max-height: min(720px, calc(100vh - 30px)); overflow-y: auto; padding: 36px; border: 1px solid var(--line-strong); border-radius: 24px; background: #121419; box-shadow: 0 40px 120px rgba(0,0,0,.6); transform: translate(-50%,-47%) scale(.97); opacity: 0; transition: opacity .2s, transform .2s; }
.modal.is-visible { opacity: 1; transform: translate(-50%,-50%) scale(1); }
.modal-close { position: absolute; right: 18px; top: 18px; }
.demo-tag, .modal-kicker { display: inline-block; margin-bottom: 15px; color: var(--lime); font-size: .64rem; font-weight: 800; letter-spacing: .12em; }
.modal h2 { margin: 0 0 10px; font: 600 2rem "Space Grotesk"; }
.modal > p { margin: 0 0 25px; color: #9b9fa2; }
.checkout-summary { display: grid; grid-template-columns: 72px 1fr auto; gap: 13px; align-items: center; padding: 13px; margin-bottom: 22px; border: 1px solid var(--line); border-radius: 14px; background: #0d0f12; }
.checkout-summary img { border-radius: 9px; }
.checkout-summary strong, .checkout-summary span { display: block; font-size: .78rem; }
.checkout-summary span { color: #7e8286; margin-top: 3px; }
.checkout-summary b { font-size: .9rem; }
.modal label { display: block; color: #a6aaad; font-size: .76rem; }
.modal input { width: 100%; height: 48px; margin-top: 7px; padding: 0 14px; border: 1px solid var(--line); border-radius: 11px; background: #0b0d10; color: #777; }
.disabled-checkout { width: 100%; height: 51px; margin-top: 13px; border: 0; border-radius: 12px; background: #2a2d31; color: #777b7e; font-weight: 800; cursor: not-allowed; }
.modal > small { display: block; margin-top: 10px; color: #6f7376; text-align: center; }
.legal-content { color: #a3a7aa; }
.legal-content h3 { color: var(--text); font-size: .94rem; margin: 22px 0 5px; }
.legal-content p { margin: 0 0 12px; font-size: .85rem; }
.cookie-option { display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 16px 0; border-top: 1px solid var(--line); }
.cookie-option strong, .cookie-option span { display: block; }
.cookie-option span { color: #808488; font-size: .72rem; }
.cookie-option input { width: 20px; height: 20px; accent-color: var(--lime); }
.cookie-modal .primary-button { width: 100%; margin-top: 16px; }
.cookie-banner { position: fixed; z-index: 180; right: 22px; bottom: 22px; width: min(580px, calc(100% - 44px)); display: flex; justify-content: space-between; gap: 30px; align-items: center; padding: 20px; border: 1px solid var(--line-strong); border-radius: 18px; background: rgba(17,19,24,.94); backdrop-filter: blur(16px); box-shadow: 0 25px 70px rgba(0,0,0,.45); }
.cookie-banner strong { font-size: .86rem; }
.cookie-banner p { margin: 3px 0 0; color: #8d9195; font-size: .72rem; }
.cookie-banner > div:last-child { display: flex; gap: 8px; flex: 0 0 auto; }
.ghost-button { min-height: 41px; padding: 0 14px; background: transparent; border: 1px solid var(--line); }
.primary-button.small { min-height: 41px; padding: 0 15px; }
.toast { position: fixed; z-index: 300; left: 50%; bottom: 24px; padding: 12px 17px; border: 1px solid rgba(201,244,108,.35); border-radius: 12px; background: #16200c; color: var(--lime); font-size: .8rem; font-weight: 700; opacity: 0; transform: translate(-50%, 15px); pointer-events: none; transition: opacity .2s, transform .2s; }
.toast.is-visible { opacity: 1; transform: translate(-50%,0); }

.reveal { opacity: 0; transform: translateY(20px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 1050px) {
  .desktop-nav { display: none; }
  .icon-button { display: grid; }
  .mobile-nav { position: absolute; top: calc(100% + 1px); left: 0; right: 0; display: grid; padding: 14px 24px 24px; border-bottom: 1px solid var(--line); background: rgba(8,9,11,.98); transform: translateY(-10px); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }
  .mobile-nav.is-open { opacity: 1; transform: none; pointer-events: auto; }
  .mobile-nav a { padding: 12px 0; border-bottom: 1px solid var(--line); }
  .hero-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
  .product-copy h1 { font-size: clamp(2.7rem,5.5vw,4rem); }
  .trust-grid { grid-template-columns: 1fr 1fr; }
  .trust-grid > div:nth-child(3) { border-left: 1px solid var(--line); border-top: 1px solid var(--line); }
  .trust-grid > div:nth-child(4) { border-top: 1px solid var(--line); }
  .future-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 800px) {
  :root { --header-h: 68px; --radius: 20px; }
  .container { width: min(100% - 30px, var(--container)); }
  .section { padding-block: 80px; }
  .announcement { padding: 6px 14px; justify-content: space-between; }
  .announcement p { display: none; }
  .site-header { padding-inline: 15px; }
  .brand img { width: 134px; }
  .cart-button { padding: 0 10px; }
  .cart-button > span:nth-of-type(1) { display: none; }
  .product-hero { padding: 34px 0 64px; }
  .hero-grid { grid-template-columns: 1fr; }
  .product-copy { order: -1; }
  .product-copy h1 { font-size: clamp(3rem,13vw,4.5rem); }
  .product-visual { margin-top: 5px; }
  .image-badge { font-size: .66rem; }
  .manifesto-grid, .inside-panel, .faq, .footer-main { grid-template-columns: 1fr; gap: 45px; }
  .manifesto h2, .section-heading h2, .inside h2, .faq h2 { font-size: clamp(2.5rem,10vw,4rem); }
  .section-heading { display: block; }
  .section-heading > p { width: auto; margin-top: 24px; }
  .feature-layout { grid-template-columns: 1fr; grid-template-rows: auto; }
  .feature-main { grid-row: auto; min-height: 600px; }
  .inside-copy { padding: 45px 28px; }
  .inside-copy ul { grid-template-columns: 1fr; }
  .phone-visual { min-height: 570px; }
  .steps-grid { grid-template-columns: 1fr; }
  .step { padding: 28px 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .step + .step { padding-left: 0; }
  .step > span { margin-bottom: 28px; }
  .final-cta-inner { display: block; }
  .final-buy { width: 100%; margin-top: 45px; }
  .footer-links { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 520px) {
  .product-copy h1 { font-size: 3.05rem; }
  .hero-lede { font-size: .98rem; }
  .rating-row { flex-wrap: wrap; }
  .rating-row > span:last-child { width: 100%; }
  .launch-label { display: none; }
  .product-image-shell { border-radius: 21px; }
  .badge-excel { left: 12px; bottom: 12px; }
  .badge-download { right: 12px; top: 12px; }
  .trust-grid { grid-template-columns: 1fr; }
  .trust-grid > div { border: 0 !important; border-bottom: 1px solid var(--line) !important; padding-inline: 0; }
  .feature-main { min-height: 520px; padding: 25px 22px 0; }
  .feature-copy { grid-template-columns: 1fr; }
  .dashboard-crop { height: 340px; background-size: 220%; }
  .future-grid { grid-template-columns: 1fr; }
  .future-card { min-height: 280px; }
  .quote-section p { font-size: 2.1rem; }
  .phone-frame { width: 242px; height: 490px; }
  .stat-one { left: 8px; }
  .stat-two { right: 8px; }
  .final-cta h2 { font-size: 3.5rem; }
  .footer-links { grid-template-columns: 1fr; }
  .footer-bottom { display: grid; gap: 8px; }
  .cookie-banner { display: block; right: 15px; bottom: 15px; width: calc(100% - 30px); }
  .cookie-banner > div:last-child { margin-top: 15px; }
  .modal { padding: 30px 21px; }
}

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