*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#ffffff;--soft:#f6f7fb;--ink:#0f1222;--muted:#5b607f;--line:#e9ecf5;
  --brand:#5b5bf0;--brand-2:#8f6bff;--good:#12b76a;--radius:18px;
  --shadow:0 12px 40px rgba(20,22,60,.10);--shadow-lg:0 30px 80px rgba(30,20,90,.18);
}
html{scroll-behavior:smooth}
body{font-family:Inter,system-ui,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.5}
a{text-decoration:none;color:inherit}
.lp-wrap{max-width:1160px;margin:0 auto;padding:0 24px}
.grad{background:linear-gradient(120deg,var(--brand),var(--brand-2));-webkit-background-clip:text;background-clip:text;color:transparent}

/* buttons */
.lp-btn{display:inline-flex;align-items:center;gap:6px;padding:11px 20px;border-radius:12px;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;font-weight:700;font-size:14px;transition:.15s;border:1px solid transparent}
.lp-btn:hover{transform:translateY(-1px);box-shadow:var(--shadow)}
.lp-btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}
.lp-btn.ghost:hover{border-color:var(--brand)}
.lp-btn.big{padding:15px 28px;font-size:16px}
.lp-btn.light{background:#fff;color:var(--brand)}
.lp-btn.full{width:100%;justify-content:center}

/* nav */
.lp-nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav-inner{display:flex;align-items:center;gap:20px;height:68px}
.lp-brand{display:flex;align-items:center;gap:10px}
.lp-mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;display:grid;place-items:center;font-weight:900;font-size:18px}
.lp-brand-name{font-weight:800;font-size:17px}
.nav-links{display:flex;gap:26px;margin-left:24px;flex:1}
.nav-links a{font-weight:600;font-size:14px;color:var(--muted)}
.nav-links a:hover{color:var(--ink)}
.nav-cta{display:flex;gap:10px}

