:root{
  --bg:#0f1012;
  --bg2:#15171b;
  --ink:#f4f2ee;
  --muted:rgba(244,242,238,0.78);
  --muted2:rgba(244,242,238,0.62);
  --line: rgba(244,242,238,0.14);
  --shadow: 0 18px 55px rgba(0,0,0,0.55);
  --radius: 18px;
  --radius2: 26px;
  --primary:#BC0404;
  --neutral:#4E4E4E;
  --h:"Space Grotesk", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  --b:"Inter", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  --mono:"IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --max: 1160px;
}
*{box-sizing:border-box}
html,body{
  margin:0;
  font-family:var(--b);
  color:var(--ink);
  background:
    radial-gradient(900px 520px at 12% 12%, rgba(188,4,4,0.20), transparent 60%),
    radial-gradient(800px 480px at 88% 18%, rgba(244,242,238,0.08), transparent 55%),
    linear-gradient(180deg, var(--bg), var(--bg2) 55%, #0b0c0e);
  line-height:1.65;
}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--b);
  color:var(--ink);
  background:
    radial-gradient(900px 520px at 12% 12%, rgba(188,4,4,0.20), transparent 60%),
    radial-gradient(800px 480px at 88% 18%, rgba(244,242,238,0.08), transparent 55%),
    linear-gradient(180deg, var(--bg), var(--bg2) 55%, #0b0c0e);
  line-height:1.65;
}
a{color:inherit; text-decoration:none}
a:hover{text-decoration:underline; text-underline-offset:3px}
.wrap{max-width:var(--max); margin:0 auto; padding:0 20px}
.skip{position:absolute; left:-9999px} .skip:focus{left:20px; top:20px; background: rgba(20,22,26,0.72); padding:10px 12px; border-radius:12px; border:1px solid var(--line); box-shadow: var(--shadow)}
.topbar{font-size:12.5px;color:rgba(17,17,17,0.72);border-bottom:1px solid rgba(17,17,17,0.14);background:rgba(245,242,236,0.82);}
.topbar .wrap{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:10px 20px}
.badge{display:inline-flex;align-items:center;gap:10px;padding:6px 10px;border-radius:999px;border:1px solid var(--line);background: rgba(20,22,26,0.80)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--primary);box-shadow:0 0 0 4px rgba(188,4,4,0.12)}
header{position:sticky;top:0;z-index:50;backdrop-filter:blur(12px);background:rgba(245,242,236,0.88);border-bottom:1px solid rgba(17,17,17,0.14);}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}
.brand img{height:52px;width:auto;display:block;filter: drop-shadow(0 1px 0 rgba(255,255,255,0.7));}
nav ul{margin:0;padding:0;list-style:none;display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.navlink{font-size:13.5px;color:rgba(17,17,17,0.82);padding:9px 10px;border-radius:12px;border:1px solid transparent;transition:background-color .2s ease,border-color .2s ease,color .2s ease;font-weight:600;}
.navlink:hover{background:rgba(17,17,17,0.06);border-color:rgba(17,17,17,0.14);text-decoration:none;color:rgba(17,17,17,0.90);}
.navlink[aria-current="page"]{border-color: rgba(188,4,4,0.30);background: rgba(188,4,4,0.08);color: rgba(244,242,238,0.92)}
.cta{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:10px 14px;border-radius:999px;background: linear-gradient(180deg, rgba(188,4,4,0.92), rgba(188,4,4,0.82));color: #fff;border: 1px solid rgba(188,4,4,0.25);font-weight:700;letter-spacing:0.02em;box-shadow: 0 16px 35px rgba(188,4,4,0.18);}
.cta.secondary{background: rgba(255,255,255,0.06); color: var(--ink); border:1px solid var(--line); box-shadow: var(--shadow)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:10px 14px;border-radius:16px;border:1px solid var(--line);background: rgba(20,22,26,0.80);font-weight:650}
.btn:hover{background: rgba(20,22,26,0.72);text-decoration:none}
.hero{padding:64px 0 26px}
.heroGrid{display:grid;grid-template-columns: 1.1fr 0.9fr;gap:18px;align-items:start}
.h1{margin:0 0 10px;font-family:var(--h);font-weight:700;letter-spacing:-0.02em;line-height:1.05;font-size:clamp(34px, 4.2vw, 58px)}
.lead{margin:0 0 18px;color:var(--muted);font-size:18px;max-width:72ch}
.kicker{font-family:var(--mono);letter-spacing:0.10em;text-transform:uppercase;font-size:12px;color: rgba(244,242,238,0.70)}
.heroActions{display:flex;gap:12px;flex-wrap:wrap;margin-top:10px}
.card{background:rgba(28,30,35,0.82);border:1px solid rgba(244,242,238,0.16);border-radius:var(--radius2);padding:18px;box-shadow:var(--shadow);color:var(--ink);}
.section{padding:34px 0}
.sectionHead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.h2{margin:0;font-family:var(--h);font-weight:700;letter-spacing:-0.02em;font-size:30px}
.sub{margin:0;color:var(--muted);max-width:75ch}
.grid{display:grid;grid-template-columns: repeat(3, 1fr);gap:14px}
.grid2{display:grid;grid-template-columns: repeat(2, 1fr);gap:14px}
.grid1{display:grid;grid-template-columns:1fr;gap:14px}
.feature{padding:16px;border-radius:22px;border:1px solid rgba(244,242,238,0.14);background:rgba(28,30,35,0.70);color:var(--ink);}
.feature h3{margin:0 0 8px;font-weight:700}
.feature p{margin:0;color:var(--muted);font-size:14.8px}
.icon{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;border:1px solid rgba(188,4,4,0.20);background: rgba(188,4,4,0.10)}
.media{border-radius: var(--radius2);overflow:hidden;border:1px solid var(--line);background: rgba(255,255,255,0.70)}
.media img{width:100%;height:auto;display:block}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{display:inline-flex;padding:7px 10px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,0.06);color:rgba(244,242,238,0.86);font-size:12.5px}
.kpis{display:grid;grid-template-columns: repeat(3, 1fr);gap:12px;margin-top:14px}
.kpi{padding:14px;border-radius:18px;border:1px solid var(--line);background: rgba(255,255,255,0.70)}
.kpi .v{font-family:var(--h);font-weight:700;letter-spacing:-0.02em;font-size:20px}
.kpi .l{color:var(--muted2);font-size:12.5px}
.quote{padding:18px;border-radius: 24px;border:1px solid var(--line);background: rgba(255,255,255,0.72)}
.quote p{margin:0;color: rgba(17,17,17,0.86);font-size:16px}
.quote .by{margin-top:10px;color: var(--muted2);font-size:12.5px}
.faq details{border:1px solid var(--line);background: rgba(20,22,26,0.65);border-radius:18px;padding:12px 14px}
.faq details + details{margin-top:10px}
.faq summary{cursor:pointer;font-weight:650}
.faq p{margin:10px 0 0;color:var(--muted);font-size:14.5px}
form{display:grid;gap:10px}
input, textarea{width:100%;padding:12px 12px;border-radius:14px;border:1px solid var(--line);background: rgba(20,22,26,0.75);color: var(--ink);font-family: var(--b);font-size: 14.8px;outline:none}
input:focus, textarea:focus{border-color: rgba(188,4,4,0.45);box-shadow: 0 0 0 4px rgba(188,4,4,0.10)}
textarea{min-height:140px;resize:vertical}
.help{color: var(--muted2);font-size:12.5px}
.bookGrid{display:grid;grid-template-columns: repeat(4, 1fr);gap:14px}
.book{border-radius:20px;overflow:hidden;border:1px solid var(--line);background: rgba(20,22,26,0.72);box-shadow:0 12px 30px rgba(17,17,17,0.10)}
.book img{width:100%;height:auto;display:block}
.book .cap{padding:10px 12px;font-size:13px;color: var(--muted);border-top:1px solid var(--line)}
.footer{padding:28px 0 48px;border-top:1px solid rgba(17,17,17,0.14);color:rgba(17,17,17,0.72);font-size:13px;background:rgba(245,242,236,0.90);}
.footer .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.miniLinks{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
@media (max-width: 980px){.heroGrid{grid-template-columns:1fr}.grid,.grid2{grid-template-columns:1fr}.bookGrid{grid-template-columns: repeat(2, 1fr)}}


/* --- Polish pass additions --- */
body::before{
  content:"";
  position:fixed; inset:0;
  pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
  opacity:.35;
}
.h1, .h2{ text-wrap:balance }
.lead{ max-width:68ch }
.card, .feature, .book, .faq details{
  transition: transform .25s ease, box-shadow .25s ease, background-color .25s ease, border-color .25s ease;
}
.card:hover, .feature:hover, .book:hover{
  transform: translateY(-2px);
  box-shadow: 0 22px 55px rgba(17,17,17,0.12);
  border-color: rgba(17,17,17,0.18);
}
.navlink{font-size:13.5px;color:rgba(17,17,17,0.82);padding:9px 10px;border-radius:12px;border:1px solid transparent;transition:background-color .2s ease,border-color .2s ease,color .2s ease;font-weight:600;}
.cta, .btn{ transition: transform .18s ease, filter .18s ease, box-shadow .18s ease }
.cta:hover, .btn:hover{ transform: translateY(-1px) }
.cta:active, .btn:active{ transform: translateY(0px) scale(.99) }
.section{ padding:40px 0 }
.sectionHead{ margin-bottom:18px }
.media img{ transition: transform .35s ease }
.media:hover img{ transform: scale(1.02) }
.book .cap{ font-weight:600 }
.quote{ position:relative }
.quote::before{
  content:"“";
  position:absolute; left:18px; top:6px;
  font-family:var(--h); font-size:64px;
  color: rgba(188,4,4,0.10);
  line-height:1;
}
.quote p{ padding-left:30px }
hr.sep{
  border:0; height:1px; background:var(--line);
  margin:22px 0;
}
.reveal{
  opacity:0; transform: translateY(10px);
  transition: opacity .7s ease, transform .7s ease;
}
.reveal.in{
  opacity:1; transform: translateY(0);
}
@media (prefers-reduced-motion: reduce){
  .reveal, .card, .feature, .book, .media img, .cta, .btn{ transition:none !important }
  .reveal{ opacity:1 !important; transform:none !important }
}

body::after{content:'';position:fixed;inset:0;pointer-events:none;background:radial-gradient(1200px 700px at 50% 0%, transparent 45%, rgba(0,0,0,0.55));opacity:.65;mix-blend-mode:multiply;}


/* --- Readability fixes for dark theme --- */
body, p, li, ul, ol, label, input, textarea { color: var(--ink); }
.sub, .lead, .help, .miniLinks, .topbar, .kpi .l, .feature p { color: var(--muted) !important; }
.navlink { color: rgba(244,242,238,0.86) !important; }
.navlink:hover { color: rgba(244,242,238,0.95) !important; }
.badge { color: rgba(244,242,238,0.88) !important; }
.pill { color: rgba(244,242,238,0.80) !important; }
.feature h3, .card h2, .h1, .h2 { color: var(--ink) !important; }
a { color: rgba(244,242,238,0.90); }
a:hover { color: rgba(244,242,238,0.98); }
input, textarea { color: var(--ink) !important; }
::placeholder { color: rgba(244,242,238,0.55); }
.footer { color: rgba(244,242,238,0.70) !important; }

.feature p{color:var(--muted) !important}

/* --- agency pattern --- */
.hero{
  position:relative;
}
.hero::before{
  content:"";
  position:absolute;
  inset:-1px 0 auto 0;
  height:360px;
  pointer-events:none;
  background:
    radial-gradient(900px 520px at 12% 12%, rgba(188,4,4,0.22), transparent 60%),
    radial-gradient(700px 420px at 88% 18%, rgba(244,242,238,0.10), transparent 55%),
    repeating-linear-gradient(90deg, rgba(244,242,238,0.06) 0 1px, transparent 1px 92px),
    repeating-linear-gradient(0deg, rgba(244,242,238,0.04) 0 1px, transparent 1px 72px);
  opacity:.55;
  mix-blend-mode:screen;
}


main a{color:rgba(244,242,238,0.92)} main a:hover{color:rgba(255,255,255,0.98)}

.footer a{color:rgba(17,17,17,0.78)} .footer a:hover{color:rgba(17,17,17,0.92)}

/* --- spacing + readability pass --- */
main p{margin:0 0 14px}
main p.sub{margin:0 0 14px}
main ul, main ol{margin:10px 0 16px 18px; padding:0}
main li{margin:0 0 8px}
.lead{margin:0 0 18px}
.hero .sub{font-size:16px; line-height:1.75}
.feature p + p{margin-top:10px}
.card .sub{margin-top:8px}

.lead,.sub{max-width:74ch}

/* --- FINAL TYPOGRAPHY + HIERARCHY PASS --- */
.h1{
  font-size:clamp(36px, 4.3vw, 60px);
  letter-spacing:-0.025em;
}
.h2{
  font-size:clamp(24px, 2.6vw, 34px);
  letter-spacing:-0.02em;
}
.lead{
  font-size:18px;
  line-height:1.75;
}
.sub{
  font-size:16px;
  line-height:1.78;
}
main p{margin:0 0 16px}
main li{margin:0 0 10px}
.section{padding:46px 0}
.section + .section{border-top:1px solid rgba(244,242,238,0.10)}
.sectionHead{margin-bottom:22px}
.feature h3{font-size:16px; letter-spacing:0.01em}
.feature p{font-size:15px; line-height:1.75}
.card{padding:22px}
.card .h2{margin-bottom:8px}
.quote p{font-size:17px; line-height:1.7}
.pills{gap:10px}
.pill{font-size:12.2px; letter-spacing:0.02em}
.book .cap{font-size:12.8px}
nav ul{gap:6px}
.navlink{padding:9px 9px}
@media(max-width:980px){
  .card{padding:18px}
  .section{padding:38px 0}
}

.prose{
  max-width:78ch;
}
.prose p:last-child{margin-bottom:0}

/* --- HEADER/FOOTER V5 (readable + tech) --- */
header{
  background: rgba(248,246,242,0.95) !important;
  border-bottom: 1px solid rgba(17,17,17,0.16) !important;
}
.topbar{
  background: rgba(248,246,242,0.90) !important;
  border-bottom: 1px solid rgba(17,17,17,0.14) !important;
  color: rgba(17,17,17,0.72) !important;
}
.badge{ color: rgba(17,17,17,0.78) !important; }
.navlink{
  color: rgba(17,17,17,0.86) !important;
  font-weight: 650 !important;
  letter-spacing: 0.01em;
  padding: 10px 11px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(17,17,17,0.12) !important;
  background: rgba(255,255,255,0.60) !important;
}
.navlink:hover{
  background: rgba(17,17,17,0.06) !important;
  border-color: rgba(17,17,17,0.18) !important;
  color: rgba(17,17,17,0.96) !important;
  text-decoration: none !important;
}
.navlink[aria-current="page"]{
  background: rgba(188,4,4,0.10) !important;
  border-color: rgba(188,4,4,0.30) !important;
  color: rgba(17,17,17,0.96) !important;
}
.cta{
  border-radius: 999px !important;
}
.cta.secondary{
  background: rgba(255,255,255,0.65) !important;
  color: rgba(17,17,17,0.90) !important;
  border-color: rgba(17,17,17,0.16) !important;
}
.footer{
  background: rgba(248,246,242,0.95) !important;
  border-top: 1px solid rgba(17,17,17,0.16) !important;
  color: rgba(17,17,17,0.74) !important;
}
.footer a{ color: rgba(17,17,17,0.82) !important; }
.footer a:hover{ color: rgba(17,17,17,0.98) !important; }

.brand img{height:52px;width:auto;display:block;filter: drop-shadow(0 1px 0 rgba(255,255,255,0.7));}

main a{color: rgba(244,242,238,0.92);} main a:hover{color: rgba(255,255,255,0.98);} 

/* --- V6: remove topbar + refine header/footer --- */
.topbar{display:none !important;}
header{
  background: rgba(255,255,255,0.94) !important;
}
header::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-1px;
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(188,4,4,0.35), transparent);
  opacity:.9;
}

