/* ===== fonts (self-hosted, latin + latin-ext for Serbian diacritics) ===== */
@font-face{font-family:'Bebas Neue';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/bebas-latinext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F;}
@font-face{font-family:'Bebas Neue';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/bebas-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+2122;}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('../fonts/plexsans-latinext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F;}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('../fonts/plexsans-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+2122;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/plexmono-latinext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/plexmono-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+2122;}

/* ===== tokens ===== */
:root{
  --void:#0a0714;
  --void-2:#150f24;
  --void-3:#1e1633;
  --line: rgba(255,255,255,0.09);
  --cold:#4a2a6e;
  --mid:#d61f5c;
  --hot:#ff5a1f;
  --peak:#ffc93c;
  --ink:#f1ecfa;
  --ink-dim: #a99fc2;
  --paper:#f1eef7;
  --paper-2:#e7e1f2;
  --paper-line: rgba(20,12,34,0.12);
  --ink-on-paper:#140c22;
  --ink-on-paper-dim:#5c5270;
}
:root[data-theme="light"]{ color-scheme: light; }
:root[data-theme="dark"]{ color-scheme: dark; }

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background: var(--void);
  color: var(--ink);
  font-family: 'IBM Plex Sans', -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
:root[data-theme="light"] body{ background: var(--paper); color: var(--ink-on-paper); }
a{ color:inherit; }
img{ max-width:100%; display:block; }

.wrap{ max-width: 1180px; margin: 0 auto; padding: 0 32px; }

