/* ============================================================
   BlackSOC — Homepage v2 "Kinetic Operations" layer
   Sits on top of bs-design-system.css. Energetic / threat-action.
   ============================================================ */

:root {
  --k-scan: 0.06;        /* scanline opacity, tweakable */
  --k-grain: 1;          /* grain/HUD multiplier */
  --hero-h: 100svh;
}

/* motion master switch (set by tweaks: full | subtle | off) */
html[data-motion="off"] * { animation: none !important; transition: none !important; }
/* subtle: keep reveals + console, calm the ambient loops */
html[data-motion="subtle"] .k-scanlines,
html[data-motion="subtle"] .k-reticle .sweep,
html[data-motion="subtle"] .k-hero::before,
html[data-motion="subtle"] .k-chain-line .pulse { animation: none !important; }
html[data-motion="subtle"] .k-hero-img { animation: kHeroIn 1.6s var(--bs-ease) both !important; }
html[data-motion="subtle"] .k-ticker-track { animation-duration: 90s !important; }
html[data-motion="subtle"] .k-scanlines { opacity: 0.25; }

/* ===================================================================
   GLOBAL ATMOSPHERE — scanlines + vignette over whole page
   =================================================================== */
.k-scanlines {
  position: fixed; inset: 0; z-index: 80; pointer-events: none;
  background-image: repeating-linear-gradient(
    to bottom, rgba(255,255,255,0) 0px, rgba(255,255,255,0) 2px,
    rgba(0,0,0,calc(var(--k-scan))) 3px, rgba(0,0,0,calc(var(--k-scan))) 4px);
  mix-blend-mode: overlay; opacity: 0.7;
}

/* ===================================================================
   THREAT-INTEL TICKER (top, above nav)
   =================================================================== */
.k-ticker {
  position: relative; z-index: 101;
  background: #07070880;
  border-bottom: 1px solid var(--bs-border);
  backdrop-filter: blur(10px);
  overflow: hidden; height: 34px;
  display: flex; align-items: center;
}
.k-ticker-tag {
  flex-shrink: 0; align-self: stretch; display: flex; align-items: center;
  gap: 8px; padding: 0 16px;
  background: var(--bs-accent-red); color: #fff;
  font-family: var(--bs-font-mono); font-size: 10px; font-weight: 700;
  letter-spacing: 0.22em; text-transform: uppercase;
  position: relative; z-index: 2;
}
.k-ticker-tag .dot { width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: bsPulse 1s infinite; }
.k-ticker-track {
  display: flex; gap: 48px; white-space: nowrap;
  font-family: var(--bs-font-mono); font-size: 11px; letter-spacing: 0.05em;
  color: var(--bs-text-secondary);
  animation: kMarquee 42s linear infinite; will-change: transform;
  padding-left: 48px;
}
.k-ticker:hover .k-ticker-track { animation-play-state: paused; }
.k-ticker-track b { color: var(--bs-text-primary); font-weight: 500; }
.k-ticker-track .neut { color: var(--bs-success); }
.k-ticker-track .crit { color: var(--bs-accent-red); }
.k-ticker-track .t { color: var(--bs-text-faint); }
@keyframes kMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ===================================================================
   KINETIC HERO
   =================================================================== */