.footer{
  background: rgba(12,13,15,0.98) !important;
  border-top: 1px solid rgba(244,242,238,0.14) !important;
  color: rgba(244,242,238,0.72) !important;
}
.footer a{ color: rgba(244,242,238,0.82) !important; }
.footer a:hover{ color: rgba(255,255,255,0.98) !important; }

/* --- Content Services book layout --- */
.bookList{display:grid;grid-template-columns:1fr;gap:16px;margin-top:10px}
.bookCard{display:grid;grid-template-columns:160px 1fr;gap:16px;padding:18px;border-radius:22px;border:1px solid rgba(244,242,238,0.14);background:rgba(28,30,35,0.70);box-shadow:0 16px 45px rgba(0,0,0,0.35)}
.bookImg{border-radius:16px;overflow:hidden;border:1px solid rgba(244,242,238,0.14);background:rgba(0,0,0,0.25)}
.bookImg img{width:100%;height:auto;display:block}
.bookBody h3{margin:0 0 10px;font-family:var(--h);font-size:20px;letter-spacing:-0.01em}
.bookBody p{margin:0 0 10px;color:var(--muted);font-size:15px;line-height:1.75}
.bookBody p:last-child{margin-bottom:0}
@media(max-width:820px){.bookCard{grid-template-columns:1fr}.bookImg{max-width:280px}}