/* Dyno-Graph Hero — Plan 01-06 / BRAND-04. Scoped CSS. */
.ob-hero{display:flex;flex-direction:column;gap:var(--ob-s-8);padding:var(--ob-s-9) var(--ob-gutter);background:var(--ob-bg-dark);color:var(--ob-fg-on-dark-1)}
.ob-hero > *{min-width:0;max-width:1100px}
.ob-hero__copy{display:flex;flex-direction:column;gap:var(--ob-s-5)}
.ob-hero__chip{display:inline-flex;align-items:center;gap:var(--ob-s-2);align-self:flex-start;font:var(--ob-text-xs)/1 var(--ob-font-mono);letter-spacing:.08em;color:var(--ob-fg-on-dark-2);padding:var(--ob-s-2) var(--ob-s-3);border:1px solid var(--ob-border-dark);border-radius:var(--ob-r-pill)}
.ob-hero__chip-dot{width:8px;height:8px;border-radius:50%;background:var(--ob-cyan-500);box-shadow:0 0 8px var(--ob-cyan-500)}
.ob-hero-h{font:600 clamp(2rem,5vw,4rem)/1.1 var(--ob-font-display);letter-spacing:-.02em;text-wrap:balance;margin:0;color:var(--ob-fg-on-dark-1);max-width:22ch}
.ob-hero__sub{font:var(--ob-text-lg)/1.5 var(--ob-font-sans);color:var(--ob-fg-on-dark-2);margin:0;max-width:48ch}
.ob-hero__ctas{display:flex;gap:var(--ob-s-3);flex-wrap:wrap}
.ob-hero__cta{display:inline-flex;align-items:center;gap:var(--ob-s-2);min-height:44px;padding:var(--ob-s-3) var(--ob-s-5);border-radius:var(--ob-r-sm);font:600 var(--ob-text-sm) var(--ob-font-display);text-decoration:none;transition:background var(--ob-t-base) var(--ob-ease)}
.ob-hero__cta--primary{background:var(--ob-brand);color:var(--ob-brand-fg)}
.ob-hero__cta--primary:hover{background:var(--ob-brand-hover)}
.ob-hero__cta--secondary{color:var(--ob-fg-on-dark-1);border:1px solid var(--ob-border-dark)}
.ob-hero__cta--secondary:hover{border-color:var(--ob-fg-on-dark-2)}
.ob-stat-strip{display:flex;align-items:baseline;gap:var(--ob-s-3);flex-wrap:wrap;margin-top:var(--ob-s-4);font:var(--ob-text-sm) var(--ob-font-mono)}
.ob-stat__value{color:var(--ob-fg-on-dark-1);margin-right:var(--ob-s-2)}
.ob-stat__label,.ob-stat__sep{color:var(--ob-fg-on-dark-3)}
.ob-hero__chart-wrap{position:relative;width:100%;background:var(--ob-bg-dark-card);border:1px solid var(--ob-border-dark);border-radius:var(--ob-r-lg);padding:var(--ob-s-7) var(--ob-s-4) var(--ob-s-4);box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.ob-hero__chart-wrap::before{content:'ECU · LOG #042';position:absolute;top:var(--ob-s-4);left:var(--ob-s-5);font:var(--ob-text-xs)/1 var(--ob-font-mono);letter-spacing:.08em;color:var(--ob-fg-on-dark-3)}
.ob-dyno-chart{width:100%;aspect-ratio:16/9;display:block;max-height:520px}
.ob-dyno-hp-path,.ob-dyno-tq-path{stroke-dasharray:1;stroke-dashoffset:1}
.ob-dyno-hp-path{animation:ob-draw-in 1700ms cubic-bezier(.2,0,0,1) 250ms forwards}
.ob-dyno-tq-path{animation:ob-draw-in 1700ms cubic-bezier(.2,0,0,1) 470ms forwards}
.ob-dyno-fill{opacity:0;animation:ob-fill-fade-in 900ms ease 1400ms forwards,ob-breathe 5200ms ease-in-out 2400ms infinite}
.ob-dyno-peak{opacity:0;animation:ob-fill-fade-in 900ms ease 1400ms forwards}
.ob-dyno-peak-ring{animation:ob-peak-pulse 5200ms ease-in-out 2400ms infinite;opacity:.35}
@keyframes ob-draw-in{to{stroke-dashoffset:0}}
@keyframes ob-fill-fade-in{to{opacity:1}}
@keyframes ob-breathe{0%,100%{opacity:1}50%{opacity:.62}}
@keyframes ob-peak-pulse{0%,100%{opacity:.35}50%{opacity:.15}}
.ob-hero__chart-wrap[style*="paused"] :is(.ob-dyno-hp-path,.ob-dyno-tq-path,.ob-dyno-fill,.ob-dyno-peak,.ob-dyno-peak-ring){animation-play-state:paused}
@media(max-width:768px){.ob-hero{grid-template-columns:1fr;padding:var(--ob-s-9) var(--ob-s-4);gap:var(--ob-s-6)}}
@media(prefers-reduced-motion:reduce){.ob-dyno-hp-path,.ob-dyno-tq-path{stroke-dashoffset:0!important;animation:none!important}.ob-dyno-fill,.ob-dyno-peak{opacity:1!important;animation:none!important}.ob-dyno-peak-ring{animation:none!important;opacity:.35!important}}