/* hero */
.hero{padding:80px 0 40px;background:radial-gradient(1200px 500px at 50% -10%,rgba(143,107,255,.14),transparent);text-align:center}
.hero-inner{display:flex;flex-direction:column;align-items:center}
.hero-badge{display:inline-block;background:var(--soft);border:1px solid var(--line);color:var(--brand);font-weight:700;font-size:13px;padding:7px 15px;border-radius:30px;margin-bottom:24px}
.hero h1{font-size:56px;line-height:1.08;font-weight:900;letter-spacing:-1.5px;margin-bottom:20px}
.hero-sub{max-width:640px;font-size:18px;color:var(--muted);margin-bottom:30px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.hero-trust{margin-top:22px;font-size:13px;color:var(--muted);font-weight:600}

/* hero product shot */
.hero-shot{margin-top:56px;width:100%;max-width:960px;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-lg);overflow:hidden;text-align:left}
.shot-bar{display:flex;gap:7px;padding:14px 16px;background:var(--soft);border-bottom:1px solid var(--line)}
.shot-bar span{width:11px;height:11px;border-radius:50%;background:#d5d9ea}
.shot-body{display:grid;grid-template-columns:200px 1fr}
.shot-side{background:var(--soft);border-right:1px solid var(--line);padding:18px 14px}
.s-mark{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;display:grid;place-items:center;font-weight:900;margin-bottom:18px}
.s-nav{display:flex;flex-direction:column;gap:4px}
.s-nav span{padding:8px 10px;border-radius:9px;font-size:13px;font-weight:600;color:var(--muted)}
.s-nav span.on{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff}
.shot-main{padding:20px}
.s-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
.s-kpi{background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:12px}
.s-kpi small{color:var(--muted);font-size:11px;font-weight:600}
.s-kpi b{display:block;font-size:20px;font-weight:800;margin:5px 0 2px}
.s-kpi em{font-style:normal;font-size:11px;font-weight:700}
.s-kpi em.up{color:var(--good)}
.s-ai{background:linear-gradient(135deg,rgba(91,91,240,.09),rgba(143,107,255,.09));border:1px solid rgba(91,91,240,.22);border-radius:12px;padding:12px 14px;font-size:13px;margin-bottom:14px}
.s-kan{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.s-col{background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:11px}
.s-col h5{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:9px}
.s-card{background:#fff;border:1px solid var(--line);border-radius:9px;padding:9px 10px;font-size:12px;font-weight:600;margin-bottom:7px}

/* strip */
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--soft)}
.strip-inner{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:34px 24px;text-align:center}
.strip-inner b{display:block;font-size:30px;font-weight:900;background:linear-gradient(120deg,var(--brand),var(--brand-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.strip-inner span{font-size:13px;color:var(--muted);font-weight:600}

/* sections */
.section{padding:88px 0}
.sec-head{text-align:center;max-width:660px;margin:0 auto 48px}
.eyebrow{color:var(--brand);font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}
.eyebrow.light{color:#c9c2ff}
.sec-head h2{font-size:38px;font-weight:900;letter-spacing:-1px;margin-bottom:14px}
.sec-head p{color:var(--muted);font-size:17px}

.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.feat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;transition:.15s}
.feat:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:transparent}
.f-ic{font-size:28px;display:block;margin-bottom:14px}
.feat h3{font-size:18px;font-weight:800;margin-bottom:8px}
.feat p{color:var(--muted);font-size:14px}

/* barter */
.barter{background:linear-gradient(150deg,#171a33,#0b0d1a);color:#fff;border-radius:0}
.barter-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.barter-copy h2{font-size:38px;font-weight:900;letter-spacing:-1px;margin-bottom:16px}
.barter-copy p{color:#b6bce0;font-size:17px;margin-bottom:22px}
.lifecycle{list-style:none;display:flex;flex-direction:column;gap:11px;margin-bottom:26px}
.lifecycle li{padding-left:28px;position:relative;font-weight:600;font-size:15px}
.lifecycle li:before{content:"✓";position:absolute;left:0;color:var(--good);font-weight:900}
.barter-flow{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:26px}
.flow-step{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:14px 16px;font-weight:700;font-size:15px;display:flex;align-items:center;gap:12px}
.flow-step span{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand-2));display:grid;place-items:center;font-size:13px;flex-shrink:0}
.flow-step.done{background:rgba(18,183,106,.15);border-color:rgba(18,183,106,.4)}
.flow-step.done span{background:var(--good)}
.flow-arrow{text-align:center;color:#6b7099;font-size:18px;margin:6px 0}

/* roles */
.role-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.role-card{background:var(--soft);border:1px solid var(--line);border-radius:var(--radius);padding:24px;text-align:center;transition:.15s}
.role-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);background:#fff}
.r-ic{font-size:32px;display:block;margin-bottom:12px}
.role-card h3{font-size:16px;font-weight:800;margin-bottom:6px}
.role-card p{color:var(--muted);font-size:13px}

/* pricing */
.pricing{background:var(--soft)}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.price-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px;position:relative;display:flex;flex-direction:column}
.price-card.featured{border-color:var(--brand);box-shadow:var(--shadow-lg);transform:scale(1.03)}
.p-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;font-size:12px;font-weight:700;padding:5px 14px;border-radius:20px}
.price-card h3{font-size:18px;font-weight:800;margin-bottom:10px}
.price{font-size:40px;font-weight:900;letter-spacing:-1px}
.price span{font-size:15px;font-weight:600;color:var(--muted)}
.p-sub{color:var(--muted);font-size:14px;margin:8px 0 20px}
.price-card ul{list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:24px;flex:1}
.price-card li{font-size:14px;font-weight:500}

/* lead capture */
.leadgen{background:var(--soft)}
.lead-wrap{max-width:560px;margin:0 auto}
.lead-form{display:flex;flex-direction:column;gap:14px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.lead-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lead-form input,.lead-form select{padding:13px 14px;border-radius:11px;border:1px solid var(--line);background:var(--soft);font-family:inherit;font-size:15px;font-weight:500;color:var(--ink)}
.lead-form input:focus,.lead-form select:focus{outline:none;border-color:var(--brand)}
.lead-msg{font-size:14px;font-weight:600;min-height:2px}
.lead-msg.ok{color:var(--good)}
.lead-msg.err{color:#f04438}
.lead-or{text-align:center;position:relative;margin:20px 0}
.lead-or:before{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background:var(--line)}
.lead-or span{position:relative;background:var(--soft);padding:0 14px;color:var(--muted);font-size:13px;font-weight:600}
.wa-btn{background:linear-gradient(135deg,#25D366,#128C7E)!important}
.wa-btn .wa-ic{font-size:18px}
.lead-fine{text-align:center;color:var(--muted);font-size:12px;margin-top:14px}
@media(max-width:600px){.lead-row{grid-template-columns:1fr}}

/* cta band */
.cta-band{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;text-align:center}
.cta-inner{padding:80px 24px}
.cta-band h2{font-size:38px;font-weight:900;letter-spacing:-1px;margin-bottom:12px}
.cta-band p{font-size:18px;opacity:.92;margin-bottom:28px}

/* footer */
.lp-foot{background:#0b0d1a;color:#fff;padding:48px 0 0}
.foot-inner{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding-bottom:32px}
.foot-brand{display:flex;align-items:center;gap:12px}
.foot-brand small{display:block;color:#8b90b8;font-size:12px}
.foot-links{display:flex;gap:16px 24px;flex-wrap:wrap}
.foot-links a{color:#b6bce0;font-weight:600;font-size:14px}
.foot-links a:hover{color:#fff}
.foot-bottom{border-top:1px solid #242848;padding:20px 24px;text-align:center;color:#6b7099;font-size:13px}

/* hero video */
.hero-video{margin-top:52px;width:100%;max-width:900px}
.video-frame{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-lg);background:#0b0d1a;cursor:pointer;transition:.18s}
.video-frame:hover{transform:translateY(-3px)}
.video-poster{position:relative}
.poster-body{aspect-ratio:16/9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:radial-gradient(600px 300px at 50% 40%,rgba(143,107,255,.28),rgba(11,13,26,.96))}
.play-btn{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;display:grid;place-items:center;font-size:22px;padding-left:5px;box-shadow:0 10px 40px rgba(91,91,240,.5);transition:.18s}
.video-frame:hover .play-btn{transform:scale(1.08)}
.play-btn.big-play{width:82px;height:82px;font-size:28px}
.poster-cap{color:#dfe2f5;font-weight:700;font-size:15px}
.video-frame.small .poster-body{gap:12px}
.video-frame.small .play-btn{width:52px;height:52px;font-size:18px}
.video-frame.big{max-width:920px;margin:0 auto}

/* audience switcher */
.aud-tabs{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:40px}
.aud-tabs button{padding:12px 22px;border-radius:30px;border:1px solid var(--line);background:#fff;font-family:inherit;font-weight:700;font-size:15px;color:var(--muted);cursor:pointer;transition:.15s}
.aud-tabs button:hover{border-color:var(--brand);color:var(--ink)}
.aud-tabs button.act{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;border-color:transparent;box-shadow:var(--shadow)}
.aud-panel{display:none;grid-template-columns:1fr 1fr;gap:48px;align-items:center;animation:fade .25s ease}
.aud-panel.act{display:grid}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.aud-copy h3{font-size:30px;font-weight:900;letter-spacing:-.8px;margin:8px 0 14px;line-height:1.15}
.aud-copy p{color:var(--muted);font-size:16px;margin-bottom:20px}
.aud-list{list-style:none;display:flex;flex-direction:column;gap:11px;margin-bottom:26px}
.aud-list li{font-weight:600;font-size:15px}
.aud-media .video-frame{max-width:100%}

/* big demo section */
.demo-sec{background:linear-gradient(150deg,#171a33,#0b0d1a)}
.demo-frame{max-width:920px;margin:0 auto}
.demo-chips{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.demo-chips span{padding:10px 18px;border-radius:30px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#dfe2f5;font-weight:600;font-size:14px;cursor:pointer;transition:.15s}
.demo-chips span:hover{background:rgba(91,91,240,.25);border-color:var(--brand)}

/* video lightbox */
.vid-overlay{position:fixed;inset:0;background:rgba(8,9,20,.86);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;z-index:200;padding:24px}
.vid-overlay.open{display:flex}
.vid-box{position:relative;width:100%;max-width:960px}
.vid-embed{aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#000;box-shadow:var(--shadow-lg)}
.vid-embed iframe{display:block;border:0}
.vid-close{position:absolute;top:-46px;right:0;width:38px;height:38px;border-radius:50%;border:none;background:#fff;color:var(--ink);font-size:16px;cursor:pointer;font-weight:700}

/* responsive */
@media(max-width:900px){
  .aud-panel.act{grid-template-columns:1fr;gap:28px}
  .aud-copy h3{font-size:24px}
  .nav-links{display:none}
  .hero h1{font-size:38px}
  .hero-sub{font-size:16px}
  .shot-side{display:none}
  .s-kpis{grid-template-columns:repeat(2,1fr)}
  .feat-grid,.role-grid,.price-grid,.strip-inner{grid-template-columns:1fr}
  .barter-inner{grid-template-columns:1fr;gap:32px}
  .price-card.featured{transform:none}
  .sec-head h2,.barter-copy h2,.cta-band h2{font-size:28px}
}
/* Cookie / consent banner (shared with the app) */
.consent-bar{position:fixed;left:0;right:0;bottom:0;z-index:400;background:#fff;border-top:1px solid var(--line);box-shadow:0 -8px 30px rgba(20,20,60,.10)}
.consent-inner{max-width:1080px;margin:0 auto;padding:14px 18px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:space-between}
.consent-txt{display:flex;flex-direction:column;gap:2px;font-size:13px;max-width:640px}
.consent-txt b{font-size:14px;color:var(--ink)}
.consent-txt span{color:var(--muted)}
.consent-txt a{color:var(--brand);font-weight:600;text-decoration:none}
.consent-btns{display:flex;gap:10px;flex-wrap:wrap}
.consent-btn{padding:10px 16px;border-radius:11px;border:none;background:var(--brand);color:#fff;font-weight:700;font-size:13px;cursor:pointer;font-family:inherit}
.consent-btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
@media(max-width:600px){.consent-btns{width:100%}.consent-btn{flex:1}}

/* Geek logo in place of the old "G" mark */
.lp-mark{background:url(/assets/geek-icon-192.png) center/contain no-repeat;color:transparent;font-size:0;box-shadow:none;border-radius:0}
