/* ============================================================
   AI ENABLEMENT // CYBER OVERHAUL
   Black + rouge HUD / terminal interface skin.
   Reuses the same markup + app.js as the base one-pager.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@500;600;700&family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@600;700;800&family=Hanken+Grotesk:wght@400;500;600;700;800&family=Space+Mono:wght@400;700&display=swap');

:root{
  /* ── palette: void + rouge ── */
  --void:#050507;
  --void-2:#0a0a0e;
  --panel:#0c0c11;
  --panel-2:#101017;
  --ink:#edeaef;
  --ink-dim:#b7b2be;
  --void:#070709;
  --void-2:#0b0b0f;
  --panel:#0e0e14;
  --panel-2:#111118;
  --ink:#f3f1f6;
  --ink-dim:#c2bdca;
  --muted:#857f8e;
  --faint:#4a4651;

  --rouge:#ff2138;          /* primary neon red */
  --rouge-hot:#ff4d5e;
  --rouge-deep:#9c0a1c;
  --rouge-glow:rgba(255,33,56,.45);
  --rouge-wash:rgba(255,33,56,.07);

  --line:rgba(255,255,255,.08);
  --line-2:rgba(255,255,255,.035);
  --line-rouge:rgba(255,33,56,.28);

  /* accent is swappable via tweak — defaults to rouge */
  --accent:#ff2138;
  --accent-glow:rgba(255,33,56,.45);

  --font-display:'Chakra Petch', sans-serif;
  --font-body:'Space Grotesk', sans-serif;
  --font-mono:'JetBrains Mono', monospace;

  --content:1140px;
  --pad:40px;

  --glow:1; /* 1 = glow on, 0 = off (set by tweak) */
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; color:var(--ink);
  font-family:var(--font-body); font-size:16px; line-height:1.65;
  -webkit-font-smoothing:antialiased;
  background:
    radial-gradient(820px 440px at 84% -12%, rgba(255,33,56,.06), transparent 62%),
    var(--void);
  background-attachment:fixed;
}
/* faint engineering grid — kept very subtle, fades out early */
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(var(--line-2) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-2) 1px, transparent 1px);
  background-size:58px 58px;
  opacity:.6;
  mask-image:radial-gradient(circle at 50% 22%, #000 0%, transparent 70%);
  -webkit-mask-image:radial-gradient(circle at 50% 22%, #000 0%, transparent 70%);
}
/* CRT scanlines (toggleable) */
body::after{
  content:""; position:fixed; inset:0; z-index:60; pointer-events:none;
  background:repeating-linear-gradient(to bottom,
    rgba(0,0,0,0) 0px, rgba(0,0,0,0) 2px,
    rgba(0,0,0,.11) 3px, rgba(0,0,0,.11) 3px);
  mix-blend-mode:multiply; opacity:.45;
  transition:opacity .3s ease;
}
:root[data-scanlines="off"] body::after{opacity:0;}
main, .nav, .foot{position:relative; z-index:1;}

a{color:inherit; text-decoration:none; cursor:pointer;}
img{max-width:100%; display:block;}
::selection{background:var(--rouge); color:#fff;}

.wrap{max-width:var(--content); margin:0 auto; padding:0 var(--pad);}
section{position:relative;}

/* ── shared type ─────────────────────────────────────────── */
.eyebrow{
  font-family:var(--font-mono); font-size:11px; font-weight:500;
  letter-spacing:.28em; text-transform:uppercase; color:var(--accent);
  margin:0; display:inline-flex; align-items:center; gap:9px;
}
.eyebrow::before{
  content:"▶"; font-size:8px; color:var(--accent);
  filter:drop-shadow(0 0 6px var(--accent-glow));
}
.display{
  font-family:var(--font-display); font-weight:700; letter-spacing:-.01em;
  line-height:1.04; color:var(--ink); margin:0; text-transform:uppercase;
}
.lede{
  font-size:18px; line-height:1.62; color:var(--ink-dim); margin:0;
  max-width:62ch; text-wrap:pretty;
}

/* ── buttons ─────────────────────────────────────────────── */
.btn{
  position:relative; display:inline-flex; align-items:center; gap:11px;
  font-family:var(--font-mono); font-size:13px; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase;
  padding:15px 24px; border:1px solid var(--accent);
  background:var(--accent); color:#0a0001; cursor:pointer;
  clip-path:polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
  transition:background .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
  box-shadow:calc(var(--glow) * 0px) 0 calc(var(--glow) * 22px) var(--accent-glow);
}
.btn .arw{transition:transform .2s ease;}
.btn:hover{transform:translateY(-2px); box-shadow:0 0 calc(var(--glow) * 30px) var(--accent-glow);}
.btn:hover .arw{transform:translateX(4px);}
.btn--ghost{
  background:transparent; color:var(--accent); border-color:var(--line-rouge);
  box-shadow:none;
}
.btn--ghost:hover{background:var(--rouge-wash); border-color:var(--accent); color:var(--ink);}

/* ── nav: status bar ─────────────────────────────────────── */
.nav{
  position:sticky; top:0; z-index:40;
  background:rgba(7,7,10,.72); backdrop-filter:blur(12px) saturate(1.2);
  border-bottom:1px solid var(--line);
}
.nav__in{
  max-width:var(--content); margin:0 auto; padding:13px var(--pad);
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.brand{display:flex; align-items:center; gap:12px; font-family:var(--font-mono);
  font-weight:700; font-size:14px; letter-spacing:.06em; white-space:nowrap; color:var(--ink);}
.brand .mark{
  width:30px; height:30px; background:transparent; border:1px solid var(--accent);
  display:grid; place-items:center; color:var(--accent);
  font-family:var(--font-display); font-weight:700; font-size:16px; line-height:1;
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);
  box-shadow:0 0 calc(var(--glow) * 12px) var(--accent-glow) inset;
}
.nav__links{display:flex; align-items:center; gap:28px;}
.nav__links a{font-family:var(--font-mono); font-size:12px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--muted); transition:color .15s;}
.nav__links a:hover{color:var(--accent);}
.nav__cta{padding:10px 18px; font-size:11px; white-space:nowrap;}
@media(max-width:760px){ .nav__links a:not(.nav__cta){display:none;} }

/* ── hero ────────────────────────────────────────────────── */
.hero{padding:96px 0 80px;}
.hero__grid{display:grid; gap:44px; align-items:center;}
.hero .eyebrow{margin-bottom:26px;}
.hero h1{font-size:clamp(42px,6.6vw,88px); margin-bottom:26px; letter-spacing:-.015em;}
.hero h1 em{
  font-style:normal; color:var(--accent);
  text-shadow:0 0 calc(var(--glow) * 26px) var(--accent-glow);
}
.hero__actions{display:flex; gap:14px; flex-wrap:wrap; margin-top:36px;}
.hero__stats{
  display:flex; flex-wrap:wrap; gap:0; margin-top:48px;
  padding-top:0; border-top:1px solid var(--line);
}
.hero__stat{
  flex:1; min-width:150px; padding:20px 22px;
  border-bottom:1px solid var(--line); border-right:1px solid var(--line);
  transition:background .18s ease;
}
.hero__stat:hover{background:var(--rouge-wash);}
.hero__stat .eyebrow{margin-bottom:10px; font-size:10px; letter-spacing:.2em; color:var(--muted);}
.hero__stat .eyebrow::before{display:none;}
.hero__stat b{font-family:var(--font-display); font-size:26px; font-weight:700;
  text-transform:uppercase; display:block; line-height:1; color:var(--ink);}

/* hero: centered (default) */
:root[data-hero="centered"] .hero{padding-top:104px; text-align:center;}
:root[data-hero="centered"] .hero .eyebrow,
:root[data-hero="centered"] .hero .lede{margin-left:auto; margin-right:auto;}
:root[data-hero="centered"] .hero .eyebrow{justify-content:center;}
:root[data-hero="centered"] .hero__actions{justify-content:center;}
:root[data-hero="centered"] .hero__stats{justify-content:center; border:1px solid var(--line);}
:root[data-hero="centered"] .hero h1{max-width:17ch; margin-left:auto; margin-right:auto;}

/* hero: split */
:root[data-hero="split"] .hero__grid{grid-template-columns:1.3fr .85fr;}
:root[data-hero="split"] .hero__aside{
  border:1px solid var(--line-rouge); background:var(--panel);
  padding:0; position:relative;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%);
}
:root[data-hero="centered"] .hero__aside{display:none;}
.hero__aside h4{
  font-family:var(--font-mono); font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:.18em; margin:0; color:var(--accent);
  padding:18px 22px; border-bottom:1px solid var(--line);
  background:var(--rouge-wash);
}
.hero__steplist{display:flex; flex-direction:column; padding:6px 22px 14px;}
.hero__steplist a{
  display:flex; align-items:center; gap:14px; padding:16px 0;
  border-top:1px solid var(--line-2); font-family:var(--font-body);
  font-weight:600; font-size:14.5px; color:var(--ink-dim);
  transition:padding-left .18s ease, color .18s;
}
.hero__steplist a:first-child{border-top:0;}
.hero__steplist a:hover{padding-left:6px; color:var(--ink);}
.hero__steplist .n{
  font-family:var(--font-mono); font-size:12px; color:var(--accent);
  width:24px; flex-shrink:0;
}
.hero__steplist .arw{margin-left:auto; color:var(--faint); transition:transform .2s, color .2s;}
.hero__steplist a:hover .arw{transform:translateX(3px); color:var(--accent);}
@media(max-width:820px){ :root[data-hero="split"] .hero__grid{grid-template-columns:1fr;} }