/* ---------- grain overlay ---------- */
.grain{
  position: fixed; inset:0; pointer-events:none; z-index: 40;
  opacity: 0.05; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* ---------- nav ---------- */
header.nav{
  position: sticky; top:0; z-index:30;
  background: color-mix(in srgb, var(--void) 82%, transparent);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
:root[data-theme="light"] header.nav{ background: color-mix(in srgb, var(--paper) 86%, transparent); border-bottom-color: var(--paper-line); }
.nav-inner{ display:flex; align-items:center; justify-content:space-between; padding: 18px 32px; }
.logo{ font-family:'Bebas Neue'; font-size: 26px; letter-spacing: 0.04em; display:flex; align-items:center; gap:9px; text-decoration:none; }
.logo-mark{ width:22px; height:22px; flex-shrink:0; filter: drop-shadow(0 0 6px rgba(255,90,31,0.5)); }
.nav-links{ display:flex; align-items:center; gap: 30px; font-size: 14px; color: var(--ink-dim); }
:root[data-theme="light"] .nav-links{ color: var(--ink-on-paper-dim); }
.nav-links a{ text-decoration:none; transition: color .15s; }
.nav-links a:hover{ color: var(--ink); }
:root[data-theme="light"] .nav-links a:hover{ color: var(--ink-on-paper); }
.nav-right{ display:flex; align-items:center; gap:14px; }
.lang-switch{ display:flex; align-items:center; gap:5px; font-family:'IBM Plex Mono'; font-size:12px; color: var(--ink-dim); }
:root[data-theme="light"] .lang-switch{ color: var(--ink-on-paper-dim); }
.lang-switch a{ text-decoration:none; padding:2px 3px; opacity:0.55; transition: opacity .15s; }
.lang-switch a.active,.lang-switch a:hover{ opacity:1; color: var(--peak); }
.btn-ghost{ border:1px solid var(--line); padding:9px 16px; border-radius: 7px; text-decoration:none; font-size:14px; transition: border-color .15s, background .15s; }
:root[data-theme="light"] .btn-ghost{ border-color: var(--paper-line); }
.btn-ghost:hover{ background: rgba(255,255,255,0.04); }
.btn-fire{
  position:relative; display:inline-flex; align-items:center; gap:8px;
  background: linear-gradient(90deg, var(--mid), var(--hot) 55%, var(--peak));
  color:#160a06; font-weight:700; font-size: 14px; text-decoration:none;
  padding: 10px 18px; border-radius:7px;
  box-shadow: 0 8px 24px -8px rgba(255,90,31,0.55);
  transition: transform .15s ease, box-shadow .15s ease;
}
.btn-fire:hover{ transform: translateY(-1px); box-shadow: 0 12px 30px -8px rgba(255,90,31,0.7); }

/* ---------- hero ---------- */
.hero{ position:relative; padding: 88px 0 70px; overflow:hidden; }
.hero::before{
  content:""; position:absolute; top:-260px; left:50%; transform:translateX(-38%);
  width:900px; height:900px; border-radius:50%;
  background: radial-gradient(circle at 40% 40%, color-mix(in srgb, var(--mid) 30%, transparent), transparent 60%);
  filter: blur(10px); pointer-events:none;
}
.hero-grid{ position:relative; display:grid; grid-template-columns: 1.15fr 0.85fr; gap:56px; align-items:center; }

.gauge-rings{ position:absolute; right:-220px; top:50%; transform:translateY(-50%); width:900px; height:900px; pointer-events:none; z-index:0; }
.gauge-rings svg{ width:100%; height:100%; }
.gauge-rings .ring{ fill:none; stroke-width:1; opacity:0.55; }
.gauge-rings .arc{ fill:none; stroke-width:2; stroke-linecap:round; filter:drop-shadow(0 0 10px currentColor); }
.gauge-rings .tick{ font-family:'IBM Plex Mono'; font-size:10px; letter-spacing:0.08em; fill: var(--ink-dim); opacity:0.8; }
:root[data-theme="light"] .gauge-rings .tick{ fill: var(--ink-on-paper-dim); }
.gauge-rings .needle{ transform-origin: 450px 450px; animation: needle-sweep 7s ease-in-out infinite; }
@keyframes needle-sweep{ 0%,100%{ transform: rotate(-38deg);} 50%{ transform: rotate(52deg);} }

.annot{
  position:absolute; display:flex; align-items:center; gap:8px;
  font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:0.05em; color: var(--ink-dim);
  z-index:2; white-space:nowrap;
}
:root[data-theme="light"] .annot{ color: var(--ink-on-paper-dim); }
.annot::before{ content:""; width:16px; height:1px; background: var(--line); }
:root[data-theme="light"] .annot::before{ background: var(--paper-line); }
.annot.a1{ top:6%; right:6%; }
.annot.a2{ bottom:10%; right:2%; flex-direction:row-reverse; }
.annot.a2::before{ transform:scaleX(-1); }

.eyebrow{
  display:inline-flex; align-items:center; gap:8px; font-family:'IBM Plex Mono'; font-weight:500;
  font-size:12px; letter-spacing:0.14em; text-transform:uppercase; color: var(--peak);
  border:1px solid color-mix(in srgb, var(--peak) 40%, transparent); padding:6px 12px; border-radius:99px;
  margin-bottom:26px; background: color-mix(in srgb, var(--peak) 8%, transparent);
}
.eyebrow .pulse{ width:6px;height:6px;border-radius:50%; background: var(--peak); box-shadow: 0 0 8px var(--peak); animation: pulse 1.8s ease-in-out infinite; }
@keyframes pulse{ 0%,100%{opacity:1;} 50%{opacity:.3;} }

h1.hero-h{
  font-family:'Bebas Neue'; font-weight:400; letter-spacing:0.01em;
  font-size: clamp(46px, 6vw, 76px); line-height:0.96; margin:0 0 22px;
  text-wrap: balance;
}
h1.hero-h .flame{
  background: linear-gradient(90deg, var(--mid), var(--hot) 45%, var(--peak));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero p.lead{
  font-size:18px; line-height:1.6; color: var(--ink-dim); max-width: 480px; margin: 0 0 34px;
}
:root[data-theme="light"] .hero p.lead{ color: var(--ink-on-paper-dim); }
.hero-ctas{ display:flex; align-items:center; gap:16px; margin-bottom:34px; flex-wrap:wrap; }
.btn-fire.lg{ padding:14px 26px; font-size:15px; border-radius:9px; }
.btn-ghost.lg{ padding:14px 20px; }

.trust-row{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.trust-row span{ font-family:'IBM Plex Mono'; font-size:12px; color: var(--ink-dim); letter-spacing:0.02em; }
:root[data-theme="light"] .trust-row span{ color: var(--ink-on-paper-dim); }

/* ---------- scanner module ---------- */
.scanner{
  position:relative; border:1px solid var(--line); border-radius:14px;
  background: linear-gradient(180deg, var(--void-2), var(--void-3));
  padding:18px; overflow:hidden;
  box-shadow: 0 30px 60px -30px rgba(0,0,0,0.6);
}
:root[data-theme="light"] .scanner{ border-color: var(--paper-line); background: linear-gradient(180deg, #ffffff, var(--paper-2)); box-shadow: 0 30px 60px -30px rgba(20,12,34,0.18); }
.scanner-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.scanner-title{ font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-dim); }
:root[data-theme="light"] .scanner-title{ color: var(--ink-on-paper-dim); }
.scanner-dots{ display:flex; gap:5px; }
.scanner-dots i{ width:6px;height:6px;border-radius:50%; background: var(--line); }
.scan-beam{
  position:absolute; left:18px; right:18px; height:2px; top:56px;
  background: linear-gradient(90deg, transparent, var(--peak), transparent);
  box-shadow: 0 0 16px 2px var(--peak);
  animation: scan 3.2s ease-in-out infinite;
  opacity:0.85;
}
@keyframes scan{ 0%{ transform: translateY(0); } 50%{ transform: translateY(210px); } 100%{ transform: translateY(0); } }

.card{
  position:relative; display:flex; align-items:center; gap:12px;
  border:1px solid var(--line); border-radius:10px; padding:12px;
  background: color-mix(in srgb, var(--void) 40%, transparent);
  margin-bottom:10px; transition: transform .2s ease, border-color .2s ease;
}
:root[data-theme="light"] .card{ border-color: var(--paper-line); background: rgba(255,255,255,0.6); }
.card:hover{ transform: translateY(-2px); border-color: color-mix(in srgb, var(--hot) 50%, var(--line)); }
.card .thumb{ width:38px;height:38px;border-radius:7px; flex-shrink:0; background: linear-gradient(135deg, var(--void-3), var(--void-2)); border:1px solid var(--line); }
:root[data-theme="light"] .card .thumb{ background: linear-gradient(135deg, #e2dcee, #f3effa); border-color: var(--paper-line); }
.card .meta{ flex:1; min-width:0; }
.card .name{ font-size:13px; font-weight:600; margin-bottom:2px; }
.card .sub{ font-family:'IBM Plex Mono'; font-size:11px; color:var(--ink-dim); }
:root[data-theme="light"] .card .sub{ color: var(--ink-on-paper-dim); }
.meter{ width:70px; height:5px; border-radius:99px; background: var(--line); position:relative; overflow:hidden; flex-shrink:0; }
.meter i{ position:absolute; inset:0; border-radius:99px; background: linear-gradient(90deg, var(--cold), var(--mid), var(--hot), var(--peak)); }
.verdict{ font-family:'IBM Plex Mono'; font-size:10px; font-weight:500; letter-spacing:0.06em; text-transform:uppercase; padding:3px 8px; border-radius:5px; flex-shrink:0; }
.verdict.scale{ color:#12321f; background: color-mix(in srgb, #4ade80 60%, transparent); }
.verdict.kill{ color:#3a0b0b; background: color-mix(in srgb, #ff6b6b 65%, transparent); }
.verdict.watch{ color:#3a2a06; background: color-mix(in srgb, var(--peak) 65%, transparent); }

.scanner-foot{
  margin-top:14px; padding-top:14px; border-top:1px dashed var(--line);
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px;
}
:root[data-theme="light"] .scanner-foot{ border-top-color: var(--paper-line); }
.scanner-foot .label{ font-family:'IBM Plex Mono'; font-size:11px; color: var(--ink-dim); }
:root[data-theme="light"] .scanner-foot .label{ color: var(--ink-on-paper-dim); }
.scanner-foot .verdict-big{ font-family:'Bebas Neue'; font-size:20px; letter-spacing:0.03em; background: linear-gradient(90deg, var(--hot), var(--peak)); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* ---------- heat ramp divider ---------- */
.ramp{ height:3px; background: linear-gradient(90deg, var(--cold), var(--mid), var(--hot), var(--peak)); }

/* ---------- feature teaser ---------- */
.features{ padding:76px 0; }
.features-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:40px; flex-wrap:wrap; }
.section-label{ font-family:'IBM Plex Mono'; font-size:12px; letter-spacing:0.14em; text-transform:uppercase; color: var(--hot); margin-bottom:10px; }
h2.section-h{ font-family:'Bebas Neue'; font-weight:400; font-size: clamp(28px,3.4vw,40px); margin:0; letter-spacing:0.01em; }
.features-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:1px; background: var(--line); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
:root[data-theme="light"] .features-grid{ background: var(--paper-line); border-color: var(--paper-line); }
.fcard{ background: var(--void-2); padding:26px 24px; transition: background .2s ease; }
:root[data-theme="light"] .fcard{ background:#fff; }
.fcard:hover{ background: var(--void-3); }
:root[data-theme="light"] .fcard:hover{ background: var(--paper-2); }
.fcard .num{ font-family:'IBM Plex Mono'; font-size:12px; color: var(--ink-dim); margin-bottom:16px; }
:root[data-theme="light"] .fcard .num{ color: var(--ink-on-paper-dim); }
.fcard h3{ font-family:'IBM Plex Sans'; font-size:17px; font-weight:600; margin:0 0 8px; }
.fcard p{ font-size:14px; line-height:1.55; color: var(--ink-dim); margin:0; }
:root[data-theme="light"] .fcard p{ color: var(--ink-on-paper-dim); }

/* ---------- inner page hero (How it works / Features / Solutions / Pricing) ---------- */
.page-hero{ padding: 72px 0 20px; }
.page-hero .eyebrow{ margin-bottom:22px; }
.page-hero h1{ font-family:'Bebas Neue'; font-weight:400; font-size: clamp(38px,5.4vw,60px); line-height:1.02; margin:0 0 20px; max-width:820px; text-wrap:balance; }
.page-hero p.lead{ font-size:17px; line-height:1.65; color: var(--ink-dim); max-width:600px; margin:0; }
:root[data-theme="light"] .page-hero p.lead{ color: var(--ink-on-paper-dim); }

/* ---------- how it works: numbered steps ---------- */
.steps{ padding: 60px 0 90px; display:flex; flex-direction:column; gap:0; }
.step{ display:grid; grid-template-columns: 120px 1fr; gap:32px; padding:36px 0; border-top:1px solid var(--line); }
:root[data-theme="light"] .step{ border-top-color: var(--paper-line); }
.step:last-child{ border-bottom:1px solid var(--line); }
:root[data-theme="light"] .step:last-child{ border-bottom-color: var(--paper-line); }
.step-num{ font-family:'Bebas Neue'; font-size:56px; line-height:1; color: transparent; -webkit-text-stroke: 1.5px var(--line); }
:root[data-theme="light"] .step-num{ -webkit-text-stroke-color: var(--paper-line); }
.step-h{ font-family:'IBM Plex Sans'; font-weight:600; font-size:22px; margin:0 0 10px; }
.step-p{ font-size:15px; line-height:1.65; color: var(--ink-dim); max-width:560px; margin:0; }
:root[data-theme="light"] .step-p{ color: var(--ink-on-paper-dim); }
@media (max-width: 620px){ .step{ grid-template-columns:1fr; gap:12px; } .step-num{ font-size:36px; } }

/* ---------- features hub: alternating rows ---------- */
.fhub{ padding: 40px 0 90px; display:grid; grid-template-columns: 1fr 1fr; gap:1px; background: var(--line); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
:root[data-theme="light"] .fhub{ background: var(--paper-line); border-color: var(--paper-line); }
.fhub-item{ background: var(--void-2); padding:32px; }
:root[data-theme="light"] .fhub-item{ background:#fff; }
.fhub-item h3{ font-family:'IBM Plex Sans'; font-weight:600; font-size:18px; margin:0 0 10px; }
.fhub-item p{ font-size:14px; line-height:1.6; color: var(--ink-dim); margin:0; }
:root[data-theme="light"] .fhub-item p{ color: var(--ink-on-paper-dim); }
@media (max-width: 720px){ .fhub{ grid-template-columns:1fr; } }

/* ---------- solutions split ---------- */
.solutions{ padding: 50px 0 90px; display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.sol-card{ border:1px solid var(--line); border-radius:16px; padding:36px; display:flex; flex-direction:column; }
:root[data-theme="light"] .sol-card{ border-color: var(--paper-line); }
.sol-tag{ font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color: var(--hot); margin-bottom:18px; }
.sol-card h3{ font-family:'Bebas Neue'; font-weight:400; font-size:28px; letter-spacing:0.01em; margin:0 0 14px; line-height:1.05; }
.sol-card p{ font-size:15px; line-height:1.65; color: var(--ink-dim); margin:0 0 20px; }
:root[data-theme="light"] .sol-card p{ color: var(--ink-on-paper-dim); }
.sol-list{ list-style:none; margin:0 0 26px; padding:0; font-size:13px; line-height:1.8; color: var(--ink-dim); flex:1; }
.sol-list li{ padding-left:18px; position:relative; }
.sol-list li::before{ content:"→"; position:absolute; left:0; color: var(--hot); }
:root[data-theme="light"] .sol-list{ color: var(--ink-on-paper-dim); }
@media (max-width: 720px){ .solutions{ grid-template-columns:1fr; } }

/* ---------- pricing panel ---------- */
.pricing-panel{ padding: 60px 0 100px; }
.pricing-card{ max-width:640px; margin:0 auto; text-align:center; border:1px solid var(--line); border-radius:18px; padding:56px 40px; background: linear-gradient(180deg, var(--void-2), var(--void)); }
:root[data-theme="light"] .pricing-card{ border-color: var(--paper-line); background: linear-gradient(180deg, #fff, var(--paper)); }
.pricing-card p{ font-size:16px; line-height:1.7; color: var(--ink-dim); margin: 0 auto 30px; max-width:460px; }
:root[data-theme="light"] .pricing-card p{ color: var(--ink-on-paper-dim); }
.pricing-note{ margin-top:16px; font-family:'IBM Plex Mono'; font-size:12px; color: var(--ink-dim); }
:root[data-theme="light"] .pricing-note{ color: var(--ink-on-paper-dim); }

/* ---------- sample report ---------- */
.report{ padding: 40px 0 90px; max-width: 780px; margin: 0 auto; }
.report-intro{ font-size:15px; color: var(--ink-dim); border-left:2px solid var(--hot); padding-left:16px; margin-bottom:44px; }
:root[data-theme="light"] .report-intro{ color: var(--ink-on-paper-dim); }
.report-item{ margin-bottom:34px; }
.report-item .card{ margin-bottom:14px; cursor:default; }
.report-item .card:hover{ transform:none; }
.report-item p{ font-size:15px; line-height:1.7; color: var(--ink-dim); margin:0; padding-left:4px; }
:root[data-theme="light"] .report-item p{ color: var(--ink-on-paper-dim); }
.report-brief{ margin-top:56px; border-top:1px solid var(--line); padding-top:44px; }
:root[data-theme="light"] .report-brief{ border-top-color: var(--paper-line); }
.report-brief h2{ font-family:'Bebas Neue'; font-weight:400; font-size:30px; letter-spacing:0.01em; margin:0 0 10px; }
.report-brief > p{ font-size:14px; color: var(--ink-dim); margin:0 0 24px; }
:root[data-theme="light"] .report-brief > p{ color: var(--ink-on-paper-dim); }
.brief-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0; }
.brief-list li{ font-family:'IBM Plex Mono'; font-size:13px; line-height:1.7; color: var(--ink-dim); padding:16px 0; border-top:1px dashed var(--line); }
:root[data-theme="light"] .brief-list li{ color: var(--ink-on-paper-dim); border-top-color: var(--paper-line); }
.report-closing{ text-align:center; margin-top:56px; }
.report-closing p{ font-size:16px; color: var(--ink); margin:0 0 22px; }
:root[data-theme="light"] .report-closing p{ color: var(--ink-on-paper); }

/* ---------- FAQ ---------- */
.faq{ padding: 40px 0 90px; max-width: 760px; }
.faq-item{ border-top:1px solid var(--line); padding:26px 0; }
:root[data-theme="light"] .faq-item{ border-top-color: var(--paper-line); }
.faq-item:last-child{ border-bottom:1px solid var(--line); }
:root[data-theme="light"] .faq-item:last-child{ border-bottom-color: var(--paper-line); }
.faq-q{ font-family:'IBM Plex Sans'; font-weight:600; font-size:16px; margin:0 0 10px; }
.faq-a{ font-size:14px; line-height:1.7; color: var(--ink-dim); margin:0; }
:root[data-theme="light"] .faq-a{ color: var(--ink-on-paper-dim); }

/* ---------- generic content page (About/Contact/Legal/Blog) ---------- */
.content-page{ padding: 72px 0 90px; max-width: 760px; }
.content-h1{ font-family:'Bebas Neue'; font-weight:400; font-size: clamp(36px,5vw,54px); letter-spacing:0.01em; margin: 0 0 32px; text-wrap: balance; }
.content-body{ font-size:16px; line-height:1.75; color: var(--ink-dim); }
:root[data-theme="light"] .content-body{ color: var(--ink-on-paper-dim); }
.content-body h2{ font-family:'IBM Plex Sans'; font-weight:600; font-size:22px; color: var(--ink); margin:40px 0 14px; }
:root[data-theme="light"] .content-body h2{ color: var(--ink-on-paper); }
.content-body h3{ font-family:'IBM Plex Sans'; font-weight:600; font-size:17px; color: var(--ink); margin:28px 0 10px; }
:root[data-theme="light"] .content-body h3{ color: var(--ink-on-paper); }
.content-body p{ margin: 0 0 18px; }
.content-body a{ color: var(--hot); text-decoration:underline; }
.content-body ul,.content-body ol{ margin:0 0 18px; padding-left:22px; }
.content-body li{ margin-bottom:8px; }
.content-thumb{ border-radius:14px; overflow:hidden; border:1px solid var(--line); margin-bottom:36px; }
:root[data-theme="light"] .content-thumb{ border-color: var(--paper-line); }

.blog-list{ display:flex; flex-direction:column; gap:0; border-top:1px solid var(--line); }
:root[data-theme="light"] .blog-list{ border-top-color: var(--paper-line); }
.blog-item{ display:block; padding:28px 0; border-bottom:1px solid var(--line); text-decoration:none; }
:root[data-theme="light"] .blog-item{ border-bottom-color: var(--paper-line); }
.blog-item-date{ display:block; font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color: var(--hot); margin-bottom:8px; }
.blog-item-title{ display:block; font-family:'IBM Plex Sans'; font-weight:600; font-size:19px; margin-bottom:8px; }
.blog-item-excerpt{ display:block; font-size:14px; line-height:1.6; color: var(--ink-dim); }
:root[data-theme="light"] .blog-item-excerpt{ color: var(--ink-on-paper-dim); }

/* ---------- footer ---------- */
.site-footer{ border-top:1px solid var(--line); padding: 56px 0 0; margin-top: 40px; }
:root[data-theme="light"] .site-footer{ border-top-color: var(--paper-line); }
.footer-grid{ display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap:32px; padding-bottom:40px; }
.footer-brand p{ font-size:13px; color: var(--ink-dim); max-width:240px; margin-top:10px; }
:root[data-theme="light"] .footer-brand p{ color: var(--ink-on-paper-dim); }
.footer-col{ display:flex; flex-direction:column; gap:10px; font-size:13px; }
.footer-col a{ text-decoration:none; color: var(--ink-dim); }
:root[data-theme="light"] .footer-col a{ color: var(--ink-on-paper-dim); }
.footer-col a:hover{ color: var(--ink); }
:root[data-theme="light"] .footer-col a:hover{ color: var(--ink-on-paper); }
.footer-col-h{ font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color: var(--ink); margin-bottom:4px; }
:root[data-theme="light"] .footer-col-h{ color: var(--ink-on-paper); }
.footer-bottom{ border-top:1px solid var(--line); padding:20px 32px; font-family:'IBM Plex Mono'; font-size:12px; color: var(--ink-dim); }
:root[data-theme="light"] .footer-bottom{ border-top-color: var(--paper-line); color: var(--ink-on-paper-dim); }

/* ---------- testing-mode CTA toast ---------- */
.testing-toast{
  position: fixed; left:50%; bottom:24px; transform: translateX(-50%);
  z-index:60; max-width: min(480px, calc(100vw - 32px));
  background: var(--void-2); border:1px solid var(--line); border-radius:12px;
  padding:14px 42px 14px 18px; font-size:13px; line-height:1.5; color: var(--ink);
  box-shadow: 0 20px 50px -20px rgba(0,0,0,0.6);
}
:root[data-theme="light"] .testing-toast{ background:#fff; border-color: var(--paper-line); color: var(--ink-on-paper); }
.testing-toast-close{
  position:absolute; top:8px; right:10px; background:none; border:none; cursor:pointer;
  font-size:18px; line-height:1; color: var(--ink-dim); padding:4px;
}
:root[data-theme="light"] .testing-toast-close{ color: var(--ink-on-paper-dim); }

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  .scan-beam, .eyebrow .pulse, .gauge-rings .needle{ animation: none; }
}

@media (max-width: 880px){
  .hero-grid{ grid-template-columns:1fr; }
  .features-grid{ grid-template-columns:1fr; }
  .nav-links{ display:none; }
  .gauge-rings{ display:none; }
  .annot{ display:none; }
  .footer-grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px){
  .footer-grid{ grid-template-columns: 1fr; }
}
