.capabilities-hero { position: relative; isolation: isolate; overflow: hidden; background: #090f0b; }
.capabilities-hero::before { content: ''; position: absolute; inset: 0; opacity: .165; pointer-events: none; background-image: radial-gradient(circle, rgba(202,255,77,.35) 1px, transparent 1.5px); background-size: 38px 38px; mask-image: linear-gradient(to right, transparent, black 48%, black); }
.capabilities-hero .hero-grid { min-height: 660px; }
.capabilities-hero .hero-copy > .eyebrow { font-size: clamp(14px, 1.2vw, 16px); }
.capability-photo { position: relative; min-height: 510px; overflow: hidden; border: 1px solid rgba(244,239,228,.16); background: #111714; }
.capability-photo::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, transparent 48%, rgba(5,10,7,.68)); }
.capability-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 65% center; }
.capability-photo figcaption { position: absolute; z-index: 2; left: 28px; bottom: 24px; color: #f4efe4; }

.cap-stats { background: var(--paper); }
.live-dot { display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 16px rgba(202,255,77,.8); }
.stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.stat-card { position: relative; min-height: 330px; padding: 28px; border: 1px solid var(--line-light); border-radius: var(--radius); background: rgba(255,255,255,.4); }
.stat-card::before { content: ''; position: absolute; left: 30px; top: 0; width: 74px; height: 3px; background: linear-gradient(90deg, var(--green), var(--lime)); }
.stat-card strong { display: block; margin-top: 30px; font-family: var(--font-body); font-size: clamp(48px, 4.8vw, 64px); font-weight: 600; font-variant-numeric: tabular-nums lining-nums; line-height: .92; letter-spacing: -.06em; }
.stat-card .stat-unit { display: inline; color: var(--muted-light); font-size: .36em; font-weight: 500; letter-spacing: -.02em; }
.stat-card h3 { min-height: 34px; font-family: var(--font-label); color: var(--green); font-size: 15px; font-weight: 700; letter-spacing: .12em; line-height: 1.45; text-transform: uppercase; }
.stat-card > p:not(.eyebrow) { margin-top: 10px; color: var(--muted-light); line-height: 1.5; }
.stat-card > .eyebrow:last-child { position: absolute; left: 28px; bottom: 24px; color: #778078; font-size: 10px; }

.cap-stack { background: #101713; }
.stack-section-head { display: grid; grid-template-columns: minmax(0, .9fr) minmax(340px, 1.1fr); column-gap: clamp(42px, 8vw, 112px); max-width: none; align-items: end; }
.stack-section-head > .eyebrow, .stack-section-head > h2 { grid-column: 1; }
.stack-section-head > h2 { max-width: 540px; }
.stack-section-head > p:last-child:not(.eyebrow) { grid-column: 2; grid-row: 1 / 3; align-self: end; max-width: 560px; margin-top: 0; padding-bottom: 4px; }
.evidence-editorial { position: relative; isolation: isolate; overflow: hidden; border: 1px solid rgba(244,239,228,.15); border-radius: 30px; background: linear-gradient(145deg, #18221b, #111814); box-shadow: 0 30px 70px rgba(0,0,0,.18), inset 0 1px 0 rgba(244,239,228,.035); }
.evidence-editorial::before { content: ''; position: absolute; z-index: 2; top: 0; left: clamp(28px, 4vw, 48px); width: 86px; height: 3px; pointer-events: none; background: linear-gradient(90deg, var(--lime), rgba(202,255,77,0)); box-shadow: 0 0 18px rgba(202,255,77,.45); }
.evidence-editorial::after { content: ''; position: absolute; z-index: 0; inset: 0; pointer-events: none; background: radial-gradient(circle at 90% 18%, rgba(202,255,77,.075), transparent 32%); }
.evidence-path { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr; }
.evidence-row { position: relative; display: grid; grid-template-columns: minmax(110px, .55fr) minmax(245px, 1fr) minmax(300px, 1.45fr); align-items: start; gap: clamp(28px, 4vw, 58px); min-height: 188px; padding: clamp(34px, 4vw, 48px); border-top: 1px solid rgba(244,239,228,.13); transition: background 350ms ease; }
.evidence-row:first-child { border-top: 0; }
.evidence-row::before { content: ''; position: absolute; top: 50px; left: clamp(25px, 3.2vw, 38px); width: 10px; height: 10px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 7px rgba(202,255,77,.065); }
.evidence-row > .eyebrow { padding-left: 25px; color: var(--lime); font-size: clamp(13px, 1vw, 15px); font-weight: 600; letter-spacing: .16em; line-height: 1.2; }
.evidence-row > div { display: contents; }
.evidence-row h3 { max-width: 340px; color: #f4efe4; font-family: var(--font-body); font-size: clamp(30px, 3.1vw, 42px); font-style: normal; font-weight: 600; letter-spacing: -.04em; line-height: 1.02; }
.evidence-row h3 span { display: block; color: var(--lime); }
.evidence-row h3.evidence-design-heading { max-width: 440px; font-size: clamp(24px, 2.35vw, 32px); line-height: 1.08; }
.evidence-row h3 .evidence-design-primary { color: #f4efe4; }
.evidence-row p:not(.eyebrow) { max-width: 610px; margin-top: 0; color: #aeb6aa; font-size: 15px; line-height: 1.68; }
.evidence-row-signals h3 { font-family: var(--font-body); font-size: clamp(29px, 3vw, 40px); font-style: normal; font-weight: 600; }
.evidence-row-signals p:not(.eyebrow) { color: #c9cec5; }
.editorial-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.editorial-links .text-link { min-height: 50px; padding: 11px 20px; border: 1px solid rgba(202,255,77,.32); border-radius: 999px; background: rgba(202,255,77,.035); font-size: 14px; }

.motion-enabled .evidence-editorial.is-in-view .evidence-row::before { animation: evidenceMarkerPulse 7.2s ease-in-out infinite; }
.motion-enabled .evidence-editorial.is-in-view .evidence-row:nth-child(2)::before { animation-delay: 2.4s; }
.motion-enabled .evidence-editorial.is-in-view .evidence-row:nth-child(3)::before { animation-delay: 4.8s; }
.motion-paused .evidence-row::before { animation-play-state: paused !important; }
@keyframes evidenceMarkerPulse { 0%, 12%, 36%, 100% { box-shadow: 0 0 0 7px rgba(202,255,77,.065); opacity: .62; } 20%, 28% { box-shadow: 0 0 0 12px rgba(202,255,77,.1), 0 0 22px rgba(202,255,77,.55); opacity: 1; } }

.cap-spectrum { background: linear-gradient(135deg, var(--paper), #dfe8d8); }
.spectrum-chart { padding: clamp(26px, 4vw, 44px); border: 1px solid var(--line-light); border-radius: var(--radius); background: rgba(255,255,255,.4); box-shadow: 0 20px 48px rgba(30,79,53,.06); }
.spectrum-ends { display: flex; justify-content: space-between; color: var(--green); }
.spectrum-ends span:last-child { text-align: right; }
.spectrum-ends small { display: block; margin-top: 6px; color: var(--muted-light); font-family: var(--font-body); font-size: 12px; font-weight: 400; letter-spacing: 0; text-transform: none; }
.spectrum-rail { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; height: 74px; margin: 0 2% 28px; }
.spectrum-rail::before { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 4px; border-radius: 999px; background: linear-gradient(90deg, var(--green), #638437 48%, var(--lime)); transform: translateY(-50%); }
.spectrum-rail i { position: relative; z-index: 1; justify-self: center; width: 18px; aspect-ratio: 1; border: 4px solid var(--paper); border-radius: 50%; background: var(--green); box-shadow: 0 0 0 1px rgba(17,23,20,.25); }
.spectrum-rail i:nth-child(2) { width: 23px; background: #4e7636; }
.spectrum-rail i:nth-child(3) { width: 28px; background: #88b83b; }
.spectrum-rail i:nth-child(4) { width: 34px; background: var(--lime); }
.spectrum-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.spectrum-card { display: flex; flex-direction: column; min-height: 300px; padding: 30px; border: 1px solid rgba(30,79,53,.15); border-radius: 20px; background: rgba(255,255,255,.46); }
.spectrum-card .eyebrow { color: var(--green); }
.spectrum-card h3 { margin-top: 22px; font-size: 24px; line-height: 1.08; }
.spectrum-card h3.spectrum-card-title-compact { font-size: 22px; }
.spectrum-card-title-compact span { white-space: nowrap; }
.spectrum-card > p:not(.eyebrow) { margin-top: 18px; color: var(--muted-light); font-size: 14px; line-height: 1.5; }
.spectrum-card strong { margin-top: auto; padding-top: 26px; border-top: 1px solid var(--line-light); font-family: var(--font-label); font-size: 11px; line-height: 1.35; letter-spacing: .04em; }
.spectrum-note { max-width: 980px; margin-top: 52px; color: var(--green); font-size: 24px; line-height: 1.35; }
.spectrum-rigor { max-width: 690px; margin-top: 14px; color: var(--muted-light); font-size: 15px; line-height: 1.55; }

.cap-study-types { background: #111714; }
.type-mosaic { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(360px, .88fr); grid-template-rows: minmax(420px, 1.25fr) minmax(300px, .85fr); gap: 18px; }
.type-feature { position: relative; isolation: isolate; min-height: 300px; overflow: hidden; border: 1px solid rgba(244,239,228,.17); border-radius: 30px; box-shadow: 0 24px 60px rgba(0,0,0,.18); }
.type-feature > img { width: 100%; height: 100%; object-fit: cover; transition: transform 900ms cubic-bezier(.16,1,.3,1); }
.type-feature::after { content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(180deg, rgba(4,9,6,.03), rgba(4,9,6,.88)); }
.type-ingredients { grid-row: 1 / 3; min-height: 690px; }
.type-ingredients > img { object-position: 68% center; }
.type-devices { min-height: 420px; }
.type-devices > img { object-position: 62% center; }
.type-overlay { position: absolute; z-index: 1; left: clamp(26px, 4vw, 46px); right: clamp(26px, 4vw, 46px); bottom: clamp(28px, 4vw, 46px); }
.type-overlay .eyebrow { color: var(--lime); font-size: clamp(14px, 1.2vw, 16px); }
.type-overlay h3 { max-width: 590px; margin-top: 16px; color: #f4efe4; font-size: clamp(34px, 4vw, 56px); line-height: 1.02; }
.type-devices .type-overlay { left: 220px; right: 34px; bottom: 34px; }
.type-devices .type-overlay h3 { font-size: clamp(27px, 3vw, 40px); }
.type-overlay > p:not(.eyebrow) { max-width: 470px; margin-top: 16px; color: #c1c8be; line-height: 1.55; }
.proof-float { position: absolute; z-index: 2; top: 28px; right: 28px; display: flex; flex-direction: column; width: min(255px, calc(100% - 56px)); padding: 22px; border: 1px solid rgba(202,255,77,.22); border-radius: 20px; background: rgba(9,15,11,.82); box-shadow: 0 18px 45px rgba(0,0,0,.22); backdrop-filter: blur(12px); }
.proof-float strong { color: #f4efe4; font-size: 23px; line-height: 1.08; letter-spacing: -.035em; }
.proof-float .eyebrow { margin-top: 11px; color: #9fa79d; font-size: 8px; line-height: 1.5; }
.proof-float .pending-link, .proof-float .text-link { margin-top: 18px; }
.proof-metric { width: 170px; }
.proof-metric strong { color: var(--lime); font-size: 52px; line-height: .9; }
.type-devices .proof-float { right: auto; left: 24px; }
.type-behavior { min-height: 300px; padding: 0; color: var(--ink); border-color: rgba(30,79,53,.22); background: linear-gradient(135deg, #f5f0e5, #dfe8d7); }
.type-behavior::before { content: ''; position: absolute; inset: 20px; z-index: -1; border: 1px solid rgba(30,79,53,.16); border-radius: 21px; }
.type-behavior::after { display: none; }
.behavior-copy { display: flex; flex-direction: column; justify-content: center; min-width: 0; height: 100%; padding: 32px 38px; }
.behavior-copy .eyebrow { color: var(--green); font-size: clamp(14px, 1.2vw, 16px); }
.behavior-word { margin-top: 8px; color: rgba(30,79,53,.28); font-size: clamp(40px, 3.4vw, 50px); font-style: italic; line-height: .9; }
.behavior-copy h3 { max-width: 360px; margin-top: 12px; font-size: clamp(27px, 2.6vw, 34px); line-height: 1.04; }
.behavior-copy > p:last-child { max-width: 430px; margin-top: 10px; color: var(--muted-light); font-size: 14px; line-height: 1.45; }
.pending-link { color: var(--lime); font-size: 13px; font-weight: 600; }
.text-arrow { font-family: var(--font-body); font-style: normal; font-variant-emoji: text; }

.cap-why { background: var(--paper); }
.why-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(40px, 8vw, 110px); align-items: start; }
.cap-why .section-head .eyebrow { color: var(--green); }
.cap-why blockquote { margin: 0; padding: clamp(30px, 4vw, 52px); border: 1px solid var(--line-light); border-radius: var(--radius); background: linear-gradient(145deg, #f9f6ee, #dfe8d8); }
.cap-why blockquote > p { font-family: var(--font-serif); color: var(--green); font-size: clamp(30px, 3.5vw, 46px); font-style: italic; line-height: 1.16; }
.cap-why blockquote footer { margin-top: 34px; padding-top: 26px; border-top: 1px solid var(--line-light); color: var(--muted-light); font-size: 17px; line-height: 1.65; }

.motion-enabled .spectrum-chart.is-in-view .spectrum-rail::before { animation: capabilitySignal 3.8s ease-in-out infinite; transform-origin: left; }
.motion-paused .spectrum-rail::before { animation-play-state: paused !important; }
@keyframes capabilitySignal { 0%, 100% { transform: translateY(-50%) scaleX(.08); opacity: .45; } 50% { transform: translateY(-50%) scaleX(1); opacity: 1; } }

@media (hover: hover) and (pointer: fine) {
  .stat-card, .spectrum-card { transition: transform 250ms ease, border-color 250ms ease, box-shadow 250ms ease; }
  .stat-card:hover, .spectrum-card:hover { transform: translateY(-4px); border-color: rgba(30,79,53,.35); box-shadow: 0 16px 30px rgba(17,23,20,.08); }
  .evidence-row:hover { background: radial-gradient(circle at 60% 15%, rgba(202,255,77,.105), transparent 55%); box-shadow: inset 0 0 0 1px rgba(202,255,77,.08); }
  .type-feature:hover > img { transform: scale(1.025); }
}
@media (max-width: 1100px) {
  .stack-section-head { grid-template-columns: 1fr; }
  .stack-section-head > .eyebrow, .stack-section-head > h2, .stack-section-head > p:last-child:not(.eyebrow) { grid-column: 1; grid-row: auto; }
  .stack-section-head > p:last-child:not(.eyebrow) { margin-top: 24px; }
  .evidence-row { grid-template-columns: 112px minmax(210px, .9fr) minmax(260px, 1.2fr); gap: 26px; min-height: 0; padding: 34px 30px; }
  .evidence-row::before { top: 38px; left: 20px; }
  .type-mosaic { grid-template-columns: 1fr; grid-template-rows: auto; }
  .type-ingredients { grid-row: auto; min-height: 590px; }
  .type-devices { min-height: 540px; }
  .type-devices .type-overlay { left: 30px; right: 30px; bottom: 34px; }
  .type-behavior { min-height: 400px; }
  .spectrum-grid { grid-template-columns: 1fr 1fr; gap: 24px; }
  .spectrum-rail { display: none; }
  .spectrum-ends { margin-bottom: 34px; padding-bottom: 20px; border-bottom: 3px solid var(--green); }
  .stat-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 800px) {
  .capabilities-hero .hero-grid { min-height: 0; }
  .capability-photo { min-height: 410px; height: auto; max-height: none; }
  .stat-card { min-height: 270px; }
  .evidence-row { grid-template-columns: 120px minmax(0, 1fr); gap: 22px 28px; }
  .evidence-row > div { display: grid; grid-template-columns: subgrid; grid-column: 2; }
  .evidence-row p:not(.eyebrow) { grid-column: 1 / -1; }
  .why-layout { grid-template-columns: 1fr; gap: 8px; }
}
@media (max-width: 620px) {
  .capability-photo { min-height: 350px; }
  .spectrum-grid, .stat-grid { grid-template-columns: 1fr; }
  .evidence-row { grid-template-columns: 1fr; gap: 18px; padding: 32px 24px 34px; }
  .evidence-row::before { top: 37px; left: 24px; }
  .evidence-row > .eyebrow { padding-left: 25px; font-size: 13px; }
  .evidence-row > div { display: contents; }
  .evidence-row h3 { max-width: 320px; font-size: clamp(30px, 9.5vw, 38px); }
  .evidence-row h3.evidence-design-heading { max-width: 100%; font-size: clamp(25px, 7.8vw, 32px); }
  .evidence-row p:not(.eyebrow) { grid-column: 1; font-size: 15px; }
  .editorial-links { display: grid; grid-template-columns: 1fr; }
  .editorial-links .text-link { justify-content: space-between; width: 100%; font-size: 15px; }
  .spectrum-chart { padding: 22px; }
  .spectrum-ends { gap: 20px; }
  .spectrum-card { min-height: 250px; }
  .type-mosaic { gap: 14px; }
  .type-feature { border-radius: 24px; }
  .type-ingredients { min-height: 540px; }
  .type-ingredients > img { object-position: 61% center; }
  .type-devices { min-height: 520px; }
  .type-devices > img { object-position: 64% center; }
  .type-overlay { left: 24px; right: 24px; bottom: 24px; }
  .type-overlay .eyebrow { font-size: 12px; }
  .type-overlay h3 { max-width: 330px; margin-top: 12px; font-size: clamp(30px, 8.8vw, 38px); }
  .type-devices .type-overlay { left: 24px; right: 24px; bottom: 24px; }
  .type-devices .type-overlay h3 { font-size: clamp(29px, 8.4vw, 36px); }
  .type-overlay > p:not(.eyebrow) { margin-top: 12px; font-size: 15px; line-height: 1.5; }
  .proof-float { top: 16px; width: min(220px, calc(100% - 32px)); padding: 18px; }
  .type-ingredients .proof-float { right: 16px; left: auto; }
  .type-devices .proof-float { right: auto; left: 16px; }
  .proof-float strong { font-size: 20px; }
  .proof-float .eyebrow { margin-top: 9px; font-size: 9px; }
  .proof-float .pending-link, .proof-float .text-link { min-height: 40px; margin-top: 12px; padding-block: 8px; font-size: 13px; }
  .proof-metric { width: min(200px, calc(100% - 32px)); }
  .proof-metric strong { font-size: 44px; }
  .type-behavior { min-height: 0; }
  .behavior-copy { height: auto; padding: 30px 24px; }
  .behavior-word { font-size: 52px; }
}
@media (max-width: 480px) {
  .capabilities-hero::before { background-size: 28px 28px; }
  .capability-hero-media { border-radius: 20px; }
  .stat-card { min-height: 250px; padding: 24px; }
  .stat-card::before { left: 24px; }
  .stat-card > .eyebrow:last-child { left: 24px; bottom: 20px; }
  .spectrum-chart { padding: 18px; }
  .spectrum-ends { display: grid; gap: 12px; }
  .spectrum-ends span:last-child { text-align: left; }
  .spectrum-card { min-height: 0; padding: 24px; }
  .type-ingredients { min-height: 520px; }
  .type-devices { min-height: 500px; }
  .type-overlay, .type-devices .type-overlay { left: 20px; right: 20px; bottom: 20px; }
  .proof-float { width: min(210px, calc(100% - 32px)); padding: 16px; }
  .type-ingredients .proof-float { right: 16px; left: auto; }
  .type-devices .proof-float { right: auto; left: 16px; }
  .proof-metric { width: min(188px, calc(100% - 32px)); }
  .proof-metric strong { font-size: 42px; }
  .behavior-copy { padding: 28px 22px; }
  .cap-why .section-head h2.eyebrow { font-size: clamp(14px, 4vw, 16px); letter-spacing: .18em; line-height: 1.35; }
  .cap-why blockquote { padding: 26px 24px; }
  .cap-why blockquote > p { font-size: clamp(28px, 8.3vw, 34px); }
}
@media (prefers-reduced-motion: reduce) {
  .spectrum-rail::before { animation: none !important; }
  .evidence-editorial::before, .evidence-editorial::after, .evidence-row::before, .evidence-row h3 span { animation: none !important; }
  .type-feature > img { transition: none !important; }
}