/* ── section heading ─────────────────────────────────────── */
.shead{max-width:680px; margin-bottom:56px;}
.shead.center{margin-left:auto; margin-right:auto; text-align:center;}
.shead .eyebrow{margin-bottom:18px;}
.shead h2{font-size:clamp(30px,4.2vw,52px); margin-bottom:18px;}
.divider{
  border:0; height:1px; margin:0;
  background:linear-gradient(90deg, transparent, var(--line-rouge) 30%, var(--line-rouge) 70%, transparent);
}

/* ── approach ────────────────────────────────────────────── */
.approach{padding:72px 0;}
.approach__grid{display:grid; grid-template-columns:1fr; gap:52px; align-items:start;}
.approach blockquote{
  margin:0; max-width:100%; font-family:var(--font-display); font-weight:600;
  font-size:clamp(26px,3.6vw,44px); line-height:1.26; text-transform:none;
  letter-spacing:-.015em; color:var(--ink); text-wrap:balance;
}
.approach blockquote em{
  font-style:normal; color:var(--accent);
  text-shadow:0 0 calc(var(--glow) * 18px) var(--accent-glow);
}
.approach__note{
  border-left:2px solid var(--accent); padding:6px 0 6px 24px;
  font-size:15.5px; color:var(--ink-dim);
  background:linear-gradient(90deg, var(--rouge-wash), transparent 80%);
}
.approach__note strong{color:var(--ink); font-weight:600;}
@media(max-width:820px){ .approach__grid{grid-template-columns:1fr; gap:28px;} }

