:root{
  --ink:#17151f;
  --ink-deep:#111018;
  --surface:#1d1a26;
  --surface-2:#24202f;
  --paper:#f2efe9;
  --muted:#bbb5c8;
  --dim:#8c859d;
  --line:#3a354a;
  --signal:#f5b841;
  --signal-deep:#dfa12d;
  --lavender:#b9a6d8;
  --ok:#7fd1a0;
  --display:'Bricolage Grotesque',system-ui,sans-serif;
  --body:'Instrument Sans',system-ui,sans-serif;
  --mono:'Space Mono',ui-monospace,monospace;
  --shadow:0 32px 100px rgba(0,0,0,.38);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ink-deep)}
body{margin:0;background:var(--ink);color:var(--paper);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
button,a{touch-action:manipulation}
img{max-width:100%;display:block}
.container{width:min(1160px,calc(100% - 40px));margin-inline:auto}
.eyebrow{font:700 12px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--signal)}
.section{padding:108px 0}
.section-head{max-width:760px;margin-bottom:46px}
.section-head h2{font:800 clamp(36px,5vw,58px)/1.02 var(--display);letter-spacing:-.045em;margin:12px 0 18px}
.section-head p{font-size:19px;color:var(--muted);margin:0;max-width:65ch}

.site-nav{position:sticky;top:0;z-index:50;background:rgba(23,21,31,.78);backdrop-filter:blur(18px);border-bottom:1px solid rgba(58,53,74,.68)}
.nav-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;font:800 23px/1 var(--display);letter-spacing:-.035em}
.brand svg{width:29px;height:29px}.brand b{color:var(--signal)}
.nav-links{display:flex;align-items:center;gap:26px}
.nav-links>a:not(.nav-cta){font-size:14px;text-decoration:none;color:var(--muted)}
.nav-links>a:not(.nav-cta):hover{color:var(--paper)}
.nav-cta,.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 18px;border-radius:12px;text-decoration:none;font-weight:700;border:1px solid transparent;transition:.18s ease}
.nav-cta,.button.primary{background:var(--signal);color:var(--ink)}
.nav-cta:hover,.button.primary:hover{background:var(--signal-deep);transform:translateY(-1px)}
.button.secondary{border-color:var(--line);background:rgba(255,255,255,.025);color:var(--paper)}
.button.secondary:hover{border-color:#5b546f;background:rgba(255,255,255,.055)}

.hero{position:relative;overflow:hidden;padding:92px 0 78px;background:
  radial-gradient(850px 560px at 8% 0%,rgba(91,72,123,.27),transparent 66%),
  radial-gradient(750px 520px at 92% 35%,rgba(245,184,65,.10),transparent 66%),
  var(--ink)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent)}