.k-hero {
  position: relative; min-height: var(--hero-h);
  display: flex; flex-direction: column; justify-content: flex-end; align-items: stretch;
  overflow: hidden; isolation: isolate;
  border-bottom: 1px solid var(--bs-border);
}
.k-hero-img {
  position: absolute; inset: 0; z-index: -3;
  background-image: var(--img-hero-home);
  background-size: cover; background-position: center 38%;
  filter: brightness(0.62) saturate(1.08) contrast(1.05);
  transform: scale(1.08);
  animation: kHeroIn 1.6s var(--bs-ease) both, bsDrift 30s ease-in-out 1.6s infinite alternate;
}
@keyframes kHeroIn { from { opacity: 0; transform: scale(1.22); filter: brightness(0.2) saturate(0.4) blur(8px); } to { opacity: 1; } }
.k-hero::after {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background:
    radial-gradient(ellipse 90% 70% at 50% 8%, rgba(255,46,58,0.16), transparent 60%),
    linear-gradient(180deg, rgba(10,10,10,0.55) 0%, rgba(10,10,10,0.1) 38%, rgba(10,10,10,0.82) 86%, var(--bs-bg-0) 100%);
}
/* faint moving HUD grid */
.k-hero::before {
  content: ''; position: absolute; inset: 0; z-index: -2; opacity: calc(0.5 * var(--k-grain));
  background-image:
    linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000, transparent 75%);
  mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000, transparent 75%);
  animation: kGridDrift 40s linear infinite;
}
@keyframes kGridDrift { to { background-position: 64px 64px; } }