/* ============================================================
   SERVICES
   ============================================================ */
.services{padding:80px 0 90px;}
.services__list{display:grid; gap:22px;}
.service{
  position:relative; background:var(--panel);
  border:1px solid var(--line); padding:36px;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%);
  transition:border-color .2s ease;
}
.service:hover{border-color:var(--line-rouge);}
/* corner tick */
.service::after{
  content:""; position:absolute; right:0; top:0; width:12px; height:12px;
  border-top:2px solid var(--accent); border-right:2px solid var(--accent);
  opacity:.7;
}
.service__head{display:flex; align-items:flex-start; gap:22px;}
.svc-num{
  font-family:var(--font-display); font-size:32px; font-weight:700;
  line-height:1; color:var(--accent); flex-shrink:0;
  text-shadow:0 0 calc(var(--glow) * 16px) var(--accent-glow);
}
.svc-badge{
  width:46px; height:46px; background:transparent; border:1px solid var(--accent);
  flex-shrink:0; display:grid; place-items:center; color:var(--accent);
  clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);
  box-shadow:0 0 calc(var(--glow) * 14px) var(--accent-glow) inset;
}
.svc-titles{flex:1; min-width:0;}
.svc-kicker{
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--muted); margin:0 0 9px;
}
.service h3{font-family:var(--font-display); font-weight:600; font-size:23px;
  line-height:1.18; margin:0; color:var(--ink); text-transform:uppercase; letter-spacing:-.005em;}