.hero-grid{display:grid;grid-template-columns:minmax(0,.88fr) minmax(520px,1.12fr);align-items:center;gap:64px}
.hero-copy h1{font:800 clamp(54px,6.8vw,86px)/.94 var(--display);letter-spacing:-.06em;margin:18px 0 24px;max-width:10ch}
.hero-copy h1 span{color:var(--signal)}
.hero-copy>.lede{font-size:20px;line-height:1.62;color:var(--muted);max-width:55ch;margin:0}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.hero-note{display:flex;align-items:center;gap:9px;margin-top:20px;color:var(--dim);font-size:13px}
.hero-note i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 5px rgba(127,209,160,.08)}
.hero-proof{position:relative}
.hero-proof::before{content:"";position:absolute;inset:8% -6% -8% 12%;border-radius:50%;background:rgba(185,166,216,.13);filter:blur(70px)}
.browser{position:relative;border:1px solid #484157;border-radius:20px;background:#111018;box-shadow:var(--shadow);overflow:hidden;transform:perspective(1300px) rotateY(-2deg) rotateX(1deg)}
.browser-top{height:42px;display:flex;align-items:center;gap:8px;padding:0 15px;border-bottom:1px solid #302c3c;background:#18151f}
.browser-top i{width:9px;height:9px;border-radius:50%;background:#4c465b}.browser-top i:first-child{background:#f08c8c}.browser-top i:nth-child(2){background:#f5b841}.browser-top i:nth-child(3){background:#7fd1a0}
.browser-url{margin-left:9px;height:22px;flex:1;border-radius:7px;background:#211d2a;color:#898298;font:400 9px/22px var(--mono);padding:0 10px}
.browser-shot{height:570px;overflow:hidden;background:#15131c}
.browser-shot img{width:100%;height:auto;min-height:100%;object-fit:cover;object-position:top left}
.floating-signal{position:absolute;right:-24px;bottom:34px;width:min(270px,55%);padding:15px 16px;border:1px solid rgba(245,184,65,.4);border-radius:14px;background:rgba(29,26,38,.94);box-shadow:0 20px 60px rgba(0,0,0,.38);backdrop-filter:blur(14px)}
.floating-signal strong{display:flex;justify-content:space-between;gap:10px;font:700 11px/1.4 var(--mono);color:var(--signal)}
.floating-signal p{margin:8px 0 0;font-size:13px;line-height:1.5;color:var(--muted)}

.problem{background:var(--ink-deep)}
.problem-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pain-card{padding:26px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,#1c1924,#17151f)}
.pain-num{font:700 11px/1 var(--mono);color:var(--signal);letter-spacing:.12em}
.pain-card h3{font:700 24px/1.15 var(--display);letter-spacing:-.025em;margin:20px 0 10px}
.pain-card p{margin:0;color:var(--muted);font-size:16px}
.problem-callout{margin-top:28px;padding:30px 34px;border-radius:20px;border:1px solid rgba(245,184,65,.32);background:rgba(245,184,65,.06);font:600 clamp(24px,3.2vw,38px)/1.28 var(--display);letter-spacing:-.025em}
.problem-callout span{color:var(--signal)}

.workflow{background:var(--ink)}
.flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;counter-reset:flow}
.flow-card{position:relative;padding:25px 22px;min-height:240px;border:1px solid var(--line);border-radius:18px;background:var(--surface);counter-increment:flow}
.flow-card::before{content:"0" counter(flow);display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#2c2738;color:var(--signal);font:700 11px var(--mono)}
.flow-card:not(:last-child)::after{content:"→";position:absolute;right:-17px;top:38px;z-index:2;color:var(--signal);font:700 22px var(--mono)}
.flow-card h3{font:700 22px/1.15 var(--display);margin:28px 0 10px;letter-spacing:-.025em}
.flow-card p{margin:0;color:var(--muted);font-size:15.5px}

.scoring{background:linear-gradient(180deg,var(--ink-deep),#15131c)}
.score-layout{display:grid;grid-template-columns:.86fr 1.14fr;gap:60px;align-items:center}
.score-stack{display:grid;gap:12px}
.score-row{display:grid;grid-template-columns:72px 1fr auto;align-items:center;gap:16px;padding:17px 18px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.score-chip{border-radius:10px;background:var(--signal);color:var(--ink);font:700 13px/36px var(--mono);text-align:center}.score-row:nth-child(2) .score-chip{background:var(--lavender)}.score-row:nth-child(3) .score-chip{background:#5e5a70;color:var(--paper)}
.score-row strong{display:block;font-size:16px}.score-row span{display:block;font-size:13px;color:var(--muted);margin-top:2px}.score-row em{font:700 10px var(--mono);color:var(--dim);font-style:normal}
.score-copy h2{font:800 clamp(38px,5vw,62px)/1.02 var(--display);letter-spacing:-.048em;margin:12px 0 20px}
.score-copy p{font-size:18px;color:var(--muted);margin:0 0 18px}
.score-list{display:grid;gap:10px;margin-top:25px}
.score-list div{display:flex;align-items:flex-start;gap:12px;color:#d9d4df}
.score-list i{width:22px;height:22px;flex:none;border-radius:50%;display:grid;place-items:center;background:rgba(127,209,160,.1);color:var(--ok);font:700 12px var(--mono);font-style:normal;margin-top:2px}

.control{background:var(--ink)}
.control-card{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;padding:48px;border:1px solid var(--line);border-radius:24px;background:
 radial-gradient(500px 280px at 100% 0%,rgba(245,184,65,.12),transparent 70%),var(--surface)}
.control-card h2{font:800 clamp(38px,5vw,60px)/1.02 var(--display);letter-spacing:-.045em;margin:12px 0 18px}.control-card p{margin:0;color:var(--muted);font-size:18px}
.reply-demo{padding:22px;border:1px solid #494258;border-radius:17px;background:#15131c}
.reply-label{font:700 10px var(--mono);letter-spacing:.13em;color:var(--signal)}
.reply-post{margin:12px 0 18px;padding-left:12px;border-left:2px solid var(--signal);color:var(--muted);font-size:14px}
.reply-draft{padding:16px;border:1px solid var(--line);border-radius:12px;color:#e3dfe7;background:#1b1823;font-size:15px;line-height:1.62}
.reply-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:13px}.reply-actions span{min-height:42px;border-radius:10px;display:grid;place-items:center;font-weight:700;font-size:13px;background:#2a2534}.reply-actions span:last-child{background:var(--signal);color:var(--ink)}

.final-cta{padding:104px 0;background:var(--ink-deep)}
.cta-panel{text-align:center;padding:74px 30px;border:1px solid rgba(245,184,65,.35);border-radius:26px;background:
 radial-gradient(600px 300px at 50% 0%,rgba(245,184,65,.13),transparent 70%),var(--surface)}
.cta-panel h2{font:800 clamp(42px,6vw,72px)/.98 var(--display);letter-spacing:-.055em;margin:14px auto 20px;max-width:14ch}.cta-panel p{margin:0 auto;color:var(--muted);font-size:19px;max-width:58ch}.cta-panel .hero-actions{justify-content:center}
.site-footer{padding:34px 0;border-top:1px solid var(--line);background:#111018;color:var(--dim);font-size:13px}.footer-inner{display:flex;justify-content:space-between;gap:25px;align-items:center}.footer-inner a{text-decoration:none;color:var(--muted)}

@media(max-width:1040px){
  .hero-grid{grid-template-columns:1fr;gap:54px}.hero-copy{text-align:center}.hero-copy h1,.hero-copy>.lede{margin-left:auto;margin-right:auto}.hero-actions,.hero-note{justify-content:center}.hero-proof{max-width:820px;margin-inline:auto}.browser{transform:none}.problem-grid{grid-template-columns:1fr}.flow{grid-template-columns:1fr 1fr}.flow-card:not(:last-child)::after{display:none}.score-layout,.control-card{grid-template-columns:1fr}.score-copy{order:-1}
}
@media(max-width:720px){
  body{font-size:16px}.container{width:min(100% - 28px,1160px)}.section{padding:80px 0}.nav-links>a:not(.nav-cta){display:none}.nav-inner{min-height:68px}.nav-cta{min-height:44px;padding:0 14px}.hero{padding:66px 0 58px}.hero-grid{gap:38px}.hero-copy h1{font-size:50px}.hero-copy>.lede{font-size:18px}.hero-actions{display:grid}.button{width:100%}.browser-shot{height:390px}.floating-signal{right:10px;bottom:18px}.flow{grid-template-columns:1fr}.flow-card{min-height:auto}.score-row{grid-template-columns:60px 1fr}.score-row em{display:none}.control-card{padding:28px 20px}.reply-actions{grid-template-columns:1fr}.cta-panel{padding:55px 18px}.footer-inner{align-items:flex-start;flex-direction:column}.section-head p{font-size:17px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}