/* ---- targeting reticle, centered on the subject ---- */
.k-reticle {
  position: absolute; top: 38%; left: 50%; z-index: -1;
  width: min(46vh, 340px); aspect-ratio: 1; transform: translate(-50%,-50%);
  pointer-events: none; opacity: 0;
  animation: kReticleIn 1s var(--bs-ease) 0.7s forwards;
}
.k-reticle .ring { position: absolute; inset: 0; border: 1px solid rgba(255,46,58,0.35); border-radius: 50%; }
.k-reticle .ring2 { inset: 14%; border-style: dashed; border-color: rgba(255,46,58,0.22); animation: kSpin 18s linear infinite; }
.k-reticle .sweep {
  position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(from 0deg, rgba(255,46,58,0.32), transparent 22%);
  -webkit-mask: radial-gradient(circle, transparent 56%, #000 57%);
  mask: radial-gradient(circle, transparent 56%, #000 57%);
  animation: kSpin 3.2s linear infinite;
}
.k-reticle .corner { position: absolute; width: 22px; height: 22px; border: 2px solid var(--bs-accent-red); }
.k-reticle .corner.tl { top: -2px; left: -2px; border-right: 0; border-bottom: 0; }
.k-reticle .corner.tr { top: -2px; right: -2px; border-left: 0; border-bottom: 0; }
.k-reticle .corner.bl { bottom: -2px; left: -2px; border-right: 0; border-top: 0; }
.k-reticle .corner.br { bottom: -2px; right: -2px; border-left: 0; border-top: 0; }
.k-reticle .crosshair, .k-reticle .crossv { position: absolute; background: rgba(255,46,58,0.5); }
.k-reticle .crosshair { top: 50%; left: 30%; right: 30%; height: 1px; }
.k-reticle .crossv { left: 50%; top: 30%; bottom: 30%; width: 1px; }
.k-reticle .lock {
  position: absolute; top: -28px; left: 50%; transform: translateX(-50%);
  font-family: var(--bs-font-mono); font-size: 10px; letter-spacing: 0.24em;
  color: var(--bs-accent-red); white-space: nowrap; text-transform: uppercase;
}
@keyframes kReticleIn { from { opacity: 0; transform: translate(-50%,-50%) scale(1.5); } to { opacity: 0.9; transform: translate(-50%,-50%) scale(1); } }
@keyframes kSpin { to { transform: rotate(360deg); } }
.k-reticle .ring2.x { /* keep transform-origin centered while spinning */ }

.k-hero-inner {
  position: relative; z-index: 2;
  flex: 0 0 auto;
  max-width: 1320px; margin: 0 auto; width: 100%;
  padding: 96px 32px 64px;
  display: grid; grid-template-columns: 1.35fr 0.95fr; gap: 48px; align-items: end;
}

/* status / kill-chain chip cluster */
.k-status {
  display: inline-flex; align-items: center; gap: 0;
  font-family: var(--bs-font-mono); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  border: 1px solid var(--bs-border); border-radius: 999px;
  background: rgba(7,7,8,0.6); backdrop-filter: blur(10px);
  overflow: hidden; margin-bottom: 26px;
}
.k-status-stage {
  padding: 9px 16px; color: var(--bs-text-faint); position: relative;
  white-space: nowrap;
  transition: color 0.3s, background 0.3s;
}
.k-status-stage + .k-status-stage { border-left: 1px solid var(--bs-border); }
.k-status-stage.done { color: var(--bs-text-secondary); }
.k-status-stage.active { color: #fff; background: var(--bs-accent-red); }
.k-status-stage.active.det { background: var(--bs-warn); color: #1a1206; }
.k-status-stage.active.hnt { background: var(--bs-info); color: #06121f; }
.k-status-stage.active.con { background: #f97316; color: #1a0d02; }

.k-hero-h1 {
  font-family: var(--bs-font-display);
  font-size: clamp(40px, 5.6vw, 84px);
  font-weight: 800; line-height: 0.92; letter-spacing: -0.04em;
  color: var(--bs-text-primary);
  margin: 0 0 24px; max-width: 13ch;
}
.k-hero-h1 .ln { display: block; overflow: hidden; }
.k-hero-h1 .ln > span { display: inline-block; transform: translateY(108%); animation: kLineUp 0.85s var(--bs-ease) forwards; }
.k-hero-h1 .ln:nth-child(1) > span { animation-delay: 1.05s; }
.k-hero-h1 .ln:nth-child(2) > span { animation-delay: 1.2s; }
.k-hero-h1 .ln:nth-child(3) > span { animation-delay: 1.35s; }
@keyframes kLineUp { to { transform: translateY(0); } }
.k-hero-h1 .accent { color: var(--bs-accent-red); text-shadow: 0 0 40px rgba(255,46,58,0.45); position: relative; }

.k-hero-sub {
  font-size: 19px; line-height: 1.55; color: var(--bs-text-secondary);
  max-width: 540px; margin: 0 0 34px;
  opacity: 0; animation: kFadeUp 0.8s var(--bs-ease) 1.6s forwards;
}
.k-hero-ctas { display: flex; gap: 14px; flex-wrap: wrap; opacity: 0; animation: kFadeUp 0.8s var(--bs-ease) 1.78s forwards; }
@keyframes kFadeUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

/* right column: live mini-console that types the kill-chain */
.k-hero-console {
  background: rgba(7,7,9,0.72); backdrop-filter: blur(14px);
  border: 1px solid var(--bs-border-strong); border-radius: var(--bs-r-md);
  box-shadow: 0 30px 80px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,46,58,0.12);
  overflow: hidden; opacity: 0; align-self: stretch;
  animation: kFadeUp 0.9s var(--bs-ease) 1.5s forwards;
  display: flex; flex-direction: column; min-height: 248px;
}
.k-console-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 11px 14px; border-bottom: 1px solid var(--bs-border);
  font-family: var(--bs-font-mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--bs-text-tertiary);
}
.k-console-head .lights { display: flex; gap: 6px; }
.k-console-head .lights i { width: 9px; height: 9px; border-radius: 50%; background: var(--bs-bg-3); display: block; }
.k-console-head .lights i:first-child { background: var(--bs-accent-red); }
.k-console-status { display: inline-flex; align-items: center; gap: 6px; color: var(--bs-accent-red); }
.k-console-status .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--bs-accent-red); box-shadow: 0 0 8px var(--bs-accent-red); animation: bsPulse 1.3s infinite; }
.k-console-body {
  flex: 1; padding: 14px; font-family: var(--bs-font-mono); font-size: 12.5px; line-height: 1.85;
  color: var(--bs-text-secondary); overflow: hidden;
}
.k-console-body .ln { white-space: nowrap; }
.k-console-body .t { color: var(--bs-text-faint); }
.k-console-body .lv-detect { color: var(--bs-warn); }
.k-console-body .lv-hunt { color: var(--bs-info); }
.k-console-body .lv-contain { color: #f97316; }
.k-console-body .lv-eradicate { color: var(--bs-accent-red); font-weight: 700; }
.k-console-body .ok { color: var(--bs-success); }
.k-caret { display: inline-block; width: 8px; height: 14px; background: var(--bs-accent-red); vertical-align: -2px; animation: kBlink 1s steps(1) infinite; }
@keyframes kBlink { 50% { opacity: 0; } }

.k-hero-scroll {
  position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); z-index: 3;
  font-family: var(--bs-font-mono); font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--bs-text-tertiary); display: flex; flex-direction: column; align-items: center; gap: 8px;
  opacity: 0; animation: kFadeUp 1s var(--bs-ease) 2.4s forwards;
}
.k-hero-scroll .bar { width: 1px; height: 34px; background: linear-gradient(var(--bs-accent-red), transparent); animation: kScrollBar 1.8s ease-in-out infinite; }
@keyframes kScrollBar { 0%,100% { opacity: 0.3; transform: scaleY(0.6); } 50% { opacity: 1; transform: scaleY(1); } }

/* ===================================================================
   LIVE STRIP — bordered metric rail
   =================================================================== */
.k-live { background: var(--bs-bg-1); border-bottom: 1px solid var(--bs-border); }
.k-live-strip {
  max-width: 1320px; margin: 0 auto; padding: 0 32px;
  display: grid; grid-template-columns: repeat(4, 1fr);
}
.k-live-cell { padding: 26px 28px; border-left: 1px solid var(--bs-border); position: relative; }
.k-live-cell:first-child { border-left: 0; }
.k-live-cell::before {
  content: ''; position: absolute; top: 0; left: -1px; width: 28px; height: 2px; background: var(--bs-accent-red);
}
.k-live-label { font-family: var(--bs-font-mono); font-size: 10px; letter-spacing: 0.2em; color: var(--bs-text-tertiary); text-transform: uppercase; margin-bottom: 10px; }
.k-live-value { font-family: var(--bs-font-display); font-size: clamp(30px, 3.4vw, 44px); font-weight: 800; letter-spacing: -0.03em; color: var(--bs-text-primary); line-height: 1; }
.k-live-value .u { color: var(--bs-text-secondary); font-size: 16px; font-weight: 500; margin-left: 5px; letter-spacing: 0; }

/* ===================================================================
   STAKES
   =================================================================== */
.k-stakes { padding: 132px 32px; background: var(--bs-bg-0); position: relative; overflow: hidden; }
.k-stakes-inner { max-width: 1100px; margin: 0 auto; text-align: center; position: relative; }
.k-stakes-quote {
  font-family: var(--bs-font-display); font-size: clamp(38px, 5.4vw, 72px);
  line-height: 1.04; letter-spacing: -0.03em; color: var(--bs-text-primary); font-weight: 800; margin: 0 0 28px;
  text-wrap: balance;
}
.k-stakes-quote .strike { position: relative; color: var(--bs-text-faint); }
.k-stakes-quote .strike::after { content: ''; position: absolute; left: -2%; right: -2%; top: 52%; height: 4px; background: var(--bs-accent-red); box-shadow: 0 0 16px var(--bs-accent-red); transform: scaleX(0); transform-origin: left; }
.k-stakes-quote .strike.cut::after { animation: kStrike 0.5s var(--bs-ease) forwards; }
@keyframes kStrike { to { transform: scaleX(1); } }
.k-stakes-sub { font-size: 18px; line-height: 1.65; color: var(--bs-text-secondary); max-width: 700px; margin: 0 auto; }

/* ===================================================================
   KILL-CHAIN (horizontal, traveling pulse)
   =================================================================== */
.k-chain { padding: 132px 32px; background: var(--bs-bg-1); border-top: 1px solid var(--bs-border); border-bottom: 1px solid var(--bs-border); }
.k-chain-inner { max-width: 1320px; margin: 0 auto; }
.k-chain-rail { position: relative; margin-top: 64px; }
.k-chain-line { position: absolute; top: 26px; left: 6%; right: 6%; height: 2px; background: var(--bs-border-strong); }
.k-chain-line .pulse { position: absolute; top: 50%; left: 0; width: 120px; height: 3px; transform: translateY(-50%); background: linear-gradient(90deg, transparent, var(--bs-accent-red), transparent); box-shadow: 0 0 14px var(--bs-accent-red); animation: kPulseRun 4.5s linear infinite; }
@keyframes kPulseRun { 0% { left: -10%; } 100% { left: 100%; } }
.k-chain-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.k-step { position: relative; padding-top: 4px; }
.k-step-node {
  width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center;
  background: var(--bs-bg-2); border: 2px solid var(--bs-border-strong); position: relative; z-index: 2;
  font-family: var(--bs-font-mono); font-size: 12px; font-weight: 700; color: var(--bs-text-secondary);
  transition: border-color 0.3s, color 0.3s, box-shadow 0.3s, background 0.3s;
}
.k-step:hover .k-step-node, .k-step.lit .k-step-node {
  border-color: var(--bs-accent-red); color: #fff; background: rgba(255,46,58,0.12);
  box-shadow: 0 0 0 6px rgba(255,46,58,0.08), 0 0 24px rgba(255,46,58,0.3);
}
.k-step-mono { font-family: var(--bs-font-mono); font-size: 11px; letter-spacing: 0.18em; color: var(--bs-accent-red); text-transform: uppercase; margin: 22px 0 10px; }
.k-step h3 { font-family: var(--bs-font-display); font-size: 23px; font-weight: 700; letter-spacing: -0.01em; color: var(--bs-text-primary); margin: 0 0 10px; }
.k-step p { font-size: 14px; line-height: 1.6; color: var(--bs-text-secondary); margin: 0; }
.k-step-foot { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--bs-border); font-family: var(--bs-font-mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--bs-text-tertiary); }

