/* hero-v5: the copy, large, and a continuous thread in motion. Nothing else above the fold. 2026-09-17 */
.hero-v5{position:relative;isolation:isolate;overflow:hidden;background:#131c17;flex-wrap:wrap;color:#fff;min-height:calc(100svh - 78px);max-height:920px;display:flex;align-items:center}
.v5-inner{width:100%;max-width:1400px;margin:0 auto;padding:60px 5vw 56px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:3vw;align-items:center}
.v5-copy{max-width:760px}
.v5-copy h1{font-size:clamp(38px,3.92vw,60px);line-height:1.04;letter-spacing:-.055em;font-weight:450;margin:0}
.v5-copy h1>span{display:block;color:#fff;white-space:nowrap}
.v5-copy h1>span.v5-accent{color:#d8e4d0}
.v5-cycle{position:relative;display:inline-block;white-space:nowrap;color:#fff}
.v5-cycle:after{content:'';position:absolute;left:0;right:0;bottom:-.04em;height:.14em;background:#ffbd9d;opacity:.9;z-index:-1}
.v5-word,.v5-dot{display:inline-block;white-space:pre}
.v5-ch{display:inline-block;white-space:pre;animation:v5-char-in .42s cubic-bezier(.2,.8,.2,1) both}
@keyframes v5-char-in{from{opacity:0;transform:translateY(.28em)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.v5-ch{animation:none}}
.v5-copy .lead{color:#c3cfba;font-size:clamp(18px,1.45vw,22px);line-height:1.5;margin:28px 0 0;max-width:560px}
.v5-copy .lead strong{color:#fff;font-weight:550}
.v5-copy .actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-start;margin-top:32px}
.v5-copy .button{background:#f5f6f0;color:#1f2b24;border-color:#f5f6f0;font-size:14px;padding:16px 24px}
.v5-copy .button:hover{background:#fff}
.v5-proof{margin:22px 0 0;font-size:14px;line-height:1.5;color:#9aa896;max-width:520px}
.v5-proof b{color:#dfe8d6;font-weight:550}
.v5-copy .button.secondary{background:#ffffff0a;color:#fff;border-color:#ffffff40}
.v5-copy .button.secondary:hover{background:#ffffff1a}
.v5-thread{position:relative;min-width:0;aspect-ratio:16/10;overflow:visible;transform:scale(1.22) translateX(6%);transform-origin:center}
.v5-thread video{width:100%;height:100%;object-fit:cover;display:block;mix-blend-mode:screen;-webkit-mask-image:radial-gradient(ellipse at 50% 50%,#000 38%,transparent 70%);mask-image:radial-gradient(ellipse at 50% 50%,#000 38%,transparent 70%)}
.v5-thread:after{display:none}
@media(max-width:1100px){.v5-copy h1{font-size:clamp(38px,4.6vw,60px)}}
@media(max-width:760px){
.hero-v5{min-height:0;max-height:none;align-items:flex-start}
.v5-inner{grid-template-columns:1fr;gap:26px;padding:48px 20px 40px}
.v5-copy h1{font-size:clamp(24px,6.8vw,36px)}
.v5-copy .lead{font-size:17px}
.v5-thread{aspect-ratio:16/11;margin:0;transform:scale(1.15)}
}
.v5-switch{position:absolute;right:18px;bottom:14px;display:flex;gap:6px;z-index:2}
.v5-switch button{border:1px solid #ffffff30;background:#ffffff12;color:#dfe8d6;font:inherit;font-size:11px;padding:6px 10px;border-radius:20px;cursor:pointer}
.v5-switch button[aria-pressed=true]{background:#f5f6f0;color:#1f2b24;border-color:#f5f6f0}
@media(max-width:760px){.v5-switch{position:static;flex-basis:100%;justify-content:center;margin:0;padding:0 0 18px}}
/* Keep the customer logo strip inside the desktop landing viewport. */
@media (min-width:1024px) and (min-height:600px) {
  .hero-v5 { min-height:calc(100svh - 194px); }
}

@media (min-width:1024px) and (min-height:600px) and (max-height:680px) {
  .hero-v5 .v5-inner { padding-top:30px; padding-bottom:30px; }
}
/* Leave room for the longest rotating headline on narrow phones. */
@media (max-width:360px) {
  .hero-v5 .v5-copy h1 { font-size:clamp(22px,6.8vw,24px); }
}