.svc-summary{margin:14px 0 0; color:var(--ink-dim); font-size:16px; max-width:62ch;}
.svc-chevron{display:none;}

.service__body{margin-top:26px;}
.svc-rows{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:4px;}
.svc-row .lbl{
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--accent); margin:0 0 9px;
  display:flex; align-items:center; gap:8px;
}
.svc-row .lbl::before{content:""; width:14px; height:1.5px; background:var(--accent);
  box-shadow:0 0 calc(var(--glow) * 8px) var(--accent-glow);}
.svc-row p{margin:0; font-size:15px; color:var(--ink-dim); line-height:1.62;}
.svc-start{
  display:inline-flex; align-items:flex-start; gap:12px; margin-top:26px;
  border:1px dashed var(--line-rouge); padding:14px 18px;
  background:var(--rouge-wash); font-size:14px;
}
.svc-start b{font-family:var(--font-mono); font-size:10px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--accent); white-space:nowrap; padding-top:2px;}
.svc-start span{color:var(--ink-dim);}
@media(max-width:680px){ .svc-rows{grid-template-columns:1fr;} }

/* — TIMELINE — */
:root[data-services="timeline"] .services__list{position:relative; gap:0;}
:root[data-services="timeline"] .service{
  border:0; background:transparent; clip-path:none; padding:36px 0 36px 80px;
}
:root[data-services="timeline"] .service::after{display:none;}
:root[data-services="timeline"] .service::before{
  content:""; position:absolute; left:22px; top:56px; bottom:-36px; width:1px;
  background:linear-gradient(var(--line-rouge), var(--line));
}
:root[data-services="timeline"] .service:last-child::before{display:none;}
:root[data-services="timeline"] .service + .service{border-top:1px solid var(--line);}
:root[data-services="timeline"] .service:hover{border-color:transparent;}
:root[data-services="timeline"] .svc-badge{display:none;}
/* glowing node */
:root[data-services="timeline"] .service .svc-num::before{
  content:""; position:absolute; left:15px; top:10px; width:15px; height:15px;
  background:var(--void); border:2px solid var(--accent);
  box-shadow:0 0 calc(var(--glow) * 14px) var(--accent-glow);
  clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
}

/* — CARDS — */
:root[data-services="cards"] .services__list{grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px;}
:root[data-services="cards"] .service{min-width:0; display:flex; flex-direction:column; padding:30px;
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;}
:root[data-services="cards"] .service:hover{transform:translateY(-5px);
  box-shadow:0 0 calc(var(--glow) * 34px) var(--rouge-wash);}
:root[data-services="cards"] .service h3{overflow-wrap:break-word;}
:root[data-services="cards"] .service__head{flex-direction:column; gap:18px;}
:root[data-services="cards"] .svc-num{display:none;}
:root[data-services="cards"] .svc-rows{grid-template-columns:1fr; gap:18px;}
:root[data-services="cards"] .svc-start{margin-top:auto;}
:root[data-services="cards"] .service__body{margin-top:20px; display:flex; flex-direction:column; flex:1;}
@media(max-width:900px){ :root[data-services="cards"] .services__list{grid-template-columns:1fr;} }