/* ===================================================================
   SOC SNAPSHOT (auto-appending live log)
   =================================================================== */
.k-snap { padding: 132px 32px; background: var(--bs-bg-0); }
.k-snap-inner { max-width: 1320px; margin: 0 auto; display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 64px; align-items: center; }
.k-console {
  background: var(--bs-bg-2); border: 1px solid var(--bs-border-strong); border-radius: var(--bs-r-md);
  box-shadow: var(--bs-shadow-mock); overflow: hidden; position: relative;
}
.k-console::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--bs-accent-red), transparent); z-index: 3; }
.k-console-bar { display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; border-bottom: 1px solid var(--bs-border); font-family: var(--bs-font-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--bs-text-tertiary); }
.k-console-bar .st { display: inline-flex; align-items: center; gap: 6px; color: var(--bs-accent-red); }
.k-console-bar .st .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--bs-accent-red); box-shadow: 0 0 8px var(--bs-accent-red); animation: bsPulse 1.5s infinite; }
.k-log { padding: 18px; font-family: var(--bs-font-mono); font-size: 13px; line-height: 1.95; height: 300px; overflow: hidden; position: relative; }
.k-log-feed { display: flex; flex-direction: column; }
.k-log .row { opacity: 0; transform: translateY(6px); animation: kRowIn 0.4s var(--bs-ease) forwards; white-space: nowrap; }
@keyframes kRowIn { to { opacity: 1; transform: none; } }
.k-log .t { color: var(--bs-text-faint); }
.k-log .lv-detect { color: var(--bs-warn); }
.k-log .lv-hunt { color: var(--bs-info); }
.k-log .lv-contain { color: #f97316; }
.k-log .lv-eradicate { color: var(--bs-accent-red); font-weight: 700; }
.k-log .ok { color: var(--bs-success); }
.k-log .who { color: var(--bs-text-primary); }
.k-log::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 64px; background: linear-gradient(transparent, var(--bs-bg-2)); pointer-events: none; }

