/* =========================================================
   REVITA GROWTH — Design tokens
   Subject: CRM / candidate-database revival for staffing agencies
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Inter:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --bg:        #F2EAD6;
  --bg-deep:   #E9DDBE;
  --ink:       #16140F;
  --ink-soft:  #524C3E;
  --card:      #FDFAF1;
  --line:      #D8C9A0;
  --rust:      #E15321;
  --rust-deep: #AD3B12;
  --pine:      #1B4A40;
  --pine-soft: #2E6357;
  --ghost:     #B9AF97;

  --font-display: 'Archivo Black', 'Arial Black', sans-serif;
  --font-body: 'Inter', -apple-system, sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;

  --container: 1180px;
  --radius-s: 6px;
  --radius-m: 14px;
  --ease: cubic-bezier(.22,.68,0,1);

  /* dark / glass contrast system */
  --navy:       #0F131B;
  --navy-2:     #171E2A;
  --navy-3:     #212B3B;
  --navy-line:  rgba(255,255,255,.09);
  --navy-ink:   #EDE7D6;
  --navy-ink-soft: #9AA3B4;
  --glow:       #FFB25B;
  --glow-deep:  #E15321;
  --glass-bg:   rgba(255,255,255,.045);
  --glass-bg-hi:rgba(255,255,255,.09);
}

*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

body{
  margin:0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration: none; }
ul{ list-style: none; margin:0; padding:0; }

.wrap{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 32px;
}

h1,h2,h3,h4{
  font-family: var(--font-display);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -0.01em;
  margin: 0;
  text-wrap: balance;
}

h1{ font-size: clamp(2.6rem, 5.4vw, 4.9rem); }
h2{ font-size: clamp(2rem, 3.6vw, 3.1rem); }
h3{ font-size: clamp(1.25rem, 2vw, 1.6rem); }

p{ margin:0; color: var(--ink-soft); max-width: 62ch; }

.mono{ font-family: var(--font-mono); }

:focus-visible{
  outline: 2px solid var(--rust);
  outline-offset: 3px;
}

