/* 70x7 company sites: shared theme + tab bar. Loaded after styles.css (a copy of the hub's style guide,
   nicholas.nac70x7.com). Theme = the 70x7 house from ~/aegis/tenants/70x7/projects/brand/README.md:
   Space Mono 700 display, Archivo body, cyan #3FC9E8 on ink #0C1416, 9px dot field.
   Tabs = the hub's rounded sliding pill (Nick, 2026-11-13), keyed by data-active instead of house. */

@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .28s; animation-timing-function: cubic-bezier(.16,1,.3,1); }
::view-transition-group(tabs-pill) { animation-duration: .36s; animation-timing-function: cubic-bezier(.3,1.35,.5,1); }
html.reveal-from-tab::view-transition-old(root), html.reveal-from-tab::view-transition-new(root) { animation: none; }

:root { --bg:#0C1416; --bg-2:#1B282C; --bg-card:#1B282C; --text:#E8F0F2; --text-mid:#8FA3A9; --text-dim:#7F9298;
  --accent:#3FC9E8; --accent-deep:#3FC9E8; --accent-10:rgba(63,201,232,.08); --accent-20:rgba(63,201,232,.2);
  --border:#1B282C; --border-mid:#2A3A3F; --serif:'Space Mono',monospace; --sans:'Archivo',system-ui,sans-serif; }
body { background-color:#0C1416; color:#8FA3A9; font-family:var(--sans);
  background-image: radial-gradient(rgba(63,201,232,.20) 1px, transparent 1px); background-size: 9px 9px; }
h1, h2, h3, h4 { font-family:'Space Mono',monospace; font-weight:700; color:#E8F0F2; letter-spacing:-.02em; }
a { color:#3FC9E8; } a:hover { color:#7FDDF0; }
strong { color:#E8F0F2; font-weight:600; }

/* ---------- TAB BAR ---------- */
nav.tabs:not(.case-footer-nav) { position:fixed; top:16px; left:0; right:0; z-index:100; display:flex; justify-content:center; pointer-events:none;
  transform:none; width:auto; max-width:none; padding:0 16px; margin:0; background:none; border:0; border-radius:0; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
.tabs-track { --n:3; pointer-events:auto; position:relative; display:grid; grid-template-columns:repeat(var(--n),1fr); width:min(520px,100%); padding:6px; border-radius:100vw;
  background:rgba(27,40,44,.94); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); box-shadow:0 8px 28px rgba(12,20,22,.35), 0 0 0 1px #2A3A3F; view-transition-name:tabs-bar; }
.tabs-track a { position:relative; z-index:1; display:flex; align-items:center; justify-content:center; height:40px; padding:0 10px; border-radius:100vw; white-space:nowrap;
  font-family:'Space Mono',monospace; font-size:13px; font-weight:700; color:#8FA3A9; text-decoration:none; transition:color .28s cubic-bezier(.16,1,.3,1); }
.tabs-track a.on-pill { color:#0C1416; }
.tab-pill { --i:0; position:absolute; z-index:0; top:6px; bottom:6px; left:6px; width:calc((100% - 12px) / var(--n)); border-radius:100vw; background:#3FC9E8;
  transform:translateX(calc(var(--i) * 100%)); transition:transform .36s cubic-bezier(.3,1.35,.5,1); view-transition-name:tabs-pill; }
.tabs-track[data-active="0"] .tab-pill { --i:0; } .tabs-track[data-active="1"] .tab-pill { --i:1; } .tabs-track[data-active="2"] .tab-pill { --i:2; }
.tabs-track:has(a:nth-of-type(1):is(:hover,:focus-visible)) .tab-pill { --i:0; }
.tabs-track:has(a:nth-of-type(2):is(:hover,:focus-visible)) .tab-pill { --i:1; }
.tabs-track:has(a:nth-of-type(3):is(:hover,:focus-visible)) .tab-pill { --i:2; }
.tabs-track[data-go="0"] .tab-pill { --i:0 !important; } .tabs-track[data-go="1"] .tab-pill { --i:1 !important; } .tabs-track[data-go="2"] .tab-pill { --i:2 !important; }
@media (max-width:480px) { .tabs-track a { font-size:11px; padding:0 4px; } }
@media (prefers-reduced-motion:reduce) { @view-transition { navigation:none; } .tab-pill, .tabs-track a { transition:none !important; } }

/* ---------- COMPONENTS ON INK ---------- */
.hero { background:transparent; border-bottom:5px solid #1B282C; }
.hero::before { background:radial-gradient(ellipse 70% 50% at 50% 45%, rgba(63,201,232,.08) 0%, transparent 70%); }
.hero-name { color:#3FC9E8; font-family:'Space Mono',monospace; }
.hero-title { color:#E8F0F2; font-family:'Space Mono',monospace; }
.hero-sub { color:#9FB2B7; }
.hero-cta { background:#3FC9E8; border-color:#3FC9E8; color:#0C1416; border-radius:100vw; font-family:'Space Mono',monospace; }
.hero-cta:hover { background:#7FDDF0; border-color:#7FDDF0; color:#0C1416; box-shadow:0 8px 24px rgba(63,201,232,.25); }
.hero-cta.secondary { background:transparent; color:#E8F0F2; border-color:#2A3A3F; }
.hero-cta.secondary:hover { background:#1B282C; border-color:#3FC9E8; color:#E8F0F2; box-shadow:none; }
.stats { background:transparent; border-bottom:5px solid #1B282C; }
.stat-num { color:#3FC9E8; font-family:'Space Mono',monospace; }
.stat-label { color:#8FA3A9; }
.section-label { font-family:'Space Mono',monospace; color:#3FC9E8; }
.capabilities, .about, .footer-cta { border-top:5px solid #1B282C; }
.capability { background:#1B282C; border:1px solid #2A3A3F; box-shadow:none; }
.capability:hover { border-color:#3FC9E8; box-shadow:none; }
.capability h3 { color:#E8F0F2; font-family:'Space Mono',monospace; font-weight:700; }
.capability p { color:#9FB2B7; }
.featured-role { font-family:'Space Mono',monospace; color:#3FC9E8; }
.view-link { color:#3FC9E8; }
.page-header h1 { color:#3FC9E8; }
.page-header p { color:#9FB2B7; max-width:640px; }
.about-text p { color:#8FA3A9; }
.about-text p:first-child { font-family:'Space Mono',monospace; font-weight:700; color:#E8F0F2; letter-spacing:-.02em; }
.vignette { background:#1B282C; border-left:2px solid #3FC9E8; border-bottom:1px solid #0C1416; padding:20px 24px; }
.vignette p { color:#9FB2B7; }
.footer-cta h2 a { color:#E8F0F2; } .footer-cta h2 a:hover { color:#3FC9E8; }
.footer-sub, .footer-info { color:#7F9298; }
.footer-info a { color:#9FB2B7; }
footer { background:#0C1416; border-top:1px solid #1B282C; }
.footer-social a { background:#1B282C; border-color:#2A3A3F; color:#8FA3A9; }
