/* dirs.css — the three directions. Everything identity-level lives here. */

/* ═══════════ V1 · PRECISION — obsidian, hairline, engineered ═══════════ */
[data-dir="precision"]{
  --bg:#08090C;--bg-2:#0B0D12;--panel:#0F1116;--panel-2:#0C0E13;
  --line:rgba(255,255,255,.07);--line-2:rgba(255,255,255,.11);--line-3:rgba(255,255,255,.18);
  --ink:#E9EBF1;--muted:#888FA0;--accent:#6E7BFF;--accent-2:#3ED9C4;--accent-hover:#828DFF;--accent-ink:#0A0B10;
  --ok:#3ED9C4;--track:rgba(255,255,255,.07);--ico-bg:rgba(110,123,255,.09);
  --ghost-bg:rgba(255,255,255,.04);--ghost-hover:rgba(255,255,255,.07);
  --nav-bg:rgba(8,9,12,.55);--nav-bg-scrolled:rgba(8,9,12,.86);--foot-bg:#07080B;
  --font-display:"Instrument Sans",system-ui,sans-serif;--font-body:"Instrument Sans",system-ui,sans-serif;--font-mono:"JetBrains Mono",monospace;
  --display-weight:600;--h1max:74px;--h1lh:1.02;--h1track:-.038em;--h2max:46px;--h2track:-.03em;
  --radius:13px;--btn-radius:10px;--chip-radius:8px;--btn-weight:600;--maxw:1200px;--headw:660px;
  --sec-pad:120px;--nav-h:66px;--card-pad:24px;--card-gap:14px;--step-gap:0px;--step-pad:26px 4px;--step-cols:52px 1fr;--step-inner-gap:22px;
  --shadow:0 1px 0 rgba(255,255,255,.04) inset,0 20px 50px -24px rgba(0,0,0,.8);
  --btn-shadow:0 1px 0 rgba(255,255,255,.16) inset,0 8px 22px -10px rgba(110,123,255,.7);
  --rev-y:16px;--rev-blur:6px;--grain:.03;--logo-white:block;--logo-ink:none;--constel-a:1;--logo-sheen:rgba(255,255,255,.92);--orb-blend:normal;--pmod-accent:#3A47C9;--pmod-accent-2:#0C7F72;
  color-scheme:dark;
}
[data-dir="precision"] .step{border-bottom:1px solid var(--line);border-radius:0}
[data-dir="precision"] .steps{gap:0}
[data-dir="precision"] .step:hover{background:var(--ghost-bg)}
[data-dir="precision"] .hero::before{content:"";position:absolute;inset:-30% 20% 40% -10%;background:radial-gradient(50% 50% at 30% 40%,rgba(110,123,255,.16),transparent 70%);filter:blur(20px);z-index:-1;pointer-events:none}
[data-dir="precision"] .glow-line{height:1px;background:linear-gradient(90deg,transparent,var(--line-3),transparent);margin:0}
[data-dir="precision"] .shots{grid-template-columns:1fr}
[data-dir="precision"] .sec-alt{background:linear-gradient(180deg,transparent,rgba(255,255,255,.022) 45%,transparent)}
[data-dir="precision"]{--orb-1:radial-gradient(circle,rgba(110,123,255,.55),transparent 68%);--orb-2:radial-gradient(circle,rgba(62,217,196,.30),transparent 68%);--orb-3:radial-gradient(circle,rgba(110,123,255,.32),transparent 70%);--orb-op:.30;--orb-blur:90px;--veil:radial-gradient(120% 80% at 50% 0%,transparent,rgba(8,9,12,.55) 70%)}

/* Laptop tier: clamp()s hit their max around ~1156px, so a 13–15" laptop
   (1280–1800px logical width — including scaled-down logical widths from
   Windows 125–150% OS display scaling) rendered the same oversized
   type/spacing as a 27"+ monitor. No lower bound: OS scaling can push the
   effective viewport below any "laptop-only" cutoff, and the mobile clamp
   floor (38px / 6.4vw) already protects small phones regardless. */
@media(max-width:1800px){
[data-dir="precision"]{
  --h1max:52px;--h2max:32px;--sec-pad:64px;--nav-h:58px;--card-pad:18px;--card-gap:10px;
  --step-pad:17px 4px;
}
}