/* ===================================================================
   PRICING (reuses tier styles but a touch more energetic)
   =================================================================== */
.k-pricing { padding: 132px 32px; background: var(--bs-bg-1); border-top: 1px solid var(--bs-border); }
.k-pricing-inner { max-width: 1320px; margin: 0 auto; }
.k-tiers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 60px; }
.k-tier { background: var(--bs-bg-2); border: 1px solid var(--bs-border); border-radius: var(--bs-r-lg); padding: 32px; display: flex; flex-direction: column; transition: transform .25s var(--bs-ease), border-color .25s; }
.k-tier:hover { transform: translateY(-4px); border-color: var(--bs-border-accent); }
.k-tier-featured { border-color: var(--bs-border-accent); background: linear-gradient(180deg, rgba(255,46,58,0.05), var(--bs-bg-2)); position: relative; }
.k-tier-featured::before { content: 'RECOMMENDED'; position: absolute; top: -10px; left: 32px; font-family: var(--bs-font-mono); font-size: 10px; letter-spacing: 0.2em; background: var(--bs-accent-red); color: #fff; padding: 4px 10px; border-radius: 4px; box-shadow: 0 4px 14px rgba(255,46,58,0.4); }
.k-tier-name { font-family: var(--bs-font-mono); font-size: 11px; letter-spacing: 0.2em; color: var(--bs-text-tertiary); text-transform: uppercase; margin-bottom: 16px; }
.k-tier-title { font-size: 28px; font-weight: 700; letter-spacing: -0.02em; color: var(--bs-text-primary); margin: 0 0 8px; }
.k-tier-sub { font-size: 14px; color: var(--bs-text-secondary); margin: 0 0 24px; }
.k-tier-price { font-family: var(--bs-font-display); font-size: 40px; font-weight: 800; letter-spacing: -0.02em; color: var(--bs-text-primary); margin-bottom: 4px; }
.k-tier-price-sub { font-size: 13px; color: var(--bs-text-tertiary); font-family: var(--bs-font-mono); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 28px; }
.k-tier-feats { list-style: none; padding: 0; margin: 0 0 28px; flex: 1; }
.k-tier-feats li { padding: 10px 0; border-bottom: 1px solid var(--bs-border); font-size: 14px; color: var(--bs-text-primary); display: flex; gap: 10px; align-items: flex-start; }
.k-tier-feats li::before { content: '+'; color: var(--bs-accent-red); font-family: var(--bs-font-mono); font-weight: 700; }

/* ===================================================================
   CASE STUDY
   =================================================================== */
.k-case { padding: 132px 32px; background: var(--bs-bg-0); }
.k-case-inner { max-width: 1000px; margin: 0 auto; text-align: center; }
.k-case-mark { color: var(--bs-accent-red); font-family: var(--bs-font-display); font-size: 72px; line-height: 0.6; }
.k-case-quote { font-family: var(--bs-font-display); font-size: clamp(28px, 3.6vw, 44px); line-height: 1.25; letter-spacing: -0.02em; color: var(--bs-text-primary); margin: 24px 0 28px; text-wrap: balance; }
.k-case-attr { font-family: var(--bs-font-mono); font-size: 12px; letter-spacing: 0.15em; color: var(--bs-text-tertiary); text-transform: uppercase; }
.k-case-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 64px; padding-top: 48px; border-top: 1px solid var(--bs-border); }
.k-case-mv { font-family: var(--bs-font-display); font-size: clamp(36px, 4vw, 52px); font-weight: 800; color: var(--bs-accent-red); letter-spacing: -0.03em; }
.k-case-ml { font-family: var(--bs-font-mono); font-size: 11px; letter-spacing: 0.15em; color: var(--bs-text-secondary); text-transform: uppercase; margin-top: 10px; }

