:root {
  --ink: #0b0c0d;
  --ink-soft: #151718;
  --paper: #f4f4f0;
  --paper-deep: #e9e9e3;
  --lime: #c9ff00;
  --line: rgba(11, 12, 13, 0.2);
  --muted: #6e7472;
  --white-muted: rgba(244, 244, 240, 0.62);
  --serif: Georgia, 'Times New Roman', serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--ink);
  color: var(--paper);
  font-family: var(--sans);
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
.page-shell { overflow: hidden; }

.site-header {
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  right: 0;
  max-width: 1440px;
  margin: auto;
  padding: 29px clamp(24px, 5vw, 72px);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.wordmark { letter-spacing: .32em; font-size: 15px; font-weight: 700; }
.wordmark span, .signal-strip b, .audit-row em { color: var(--lime); }
.site-nav { display: flex; align-items: center; gap: clamp(18px, 3vw, 46px); font-size: 13px; color: var(--white-muted); }
.site-nav a:not(.nav-cta):hover, .text-link:hover { color: var(--paper); }
.nav-cta, .mobile-cta { color: var(--lime); }
.nav-cta span, .mobile-cta span, .button span { padding-left: 8px; }
.mobile-cta { display: none; font-size: 13px; }

.hero {
  position: relative;
  min-height: min(790px, calc(100vh - 107px));
  min-height: min(790px, calc(100svh - 107px));
  background: var(--ink);
  isolation: isolate;
}
.hero-copy {
  position: relative;
  z-index: 2;
  align-self: center;
  max-width: 900px;
  padding: clamp(110px, 15vh, 150px) 5vw clamp(72px, 9.5vh, 110px) clamp(24px, 9vw, 140px);
  padding: clamp(110px, 15svh, 150px) 5vw clamp(72px, 9.5svh, 110px) clamp(24px, 9vw, 140px);
}
.parallax-item { --parallax-y: 0px; transform: translate3d(0, var(--parallax-y), 0); will-change: transform; }
.eyebrow { margin: 0 0 24px; color: var(--lime); font-size: 12px; font-weight: 750; letter-spacing: .16em; }
.eyebrow-dark { color: #668000; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { letter-spacing: -.065em; }
h1 { max-width: 760px; margin-bottom: 30px; font-size: clamp(3.6rem, min(6.4vw, 9.5vh), 7.2rem); line-height: .91; font-weight: 600; }
h1 { font-size: clamp(3.6rem, min(6.4vw, 9.5svh), 7.2rem); }
.hero-summary { max-width: 505px; color: var(--white-muted); font-size: 19px; line-height: 1.46; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 25px; margin-top: 38px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 51px; padding: 0 22px; border: 1px solid transparent; font-size: 14px; font-weight: 700; transition: transform .2s ease, background .2s ease, color .2s ease; cursor: pointer; }
.button:hover { transform: translateY(-2px); }
.button-lime { background: var(--lime); color: var(--ink); }
.button-lime:hover { background: #e0ff71; }
.button-outline { color: var(--paper); border-color: rgba(244, 244, 240, .45); }
.button-outline:hover { border-color: var(--lime); color: var(--lime); }
.text-link { color: var(--paper); font-size: 14px; border-bottom: 1px solid rgba(244,244,240,.4); padding-bottom: 4px; }
.text-link span { color: var(--lime); padding-left: 8px; }
.microcopy { margin: 19px 0 0; color: rgba(244,244,240,.44); font-size: 12px; }
.hero-visual { position: absolute; z-index: 1; inset: 0; min-height: 0; overflow: hidden; background-color: #0b0c0d; background-image: radial-gradient(circle at 76% 46%, rgba(33,47,72,.28), transparent 29%), url('./assets/orchestration-field-v4.png'); background-size: cover, 106% auto; background-position: center, 64% 48%; background-repeat: no-repeat; }
.hero-visual.webgl-ready { background-image: radial-gradient(circle at 76% 46%, rgba(33,47,72,.28), transparent 29%); background-size: auto; background-position: center; }
.hero-visual::before { content: ''; position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg, rgba(11,12,13,.98) 0%, rgba(11,12,13,.9) 24%, rgba(11,12,13,.22) 62%, rgba(11,12,13,.08) 100%); pointer-events: none; }
.hero-visual::after { content: ''; position: absolute; z-index: 1; inset: 0; background: radial-gradient(circle at 78% 45%, transparent 0 28%, rgba(11,12,13,.18) 58%, rgba(11,12,13,.66) 100%); pointer-events: none; }
.hero-canvas { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; display: block; }
.live-indicator { position: absolute; z-index: 2; top: 20%; right: 8vw; display: inline-flex; align-items: center; gap: 8px; color: rgba(244,244,240,.62); font-size: 10px; letter-spacing: .17em; }
.live-indicator span { width: 6px; height: 6px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 16px 4px rgba(201,255,0,.36); animation: signal-pulse 2.8s ease-in-out infinite; }
.visual-label { position: absolute; z-index: 2; color: rgba(244,244,240,.62); font-size: 11px; letter-spacing: .16em; }
.visual-label-top { top: 21%; right: 10%; writing-mode: vertical-rl; }
.visual-label-bottom { bottom: 18%; left: 14%; }
.visual-orbit { position: absolute; z-index: 2; width: 7px; height: 7px; background: var(--lime); border-radius: 50%; box-shadow: 0 0 22px 4px rgba(201,255,0,.35); animation: signal-pulse 2.8s ease-in-out infinite; }
.orbit-one { top: 28%; right: 25%; }
.orbit-two { bottom: 31%; left: 28%; animation-delay: -1.4s; }
.hero-footnote { position: absolute; z-index: 3; bottom: 31px; left: clamp(24px, 9vw, 140px); right: 5vw; display: flex; justify-content: space-between; color: rgba(244,244,240,.4); font-size: 11px; letter-spacing: .05em; }

.signal-strip { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(244,244,240,.3); background: var(--ink); padding: 28px clamp(24px, 8vw, 120px) 42px; }
.signal-strip div { padding: 0 20px; text-align: center; font-size: clamp(20px, 2.5vw, 30px); letter-spacing: -.04em; }
.signal-strip div + div { border-left: 1px solid rgba(244,244,240,.22); }

.section { padding: clamp(88px, 11vw, 160px) clamp(24px, 8vw, 120px); }
.section-light { background: var(--paper); color: var(--ink); }
.section-intro { max-width: 850px; }
.split-intro { display: grid; grid-template-columns: 1.15fr .65fr; align-items: end; gap: 10%; max-width: none; }
.section h2, .audit-section h2, .consultation-section h2 { margin-bottom: 24px; font-size: clamp(3rem, 5.8vw, 6.7rem); line-height: .92; font-weight: 600; }
.split-intro > p { max-width: 330px; margin: 0 0 7px; color: var(--muted); font-size: 18px; line-height: 1.45; }
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 100px; }
.step { position: relative; min-height: 270px; padding: 20px 35px 20px 0; border-top: 1px solid var(--line); }
.step + .step { padding-left: 35px; border-left: 1px solid var(--line); }
.step-number { color: #88ae00; font-size: 14px; font-weight: 700; }
.step h3 { margin: 58px 0 16px; font-size: 27px; letter-spacing: -.05em; font-weight: 600; }
.step > p:not(.step-number) { max-width: 260px; margin: 0; color: var(--muted); line-height: 1.5; }
.step-arrow { position: absolute; bottom: 20px; right: 25px; color: #88ae00; font-size: 26px; }

.audit-section { display: grid; grid-template-columns: .86fr 1.14fr; gap: 10%; align-items: center; padding: clamp(90px, 11vw, 160px) clamp(24px, 8vw, 120px); background: var(--ink-soft); }
.audit-copy > p:not(.eyebrow) { max-width: 480px; color: var(--white-muted); font-size: 18px; line-height: 1.5; }
.audit-copy .button { margin-top: 28px; }
.audit-list { border-top: 1px solid rgba(244,244,240,.27); }
.audit-row { display: grid; grid-template-columns: 50px 1fr 35px; align-items: center; gap: 20px; min-height: 112px; border-bottom: 1px solid rgba(244,244,240,.27); }
.audit-row span { color: var(--lime); font-size: 12px; }
.audit-row strong { font-size: clamp(19px, 2.2vw, 29px); letter-spacing: -.04em; font-weight: 500; }
.audit-row em { font-size: 19px; font-style: normal; text-align: right; }

.orchestration-section { position: relative; overflow: hidden; }
.orchestration-grid { position: relative; min-height: 500px; max-width: 1100px; margin: 85px auto 0; }
.orchestration-center { position: absolute; left: 50%; top: 50%; z-index: 2; transform: translate(-50%, -50%); text-align: center; }
.center-ring { display: grid; place-items: center; width: 160px; height: 160px; border: 1px solid #a2c900; border-radius: 50%; background: var(--paper); box-shadow: 0 0 0 18px rgba(201,255,0,.09), 0 0 0 45px rgba(11,12,13,.04); }
.center-ring::before, .center-ring::after { content: ''; position: absolute; width: 310px; height: 310px; border: 1px solid rgba(11,12,13,.1); border-radius: 50%; }
.center-ring::after { width: 500px; height: 500px; }
.center-ring span { font-size: 40px; font-weight: 700; letter-spacing: -.1em; }
.orchestration-center p { margin: 21px 0 0; color: var(--muted); font-size: 13px; }
.orchestration-node { position: absolute; z-index: 3; width: 220px; padding: 17px 19px; background: rgba(255,255,255,.38); border: 1px solid var(--line); }
.orchestration-node::before { content: ''; position: absolute; width: 100px; height: 1px; background: #a2c900; }
.orchestration-node span { display: block; margin-bottom: 25px; color: #88ae00; font-size: 12px; font-weight: 700; }
.orchestration-node strong { display: block; margin-bottom: 7px; font-size: 18px; letter-spacing: -.04em; }
.orchestration-node small { display: block; color: var(--muted); font-size: 13px; line-height: 1.35; }
.node-sales { top: 5%; left: 2%; }
.node-sales::before { right: -100px; top: 50%; transform: rotate(26deg); transform-origin: left; }
.node-ops { top: 5%; right: 2%; }
.node-ops::before { left: -100px; top: 50%; transform: rotate(-26deg); transform-origin: right; }
.node-team { bottom: 5%; left: 2%; }
.node-team::before { right: -100px; top: 45%; transform: rotate(-26deg); transform-origin: left; }
.node-content { bottom: 5%; right: 2%; }
.node-content::before { left: -100px; top: 45%; transform: rotate(26deg); transform-origin: right; }

.consultation-section { display: grid; grid-template-columns: 1fr .75fr; gap: 12%; padding: clamp(90px, 11vw, 150px) clamp(24px, 8vw, 120px); background: var(--ink); }
.consultation-copy p:not(.eyebrow) { max-width: 450px; color: var(--white-muted); font-size: 19px; line-height: 1.5; }
.consultation-form { align-self: end; display: grid; gap: 23px; max-width: 430px; }
.consultation-form label { display: grid; gap: 9px; color: rgba(244,244,240,.7); font-size: 13px; }
.consultation-form input, .consultation-form select { width: 100%; height: 48px; padding: 0 15px; border: 1px solid rgba(244,244,240,.28); border-radius: 0; outline: none; background: transparent; color: var(--paper); }
.consultation-form input:focus, .consultation-form select:focus { border-color: var(--lime); }
.consultation-form select option { color: var(--ink); }
.consultation-form .button { justify-self: start; margin-top: 4px; }
.form-note { margin: -7px 0 0; color: rgba(244,244,240,.4); font-size: 12px; }
.form-success { color: var(--lime); }
.site-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 28px clamp(24px, 8vw, 120px); border-top: 1px solid rgba(244,244,240,.2); background: var(--ink); color: rgba(244,244,240,.53); font-size: 12px; }
.site-footer .wordmark { color: var(--paper); }
.site-footer p { margin: 0; }

@keyframes field-breathe {
  0% { background-position: center, center, 64% 48%; background-size: cover, cover, 106% auto; }
  100% { background-position: center, center, 68% 52%; background-size: cover, cover, 112% auto; }
}

@keyframes field-aura {
  0% { opacity: .2; transform: translate3d(-1%, 0, 0) scale(.98); }
  100% { opacity: .48; transform: translate3d(1%, -1%, 0) scale(1.03); }
}

@keyframes orbit-sweep {
  0% { opacity: .2; transform: rotate(-16deg) scale(.98); }
  100% { opacity: .5; transform: rotate(-8deg) scale(1.03); }
}

@keyframes signal-pulse {
  0%, 100% { opacity: .62; transform: scale(.72); box-shadow: 0 0 12px 2px rgba(201,255,0,.2); }
  50% { opacity: 1; transform: scale(1.3); box-shadow: 0 0 27px 7px rgba(201,255,0,.52); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-visual, .hero-visual::before, .hero-visual::after, .live-indicator span { animation: none; }
  .parallax-item { transform: none; will-change: auto; }
}

@media (max-width: 860px) {
  .site-nav { display: none; }
  .mobile-cta { display: block; }
  .hero { display: block; min-height: auto; }
  .hero-copy { min-height: 640px; padding: 140px 24px 80px; background: linear-gradient(180deg, rgba(11,12,13,.9) 0%, rgba(11,12,13,.74) 67%, rgba(11,12,13,.1) 100%); }
  h1 { max-width: 600px; font-size: clamp(3.6rem, 13vw, 6rem); }
  .hero-summary { max-width: 440px; }
  .hero-visual { position: absolute; inset: 0; min-height: 760px; background-size: cover, cover, cover; background-position: center, center, center; opacity: .72; }
  .hero-footnote { bottom: 22px; left: 24px; right: 24px; }
  .split-intro, .audit-section, .consultation-section { grid-template-columns: 1fr; gap: 50px; }
  .split-intro > p { max-width: 500px; }
  .steps { margin-top: 65px; }
  .orchestration-grid { min-height: 570px; }
}

@media (max-width: 620px) {
  .site-header { padding: 23px 20px; }
  .wordmark { font-size: 13px; }
  .hero-copy { padding: 130px 20px 86px; }
  .hero-visual { min-height: 750px; background-size: cover, cover, cover; background-position: center, center, center; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 22px; }
  .button { width: 100%; }
  .signal-strip { padding: 21px 10px 29px; }
  .signal-strip div { padding: 0 5px; font-size: 17px; }
  .section, .audit-section, .consultation-section { padding: 82px 20px; }
  .section h2, .audit-section h2, .consultation-section h2 { font-size: clamp(3rem, 14vw, 4.7rem); }
  .steps { grid-template-columns: 1fr; margin-top: 50px; }
  .step, .step + .step { min-height: 220px; padding: 19px 0 30px; border-left: 0; }
  .step h3 { margin-top: 42px; }
  .step-arrow { right: 0; }
  .audit-row { grid-template-columns: 28px 1fr 22px; gap: 10px; min-height: 104px; }
  .audit-row strong { font-size: 20px; }
  .orchestration-grid { min-height: 690px; margin-top: 55px; }
  .orchestration-center { top: 48%; }
  .center-ring { width: 120px; height: 120px; }
  .center-ring span { font-size: 32px; }
  .orchestration-node { width: 155px; padding: 13px; }
  .orchestration-node::before { display: none; }
  .orchestration-node span { margin-bottom: 17px; }
  .orchestration-node strong { font-size: 16px; }
  .orchestration-node small { font-size: 11px; }
  .node-sales { top: 0; left: 0; }
  .node-ops { top: 0; right: 0; }
  .node-team { bottom: 0; left: 0; }
  .node-content { bottom: 0; right: 0; }
  .site-footer { align-items: flex-start; flex-direction: column; padding: 28px 20px; }
}