/* ═══════════ V2 · SIGNAL — warm editorial light, aurora, serif ═══════════ */
[data-dir="signal"]{
  --bg:#F7F5F1;--bg-2:#FFFFFF;--panel:#FFFFFF;--panel-2:#F2EFEA;
  --line:rgba(20,21,26,.10);--line-2:rgba(20,21,26,.16);--line-3:rgba(20,21,26,.26);
  --ink:#14151A;--muted:#6A6C77;--accent:#4B3BE8;--accent-2:#E0603A;--accent-hover:#3A2BD6;--accent-ink:#FFFFFF;
  --ok:#118A6B;--track:rgba(20,21,26,.08);--ico-bg:rgba(75,59,232,.07);
  --ghost-bg:rgba(20,21,26,.045);--ghost-hover:rgba(20,21,26,.08);
  --nav-bg:rgba(247,245,241,.6);--nav-bg-scrolled:rgba(247,245,241,.9);--foot-bg:#F2EFEA;
  --font-display:"Instrument Serif",Georgia,serif;--font-body:"Instrument Sans",system-ui,sans-serif;--font-mono:"JetBrains Mono",monospace;
  --display-weight:400;--h1max:86px;--h1lh:1.0;--h1track:-.022em;--h2max:56px;--h2track:-.018em;
  --radius:20px;--btn-radius:999px;--chip-radius:999px;--btn-weight:500;--maxw:1180px;--headw:720px;
  --sec-pad:136px;--nav-h:72px;--card-pad:28px;--card-gap:18px;--step-gap:16px;--step-pad:30px;--step-cols:1fr;--step-inner-gap:0px;
  --shadow:0 1px 2px rgba(20,21,26,.05),0 24px 48px -28px rgba(20,21,26,.28);
  --btn-shadow:0 10px 26px -12px rgba(75,59,232,.7);
  --rev-y:22px;--rev-blur:3px;--grain:0;--logo-white:none;--logo-ink:block;--constel-a:.72;--logo-sheen:color-mix(in oklab,var(--accent) 48%,#fff);--orb-blend:normal;--pmod-accent:#3B2CC4;--pmod-accent-2:#0C7F72;
  color-scheme:light;
}
[data-dir="signal"] .h2,[data-dir="signal"] .hero-h1{font-style:normal}
[data-dir="signal"] .hero{background:radial-gradient(120% 90% at 82% 8%,rgba(75,59,232,.14),transparent 58%),radial-gradient(90% 70% at 10% 96%,rgba(224,96,58,.11),transparent 62%)}
[data-dir="signal"] .step{background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow)}
[data-dir="signal"] .step:hover{transform:translateY(-2px)}
[data-dir="signal"] .steps{grid-template-columns:repeat(2,1fr)}
@media(max-width:860px){[data-dir="signal"] .steps{grid-template-columns:1fr}}
[data-dir="signal"] .step-n{font-size:11px;letter-spacing:.16em;margin-bottom:14px;padding:0}
[data-dir="signal"] .step-t{font-family:var(--font-display);font-weight:400;font-size:clamp(22px,2.2vw,28px);letter-spacing:-.01em}
[data-dir="signal"] .sec-dark{background:#101018;color:#F4F2EE;--ink:#F4F2EE;--muted:#9B9CA8;--panel:#171725;--panel-2:#14141F;--line:rgba(255,255,255,.09);--line-2:rgba(255,255,255,.14);--line-3:rgba(255,255,255,.22);--track:rgba(255,255,255,.09);--ghost-bg:rgba(255,255,255,.05);--ghost-hover:rgba(255,255,255,.09);--accent:#8E82FF;--accent-hover:#A79EFF;--accent-ink:#0D0D14;--ico-bg:rgba(142,130,255,.12);--shadow:0 24px 60px -30px rgba(0,0,0,.9);color-scheme:dark}
[data-dir="signal"] .sec-dark .logo-img--ink{display:none}
[data-dir="signal"] .sec-dark .logo-img--white{display:block}
[data-dir="signal"] .aurora{position:absolute;inset:0;pointer-events:none;background:radial-gradient(50% 60% at 20% 20%,rgba(142,130,255,.22),transparent 65%),radial-gradient(45% 55% at 85% 75%,rgba(224,96,58,.18),transparent 65%);filter:blur(30px)}
[data-dir="signal"] .shots{grid-template-columns:1fr}
[data-dir="signal"] .kpi{background:transparent;border:none;border-left:1px solid var(--line);border-radius:0;padding:6px 0 6px 22px}
[data-dir="signal"] .kpi-v{font-family:var(--font-display);font-weight:400;font-size:clamp(38px,4.4vw,54px)}
[data-dir="signal"] .kpi-d{margin-top:8px;display:block}
[data-dir="signal"]{--orb-1:radial-gradient(circle,rgba(75,59,232,.42),transparent 68%);--orb-2:radial-gradient(circle,rgba(224,96,58,.34),transparent 68%);--orb-3:radial-gradient(circle,rgba(120,90,255,.30),transparent 70%);--orb-op:.34;--orb-blur:100px;--veil:radial-gradient(110% 70% at 50% 10%,rgba(247,245,241,.5),rgba(247,245,241,.82) 75%)}

/* ═══════════ V3 · SYSTEMS — blueprint, instrument, industrial ═══════════ */
[data-dir="systems"]{
  --bg:#0A0D10;--bg-2:#0D1115;--panel:#111820;--panel-2:#0D1319;
  --line:rgba(126,166,200,.15);--line-2:rgba(126,166,200,.24);--line-3:rgba(126,166,200,.38);
  --ink:#DDE7EF;--muted:#7B8C9B;--accent:#FF6B2C;--accent-2:#35A0FF;--accent-hover:#FF7F47;--accent-ink:#0A0D10;
  --ok:#35D07A;--track:rgba(126,166,200,.14);--ico-bg:rgba(255,107,44,.10);
  --ghost-bg:rgba(126,166,200,.07);--ghost-hover:rgba(126,166,200,.12);
  --nav-bg:rgba(10,13,16,.6);--nav-bg-scrolled:rgba(10,13,16,.9);--foot-bg:#080B0E;
  --font-display:"Space Grotesk",system-ui,sans-serif;--font-body:"Instrument Sans",system-ui,sans-serif;--font-mono:"JetBrains Mono",monospace;
  --display-weight:600;--h1max:70px;--h1lh:1.04;--h1track:-.028em;--h2max:44px;--h2track:-.022em;
  --radius:4px;--btn-radius:3px;--chip-radius:3px;--btn-weight:600;--maxw:1240px;--headw:680px;
  --sec-pad:112px;--nav-h:64px;--card-pad:22px;--card-gap:12px;--step-gap:12px;--step-pad:22px;--step-cols:auto 1fr;--step-inner-gap:20px;
  --shadow:0 0 0 1px rgba(126,166,200,.05),0 18px 40px -24px rgba(0,0,0,.9);
  --btn-shadow:0 8px 20px -10px rgba(255,107,44,.65);
  --rev-y:14px;--rev-blur:4px;--grain:.05;--logo-white:block;--logo-ink:none;--constel-a:.92;--logo-sheen:rgba(255,255,255,.9);--orb-blend:normal;--pmod-accent:#AE3D07;--pmod-accent-2:#116E86;
  color-scheme:dark;
}
[data-dir="systems"] body,[data-dir="systems"] .sec{background-image:linear-gradient(rgba(126,166,200,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(126,166,200,.045) 1px,transparent 1px);background-size:64px 64px}
[data-dir="systems"] .eyebrow::before{width:0}
[data-dir="systems"] .eyebrow{gap:0}
[data-dir="systems"] .eyebrow::after{content:"";flex:1;height:1px;background:var(--line-2);margin-left:14px;max-width:120px}
[data-dir="systems"] .step{border:1px solid var(--line);background:var(--panel-2)}
[data-dir="systems"] .step:hover{border-color:var(--accent);background:var(--panel)}
[data-dir="systems"] .step-n{font-size:11px;letter-spacing:.14em;padding:5px 9px;border:1px solid var(--line-2);border-radius:3px;color:var(--accent);height:max-content}
[data-dir="systems"] .steps{grid-template-columns:repeat(2,1fr)}
@media(max-width:860px){[data-dir="systems"] .steps{grid-template-columns:1fr}}
[data-dir="systems"] .tick{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
[data-dir="systems"] .tick::before{content:"";width:5px;height:5px;background:var(--accent);flex:0 0 auto}
[data-dir="systems"] .shots{grid-template-columns:1fr}
[data-dir="systems"] .card{border-left:2px solid var(--accent)}
[data-dir="systems"] .kpi{border-left:2px solid var(--accent)}
[data-dir="systems"]{--orb-1:radial-gradient(circle,rgba(53,160,255,.34),transparent 68%);--orb-2:radial-gradient(circle,rgba(255,107,44,.30),transparent 68%);--orb-3:radial-gradient(circle,rgba(53,160,255,.22),transparent 70%);--orb-op:.26;--orb-blur:95px;--scan:linear-gradient(180deg,transparent,rgba(53,160,255,.055),transparent);--veil:radial-gradient(130% 85% at 50% 0%,transparent,rgba(10,13,16,.5) 72%)}
[data-dir="systems"] .sec-alt{background:linear-gradient(180deg,transparent,rgba(126,166,200,.03) 45%,transparent)}

/* shared structural helpers used by every direction */
.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--card-gap);align-items:start}
@media(max-width:900px){.split{grid-template-columns:1fr}}
.stack-lg{display:grid;gap:var(--card-gap)}
.pgrid{display:grid;grid-template-columns:1.25fr .75fr;gap:var(--card-gap);align-items:start}
@media(max-width:980px){.pgrid{grid-template-columns:1fr}}
.viz-frame{position:relative;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel-2);overflow:hidden;aspect-ratio:1/.92;min-height:320px}
.viz-cap{position:absolute;left:16px;bottom:14px;font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);z-index:2}
.viz-badge{position:absolute;right:14px;top:14px;z-index:2;display:flex;align-items:center;gap:7px;padding:6px 10px;border:1px solid var(--line);border-radius:var(--chip-radius);background:color-mix(in oklab,var(--panel) 82%,transparent);backdrop-filter:blur(8px);font-family:var(--font-mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.pulse{width:6px;height:6px;border-radius:50%;background:var(--ok);animation:pulse 2.2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1;box-shadow:0 0 0 0 color-mix(in oklab,var(--ok) 55%,transparent)}50%{opacity:.65;box-shadow:0 0 0 5px transparent}}
[data-motion="off"] .pulse{animation:none}