/* ===================================================================
   FINAL CTA
   =================================================================== */
.k-final { padding: 160px 32px 132px; background: var(--bs-bg-1); border-top: 1px solid var(--bs-border); position: relative; overflow: hidden; }
.k-final::before { content: ''; position: absolute; inset: 0; z-index: 0; background: radial-gradient(ellipse at center, rgba(255,46,58,0.14), transparent 62%); }
.k-final::after {
  content: ''; position: absolute; inset: 0; z-index: 0; opacity: 0.4;
  background-image: linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size: 48px 48px; -webkit-mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, #000, transparent 70%); mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, #000, transparent 70%);
}
.k-final-inner { max-width: 900px; margin: 0 auto; text-align: center; position: relative; z-index: 1; }
.k-final h2 { font-family: var(--bs-font-display); font-size: clamp(42px, 6.2vw, 80px); font-weight: 800; line-height: 1.02; letter-spacing: -0.035em; color: var(--bs-text-primary); margin: 0 0 24px; text-wrap: balance; }
.k-final p { font-size: 18px; color: var(--bs-text-secondary); margin: 0 0 40px; }

/* shared section heads */
.k-eyebrow { font-family: var(--bs-font-mono); font-size: 11px; font-weight: 500; letter-spacing: 0.2em; color: var(--bs-accent-red); text-transform: uppercase; margin-bottom: 16px; display: flex; align-items: center; gap: 10px; }
.k-eyebrow::before { content: ''; width: 22px; height: 1px; background: var(--bs-accent-red); }
.k-eyebrow.center { justify-content: center; }
.k-h2 { font-family: var(--bs-font-display); font-size: clamp(34px, 4.6vw, 60px); font-weight: 800; line-height: 1.02; letter-spacing: -0.03em; color: var(--bs-text-primary); margin: 0 0 16px; max-width: 16ch; text-wrap: balance; }
.k-lead { font-size: 18px; line-height: 1.55; color: var(--bs-text-secondary); max-width: 660px; }
.k-head-center { text-align: center; }
.k-head-center .k-h2, .k-head-center .k-lead { margin-left: auto; margin-right: auto; }

