:root { --bg:#060b10; --panel:#0b1519; --panel2:#0d1b1a; --ink:#edf7f3; --muted:#91aaa2; --line:rgba(139,188,173,.18); --teal:#65ddb7; --copper:#e5ad70; --warn:#f0c363; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; color:var(--ink); background:radial-gradient(circle at 12% 18%,rgba(50,136,116,.14),transparent 30%),radial-gradient(circle at 88% 8%,rgba(229,173,112,.1),transparent 25%),var(--bg); font-family:"Bahnschrift","Trebuchet MS",sans-serif; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.22; background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px); background-size:34px 34px; mask-image:linear-gradient(to bottom,#000,transparent 78%); }
.shell { position:relative; width:min(1180px,calc(100% - 32px)); margin:auto; padding:22px 0 28px; }
.nav-card { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:13px 15px 13px 18px; border:1px solid var(--line); border-radius:10px; background:rgba(8,16,20,.9); box-shadow:0 18px 55px rgba(0,0,0,.25); backdrop-filter:blur(18px); }
.brand { display:flex; align-items:center; gap:12px; color:inherit; text-decoration:none; }
.brand img { width:43px; height:43px; }
.brand span { display:grid; gap:2px; }
.brand small,.eyebrow { color:var(--teal); font:700 .67rem "Cascadia Mono",monospace; letter-spacing:.17em; }
.brand strong { font-size:1.1rem; letter-spacing:.02em; }
nav { display:flex; align-items:center; gap:5px; }
nav a { padding:10px 13px; color:var(--muted); text-decoration:none; font-size:.84rem; border:1px solid transparent; border-radius:6px; }
nav a:hover { color:var(--ink); background:rgba(255,255,255,.03); }
nav .nav-cta { color:#07120f; background:var(--teal); }
.hero { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(360px,.72fr); gap:55px; align-items:center; min-height:620px; padding:82px 42px; }
.eyebrow { margin:0 0 17px; }
h1,h2,h3,p { margin-top:0; }
h1 { max-width:760px; margin-bottom:22px; font-size:clamp(3rem,7vw,6.4rem); line-height:.92; letter-spacing:-.055em; }
.lede { max-width:680px; color:var(--muted); font-size:1.08rem; line-height:1.7; }
.actions { display:flex; flex-wrap:wrap; gap:10px; margin:30px 0 20px; }
.button { display:inline-flex; min-height:46px; align-items:center; justify-content:center; padding:0 19px; border:1px solid var(--line); border-radius:6px; color:var(--ink); text-decoration:none; font-weight:700; }
.button.primary { color:#06120e; border-color:var(--teal); background:var(--teal); }
.button.secondary { background:rgba(255,255,255,.025); }
.safety-line { display:flex; align-items:center; gap:9px; color:var(--muted); font-size:.78rem; }
.safety-line span { width:8px; height:8px; border-radius:50%; background:var(--teal); box-shadow:0 0 16px var(--teal); }
.signal-board { padding:22px; border:1px solid var(--line); border-radius:10px; background:linear-gradient(145deg,rgba(14,30,28,.96),rgba(8,15,21,.98)); box-shadow:0 28px 80px rgba(0,0,0,.32); transform:rotate(1.2deg); }
.board-head { display:flex; align-items:center; justify-content:space-between; padding-bottom:15px; border-bottom:1px solid var(--line); color:var(--muted); font:700 .67rem "Cascadia Mono",monospace; letter-spacing:.13em; }
.board-head i { width:9px; height:9px; border-radius:50%; background:var(--warn); box-shadow:0 0 14px var(--warn); }
.score-ring { display:grid; place-items:center; align-content:center; width:150px; height:150px; margin:32px auto; border:1px solid rgba(240,195,99,.38); border-radius:50%; box-shadow:inset 0 0 45px rgba(240,195,99,.06); }
.score-ring strong { color:var(--warn); font-size:3rem; line-height:1; }
.score-ring small { margin-top:5px; color:var(--muted); font:700 .58rem "Cascadia Mono",monospace; letter-spacing:.12em; }
.signal-row { display:flex; justify-content:space-between; gap:15px; padding:12px 3px; color:var(--muted); border-bottom:1px solid var(--line); }
.signal-row b { color:var(--copper); }
.recommendation { display:grid; gap:5px; margin-top:17px; padding:14px; border-left:3px solid var(--teal); background:rgba(101,221,183,.05); }
.recommendation small { color:var(--muted); letter-spacing:.11em; }
.section-grid { display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:10px; padding:20px 0 90px; }
.feature { min-height:245px; padding:25px; border:1px solid var(--line); border-radius:8px; background:rgba(9,18,22,.72); }
.feature > span { display:block; margin-bottom:60px; color:var(--copper); font:700 .72rem "Cascadia Mono",monospace; }
.feature h2 { font-size:2.3rem; letter-spacing:-.035em; }
.feature h3 { font-size:1.25rem; }
.feature p { color:var(--muted); line-height:1.55; }
.lead-card { background:linear-gradient(145deg,rgba(21,50,43,.8),rgba(9,18,22,.84)); }
.signal-section { display:grid; grid-template-columns:.9fr 1.1fr; gap:40px; padding:65px 42px; border:1px solid var(--line); border-radius:10px; background:rgba(9,18,22,.75); }
.signal-section h2 { max-width:540px; font-size:clamp(2rem,4vw,3.7rem); line-height:1; letter-spacing:-.04em; }
.signal-list { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.signal-list span { padding:16px; color:var(--muted); border:1px solid var(--line); border-radius:6px; background:rgba(255,255,255,.018); }
footer { display:flex; justify-content:space-between; gap:20px; padding:30px 4px 2px; color:var(--muted); font-size:.78rem; }
footer span { color:var(--ink); font-weight:700; }
footer p { margin:0; }
@media (max-width:900px) { .hero { grid-template-columns:1fr; padding:70px 18px; } .signal-board { max-width:560px; transform:none; } .section-grid { grid-template-columns:1fr 1fr; } .lead-card { grid-column:1/-1; } .signal-section { grid-template-columns:1fr; padding:40px 25px; } }
@media (max-width:620px) { .shell { width:min(100% - 20px,1180px); padding-top:10px; } .nav-card { align-items:flex-start; } nav a:not(.nav-cta) { display:none; } .hero { min-height:0; gap:35px; padding:65px 8px 55px; } h1 { font-size:clamp(2.8rem,15vw,4.5rem); } .section-grid { grid-template-columns:1fr; } .lead-card { grid-column:auto; } .feature { min-height:0; } .feature > span { margin-bottom:35px; } .signal-list { grid-template-columns:1fr; } footer { flex-direction:column; } }