/* — ACCORDION — */
:root[data-services="accordion"] .services__list{gap:16px;}
:root[data-services="accordion"] .service{padding:0; overflow:hidden;}
:root[data-services="accordion"] .service__head{padding:28px 32px; cursor:pointer; align-items:center;}
:root[data-services="accordion"] .svc-badge{display:none;}
:root[data-services="accordion"] .svc-num{font-size:34px;}
:root[data-services="accordion"] .svc-summary{display:none;}
:root[data-services="accordion"] .svc-chevron{display:block; margin-left:auto; flex-shrink:0;
  color:var(--accent); transition:transform .25s ease;}
:root[data-services="accordion"] .service.open .svc-chevron{transform:rotate(180deg);}
:root[data-services="accordion"] .service__body{margin-top:0; max-height:0; opacity:0; overflow:hidden;
  padding:0 32px; transition:max-height .35s ease, opacity .25s ease, padding .35s ease;}
:root[data-services="accordion"] .service.open{border-color:var(--line-rouge);}
:root[data-services="accordion"] .service.open .service__body{max-height:640px; opacity:1; padding:0 32px 32px;}

/* ── about ───────────────────────────────────────────────── */
.about{padding:80px 0; border-top:1px solid var(--line);}
.about__grid{display:grid; grid-template-columns:300px 1fr; gap:52px; align-items:start;}
.about__photo{
  position:relative; width:100%; aspect-ratio:4/5; overflow:hidden;
  border:1px solid var(--line-rouge); background:var(--panel);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%);
}
.about__photo::after{
  content:""; position:absolute; left:0; top:0; width:14px; height:14px;
  border-top:2px solid var(--accent); border-left:2px solid var(--accent); z-index:2;
}
.about__photo image-slot{width:100%; height:100%;}
.about__photo img, .about__img{width:100%; height:100%; object-fit:cover; display:block;}
.about h2{font-size:clamp(28px,3.6vw,42px); margin:8px 0 20px;}
.about__bio p{margin:0 0 16px; color:var(--ink-dim); font-size:16px; max-width:58ch;}
.about__bio p strong{color:var(--ink); font-weight:600;}
@media(max-width:760px){ .about__grid{grid-template-columns:1fr; gap:30px;} .about__photo{max-width:280px;} }

/* ── final CTA ───────────────────────────────────────────── */
.cta{
  position:relative; padding:96px 0; border-top:1px solid var(--line-rouge);
  background:
    radial-gradient(680px 320px at 50% 0%, rgba(255,33,56,.09), transparent 66%),
    var(--void);
}
.cta__in{max-width:780px; margin:0 auto; text-align:center; padding:0 var(--pad);}
.cta .eyebrow{color:var(--accent); margin-bottom:20px; justify-content:center;}
.cta h2{font-family:var(--font-display); font-weight:700; text-transform:uppercase;
  letter-spacing:-.01em; font-size:clamp(30px,4.6vw,54px); line-height:1.06; margin:0 0 22px; color:var(--ink);}
.cta h2 em{font-style:normal; color:var(--accent); text-shadow:0 0 calc(var(--glow) * 24px) var(--accent-glow);}
.cta p{color:var(--ink-dim); font-size:17px; margin:0 auto 36px; max-width:50ch;}

/* ── footer ──────────────────────────────────────────────── */
.foot{background:var(--void-2); color:var(--ink); padding:44px 0; border-top:1px solid var(--line);}
.foot__in{max-width:var(--content); margin:0 auto; padding:0 var(--pad);
  display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap;}
.foot .brand{color:var(--ink);}
.foot__meta{font-family:var(--font-mono); font-size:12px; letter-spacing:.06em; color:var(--muted);}
.foot a.foot__meta:hover{color:var(--accent);}