/* ===================================================================
   REVEAL (kinetic variant — clip + slide)
   =================================================================== */
@media (prefers-reduced-motion: no-preference) {
  .k-reveal { opacity: 0; transform: translateY(28px); transition: opacity 0.7s var(--bs-ease), transform 0.7s var(--bs-ease); }
  .k-reveal.in { opacity: 1; transform: none; }
}

/* ===================================================================
   REDUCED-MOTION / NO-ANIMATION FALLBACKS
   Guarantee hero content is visible even when entrance animations
   don't play (prefers-reduced-motion, or motion=off).
   =================================================================== */
@media (prefers-reduced-motion: reduce) {
  .k-hero-img { animation: none !important; opacity: 1 !important; transform: scale(1.06); filter: brightness(0.62) saturate(1.08) contrast(1.05); }
  .k-hero-h1 .ln > span { transform: none !important; animation: none !important; }
  .k-hero-sub, .k-hero-ctas, .k-hero-console, .k-hero-scroll { opacity: 1 !important; animation: none !important; }
  .k-reticle { opacity: 0.9 !important; animation: none !important; }
}
html[data-motion="off"] .k-hero-img { opacity: 1 !important; }
html[data-motion="off"] .k-hero-h1 .ln > span { transform: none !important; }
html[data-motion="off"] .k-hero-sub,
html[data-motion="off"] .k-hero-ctas,
html[data-motion="off"] .k-hero-console,
html[data-motion="off"] .k-hero-scroll,
html[data-motion="off"] .k-reticle { opacity: 1 !important; }

/* ===================================================================
   RESPONSIVE
   =================================================================== */
@media (max-width: 1000px) {
  .k-hero-inner { grid-template-columns: 1fr; gap: 28px; }
  .k-hero-console { display: none; }
  .k-snap-inner { grid-template-columns: 1fr; gap: 40px; }
  .k-chain-steps { grid-template-columns: repeat(2, 1fr); gap: 32px; }
  .k-chain-line { display: none; }
}
@media (max-width: 760px) {
  .k-live-strip { grid-template-columns: 1fr 1fr; }
  .k-live-cell:nth-child(3) { border-left: 0; }
  .k-tiers { grid-template-columns: 1fr; }
  .k-chain-steps { grid-template-columns: 1fr; }
  .k-case-metrics { grid-template-columns: 1fr; gap: 28px; }
  .k-reticle { width: 60vw; }
}