/* ---------- Header ---------- */
.site-header{
  position: sticky; top:0; z-index: 90;
  background: rgba(242,234,214,.86);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
.site-header .wrap{
  display:flex; align-items:center; justify-content:space-between;
  height: 78px;
}
.brand{
  display:flex; align-items:center; gap:10px;
  font-family: var(--font-display);
  font-size: 1.22rem;
  color: var(--ink);
}
.brand .dot{
  width:10px; height:10px; border-radius:50%;
  background: var(--rust);
  box-shadow: 0 0 0 4px rgba(225,83,33,.16);
}
.brand small{
  display:block; font-family: var(--font-mono); font-size:.56rem;
  letter-spacing:.06em; color: var(--pine); font-weight:600; margin-top:1px;
}
.main-nav ul{ display:flex; gap:34px; align-items:center; }
.main-nav a{
  font-size:.94rem; font-weight:600; color: var(--ink-soft);
  position:relative; padding: 6px 0;
  transition: color .2s var(--ease);
}
.main-nav a:hover, .main-nav a.active{ color: var(--ink); }
.main-nav a.active::after{
  content:''; position:absolute; left:0; right:0; bottom:0;
  height:2px; background: var(--rust);
}
.nav-cta{
  display:inline-flex; align-items:center; gap:8px;
  background: var(--ink); color: var(--bg) !important;
  font-family: var(--font-mono); font-size:.82rem; font-weight:600;
  padding: 11px 18px; border-radius: 100px;
  transition: background .2s var(--ease), transform .2s var(--ease);
}
.nav-cta:hover{ background: var(--rust); transform: translateY(-1px); }
.nav-toggle{ display:none; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding: 15px 26px; border-radius: 100px;
  font-weight: 700; font-size: .98rem;
  border: 1px solid transparent; cursor:pointer;
  transition: transform .2s var(--ease), background .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease);
}
.btn-primary{ background: var(--rust); color:#fff; }
.btn-primary:hover{ background: var(--rust-deep); transform: translateY(-2px); }
.btn-ghost{ border-color: var(--ink); color: var(--ink); background:transparent; }
.btn-ghost:hover{ background: var(--ink); color: var(--bg); }
.btn-line{ border-bottom:2px solid var(--ink); border-radius:0; padding:6px 0; }

/* ---------- Section shell ---------- */
section{ padding: 108px 0; position:relative; }
.section-tight{ padding: 72px 0; }
.eyebrow{
  font-family: var(--font-mono); font-size:.78rem; color: var(--pine);
  font-weight:600; margin-bottom: 18px; display:flex; align-items:center; gap:10px;
}
.eyebrow::before{ content:''; width:22px; height:1px; background: var(--pine); }

/* ---------- HERO ---------- */
.hero{ padding-top: 78px; overflow:hidden; }
.hero-grid{
  display:grid; grid-template-columns: 1.15fr 1fr; gap:60px; align-items:center;
  padding: 64px 0 40px;
}
.hero h1{ margin-bottom: 26px; }
.hero h1 .strike{
  color: var(--ghost); text-decoration: line-through; text-decoration-color: var(--rust); text-decoration-thickness: 4px;
}
.hero p.lead{ font-size: 1.14rem; max-width: 46ch; margin-bottom: 34px; }
.hero-actions{ display:flex; align-items:center; gap:26px; flex-wrap:wrap; }
.hero-note{ font-family: var(--font-mono); font-size:.8rem; color: var(--ink-soft); }

.hero-stats{
  display:flex; gap:38px; margin-top:58px; padding-top:30px; border-top:1px solid var(--line);
  flex-wrap:wrap;
}
.stat b{ display:block; font-family: var(--font-display); font-size: 2.1rem; color: var(--rust); font-weight:400; }
.stat span{ font-family: var(--font-mono); font-size:.74rem; color: var(--ink-soft); }

/* ---------- Orbit visual (signature motif) ---------- */
.orbit-stage{
  position: relative; width:100%; aspect-ratio: 1/1; max-width: 480px; margin: 0 auto;
}
.orbit-core{
  position:absolute; inset:28%;
  border-radius:50%;
  background: radial-gradient(circle at 32% 28%, #ff9257, var(--rust) 55%, var(--rust-deep) 100%);
  box-shadow: 0 0 60px rgba(225,83,33,.45), inset -10px -10px 30px rgba(0,0,0,.25);
  display:flex; align-items:center; justify-content:center;
  animation: pulse 4.5s ease-in-out infinite;
}
.orbit-core svg{ width:62%; height:62%; }
@keyframes pulse{
  0%,100%{ box-shadow: 0 0 46px rgba(225,83,33,.4), inset -10px -10px 30px rgba(0,0,0,.25); }
  50%{ box-shadow: 0 0 78px rgba(225,83,33,.6), inset -10px -10px 30px rgba(0,0,0,.25); }
}
.orbit-ring{
  position:absolute; inset:0; border-radius:50%;
  border:1px dashed rgba(22,20,15,.18);
  animation: spin 38s linear infinite;
}
.orbit-ring.r2{ inset:8%; animation-duration: 26s; animation-direction: reverse; border-style: solid; border-color: rgba(22,20,15,.1); }
@keyframes spin{ to{ transform: rotate(360deg); } }

.orbit-card{
  position:absolute; width: 172px;
  display:flex; align-items:flex-start; gap:10px;
  background: var(--card); border:1px solid var(--line); border-radius: var(--radius-s);
  padding: 12px 13px; box-shadow: 0 14px 30px rgba(22,20,15,.12);
  font-family: var(--font-mono); font-size:.62rem; color: var(--ink-soft);
  opacity:0; animation: cardIn .7s var(--ease) forwards;
}
.orbit-copy{ display:flex; flex-direction:column; min-width:0; }
.orbit-label{ letter-spacing:.03em; }
.orbit-card .name{
  font-family: var(--font-body); font-weight:700; font-size:.78rem; color: var(--ink);
  margin-top:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.orbit-card.ghost .name{ font-style:italic; font-weight:500; color: var(--ink-soft); }
.orbit-card .tag{
  display:inline-block; margin-top:6px; padding:2px 7px; border-radius:100px;
  font-size:.56rem; font-weight:700; letter-spacing:.02em; align-self:flex-start;
}
.orbit-card.verified .tag{ background: rgba(27,74,64,.12); color: var(--pine); }
.orbit-card.ghost{ opacity:.5; filter: grayscale(1); }
.orbit-card.ghost .tag{ background: rgba(22,20,15,.08); color: var(--ink-soft); }
.orbit-card.c1{ top:-6%; left:2%; animation-delay:.15s; }
.orbit-card.c2{ top:4%; right:-12%; animation-delay:.35s; }
.orbit-card.c3{ bottom:2%; left:-14%; animation-delay:.55s; }
.orbit-card.c4{ bottom:-8%; right:0%; animation-delay:.75s; }
@keyframes cardIn{ from{ opacity:0; transform: translateY(14px) scale(.94); } to{ opacity:1; transform:none; } }
.orbit-card.ghost{ animation: cardIn .7s var(--ease) forwards, flicker 5s ease-in-out 2s infinite; }
@keyframes flicker{ 0%,100%{ opacity:.5; } 50%{ opacity:.22; } }

/* icon chips on orbit cards */
.orbit-icon{
  flex-shrink:0; width:26px; height:26px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background: rgba(22,20,15,.06);
}
.orbit-icon svg{ width:15px; height:15px; }
.orbit-icon.i-check{ background: rgba(27,74,64,.12); }
.orbit-icon.i-check svg path{ stroke: var(--pine); }
.orbit-icon.i-ghost{ background: rgba(22,20,15,.08); }
.orbit-icon.i-ghost svg path{ fill: var(--ink-soft); }
.orbit-icon.i-ghost svg .eye{ fill: var(--card); }

/* faint rotating dot-grid behind the orbit, suggests "database" */
.orbit-grid{
  position:absolute; inset:-8%; border-radius:50%;
  background-image: radial-gradient(rgba(22,20,15,.16) 1px, transparent 1.4px);
  background-size: 22px 22px;
  -webkit-mask-image: radial-gradient(circle, #000 55%, transparent 78%);
  mask-image: radial-gradient(circle, #000 55%, transparent 78%);
  animation: spin 90s linear infinite;
}

/* connecting "data flow" lines from cards to the core */
.orbit-links{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.orbit-links .link{
  fill:none; stroke-width:1.4; stroke-linecap:round;
  stroke-dasharray: 3 7;
  animation: flow 2.4s linear infinite;
}
.orbit-links .link.verified{ stroke: var(--pine-soft); opacity:.55; }
.orbit-links .link.ghost{ stroke: var(--ghost); opacity:.35; stroke-dasharray: 1.5 8; animation-duration: 3.6s; }
@keyframes flow{ to{ stroke-dashoffset: -40; } }

/* small particles drifting around the orbit ring */
.orbit-particles{ position:absolute; inset:0; }
.orbit-particle{
  position:absolute; top:50%; left:50%; width:6px; height:6px; border-radius:50%;
  background: var(--rust); box-shadow: 0 0 10px rgba(225,83,33,.7);
  transform-origin: -80px 0;
}
.orbit-particle.p1{ animation: orbitSpin 14s linear infinite; }
.orbit-particle.p2{ animation: orbitSpin 20s linear infinite reverse; transform-origin: -125px 0; opacity:.7; }
.orbit-particle.p3{ animation: orbitSpin 26s linear infinite; transform-origin: -150px 0; opacity:.5; }
@keyframes orbitSpin{ from{ transform: rotate(0deg) translateX(80px); } to{ transform: rotate(360deg) translateX(80px); } }

/* ---------- Logo strip ---------- */
.logo-strip{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.logo-strip .wrap{
  display:flex; align-items:center; gap:48px; padding: 30px 32px;
  flex-wrap:wrap; justify-content:space-between;
}
.logo-strip span{
  font-family: var(--font-mono); font-size:.85rem; color: var(--ink-soft); font-weight:500;
  letter-spacing:.02em;
}

/* ---------- Problem section ---------- */
.problem-grid{ display:grid; grid-template-columns: .8fr 1.2fr; gap:70px; align-items:start; }
.decay-list{ margin-top: 28px; }
.decay-item{
  display:flex; justify-content:space-between; align-items:baseline;
  padding: 20px 0; border-top:1px solid var(--line);
  gap: 20px;
}
.decay-item:last-child{ border-bottom:1px solid var(--line); }
.decay-item .label{ font-weight:600; }
.decay-item .num{ font-family: var(--font-mono); color: var(--rust); font-weight:600; white-space:nowrap; }

/* ---------- Services / pillars ---------- */
.pillars{
  display:grid; grid-template-columns: repeat(4, 1fr); gap:1px;
  background: var(--line); border:1px solid var(--line); border-radius: var(--radius-m); overflow:hidden;
  margin-top: 50px;
}
.pillar{
  background: var(--card); padding: 36px 26px; min-height: 260px;
  display:flex; flex-direction:column; gap:16px;
}
.pillar .idx{ font-family: var(--font-mono); color: var(--rust); font-size:.85rem; font-weight:600; }
.pillar h3{ margin-top:2px; }
.pillar p{ font-size:.92rem; }

/* ---------- Process ---------- */
.process-row{
  display:grid; grid-template-columns: 90px 1fr; gap: 26px;
  padding: 30px 0; border-top:1px solid var(--line);
}
.process-row:last-child{ border-bottom:1px solid var(--line); }
.process-row .step-num{ font-family: var(--font-display); font-size:1.9rem; color: var(--ghost); }
.process-row h3{ margin-bottom:8px; }

/* ---------- CTA band ---------- */
.cta-band{
  background: var(--pine); color:#EFEBDA; border-radius: var(--radius-m);
  padding: 64px 56px; display:flex; align-items:center; justify-content:space-between; gap:40px;
  flex-wrap:wrap;
}
.cta-band h2{ color:#fff; max-width: 14ch; }
.cta-band p{ color:#C9D6D0; }
.cta-band .btn-primary{ background:#fff; color: var(--pine); }
.cta-band .btn-primary:hover{ background: var(--rust); color:#fff; }

/* ---------- Cards generic ---------- */
.card{
  background: var(--card); border:1px solid var(--line); border-radius: var(--radius-m);
  padding: 32px;
}

/* ---------- Footer ---------- */
footer.site-footer{ border-top:1px solid var(--line); padding: 64px 0 34px; }
.footer-top{
  display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px;
  padding-bottom: 46px; border-bottom:1px solid var(--line);
}
.footer-top h4{ font-family: var(--font-mono); font-size:.78rem; color: var(--ink-soft); font-weight:600; margin-bottom:16px; }
.footer-top ul li{ margin-bottom: 10px; }
.footer-top a{ font-size:.92rem; color: var(--ink-soft); transition: color .2s; }
.footer-top a:hover{ color: var(--rust); }
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center; padding-top: 24px;
  font-family: var(--font-mono); font-size:.76rem; color: var(--ink-soft); flex-wrap:wrap; gap:12px;
}

/* ---------- Reveal-on-scroll (single subtle utility, used sparingly) ----------
   Visible by default (no-JS / slow-JS safe). Only animates once .js is confirmed
   on <html> AND IntersectionObserver has actually fired. */
.reveal{ opacity:1; transform:none; }
html.js .reveal{ opacity:0; transform: translateY(18px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
html.js .reveal.in{ opacity:1; transform:none; }

/* ---------- Page hero (inner pages) ---------- */
.page-hero{ padding: 64px 0 30px; }
.page-hero .eyebrow{ margin-bottom: 22px; }
.page-hero p.lead{ font-size:1.08rem; max-width: 60ch; margin-top:20px; }

/* ---------- Team / values grid ---------- */
.values-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:26px; margin-top:46px; }

/* ---------- Timeline (about) ---------- */
.timeline{ margin-top: 50px; }
.tl-row{ display:grid; grid-template-columns: 120px 1fr; gap:26px; padding:26px 0; border-top:1px solid var(--line); }
.tl-row:last-child{ border-bottom:1px solid var(--line); }
.tl-row .yr{ font-family: var(--font-mono); color: var(--rust); font-weight:600; }

/* ---------- Contact ---------- */
.contact-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:64px; align-items:start; }
.field{ margin-bottom: 20px; }
.field label{ display:block; font-family: var(--font-mono); font-size:.76rem; color: var(--ink-soft); margin-bottom:8px; }
.field input, .field textarea, .field select{
  width:100%; background: var(--card); border:1px solid var(--line); border-radius: var(--radius-s);
  padding: 13px 14px; font-family: var(--font-body); font-size:.96rem; color: var(--ink);
  transition: border-color .2s;
}
.field input:focus, .field textarea:focus, .field select:focus{ border-color: var(--rust); outline:none; }
.field textarea{ resize: vertical; min-height: 120px; }
.contact-info .info-row{ display:flex; gap:16px; padding:18px 0; border-top:1px solid var(--line); }
.contact-info .info-row:last-child{ border-bottom:1px solid var(--line); }
.contact-info .info-row span.k{ font-family: var(--font-mono); font-size:.76rem; color: var(--ink-soft); width:100px; flex-shrink:0; }

/* ---------- Services page detail rows ---------- */
.service-detail{ display:grid; grid-template-columns: .9fr 1.1fr; gap:60px; align-items:center; padding: 70px 0; border-top:1px solid var(--line); }
.service-detail:last-of-type{ border-bottom:1px solid var(--line); }
.service-detail.rev{ direction: rtl; }
.service-detail.rev > *{ direction: ltr; }
.mini-list li{ display:flex; gap:10px; padding:10px 0; font-size:.94rem; color: var(--ink-soft); border-top:1px solid var(--line); }
.mini-list li:first-child{ border-top:none; }
.mini-list li::before{ content:'—'; color: var(--rust); flex-shrink:0; }

/* =========================================================
   DARK / GLASS CONTRAST SYSTEM
   ========================================================= */

.dark-section{
  background: var(--navy);
  color: var(--navy-ink);
  position: relative;
  overflow: hidden;
}
.dark-section::before{
  content:'';
  position:absolute; inset:0;
  background:
    radial-gradient(520px 320px at 12% 0%, rgba(255,178,91,.10), transparent 60%),
    radial-gradient(600px 380px at 92% 100%, rgba(225,83,33,.10), transparent 60%);
  pointer-events:none;
}
.dark-section .eyebrow{ color: var(--glow); }
.dark-section .eyebrow::before{ background: var(--glow); }
.dark-section h2, .dark-section h1, .dark-section h3{ color:#fff; }
.dark-section p{ color: var(--navy-ink-soft); }

.glass-card{
  background: var(--glass-bg);
  border: 1px solid var(--navy-line);
  border-radius: var(--radius-m);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  position: relative;
  transition: background .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
}
.glass-card:hover{ background: var(--glass-bg-hi); border-color: rgba(255,178,91,.35); transform: translateY(-3px); }

/* ---------- Crystal core (brand motif) ---------- */
.crystal{ display:block; filter: drop-shadow(0 0 26px rgba(255,178,91,.55)); }
.crystal .facet-a{ fill: url(#crystalGradA); }
.crystal .facet-b{ fill: url(#crystalGradB); }
.crystal .facet-c{ fill: url(#crystalGradC); }
.crystal .facet-edge{ stroke: rgba(255,255,255,.35); stroke-width: .6; fill:none; }
.crystal-spin{ animation: crystalSpin 16s linear infinite; transform-origin: center; }
@keyframes crystalSpin{ to{ transform: rotate(360deg); } }
.crystal-pulse{ animation: crystalPulse 3.6s ease-in-out infinite; }
@keyframes crystalPulse{ 0%,100%{ filter: drop-shadow(0 0 20px rgba(255,178,91,.45)); } 50%{ filter: drop-shadow(0 0 40px rgba(255,178,91,.75)); } }

.crystal-badge{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:50%;
  background: radial-gradient(circle at 32% 28%, #2a2118, var(--navy) 70%);
  border: 1px solid var(--navy-line);
  flex-shrink:0;
}
.crystal-badge svg{ width:22px; height:22px; }

/* ---------- Hero panel (dark) ---------- */
.hero{ background: var(--navy); color: var(--navy-ink); position:relative; overflow:hidden; padding-bottom: 0; }
.hero::before{
  content:'';
  position:absolute; inset:0;
  background:
    radial-gradient(680px 420px at 78% 12%, rgba(255,178,91,.16), transparent 62%),
    radial-gradient(520px 360px at 6% 92%, rgba(225,83,33,.14), transparent 60%);
  pointer-events:none;
}
.hero .eyebrow{ color: var(--glow); }
.hero .eyebrow::before{ background: var(--glow); }
.hero h1{ color:#fff; }
.hero h1 .strike{ color:#5C6376; text-decoration-color: var(--glow); }
.hero p.lead{ color: var(--navy-ink-soft); }
.hero-note.mono{ color:#7C8598; }
.hero-stats{ border-top-color: var(--navy-line); }
.stat b{ color: var(--glow); }
.stat span{ color:#7C8598; }
.hero .btn-line{ border-bottom-color: #fff; color:#fff; }

/* orbit stage restyle: glass cards on dark */
.orbit-core{ background:transparent; box-shadow:none; animation:none; position:absolute; inset:28%; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.orbit-core::before{
  content:'';
  position:absolute; inset:-35%;
  border-radius:50%;
  background: radial-gradient(circle, rgba(255,178,91,.30), rgba(255,122,46,.09) 55%, transparent 75%);
  pointer-events:none;
}
.orbit-ring{ border-color: rgba(255,255,255,.14); }
.orbit-ring.r2{ border-color: rgba(255,255,255,.08); }
.orbit-card{
  background: var(--glass-bg);
  border: 1px solid var(--navy-line);
  backdrop-filter: blur(10px);
  color: var(--navy-ink-soft);
}
.orbit-card .name{ color:#fff; }
.orbit-card.ghost .name{ color: var(--navy-ink-soft); }
.orbit-card.verified .tag{ background: rgba(255,178,91,.16); color: var(--glow); }
.orbit-card.ghost{ opacity:.42; filter:none; }
.orbit-card.ghost .tag{ background: rgba(255,255,255,.06); color:#7C8598; }

/* dark-theme restyle for icons, grid and links */
.orbit-icon{ background: rgba(255,255,255,.07); }
.orbit-icon.i-check{ background: rgba(255,178,91,.16); }
.orbit-icon.i-check svg path{ stroke: var(--glow); }
.orbit-icon.i-ghost{ background: rgba(255,255,255,.06); }
.orbit-icon.i-ghost svg path{ fill:#7C8598; }
.orbit-icon.i-ghost svg .eye{ fill: var(--navy-2); }
.orbit-grid{ background-image: radial-gradient(rgba(255,255,255,.14) 1px, transparent 1.4px); }
.orbit-links .link.verified{ stroke: var(--glow); opacity:.5; }
.orbit-links .link.ghost{ stroke:#5C6376; opacity:.4; }

.logo-strip{ background: var(--navy-2); border-color: var(--navy-line); }
.logo-strip span{ color: var(--navy-ink-soft); }

/* ---------- CTA band -> dark glass ---------- */
.cta-band{
  background: var(--navy-2);
  color: var(--navy-ink);
  border: 1px solid var(--navy-line);
  position: relative; overflow:hidden;
}
.cta-band::before{
  content:'';
  position:absolute; inset:0;
  background: radial-gradient(420px 260px at 88% 20%, rgba(255,178,91,.16), transparent 65%);
  pointer-events:none;
}
.cta-band h2{ color:#fff; }
.cta-band p{ color: var(--navy-ink-soft); }
.cta-band .btn-primary{ background: var(--glow); color: var(--navy); }
.cta-band .btn-primary:hover{ background:#fff; color: var(--navy); }

/* ---------- Results / impact section ---------- */
.results-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:18px; margin-top:50px; }
.result-card{ padding: 30px 24px; }
.result-card .rk{ font-family: var(--font-mono); font-size:.72rem; color:#7C8598; margin-bottom:14px; }
.result-card b{ display:block; font-family: var(--font-display); font-size:2.4rem; color: var(--glow); font-weight:400; margin-bottom:8px; }
.result-card span.desc{ font-size:.86rem; color: var(--navy-ink-soft); }

/* ---------- pillars on dark ---------- */
.dark-section .pillars{ background: var(--navy-line); border-color: var(--navy-line); }
.dark-section .pillar{ background: var(--navy-2); }
.dark-section .pillar h3{ color:#fff; }
.dark-section .pillar p{ color: var(--navy-ink-soft); }
.dark-section .pillar .idx{ color: var(--glow); }

/* ---------- page-hero crystal chip (inner pages) ---------- */
.page-hero{ background: var(--navy); color: var(--navy-ink); position:relative; overflow:hidden; }
.page-hero::before{
  content:'';
  position:absolute; inset:0;
  background: radial-gradient(560px 340px at 88% 0%, rgba(255,178,91,.14), transparent 62%);
  pointer-events:none;
}
.page-hero .eyebrow{ color: var(--glow); }
.page-hero .eyebrow::before{ background: var(--glow); }
.page-hero h1{ color:#fff; }
.page-hero p.lead{ color: var(--navy-ink-soft); }
.page-hero-row{ display:flex; align-items:flex-start; gap:20px; }

/* cards inside dark inner-page sections reuse .glass-card */
.dark-section .card{ background: var(--glass-bg); border-color: var(--navy-line); color: var(--navy-ink-soft); }
.dark-section .card h3{ color:#fff; }
.dark-section .decay-item{ border-color: var(--navy-line); }
.dark-section .decay-item .num{ color: var(--glow); }
.dark-section .mini-list li{ border-color: var(--navy-line); color: var(--navy-ink-soft); }
.dark-section .process-row{ border-color: var(--navy-line); }
.dark-section .process-row .step-num{ color:#3A4356; }
.dark-section .tl-row{ border-color: var(--navy-line); }

/* ---------- Footer -> dark bookend ---------- */
footer.site-footer{
  background: var(--navy); color: var(--navy-ink-soft);
  border-top: 1px solid var(--navy-line);
}
footer.site-footer .brand{ color:#fff; }
footer.site-footer .footer-top{ border-color: var(--navy-line); }
footer.site-footer h4{ color:#7C8598; }
footer.site-footer a{ color: var(--navy-ink-soft); }
footer.site-footer a:hover{ color: var(--glow); }
footer.site-footer .footer-bottom{ color:#5C6577; }

/* header stays cream/light for contrast against dark hero */

/* ---------- Responsive ---------- */
@media (max-width: 980px){
  .hero-grid{ grid-template-columns: 1fr; }
  .orbit-stage{ order:-1; max-width: 340px; }
  .problem-grid{ grid-template-columns: 1fr; }
  .pillars{ grid-template-columns: repeat(2,1fr); }
  .values-grid{ grid-template-columns: 1fr 1fr; }
  .contact-grid{ grid-template-columns: 1fr; }
  .service-detail{ grid-template-columns: 1fr; }
  .footer-top{ grid-template-columns: 1fr 1fr; row-gap: 36px; }
  .results-grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px){
  .main-nav{ display:none; }
  .wrap{ padding: 0 20px; }
  section{ padding: 72px 0; }
  .pillars{ grid-template-columns: 1fr; }
  .values-grid{ grid-template-columns: 1fr; }
  .cta-band{ padding: 40px 26px; flex-direction:column; align-items:flex-start; }
  .hero-stats{ gap:26px; }
  .results-grid{ grid-template-columns: 1fr; }
}