/* ── HUD status chip (nav) ───────────────────────────────── */
.sys-chip{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--muted);
}
.sys-dot{
  width:7px; height:7px; border-radius:50%; background:var(--accent);
  box-shadow:0 0 calc(var(--glow) * 10px) var(--accent-glow);
  animation:pulse 1.8s ease-in-out infinite;
}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.25;}}
@media(max-width:880px){ .sys-chip{display:none;} }

/* ── blinking caret accent on hero eyebrow ───────────────── */
.caret{display:inline-block; width:9px; height:15px; background:var(--accent);
  margin-left:2px; animation:blink 1.1s steps(1) infinite; vertical-align:-2px;}
@keyframes blink{0%,49%{opacity:1;}50%,100%{opacity:0;}}

/* ── motion / scroll reveal ──────────────────────────────── */
:root[data-motion="on"] .reveal{opacity:0;}
:root[data-motion="on"] .reveal.in{animation:revIn .7s cubic-bezier(.22,.61,.36,1) both;}
:root[data-motion="on"] .reveal.in.d1{animation-delay:.08s;}
:root[data-motion="on"] .reveal.in.d2{animation-delay:.16s;}
:root[data-motion="on"] .reveal.in.d3{animation-delay:.24s;}
@keyframes revIn{from{opacity:0; transform:translateY(22px);} to{opacity:1; transform:none;}}

:root.show-all .reveal,
:root:not([data-motion="on"]) .reveal{opacity:1 !important; transform:none !important; animation:none !important;}
@media(prefers-reduced-motion:reduce){
  :root .reveal{opacity:1 !important; transform:none !important; animation:none !important;}
  .sys-dot,.caret{animation:none !important;}
}

/* ============================================================
   ALT THEME // "CLEAN" — monochrome, border-led
   Same markup + layout; swapped palette, type & treatments.
   Activated by :root[data-theme="clean"].
   ============================================================ */
