:root{
  --paper:#F8F6FC;
  --ink:#141127;
  --ink-soft:#5C5A73;
  --green:#00C08B;
  --green-dark:#00A876;
  --indigo:#5B4CF0;
  --indigo-dark:#4534D6;
  --gold:#FFB238;
  --coral:#FF6E5E;
  --tint-green:#E3FBF2;
  --tint-indigo:#ECE9FE;
  --tint-gold:#FFF3DE;
  --tint-coral:#FFECE9;
  --white:#FFFFFF;
  --border:#E6E1F5;
  --g-blue:#4285F4; --g-red:#EA4335; --g-yellow:#FBBC05; --g-green:#34A853;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--paper); color:var(--ink); font-family:'Manrope',sans-serif; line-height:1.55; -webkit-font-smoothing:antialiased; overflow-x:hidden;}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px; position:relative;}
h1,h2,h3{font-family:'Sora',sans-serif; font-weight:700; letter-spacing:-0.02em; line-height:1.12;}
.grad-text{background:linear-gradient(100deg,var(--indigo),var(--green) 70%); -webkit-background-clip:text; background-clip:text; color:transparent;}
.eyebrow{font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; display:inline-flex; align-items:center; gap:9px; margin-bottom:16px; font-weight:600; padding:7px 15px 7px 12px; border-radius:100px; background:color-mix(in srgb, currentColor 8%, transparent); border:1px solid color-mix(in srgb, currentColor 22%, transparent); backdrop-filter:blur(4px);}
.eyebrow.c-green{color:var(--green-dark);} .eyebrow.c-indigo{color:var(--indigo-dark);} .eyebrow.c-gold{color:#C97A00;} .eyebrow.c-coral{color:#D6503F;}
.eyebrow::before{content:""; width:7px; height:7px; border-radius:50%; background:currentColor; flex-shrink:0; animation:eyebrowPing 2.2s cubic-bezier(0,0,.2,1) infinite;}
@keyframes eyebrowPing{
  0%{box-shadow:0 0 0 0 color-mix(in srgb, currentColor 50%, transparent);}
  70%{box-shadow:0 0 0 9px transparent;}
  100%{box-shadow:0 0 0 0 transparent;}
}
:focus-visible{outline:2px solid var(--indigo); outline-offset:3px;}
@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}}

.reveal{opacity:0; transform:translateY(26px); transition:opacity .8s cubic-bezier(.22,.61,.36,1), transform .8s cubic-bezier(.22,.61,.36,1);}
.reveal.visible{opacity:1; transform:translateY(0);}
.reveal-1{transition-delay:.05s;} .reveal-2{transition-delay:.15s;} .reveal-3{transition-delay:.25s;} .reveal-4{transition-delay:.35s;}

/* ---------- Scroll progress bar ---------- */
.scroll-progress{position:fixed; top:0; left:0; height:3px; width:0%; z-index:300; background:linear-gradient(90deg,var(--indigo),var(--green),var(--gold)); border-radius:0 3px 3px 0; transition:width .08s linear;}

/* ---------- Section heading accent ---------- */
.section-head h2{position:relative;}
.section-head h2::after{content:""; display:block; width:58px; height:4px; border-radius:4px; background:linear-gradient(90deg,var(--indigo),var(--green)); margin-top:16px; transform:scaleX(0); transform-origin:left; transition:transform .8s cubic-bezier(.22,.61,.36,1) .3s;}
.section-head.center h2::after{margin-left:auto; margin-right:auto; transform-origin:center;}
.reveal.visible h2::after, .section-head.reveal.visible h2::after{transform:scaleX(1);}

/* ---------- Button shine sweep ---------- */
.btn{position:relative; overflow:hidden;}
.btn-primary::after{content:""; position:absolute; top:0; left:-80%; width:50%; height:100%; background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent); transform:skewX(-20deg); transition:left .6s ease;}
.btn-primary:hover::after{left:130%;}