:root[data-theme="clean"]{
  --void:#f7f7f5; --void-2:#ffffff; --panel:#ffffff; --panel-2:#fafaf9;
  --ink:#0a0a0a; --ink-dim:#555553; --muted:#777775; --faint:#999997;
  --rouge:#0a0a0a; --rouge-hot:#0a0a0a; --rouge-deep:#0a0a0a;
  --rouge-glow:transparent; --rouge-wash:#f0f0ee;
  --line:#e0e0de; --line-2:#ececea; --line-rouge:#1a1a1a;
  --accent:#0a0a0a; --accent-glow:transparent; --glow:0;
  --font-display:'Syne', sans-serif;
  --font-body:'Hanken Grotesk', sans-serif;
  --font-mono:'Space Mono', monospace;
}
/* surfaces: drop the void grid + scanlines, go off-white */
:root[data-theme="clean"] body{
  background:
    radial-gradient(900px 500px at 80% -10%, rgba(0,0,0,.03), transparent 60%),
    #f7f7f5;
}
:root[data-theme="clean"] body::before{display:none;}
:root[data-theme="clean"] body::after{display:none;}
:root[data-theme="clean"] ::selection{background:#0a0a0a; color:#fff;}

/* type: kill the all-caps + neon, go heavy Title Case */
:root[data-theme="clean"] .display,
:root[data-theme="clean"] .service h3,
:root[data-theme="clean"] .cta h2{text-transform:none; letter-spacing:-.02em;}
:root[data-theme="clean"] .display{font-weight:800;}
:root[data-theme="clean"] .eyebrow{color:var(--muted); letter-spacing:.16em;}
:root[data-theme="clean"] .eyebrow::before{display:none;}
:root[data-theme="clean"] .caret{display:none;}
:root[data-theme="clean"] .hero h1 em,
:root[data-theme="clean"] .approach blockquote em,
:root[data-theme="clean"] .cta h2 em{text-shadow:none;}

/* buttons: square-ish, solid black, no clip / glow */
:root[data-theme="clean"] .btn{
  clip-path:none; border-radius:5px; background:#0a0a0a; color:#fff;
  border:1.5px solid #0a0a0a; box-shadow:none !important;
  text-transform:none; letter-spacing:0; font-family:var(--font-body); font-weight:700;
}
:root[data-theme="clean"] .btn--ghost{background:transparent; color:#0a0a0a; border-color:#0a0a0a;}
:root[data-theme="clean"] .btn--ghost:hover{background:#0a0a0a; color:#fff;}

/* nav */
:root[data-theme="clean"] .nav{background:rgba(255,255,255,.82); border-bottom:1px solid #e0e0de;}
:root[data-theme="clean"] .nav__links a{text-transform:none; letter-spacing:0;
  font-family:var(--font-body); font-weight:600; color:var(--muted);}
:root[data-theme="clean"] .nav__links a:hover{color:#0a0a0a;}
:root[data-theme="clean"] .brand{font-family:var(--font-body);}
:root[data-theme="clean"] .brand .mark{clip-path:none; border-radius:5px;
  border:1.5px solid #0a0a0a; color:#0a0a0a; box-shadow:none;}
:root[data-theme="clean"] .sys-dot{background:#0a0a0a; box-shadow:none;}

/* hero aside */
:root[data-theme="clean"] .hero__aside{clip-path:none; border:1px solid #1a1a1a;
  border-radius:6px; background:#fff;}
:root[data-theme="clean"] .hero__aside h4{background:#f0f0ee; color:#0a0a0a; letter-spacing:.12em;}
:root[data-theme="clean"] .hero__steplist .n{color:#0a0a0a;}
:root[data-theme="clean"] .hero__steplist a:hover .arw{color:#0a0a0a;}

/* services */
:root[data-theme="clean"] .service{clip-path:none; border-radius:6px;}
:root[data-theme="clean"] .service::after{display:none;}
:root[data-theme="clean"] .service:hover{border-color:#1a1a1a;}
:root[data-theme="clean"] .svc-num{color:#0a0a0a; text-shadow:none;}
:root[data-theme="clean"] .svc-badge{clip-path:none; border-radius:5px;
  border:1.5px solid #0a0a0a; color:#0a0a0a; box-shadow:none;}
:root[data-theme="clean"] .service h3{font-family:var(--font-display); font-weight:700;}
:root[data-theme="clean"] .svc-row .lbl{color:var(--muted);}
:root[data-theme="clean"] .svc-row .lbl::before{background:#0a0a0a; box-shadow:none;}
:root[data-theme="clean"] .svc-start{border:1px dashed #b0b0ae; background:#f0f0ee;}
:root[data-theme="clean"] .svc-start b{color:#0a0a0a;}
/* timeline node → simple circle */
:root[data-theme="clean"][data-services="timeline"] .service .svc-num::before{
  background:#fff; border-color:#0a0a0a; box-shadow:none; clip-path:none; border-radius:50%;
}
:root[data-theme="clean"][data-services="timeline"] .service::before{
  background:linear-gradient(#1a1a1a, #e0e0de);
}

/* about */
:root[data-theme="clean"] .about__photo{clip-path:none; border-radius:8px; border:1px solid #1a1a1a;}
:root[data-theme="clean"] .about__photo::after{display:none;}

/* final CTA */
:root[data-theme="clean"] .cta{
  background:radial-gradient(700px 360px at 50% 0%, #f0f0ee, transparent 65%), #ffffff;
  border-top:1px solid #e0e0de;
}

/* footer */
:root[data-theme="clean"] .foot{background:#fafaf9; color:#0a0a0a; border-top:1px solid #e0e0de;}
:root[data-theme="clean"] .foot .brand{color:#0a0a0a;}
:root[data-theme="clean"] .foot__meta{color:var(--muted);}