.badge{width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center; flex-shrink:0; box-shadow:0 10px 20px -8px rgba(20,17,39,0.35); transition:transform .2s ease;}
.badge svg{width:24px; height:24px; stroke:#fff; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;}
.b-green{background:linear-gradient(140deg,var(--green),#00E0A2);}
.b-indigo{background:linear-gradient(140deg,var(--indigo),#8B7BFF);}
.b-gold{background:linear-gradient(140deg,var(--gold),#FFCF6E);}
.b-coral{background:linear-gradient(140deg,var(--coral),#FF9B8F);}
.format-card:hover .badge, .feature-item:hover .badge, .gam-card:hover .badge{transform:scale(1.08) rotate(-4deg);}

header{position:sticky; top:0; z-index:100; background:rgba(248,246,252,0.82); backdrop-filter:blur(10px); border-bottom:1px solid var(--border); transition:box-shadow .2s ease;}
header.scrolled{box-shadow:0 8px 24px -12px rgba(20,17,39,0.15);}
nav{display:flex; align-items:center; justify-content:space-between; padding:16px 28px; max-width:1180px; margin:0 auto;}
.logo{display:flex; align-items:center; gap:9px; font-family:'Sora',sans-serif; font-weight:700; font-size:19px;}
.logo .dot{width:22px; height:22px; border-radius:7px; background:linear-gradient(140deg,var(--indigo),var(--green)); position:relative; overflow:hidden;}
.logo .dot::after{content:""; position:absolute; inset:3px; border-radius:4px; background:var(--white); opacity:.9; animation:pulseFill 2.4s ease-in-out infinite;}
@keyframes pulseFill{0%,100%{transform:scale(.55);} 50%{transform:scale(.85);}}
.nav-links{display:flex; align-items:center; gap:34px;}
.nav-links > li{position:relative;}
.nav-links a.top{font-size:14.5px; font-weight:600; color:var(--ink-soft); transition:color .15s ease;}
.nav-links a.top:hover, .nav-links a.top.active{color:var(--indigo-dark);}
.has-dropdown:hover .dropdown{opacity:1; visibility:visible; transform:translateY(0);}
.dropdown{position:absolute; top:130%; left:50%; transform:translateX(-50%) translateY(4px); background:var(--white); border:1px solid var(--border); border-radius:12px; padding:8px; min-width:230px; box-shadow:0 14px 30px rgba(20,17,39,0.12); opacity:0; visibility:hidden; transition:all .18s ease;}
.dropdown a{display:block; padding:9px 12px; border-radius:8px; font-size:13.5px; font-weight:500; color:var(--ink-soft);}
.dropdown a:hover{background:var(--tint-indigo); color:var(--indigo-dark);}
.nav-cta{background:linear-gradient(120deg,var(--indigo),var(--indigo-dark)); color:var(--white); font-size:14px; font-weight:600; padding:11px 22px; border-radius:10px; white-space:nowrap; transition:transform .15s ease, box-shadow .15s ease;}
.nav-cta:hover{transform:translateY(-2px); box-shadow:0 10px 22px rgba(91,76,240,0.35);}
.burger{display:none; background:none; border:none; cursor:pointer; padding:6px;}
.burger span{display:block; width:22px; height:2px; background:var(--ink); margin:5px 0;}

.btn{font-family:'Sora',sans-serif; font-weight:700; font-size:14.5px; padding:14px 26px; border-radius:10px; border:1px solid transparent; cursor:pointer; display:inline-flex; align-items:center; gap:8px; transition:transform .15s ease, box-shadow .15s ease, background .15s ease;}
.btn-primary{background:linear-gradient(120deg,var(--indigo),var(--green)); color:var(--white); box-shadow:0 10px 24px -6px rgba(91,76,240,0.45);}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 16px 30px -6px rgba(91,76,240,0.55);}
.btn-ghost{background:var(--white); color:var(--ink); border-color:var(--border);}
.btn-ghost:hover{border-color:var(--indigo); color:var(--indigo-dark); transform:translateY(-2px);}
.btn-block{width:100%; justify-content:center;}

.hero{padding:70px 0 0; position:relative; overflow:hidden;}
.hero::before{content:""; position:absolute; top:-220px; right:-180px; width:520px; height:520px; border-radius:50%; background:radial-gradient(circle,var(--green) 0%, transparent 68%); opacity:.35; filter:blur(10px);}
.hero::after{content:""; position:absolute; top:80px; left:-220px; width:460px; height:460px; border-radius:50%; background:radial-gradient(circle,var(--indigo) 0%, transparent 68%); opacity:.3; filter:blur(10px);}
.hero .wrap{display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; padding-bottom:60px;}
.hero h1{font-size:clamp(34px,4.6vw,54px); margin-bottom:20px;}
.hero p.lede{font-size:17px; color:var(--ink-soft); max-width:460px; margin-bottom:30px;}
.cta-row{display:flex; gap:14px; flex-wrap:wrap;}

.chart-card{background:var(--white); border-radius:20px; padding:22px 22px 18px; box-shadow:0 30px 60px -20px rgba(91,76,240,0.28); position:relative; z-index:1;}
.chart-card::before{content:""; position:absolute; inset:-1.5px; border-radius:21px; padding:1.5px; background:linear-gradient(140deg,var(--indigo),var(--green),var(--gold)); -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; z-index:-1;}
.chart-card .top-row{display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:6px;}
.chart-label{font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); font-family:'IBM Plex Mono',monospace;}
.ticker-num{font-family:'IBM Plex Mono',monospace; font-size:25px; font-weight:600; color:var(--ink);}
.ticker-num small{font-size:13px; color:var(--green-dark); font-weight:500; margin-left:6px;}
.chart-svg{width:100%; height:150px; display:block; margin:12px 0 4px;}
.chart-svg path.line{fill:none; stroke:url(#lineGrad); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:600; stroke-dashoffset:600; animation:draw 1.8s ease forwards .3s;}
.chart-svg path.fill{opacity:0; animation:fadeIn 1s ease forwards 1.4s;}
@keyframes draw{to{stroke-dashoffset:0;}}
@keyframes fadeIn{to{opacity:1;}}
.chart-foot{display:flex; justify-content:space-between; font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--ink-soft); border-top:1px dashed var(--border); padding-top:10px;}
.chart-foot span.up{color:var(--green-dark); font-weight:600;}
.wave{display:block; width:100%; line-height:0;}

.page-hero{padding:64px 0 56px; position:relative; overflow:hidden; text-align:center;}
.page-hero::before{content:""; position:absolute; top:-180px; left:50%; transform:translateX(-50%); width:600px; height:400px; background:radial-gradient(ellipse,var(--indigo) 0%, transparent 65%); opacity:.25; filter:blur(10px);}
.breadcrumb{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--ink-soft); margin-bottom:16px; position:relative;}
.breadcrumb a{color:var(--indigo-dark);}
.page-hero h1{font-size:clamp(30px,4.4vw,46px); margin-bottom:16px; position:relative;}
.page-hero p{color:var(--ink-soft); font-size:16.5px; max-width:600px; margin:0 auto; position:relative;}

.marquee-section{padding:30px 0; background:var(--tint-indigo);}
.marquee-title{text-align:center; font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--indigo-dark); margin-bottom:20px; font-weight:600;}
.marquee{overflow:hidden; width:100%; mask-image:linear-gradient(90deg, transparent, black 8%, black 92%, transparent);}
.marquee-track{display:flex; gap:64px; width:max-content; animation:scroll 32s linear infinite;}
.marquee-track img{height:22px; width:auto; opacity:.7;}
.marquee-track img:hover{opacity:1;}
@keyframes scroll{from{transform:translateX(0);} to{transform:translateX(-50%);}}

section{padding:90px 0; position:relative;}
.section-head{max-width:640px; margin-bottom:48px;}
.section-head h2{font-size:clamp(26px,3.2vw,38px);}
.section-head p{color:var(--ink-soft); font-size:16px; margin-top:14px;}
.center{text-align:center; margin-left:auto; margin-right:auto;}
.blob{position:absolute; border-radius:50%; filter:blur(20px); z-index:0; opacity:.5;}

.about{background:var(--tint-green);}
.about .wrap{display:grid; grid-template-columns:1fr .85fr; gap:60px; align-items:center;}
.about p{color:var(--ink-soft); font-size:16px; margin-bottom:16px; max-width:480px;}
.stat-callout{background:linear-gradient(150deg,var(--ink),#241F45); color:var(--white); border-radius:18px; padding:32px; position:relative; overflow:hidden;}
.stat-callout::after{content:""; position:absolute; width:220px; height:220px; border-radius:50%; background:radial-gradient(circle,var(--green),transparent 70%); top:-90px; right:-90px; opacity:.5;}
.stat-callout .big{font-family:'IBM Plex Mono',monospace; font-size:44px; font-weight:600; background:linear-gradient(100deg,var(--green),#7CF2CE); -webkit-background-clip:text; background-clip:text; color:transparent; position:relative;}
.stat-callout .label{font-size:13.5px; color:#C9C6E0; margin-top:6px; margin-bottom:20px; position:relative;}
.stat-callout .note{font-size:12.5px; color:#8D89AE; border-top:1px solid #322C5A; padding-top:16px; position:relative;}

.revenue-banner{background:linear-gradient(120deg,var(--indigo) 0%, var(--green) 50%, var(--indigo-dark) 100%); background-size:220% 220%; animation:gradShift 9s ease infinite; color:var(--white); border-radius:26px; padding:52px 56px; display:flex; align-items:center; justify-content:flex-start; gap:40px; flex-wrap:wrap; position:relative; overflow:hidden; box-shadow:0 30px 60px -22px rgba(91,76,240,.5);}
@keyframes gradShift{0%,100%{background-position:0% 50%;} 50%{background-position:100% 50%;}}
.revenue-banner::before{content:""; position:absolute; width:340px; height:340px; background:radial-gradient(circle,rgba(255,255,255,.28),transparent 70%); top:-120px; right:-70px; border-radius:50%; animation:floaty 6s ease-in-out infinite;}
.revenue-banner::after{content:""; position:absolute; width:200px; height:200px; border:2px dashed rgba(255,255,255,.25); border-radius:50%; bottom:-90px; left:8%; animation:spinSlow 22s linear infinite;}
@keyframes spinSlow{to{transform:rotate(360deg);}}
.revenue-banner h3{font-size:clamp(22px,2.7vw,32px); flex:1 1 340px; margin:0; line-height:1.28; color:var(--white); position:relative; z-index:1; text-wrap:balance;}
.revenue-banner .btn-primary{flex:0 0 auto; white-space:nowrap; background:var(--white); color:var(--indigo-dark); box-shadow:0 10px 24px -6px rgba(0,0,0,0.25); position:relative; z-index:1;}
.revenue-banner .btn-primary:hover{background:var(--ink); color:var(--white); transform:translateY(-3px) scale(1.03);}

.process{background:var(--white);}
.process-track{position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin-top:20px;}
.process-track::before{content:""; position:absolute; top:26px; left:8%; right:8%; height:2px; background:repeating-linear-gradient(90deg,var(--border) 0 8px, transparent 8px 16px); z-index:0;}
.process-step{position:relative; z-index:1; text-align:center;}
.process-step .num-circle{width:52px; height:52px; border-radius:50%; margin:0 auto 18px; display:flex; align-items:center; justify-content:center; font-family:'IBM Plex Mono',monospace; font-weight:600; font-size:16px; color:#fff; background:linear-gradient(140deg,var(--indigo),var(--green)); box-shadow:0 10px 22px -8px rgba(91,76,240,0.5);}
.process-step h3{font-size:16px; margin-bottom:8px;}
.process-step p{font-size:13.5px; color:var(--ink-soft); max-width:220px; margin:0 auto;}

.dash-section{background:linear-gradient(180deg,var(--tint-indigo) 0%, var(--paper) 100%); position:relative; overflow:hidden;}
.dash-section::before{content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(91,76,240,.14) 1.5px, transparent 1.5px); background-size:26px 26px; mask-image:linear-gradient(180deg, black, transparent 75%);}
.dash-section .wrap{display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; align-items:center;}
.browser-frame{background:var(--white); border-radius:16px; box-shadow:0 30px 60px -20px rgba(20,17,39,0.25); overflow:hidden; position:relative;}
.dash-visual::before{content:""; position:absolute; inset:-30px -20px; background:radial-gradient(ellipse at 60% 40%, rgba(91,76,240,.22), transparent 65%); z-index:0; pointer-events:none;}
.dash-visual .browser-frame{z-index:1;}
.dash-visual .float-card.fc-2{top:auto; bottom:-16px; left:-14px; right:auto; animation-delay:1.6s;}
.float-card .fc-val.indigo{color:var(--indigo-dark);}
.browser-bar{display:flex; align-items:center; gap:6px; padding:12px 14px; background:var(--paper); border-bottom:1px solid var(--border);}
.browser-bar span{width:9px; height:9px; border-radius:50%; background:var(--border);}
.browser-bar span:nth-child(1){background:var(--coral);} .browser-bar span:nth-child(2){background:var(--gold);} .browser-bar span:nth-child(3){background:var(--green);}
.browser-body{padding:24px; display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.mini-card{background:var(--paper); border-radius:12px; padding:14px; border:1px solid var(--border);}
.mini-card .lbl{font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.06em;}
.mini-card .val{font-family:'IBM Plex Mono',monospace; font-size:19px; font-weight:600; margin-top:4px;}
.mini-bars{display:flex; align-items:flex-end; gap:5px; height:60px; grid-column:1/-1;}
.mini-bars i{flex:1; border-radius:4px 4px 0 0; background:linear-gradient(180deg,var(--indigo),var(--green)); animation:barGrow 1.2s ease forwards; transform:scaleY(0); transform-origin:bottom;}
@keyframes barGrow{to{transform:scaleY(1);}}
.float-card{position:absolute; background:var(--white); border-radius:12px; padding:12px 16px; box-shadow:0 16px 30px -10px rgba(20,17,39,0.25); font-family:'IBM Plex Mono',monospace; z-index:2; animation:floaty 4s ease-in-out infinite;}
.float-card .fc-lbl{font-size:10px; color:var(--ink-soft); text-transform:uppercase;}
.float-card .fc-val{font-size:16px; font-weight:600; color:var(--green-dark);}
@keyframes floaty{0%,100%{transform:translateY(0);} 50%{transform:translateY(-10px);}}

.formats-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; position:relative; z-index:1;}
.format-card{background:var(--white); border:1px solid var(--border); border-radius:18px; padding:26px; transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; position:relative; overflow:hidden; cursor:pointer;}
.format-card:hover, .format-card.active, .format-card:focus-visible{transform:translateY(-5px); box-shadow:0 20px 38px -14px rgba(20,17,39,0.18); border-color:var(--indigo);}
.format-card.active{border-color:var(--indigo); box-shadow:0 0 0 3px rgba(91,76,240,.18), 0 20px 38px -14px rgba(91,76,240,.22);}
.format-card .badge{margin-bottom:18px;}
.format-card h3{font-size:17px; margin-bottom:8px;}
.format-card p{font-size:14px; color:var(--ink-soft); margin-bottom:12px;}
.format-hint{font-size:12px; font-weight:600; color:var(--indigo-dark); opacity:0; transform:translateY(4px); transition:opacity .2s ease, transform .2s ease;}
.format-card:hover .format-hint, .format-card.active .format-hint, .format-card:focus-visible .format-hint{opacity:1; transform:translateY(0);}
.format-card .tag{position:absolute; top:24px; right:24px; font-family:'IBM Plex Mono',monospace; font-size:10.5px; padding:3px 9px; border-radius:20px; opacity:0; transform:translateY(-4px); transition:all .18s ease; font-weight:600;}
.format-card:hover .tag, .format-card.active .tag{opacity:1; transform:translateY(0);}

/* ---------- FORMAT PREVIEW MODAL ---------- */
.format-modal{position:fixed; inset:0; z-index:500; display:flex; align-items:center; justify-content:center; padding:20px; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .25s ease, visibility .25s ease;}
.format-modal.open{opacity:1; visibility:visible; pointer-events:auto;}
.format-modal-backdrop{position:absolute; inset:0; background:rgba(20,17,39,.55); backdrop-filter:blur(6px);}
.format-modal-dialog{position:relative; z-index:1; background:var(--white); border-radius:24px; width:min(920px, 100%); max-height:min(90vh, 680px); overflow-y:auto; box-shadow:0 40px 80px -20px rgba(20,17,39,.45); transform:scale(.94) translateY(16px); transition:transform .3s cubic-bezier(.22,.61,.36,1);}
.format-modal.open .format-modal-dialog{transform:scale(1) translateY(0);}
.format-modal-close{position:absolute; top:16px; right:16px; z-index:5; width:36px; height:36px; border-radius:50%; border:1px solid var(--border); background:var(--white); color:var(--ink-soft); font-size:16px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .15s ease, color .15s ease, transform .15s ease;}
.format-modal-close:hover{background:var(--ink); color:#fff; transform:rotate(90deg);}
.format-preview-panel{display:none; grid-template-columns:1fr 1.15fr; gap:32px; align-items:center; padding:36px 40px 40px;}
.format-preview-panel.active{display:grid; animation:fpIn .35s cubic-bezier(.22,.61,.36,1);}
@keyframes fpIn{from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:translateY(0);}}
.fp-copy h3{font-size:24px; margin-bottom:10px;}
.fp-copy p{font-size:14.5px; color:var(--ink-soft); line-height:1.65; margin-bottom:18px;}
.fp-stats{list-style:none; display:flex; gap:18px; flex-wrap:wrap;}
.fp-stats li{font-size:12.5px; color:var(--ink-soft); background:var(--paper); border:1px solid var(--border); border-radius:10px; padding:10px 14px;}
.fp-stats strong{display:block; font-family:'IBM Plex Mono',monospace; font-size:17px; color:var(--indigo-dark); font-weight:600; margin-bottom:2px;}
.fp-mock{background:linear-gradient(145deg,var(--paper),var(--tint-indigo)); border:1px solid var(--border); border-radius:18px; padding:24px; min-height:280px; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;}
.fp-mock::before{content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(91,76,240,.12) 1px, transparent 1px); background-size:18px 18px;}

/* Mock browser & scene */
.mock-browser{background:var(--white); border-radius:12px; border:1px solid var(--border); width:100%; overflow:hidden; box-shadow:0 16px 40px -16px rgba(20,17,39,.25); position:relative;}
.mock-browser.wide{max-width:340px;}
.mock-bar{display:flex; align-items:center; gap:5px; padding:9px 12px; background:var(--paper); border-bottom:1px solid var(--border);}
.mock-bar span{width:8px; height:8px; border-radius:50%;}
.mock-bar span:nth-child(1){background:var(--coral);} .mock-bar span:nth-child(2){background:var(--gold);} .mock-bar span:nth-child(3){background:var(--green);}
.mock-bar.dark{background:#1a1730; border-color:#2a2550;}
.mock-url{flex:1; background:var(--white); border-radius:5px; font-size:10px; font-family:'IBM Plex Mono',monospace; color:var(--ink-soft); padding:4px 10px; margin-left:6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.mock-bar.dark .mock-url{background:#2a2550; color:#9a96bc;}
.mock-body{padding:16px; position:relative;}
.mock-line{height:8px; background:var(--border); border-radius:4px; margin-bottom:9px;}
.mock-line.w60{width:60%;} .mock-line.w70{width:70%;} .mock-line.w75{width:75%;} .mock-line.w80{width:80%;} .mock-line.w85{width:85%;} .mock-line.w90{width:90%;}
.mock-line.dim{opacity:.35;}
.mock-img-block{height:52px; background:linear-gradient(120deg,var(--tint-indigo),var(--tint-green)); border-radius:8px; margin-bottom:12px;}
.mock-label{position:absolute; bottom:-10px; left:50%; transform:translateX(-50%); font-size:10px; font-family:'IBM Plex Mono',monospace; font-weight:600; color:var(--ink-soft); background:var(--white); border:1px solid var(--border); padding:3px 10px; border-radius:20px; white-space:nowrap;}
.mock-label.accent{color:var(--indigo-dark); border-color:var(--indigo); background:var(--tint-indigo);}

.mock-scene-pop{position:relative; width:100%; max-width:340px; padding-bottom:28px;}
.mock-scene-pop .mock-browser.front{position:relative; z-index:2;}
.mock-scene-pop .mock-browser.back{position:absolute; bottom:0; right:-12px; width:88%; transform:rotate(3deg) scale(.92); opacity:.95; z-index:1; box-shadow:0 24px 48px -12px rgba(91,76,240,.4);}

.mock-ga-badge{display:inline-flex; align-items:center; gap:7px; font-size:11px; font-weight:700; font-family:'Sora',sans-serif; color:var(--indigo-dark); background:var(--tint-indigo); border:1px solid rgba(91,76,240,.2); padding:5px 12px; border-radius:20px; margin-bottom:12px;}
.mock-ga-badge.light{color:#fff; background:rgba(255,255,255,.15); border-color:rgba(255,255,255,.25);}
.mock-ga-badge.center{display:flex; justify-content:center; margin:0 auto 14px;}
.mock-ga-badge .dot, .mock-notif-icon .dot, .mock-inpage .dot, .mock-sl-step .dot{width:14px; height:14px; border-radius:4px; background:linear-gradient(140deg,var(--indigo),var(--green)); flex-shrink:0;}
.mock-ga-badge .dot.sm, .mock-sl-step .dot.sm{width:10px; height:10px; border-radius:3px; display:inline-block; vertical-align:middle; margin-right:4px;}

.mock-ad-page{text-align:center;}
.mock-ad-creative{background:linear-gradient(135deg,var(--indigo),var(--green)); border-radius:12px; padding:20px 16px; color:#fff; margin-bottom:12px;}
.mock-ad-creative span{display:block; font-size:15px; font-weight:700; margin-bottom:4px;}
.mock-ad-creative small{font-size:10px; opacity:.8;}
.mock-cta{display:inline-block; background:var(--indigo); color:#fff; font-size:11px; font-weight:700; padding:8px 18px; border-radius:8px;}
.mock-cta.light{background:rgba(255,255,255,.2); border:1px solid rgba(255,255,255,.4);}

/* Phone mock */
.mock-phone{width:180px; background:#1a1730; border-radius:28px; padding:10px; box-shadow:0 24px 48px -12px rgba(20,17,39,.45); border:3px solid #2a2550;}
.mock-phone-notch{width:60px; height:6px; background:#2a2550; border-radius:10px; margin:0 auto 8px;}
.mock-phone-screen{background:linear-gradient(180deg,#667eea,#764ba2); border-radius:20px; padding:14px 12px 20px; min-height:260px; position:relative;}
.mock-phone-time{font-size:11px; font-weight:700; color:rgba(255,255,255,.9); margin-bottom:16px;}
.mock-phone-apps{display:flex; gap:10px; justify-content:center; margin-top:20px;}
.mock-phone-apps i{width:32px; height:32px; border-radius:8px; background:rgba(255,255,255,.2);}

.mock-notif{display:flex; gap:10px; background:rgba(255,255,255,.95); border-radius:14px; padding:12px; box-shadow:0 12px 32px -8px rgba(0,0,0,.35); animation:notifSlide .45s cubic-bezier(.22,.61,.36,1);}
@keyframes notifSlide{from{opacity:0; transform:translateY(-20px) scale(.95);} to{opacity:1; transform:translateY(0) scale(1);}}
.mock-notif-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:3px;}
.mock-notif-head span{font-size:10px; color:var(--ink-soft);}
.mock-notif strong{font-size:12px;}
.mock-notif p{font-size:11px; color:var(--ink-soft); margin:0 0 3px; line-height:1.4;}
.mock-notif small{font-size:9px; color:var(--ink-soft); font-family:'IBM Plex Mono',monospace;}

/* Vignette */
.mock-vignette{min-height:200px; background:var(--paper);}
.mock-vignette-overlay{position:absolute; inset:0; background:linear-gradient(160deg,rgba(91,76,240,.88),rgba(0,192,139,.78)); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; border-radius:0 0 10px 10px; padding:20px;}
.mock-vignette-card{background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.3); border-radius:14px; padding:16px; text-align:center; color:#fff; backdrop-filter:blur(4px);}
.mock-vignette-art{width:100%; height:48px; background:rgba(255,255,255,.25); border-radius:8px; margin-bottom:10px;}
.mock-vignette-card strong{display:block; font-size:14px; margin-bottom:4px;}
.mock-vignette-card span{font-size:10px; opacity:.85;}

/* In-page push */
.mock-inpage{display:flex; align-items:center; gap:10px; background:var(--white); border:1px solid var(--border); border-left:4px solid var(--indigo); border-radius:10px; padding:12px 14px; margin:12px 0; box-shadow:0 10px 24px -10px rgba(91,76,240,.3);}
.mock-inpage strong{font-size:12px; display:block;}
.mock-inpage small{font-size:10px; color:var(--ink-soft);}
.mock-inpage button{background:linear-gradient(120deg,var(--indigo),var(--green)); color:#fff; border:none; border-radius:7px; padding:6px 12px; font-size:11px; font-weight:700; cursor:default; flex-shrink:0;}

/* Interstitial */
.mock-interstitial{background:#0f0d1e; border-radius:0 0 10px 10px; min-height:220px; display:flex; align-items:center; justify-content:center; padding:24px 16px;}
.mock-inter-wrap{text-align:center; position:relative; width:100%; color:#fff;}
.mock-inter-creative{height:72px; background:linear-gradient(120deg,var(--indigo),var(--green)); border-radius:12px; margin:12px 0; box-shadow:0 12px 28px -8px rgba(91,76,240,.5);}
.mock-inter-wrap strong{display:block; font-size:14px; margin-bottom:10px;}
.mock-skip{position:absolute; top:-4px; right:0; font-size:10px; color:rgba(255,255,255,.7); font-family:'IBM Plex Mono',monospace; border:1px solid rgba(255,255,255,.35); padding:3px 10px; border-radius:20px;}

/* SmartLink */
.mock-smartlink{width:100%; max-width:280px; display:flex; flex-direction:column; align-items:center; gap:8px; position:relative; z-index:1;}
.mock-sl-step{background:var(--white); border:1px solid var(--border); border-radius:12px; padding:12px 16px; width:100%; text-align:center; font-size:12px; font-weight:600; color:var(--ink-soft); box-shadow:0 6px 16px -8px rgba(20,17,39,.15);}
.mock-sl-step.active{background:linear-gradient(120deg,var(--tint-indigo),var(--tint-green)); border-color:var(--indigo); color:var(--indigo-dark); box-shadow:0 12px 24px -8px rgba(91,76,240,.3);}
.mock-sl-step.success{border-color:var(--green); background:var(--tint-green); color:var(--green-dark);}
.mock-sl-url{font-family:'IBM Plex Mono',monospace; font-size:10px; margin-top:5px; color:var(--ink-soft); font-weight:400;}
.mock-sl-arrow{font-size:16px; color:var(--indigo); font-weight:700; line-height:1;}

body.format-modal-open{overflow:hidden;}
.t-green{color:var(--green-dark); background:var(--tint-green);} .t-indigo{color:var(--indigo-dark); background:var(--tint-indigo);}
.t-gold{color:#B5720A; background:var(--tint-gold);} .t-coral{color:#C74A3A; background:var(--tint-coral);}

.demand{background:linear-gradient(180deg, var(--white) 0%, var(--tint-indigo) 50%, var(--white) 100%); overflow:hidden;}
.demand-head{max-width:640px; margin:0 auto 40px; text-align:center;}
.demand-head h2{font-size:clamp(26px,3.2vw,38px); margin-bottom:14px;}
.demand-head p{color:var(--ink-soft); font-size:16px; line-height:1.65;}

.demand-hub{position:relative; display:flex; flex-direction:column; align-items:center; margin-bottom:36px; padding:28px 0;}
.demand-hub-line{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:min(680px,90%); height:1px; background:linear-gradient(90deg, transparent, var(--indigo), var(--green), transparent); opacity:.35;}
.demand-hub-core{display:flex; flex-direction:column; align-items:center; gap:4px; background:var(--white); border:2px solid var(--indigo); border-radius:18px; padding:18px 32px; box-shadow:0 16px 40px -12px rgba(91,76,240,.35); position:relative; z-index:1;}
.demand-hub-core .hub-dot{width:28px; height:28px; border-radius:8px; background:linear-gradient(140deg,var(--indigo),var(--green)); margin-bottom:4px;}
.demand-hub-core strong{font-family:'Sora',sans-serif; font-size:18px;}
.demand-hub-core small{font-size:12px; color:var(--ink-soft); font-family:'IBM Plex Mono',monospace; letter-spacing:.04em;}
.demand-hub-tags{display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:20px;}
.demand-hub-tags span{font-size:11.5px; font-weight:600; font-family:'IBM Plex Mono',monospace; color:var(--indigo-dark); background:var(--white); border:1px solid var(--border); padding:5px 12px; border-radius:20px; transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease;}
.demand-hub-tags span:hover{transform:translateY(-2px); border-color:var(--indigo); box-shadow:0 6px 16px -6px rgba(91,76,240,.3);}
.demand-hub-tags span:last-child{background:linear-gradient(120deg,var(--indigo),var(--green)); color:#fff; border-color:transparent;}

.partner-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:32px;}
.partner-card{background:var(--white); border:1px solid var(--border); border-radius:16px; padding:20px; display:flex; align-items:center; gap:16px; transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;}
.partner-card:hover{transform:translateY(-4px); box-shadow:0 16px 32px -12px rgba(91,76,240,.28); border-color:var(--indigo);}
.partner-logo{width:56px; height:56px; background:var(--paper); border:1px solid var(--border); border-radius:12px; display:flex; align-items:center; justify-content:center; padding:10px; flex-shrink:0;}
.partner-logo img{max-height:28px; width:auto; max-width:100%;}
.partner-monogram{width:56px; height:56px; border-radius:12px; background:linear-gradient(140deg,var(--indigo),var(--green)); display:flex; align-items:center; justify-content:center; font-family:'Sora',sans-serif; font-size:16px; font-weight:700; color:#fff; flex-shrink:0;}
.partner-info strong{display:block; font-size:14.5px; margin-bottom:3px;}
.partner-info span{font-size:11.5px; font-family:'IBM Plex Mono',monospace; color:var(--ink-soft); letter-spacing:.03em;}

.demand-stats{display:flex; justify-content:center; gap:20px; flex-wrap:wrap;}
.demand-stat{background:var(--white); border:1px solid var(--border); border-radius:14px; padding:18px 28px; text-align:center; min-width:160px; box-shadow:0 8px 20px -10px rgba(20,17,39,.12);}
.demand-stat strong{display:block; font-family:'IBM Plex Mono',monospace; font-size:22px; color:var(--indigo-dark); margin-bottom:4px;}
.demand-stat span{font-size:12.5px; color:var(--ink-soft);}

/* ---------- GOOGLE AD MANAGER SECTION ---------- */
.gam-section{background:var(--ink); color:#fff; position:relative; overflow:hidden;}
.gam-section::before{content:""; position:absolute; top:-160px; right:-120px; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,var(--g-blue),transparent 70%); opacity:.35; filter:blur(4px); animation:floaty 7s ease-in-out infinite;}
.gam-section::after{content:""; position:absolute; bottom:-160px; left:-120px; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,var(--g-green),transparent 70%); opacity:.25; filter:blur(4px); animation:floaty 8s ease-in-out infinite reverse;}
.gam-section .wrap::before{content:""; position:absolute; inset:-90px 0; background-image:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px); background-size:44px 44px; pointer-events:none;}
.gam-badge-row{display:flex; align-items:center; gap:12px; margin-bottom:18px; position:relative;}
.gam-glogo{width:34px; height:34px; animation:spinSlow 14s linear infinite;}
.gam-section .section-head p{color:#B9B6D9;}
.gam-section .eyebrow{border-color:rgba(139,155,255,.35); background:rgba(139,155,255,.1);}
.gam-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; position:relative;}
.gam-card{background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); border-radius:16px; padding:24px; backdrop-filter:blur(6px); transition:transform .18s ease, background .18s ease, border-color .18s ease; position:relative; overflow:hidden;}
.gam-card::before{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--g-blue),var(--g-red),var(--g-yellow),var(--g-green)); transform:scaleX(0); transform-origin:left; transition:transform .35s ease;}
.gam-card:hover{transform:translateY(-4px); background:rgba(255,255,255,0.1); border-color:rgba(255,255,255,.22);}
.gam-card:hover::before{transform:scaleX(1);}
.gam-card h3{font-size:15.5px; margin-bottom:8px; color:#fff;}
.gam-card p{font-size:13px; color:#B9B6D9;}
.gam-card .badge{margin-bottom:16px; width:44px; height:44px;}
.gam-card .badge svg{width:20px; height:20px;}
.gam-strip{display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; margin-top:44px; padding-top:32px; border-top:1px solid rgba(255,255,255,0.12); position:relative;}
.gam-strip .gam-stat{text-align:center;}
.gam-strip .gam-stat .n{font-family:'IBM Plex Mono',monospace; font-size:26px; font-weight:700;}
.gam-strip .gam-stat .l{font-size:11.5px; color:#9A96BC; margin-top:4px;}

.stats-band{background:linear-gradient(120deg,var(--ink) 0%, #241F45 60%, var(--indigo-dark) 130%); color:var(--white);}
.stats-band .wrap{display:grid; grid-template-columns:repeat(3,1fr); gap:30px; text-align:center;}
.stat-item .num{font-family:'IBM Plex Mono',monospace; font-size:clamp(34px,5vw,52px); font-weight:600; background:linear-gradient(100deg,var(--green),var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.stat-item .lbl{font-size:13.5px; color:#C0BDDD; margin-top:8px;}

.pricing-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; align-items:stretch;}
.price-card{background:var(--white); border:1px solid var(--border); border-radius:18px; padding:30px; display:flex; flex-direction:column; transition:transform .18s ease, box-shadow .18s ease; position:relative;}
.price-card:hover{transform:translateY(-5px); box-shadow:0 20px 38px -14px rgba(20,17,39,0.15);}
.price-card.featured{background:linear-gradient(160deg,var(--ink),#241F45); color:#fff; border:none;}
.price-card.featured .price-note{color:#B9B6D9;}
.price-card .plan-name{font-family:'IBM Plex Mono',monospace; font-size:12px; text-transform:uppercase; letter-spacing:.1em; color:var(--indigo-dark); margin-bottom:10px;}
.price-card.featured .plan-name{color:var(--green);}
.price-card .price{font-family:'Sora'; font-size:34px; font-weight:700; margin-bottom:4px;}
.price-card .price-note{font-size:13px; color:var(--ink-soft); margin-bottom:22px;}
.price-card .badge-pop{position:absolute; top:-13px; right:24px; background:var(--gold); color:var(--ink); font-family:'IBM Plex Mono',monospace; font-size:10.5px; font-weight:700; padding:5px 12px; border-radius:20px;}
.price-list{list-style:none; margin-bottom:26px; flex:1;}
.price-list li{font-size:14px; padding:8px 0; display:flex; align-items:flex-start; gap:8px; border-bottom:1px dashed var(--border);}
.price-card.featured .price-list li{border-color:#322C5A;}
.price-list li svg{width:16px; height:16px; stroke:var(--green-dark); flex-shrink:0; margin-top:2px;}
.price-card.featured .price-list li svg{stroke:var(--green);}

.features-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
.feature-item{background:var(--white); border:1px solid var(--border); border-radius:16px; padding:26px; transition:transform .15s ease, box-shadow .15s ease;}
.feature-item:hover{transform:translateY(-4px); box-shadow:0 16px 30px -12px rgba(20,17,39,0.15);}
.feature-item .badge{width:44px; height:44px; border-radius:12px; margin-bottom:16px;}
.feature-item .badge svg{width:20px; height:20px;}
.feature-item h3{font-size:16px; margin-bottom:8px;}
.feature-item p{font-size:13.5px; color:var(--ink-soft);}

/* ---------- CASE STUDIES ---------- */
.case-section{background:var(--tint-indigo);}
.case-list{display:flex; flex-direction:column; gap:32px;}
.case-card{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; background:var(--white); border:1px solid var(--border); border-radius:22px; padding:40px 44px; box-shadow:0 20px 48px -24px rgba(91,76,240,.15); transition:transform .22s ease, box-shadow .22s ease;}
.case-card:hover{transform:translateY(-3px); box-shadow:0 28px 56px -20px rgba(91,76,240,.22);}
.case-card-reverse .case-visual{order:2;}
.case-card-reverse .case-copy{order:1;}

.case-visual{background:var(--paper); border:1px solid var(--border); border-radius:16px; padding:28px;}
.case-visual .cv-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; gap:12px;}
.case-visual .cv-publisher{display:flex; align-items:center; gap:10px;}
.case-visual .cv-avatar{width:36px; height:36px; border-radius:10px; background:linear-gradient(140deg,var(--indigo),#8B7BFF); color:#fff; font-family:'Sora',sans-serif; font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.case-visual .cv-avatar.green{background:linear-gradient(140deg,var(--green),#00E0A2);}
.case-visual .cv-name{font-weight:700; font-size:15px;}
.case-visual .cv-tag{font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--indigo-dark); background:var(--tint-indigo); border:1px solid rgba(91,76,240,.15); padding:4px 11px; border-radius:20px; white-space:nowrap;}
.case-visual .cv-chart-label{font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:12px;}
.case-visual .cv-chart{height:110px; display:flex; align-items:flex-end; gap:8px; padding-top:8px; border-top:1px dashed var(--border);}
.case-visual .cv-chart i{flex:1; border-radius:4px 4px 0 0; transform:scaleY(0); transform-origin:bottom;}
.reveal.visible .cv-chart i{animation:barGrow .9s cubic-bezier(.22,.61,.36,1) forwards;}
.reveal.visible .cv-chart i:nth-child(1){animation-delay:.1s;} .reveal.visible .cv-chart i:nth-child(2){animation-delay:.2s;}
.reveal.visible .cv-chart i:nth-child(3){animation-delay:.3s;} .reveal.visible .cv-chart i:nth-child(4){animation-delay:.4s;}
.reveal.visible .cv-chart i:nth-child(5){animation-delay:.5s;} .reveal.visible .cv-chart i:nth-child(6){animation-delay:.6s;}

.case-copy .eyebrow{margin-bottom:12px;}
.case-copy h3{font-size:clamp(20px,2.2vw,24px); margin-bottom:14px; line-height:1.3;}
.case-copy p{color:var(--ink-soft); font-size:15px; line-height:1.65; margin-bottom:24px;}
.case-stats{display:flex; gap:16px; flex-wrap:wrap;}
.case-stat{padding:0; min-width:0;}
.case-stat .n{font-family:'IBM Plex Mono',monospace; font-size:26px; font-weight:600; color:var(--green-dark); line-height:1;}
.case-stat .l{font-size:12px; color:var(--ink-soft); margin-top:4px;}
.case-note{font-size:12px; color:var(--ink-soft); text-align:center; margin-top:28px; opacity:.85;}

.trust{background:linear-gradient(120deg,var(--gold) 0%, var(--coral) 100%); border-radius:24px; padding:58px; text-align:center; color:var(--ink); position:relative; overflow:hidden;}
.trust::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at 20% 20%, rgba(255,255,255,.35), transparent 45%);}
.trust .eyebrow{color:#7A3B12;}
.trust h2{font-size:clamp(24px,3vw,32px); max-width:640px; margin:0 auto 12px; position:relative;}
.trust p{color:#5B3517; max-width:520px; margin:0 auto 26px; position:relative;}
.trust .btn-primary{background:var(--ink); box-shadow:0 10px 24px -6px rgba(20,17,39,0.4); position:relative;}

/* ---------- INTEGRATIONS ---------- */
.integ-section{background:var(--white);}
.integrations-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.integ-card{background:var(--paper); border:1px solid var(--border); border-radius:16px; padding:24px; text-align:left; transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease; position:relative;}
.integ-card:hover{transform:translateY(-6px); box-shadow:0 20px 36px -16px rgba(91,76,240,.25); border-color:var(--indigo); background:var(--white);}
.integ-card:hover .badge{transform:scale(1.08) rotate(-4deg);}
.integ-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px;}
.integ-card .badge{width:46px; height:46px; margin:0;}
.integ-card .badge svg{width:20px; height:20px;}
.integ-live{font-family:'IBM Plex Mono',monospace; font-size:10.5px; font-weight:600; color:var(--green-dark); letter-spacing:.05em; opacity:0; transform:translateX(-4px); transition:all .25s ease;}
.integ-card:hover .integ-live{opacity:1; transform:translateX(0);}
.integ-card h3{font-size:16.5px; margin-bottom:6px;}
.integ-card p{font-size:13.5px; color:var(--ink-soft); line-height:1.5;}

/* ---------- PAYMENTS ---------- */
.payment-section{background:var(--white); position:relative; overflow:hidden; border-top:1px solid var(--border); border-bottom:1px solid var(--border);}
.payment-section::before{content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(255,178,56,.32) 1.5px, transparent 1.5px); background-size:24px 24px; mask-image:radial-gradient(ellipse at 50% 0%, black, transparent 65%);}
.payment-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; position:relative;}
.pay-card{background:var(--white); border:1px solid var(--border); border-radius:16px; padding:26px 22px; text-align:left; box-shadow:0 12px 26px -16px rgba(20,17,39,.16); transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;}
.pay-card:hover{transform:translateY(-5px); box-shadow:0 20px 36px -16px rgba(255,178,56,.4); border-color:var(--gold);}
.pay-card .badge{width:46px; height:46px; margin-bottom:16px;}
.pay-card .badge svg{width:20px; height:20px;}
.pay-card h3{font-size:16px; margin-bottom:6px;}
.pay-card p{font-size:13.5px; color:var(--ink-soft); line-height:1.5;}
.pay-note{display:flex; justify-content:center; align-items:center; gap:28px; flex-wrap:wrap; margin-top:36px; position:relative;}
.pay-note span{display:flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600; color:var(--ink-soft);}
.pay-note svg{width:16px; height:16px; stroke:var(--green-dark); fill:none; stroke-width:2.4; flex-shrink:0;}

.blog-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.blog-card{background:var(--white); border:1px solid var(--border); border-radius:16px; overflow:hidden; transition:transform .18s ease, box-shadow .18s ease;}
.blog-card:hover{transform:translateY(-5px); box-shadow:0 20px 36px -16px rgba(20,17,39,0.18);}
.blog-thumb{height:150px; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;}
.blog-thumb svg{width:52px; height:52px; opacity:.9;}
.blog-body{padding:20px;}
.blog-tag{font-family:'IBM Plex Mono',monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--indigo-dark); margin-bottom:8px; display:block;}
.blog-body h3{font-size:16.5px; margin-bottom:8px;}
.blog-body p{font-size:13.5px; color:var(--ink-soft); margin-bottom:14px;}
.blog-meta{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--ink-soft); display:flex; justify-content:space-between; border-top:1px dashed var(--border); padding-top:12px;}

.testi-section{background:var(--tint-gold);}
.testi-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:20px;}
.testi-card{background:var(--white); border-radius:18px; padding:28px; position:relative; overflow:hidden;}
.testi-card .quote-mark{position:absolute; top:10px; right:18px; font-family:'Sora'; font-size:64px; font-weight:700; color:var(--tint-gold); line-height:1; z-index:0;}
.stars{font-family:'IBM Plex Mono',monospace; color:var(--gold); letter-spacing:2px; margin-bottom:14px; font-size:15px; position:relative;}
.testi-card p{color:var(--ink); font-size:14.5px; margin-bottom:18px; position:relative;}
.testi-who{display:flex; align-items:center; gap:10px; position:relative;}
.avatar{width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:'Sora'; font-weight:700; font-size:13px; color:#fff;}
.testi-who .name{font-weight:700; font-size:13.5px;}
.testi-who .role{font-size:12px; color:var(--ink-soft);}

/* ---------- FAQ SECTION ---------- */
.faq-section{background:linear-gradient(160deg, var(--tint-green) 0%, var(--paper) 60%, var(--white) 100%);}
.faq-layout{display:grid; grid-template-columns:.85fr 1.15fr; gap:56px; align-items:start;}
.faq-intro h2{font-size:clamp(26px,3vw,36px); margin-bottom:14px;}
.faq-intro > p{color:var(--ink-soft); font-size:16px; line-height:1.65; margin-bottom:28px; max-width:360px;}
.faq-intro .btn{margin-bottom:28px;}
.faq-help{background:var(--white); border:1px solid var(--border); border-radius:14px; padding:16px 20px; max-width:360px; box-shadow:0 8px 20px -10px rgba(20,17,39,.1);}
.faq-help strong{display:block; font-size:14px; margin-bottom:4px;}
.faq-help span{font-size:13.5px; color:var(--ink-soft);}
.faq-help a{color:var(--green-dark); font-weight:600; text-decoration:underline;}

.faq-panel{background:var(--white); border:1px solid var(--border); border-radius:22px; padding:12px; box-shadow:0 24px 48px -20px rgba(0,192,139,.2);}
.faq-item{background:var(--paper); border:1px solid transparent; border-radius:14px; margin-bottom:8px; overflow:hidden; transition:border-color .25s ease, box-shadow .25s ease, background .25s ease;}
.faq-item:last-child{margin-bottom:0;}
.faq-item:hover{background:var(--white); border-color:var(--border);}
.faq-item.open{background:var(--white); border-color:rgba(0,192,139,.35); box-shadow:0 8px 24px -12px rgba(0,192,139,.25);}
.faq-q{display:flex; align-items:center; gap:14px; padding:18px 20px; cursor:pointer; transition:color .2s ease;}
.faq-num{font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:600; color:var(--green-dark); background:var(--tint-green); border-radius:8px; padding:5px 8px; flex-shrink:0; line-height:1;}
.faq-q-text,
.faq-q > span:not(.faq-num){flex:1; font-weight:600; font-size:15.5px; font-family:'Sora',sans-serif; line-height:1.35;}
.faq-item.open .faq-q-text,
.faq-item.open .faq-q > span:not(.faq-num){color:var(--green-dark);}
.faq-q .chev{width:28px; height:28px; stroke:var(--ink-soft); fill:none; stroke-width:2; flex-shrink:0; transition:transform .3s cubic-bezier(.34,1.56,.64,1), background .2s ease, stroke .2s ease; background:var(--white); border:1px solid var(--border); border-radius:50%; padding:6px;}
.faq-item.open .chev{transform:rotate(180deg); background:var(--tint-green); stroke:var(--green-dark); border-color:transparent;}
.faq-a{max-height:0; overflow:hidden; transition:max-height .35s cubic-bezier(.22,.61,.36,1);}
.faq-a p{padding:0 20px 18px; font-size:14.5px; color:var(--ink-soft); line-height:1.65; margin:0;}
.faq-section .faq-a p{padding-left:52px;}
main .faq-list{max-width:760px; margin:0 auto;}
.faq-section .faq-list{max-width:none; margin:0;}
.faq-intro{position:sticky; top:96px;}

.contact-section .wrap{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:flex-start;}
.contact-points{list-style:none; margin-top:20px;}
.contact-points li{display:flex; gap:12px; align-items:flex-start; margin-bottom:16px; font-size:14.5px; color:var(--ink-soft);}
.contact-points li svg{width:20px; height:20px; stroke:var(--green-dark); fill:none; stroke-width:2; flex-shrink:0; margin-top:2px;}
.form-card{background:var(--white); border:1px solid var(--border); border-radius:18px; padding:30px; box-shadow:0 24px 48px -20px rgba(20,17,39,0.12);}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px;}
.field{display:flex; flex-direction:column; gap:6px; margin-bottom:14px;}
.field label{font-size:12.5px; font-weight:600; color:var(--ink-soft);}
.field input, .field select, .field textarea{border:1px solid var(--border); border-radius:9px; padding:12px 14px; font-family:'Manrope'; font-size:14px; background:var(--paper); transition:border-color .15s ease, box-shadow .15s ease;}
.field input:focus, .field select:focus, .field textarea:focus{outline:none; border-color:var(--indigo); box-shadow:0 0 0 3px rgba(91,76,240,0.15); background:var(--white);}
.field textarea{resize:vertical; min-height:90px;}

.sticky-cta{position:fixed; left:0; right:0; bottom:0; z-index:200; background:var(--ink); color:#fff; padding:14px 28px; display:flex; align-items:center; justify-content:space-between; gap:16px; transform:translateY(120%); transition:transform .3s ease; box-shadow:0 -10px 30px rgba(0,0,0,0.15);}
.sticky-cta.show{transform:translateY(0);}
.sticky-cta p{font-size:14px; font-weight:600;}
.sticky-cta .btn-primary{padding:10px 20px; font-size:13.5px;}
.sticky-close{background:none; border:none; color:#9A96BC; font-size:18px; cursor:pointer; margin-left:6px;}

footer{background:linear-gradient(160deg,var(--ink) 0%, #241F45 100%); color:#C7C4DE; padding:64px 0 100px; margin-top:0;}
.footer-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; padding-bottom:40px; border-bottom:1px solid #322C5A;}
footer .logo{color:var(--white);}
footer .tagline{font-size:14px; color:#9A96BC; max-width:280px; margin:16px 0 20px;}
.socials{display:flex; gap:12px;}
.socials a{width:36px; height:36px; border:1px solid #372F63; border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:11.5px; font-family:'IBM Plex Mono',monospace; transition:all .15s ease;}
.socials a:hover{background:linear-gradient(140deg,var(--indigo),var(--green)); border-color:transparent; color:#fff;}
footer h4{font-size:12.5px; text-transform:uppercase; letter-spacing:.1em; color:#8B87AD; margin-bottom:16px; font-family:'IBM Plex Mono',monospace; font-weight:500;}
footer ul li{margin-bottom:10px;}
footer ul a{font-size:14px; color:#C7C4DE; transition:color .15s ease;}
footer ul a:hover{color:var(--green);}
.footer-bottom{padding-top:24px; display:flex; justify-content:space-between; font-size:12.5px; color:#716D96; flex-wrap:wrap; gap:10px;}

@media (max-width:920px){
  .hero .wrap, .about .wrap, .dash-section .wrap, .contact-section .wrap{grid-template-columns:1fr;}
  .partner-grid{grid-template-columns:repeat(2,1fr);}
  .formats-grid, .pricing-grid{grid-template-columns:repeat(2,1fr);}
  .features-grid, .gam-grid{grid-template-columns:repeat(2,1fr);}
  .stats-band .wrap{grid-template-columns:1fr; gap:36px;}
  .testi-grid, .blog-grid{grid-template-columns:1fr 1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .process-track{grid-template-columns:1fr 1fr;}
  .process-track::before{display:none;}
  .integrations-grid{grid-template-columns:repeat(2,1fr);}
  .payment-grid{grid-template-columns:repeat(2,1fr);}
  .case-card{grid-template-columns:1fr; gap:28px; padding:28px 24px;}
  .case-card-reverse .case-visual, .case-card-reverse .case-copy{order:initial;}
  .form-row{grid-template-columns:1fr;}
  .gam-strip{justify-content:center; text-align:center;}
  .revenue-banner{padding:44px 40px; gap:28px;}
  .format-preview-panel{grid-template-columns:1fr; padding:32px 28px 36px;}
  .fp-mock{min-height:220px;}
  .faq-layout{grid-template-columns:1fr; gap:36px;}
  .faq-intro{position:static;}
}
@media (max-width:680px){
  .nav-links{position:fixed; top:70px; left:0; right:0; background:var(--white); flex-direction:column; align-items:flex-start; padding:20px 24px; gap:6px; border-bottom:1px solid var(--border); transform:translateY(-130%); transition:transform .2s ease; z-index:99;}
  .nav-links.open{transform:translateY(0);}
  .nav-links a.top{padding:10px 0; width:100%;}
  .dropdown{position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:none; display:none; padding:0 0 0 12px;}
  .has-dropdown.open .dropdown{display:block;}
  .burger{display:block;}
  .nav-cta{display:none;}
  .formats-grid, .pricing-grid, .features-grid, .testi-grid, .blog-grid, .gam-grid{grid-template-columns:1fr;}
  .partner-grid{grid-template-columns:1fr;}
  .demand-stats{flex-direction:column; align-items:stretch;}
  .case-card{padding:22px 18px; gap:22px;}
  .case-stat{flex:1;}
  .footer-grid{grid-template-columns:1fr; gap:28px;}
  section{padding:64px 0;}
  .trust{padding:40px 26px;}
  .process-track{grid-template-columns:1fr;}
  .integrations-grid{grid-template-columns:1fr;}
  .payment-grid{grid-template-columns:1fr;}
  .pay-note{flex-direction:column; align-items:flex-start; gap:12px;}
  .sticky-cta{flex-direction:column; align-items:flex-start; padding:14px 20px;}
  .revenue-banner{padding:34px 26px; gap:22px; text-align:center;}
  .revenue-banner h3{flex-basis:100%; max-width:100%;}
  .revenue-banner .btn-primary{width:100%; justify-content:center;}
  .format-hint{opacity:1; transform:none;}
  .format-preview-panel{padding:24px 18px 28px; gap:18px;}
  .fp-copy h3{font-size:20px;}
  .format-modal-dialog{border-radius:18px; max-height:92vh;}
  .format-modal-close{top:12px; right:12px;}
  .fp-mock{min-height:200px; padding:16px;}
  .mock-phone{width:160px;}
  .faq-intro > p,.faq-help{max-width:100%;}
  .faq-section .faq-a p{padding-left:20px;}
}