body.soccer-landing{--sc-tint:#f0f2ff}
body.soccer-landing h1,body.soccer-landing h2,body.soccer-landing h3{margin:0;color:var(--page-text);font-weight:600}
body.soccer-landing .sc-section{padding:clamp(72px,9vw,128px) 0;border-bottom:1px solid var(--page-border);scroll-margin-top:84px}
body.soccer-landing .sc-tint{background:var(--page-surface)}
body.soccer-landing .eyebrow{color:var(--page-muted)}

/* Hero: headline and actions on one row, the demo video full width beneath them. */
body.soccer-landing .sc-hero{padding:clamp(28px,3.4vw,48px) 0 clamp(48px,6vw,88px);border-bottom:1px solid var(--page-border)}
body.soccer-landing .sc-hero-layout{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-areas:"heading summary" "media media";gap:clamp(28px,3vw,40px) clamp(32px,6vw,88px);align-items:end}
body.soccer-landing .sc-hero-intro{display:contents}
body.soccer-landing .sc-hero-copy{grid-area:heading}
body.soccer-landing .sc-hero-copy .eyebrow{margin-bottom:20px}
body.soccer-landing .sc-hero-summary{grid-area:summary}
body.soccer-landing .sc-hero-video{grid-area:media;width:100%;min-width:0;margin:0;scroll-margin-top:92px}
body.soccer-landing .sc-hero h1{font-size:clamp(2.15rem,3.6vw,3.4rem);line-height:1.04;letter-spacing:-.055em;text-wrap:balance}
body.soccer-landing .sc-hero h1 span{color:var(--page-accent)}
body.soccer-landing .sc-lede{max-width:31em;margin:0;color:var(--page-muted);font-size:clamp(1rem,1.4vw,1.1rem);line-height:1.6}
body.soccer-landing .sc-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:34px}
body.soccer-landing .sc-hero .sc-actions{margin-top:24px}
body.soccer-landing .sc-values{display:flex;flex-wrap:wrap;gap:8px 28px;margin:30px 0 0;padding:0;list-style:none;color:var(--page-muted);font-size:.88rem;font-weight:500}
body.soccer-landing .sc-hero .sc-values{margin-top:20px}
body.soccer-landing .sc-values li::before{content:'';display:inline-block;width:7px;height:7px;margin-right:10px;background:var(--page-accent)}

/* Edited captures from the current BKV match workspace; real app actions and moving footage. */
body.soccer-landing .sc-demo { position:relative; overflow:hidden; border:1px solid var(--page-border); border-radius:10px; background:var(--page-bg); }
body.soccer-landing .sc-demo video { display:block; width:100%; height:auto; cursor:pointer; }
body.soccer-landing .sc-demo video:focus-visible { outline:3px solid var(--page-accent); outline-offset:-3px; }
body.soccer-landing .sc-hero-video figcaption, body.soccer-landing .sc-capture figcaption { margin-top:12px; color:var(--page-muted); font-size:.8rem; line-height:1.6; }
body.soccer-landing .sc-hero-video figcaption{margin-top:14px;font-size:.84rem}
body.soccer-landing .sc-hero-video figcaption strong{color:var(--page-text);font-weight:600}
body.soccer-landing .sc-footnote-ref{padding:0 3px;color:var(--page-muted);text-decoration:underline;text-underline-offset:2px}
body.soccer-landing .sc-footnotes{padding-top:18px;padding-bottom:18px;color:var(--page-muted);font-size:.7rem;line-height:1.6}
body.soccer-landing .sc-footnotes p{margin:0;scroll-margin-top:92px}
body.soccer-landing .sc-footnotes a{color:inherit;text-decoration:underline;text-underline-offset:2px}
body.soccer-landing .sc-footnotes a:focus-visible,body.soccer-landing .sc-footnote-ref:focus-visible{outline:2px solid var(--page-accent);outline-offset:3px}
body.soccer-landing .sc-capture { grid-column:1/-1; min-width:0; margin:0; }

/* One large icon-only play control; native controls remain available. */
body.soccer-landing .sc-hero-player{border-color:var(--page-border);border-radius:16px;background:var(--page-navy);box-shadow:0 28px 76px rgba(28,49,70,.18)}
body.soccer-landing .sc-play{position:absolute;z-index:2;top:50%;left:50%;display:grid;place-items:center;width:84px;height:84px;padding:0;border:0;border-radius:50%;background:var(--page-accent);color:#fff;box-shadow:0 10px 30px rgba(6,12,20,.28);cursor:pointer;transform:translate(-50%,-50%);transition:opacity .2s ease,visibility 0s linear 0s,filter .2s ease}
body.soccer-landing .sc-play[hidden]{display:none}
body.soccer-landing .sc-play:hover{filter:brightness(1.1)}
body.soccer-landing .sc-play:focus-visible{outline:3px solid #fff;outline-offset:4px;box-shadow:0 0 0 7px var(--page-accent),0 10px 30px rgba(6,12,20,.28)}
body.soccer-landing .sc-play svg{width:32px;height:32px;margin-left:4px;fill:currentColor}
body.soccer-landing .sc-hero-player[data-state="playing"] .sc-play{opacity:0;visibility:hidden;transition:opacity .2s ease,visibility 0s linear .2s}
body.soccer-landing .sc-hero-player[data-state="loading"] .sc-play{cursor:progress}

/* Section heads */
body.soccer-landing .sc-head{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,4fr);gap:24px clamp(32px,6vw,96px);align-items:end;margin-bottom:clamp(40px,5vw,64px)}
body.soccer-landing .sc-head h2,body.soccer-landing .sc-faq-grid h2{max-width:14em;font-size:clamp(2rem,4vw,3.3rem);line-height:1.06;letter-spacing:-.058em}
body.soccer-landing .sc-head .eyebrow{margin-bottom:22px}
body.soccer-landing .sc-sub{margin:0;color:var(--page-muted);font-size:1.02rem;line-height:1.65}

/* Workflow */
body.soccer-landing .sc-steps{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 36px;margin:0;padding:0;list-style:none}
body.soccer-landing .sc-steps::before{content:'';position:absolute;top:6px;left:0;right:0;height:1px;background:#aab8c5}
body.soccer-landing .sc-steps li{position:relative;padding-top:46px}
body.soccer-landing .sc-steps li::before{content:'';position:absolute;top:0;left:0;width:13px;height:13px;border:2px solid var(--page-accent);border-radius:50%;background:var(--page-bg)}
body.soccer-landing .sc-steps li:last-child::before{background:var(--page-accent)}
body.soccer-landing .sc-num{display:block;margin-bottom:12px;color:var(--page-accent);font-size:.78rem;font-weight:700;letter-spacing:.14em}
body.soccer-landing .sc-steps h3{margin-bottom:10px;font-size:1.3rem;letter-spacing:-.04em}
body.soccer-landing .sc-steps p{margin:0;color:var(--page-muted);font-size:.95rem;line-height:1.6}

/* Scrolling analysis gallery */
body.soccer-landing .sc-analysis-list{display:grid;gap:clamp(28px,4vw,52px)}
body.soccer-landing .sc-feature{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:clamp(24px,5vw,64px);padding:clamp(24px,4vw,52px);border:1px solid var(--page-border);border-radius:14px;background:var(--page-bg)}
body.soccer-landing .sc-feature h3{margin-bottom:14px;font-size:clamp(1.6rem,2.6vw,2.1rem);letter-spacing:-.05em}
body.soccer-landing .sc-feature p{margin:0;color:var(--page-muted);line-height:1.65}
body.soccer-landing .sc-feature ul{margin:24px 0 0;padding:0;list-style:none}
body.soccer-landing .sc-feature li{padding:13px 0;border-top:1px solid var(--page-border);font-size:.95rem;line-height:1.5}
body.soccer-landing .sc-ask{align-self:start;padding:26px;border-left:3px solid var(--page-accent);background:var(--sc-tint)}
body.soccer-landing .sc-tag{display:block;margin-bottom:12px;color:var(--page-accent);font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
body.soccer-landing .sc-ask p{margin:0 0 14px;color:var(--page-text);font-size:1.25rem;font-weight:600;letter-spacing:-.035em;line-height:1.3}
body.soccer-landing .sc-ask small{color:var(--page-muted);font-size:.8rem;line-height:1.5}

/* Technical understanding */
body.soccer-landing .sc-tech-split{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:clamp(40px,7vw,104px);align-items:start}
body.soccer-landing .sc-tech-key{max-width:14em;margin:0;color:var(--page-text);font-size:clamp(1.4rem,2.4vw,1.9rem);font-weight:600;letter-spacing:-.045em;line-height:1.22}
body.soccer-landing .sc-tech-diagram{margin:36px 0 0;padding:24px;border:1px solid var(--page-border);border-radius:14px;background:var(--page-surface)}
body.soccer-landing .sc-tech-lanes{display:grid;gap:18px}
body.soccer-landing .sc-tech-lane{display:grid;grid-template-columns:7.5em minmax(0,1fr);gap:14px;align-items:center;color:var(--page-muted);font-size:.78rem;font-weight:600}
body.soccer-landing .sc-tech-bar{display:grid;gap:4px;height:10px}
body.soccer-landing .sc-tech-bar--player{grid-template-columns:5fr 2fr 4fr}
body.soccer-landing .sc-tech-bar--number{grid-template-columns:3fr 3fr 5fr}
body.soccer-landing .sc-tech-bar--action{grid-template-columns:8fr 3fr}
body.soccer-landing .sc-tech-bar span{border-radius:99px}
body.soccer-landing .sc-tech-bar .is-clear{background:var(--page-accent)}
body.soccer-landing .sc-tech-bar .is-open{border:1px solid color-mix(in srgb,var(--page-accent) 45%,transparent);background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--page-accent) 30%,transparent) 0 3px,transparent 3px 7px)}
body.soccer-landing .sc-tech-legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:22px;padding-top:16px;border-top:1px solid var(--page-border);color:var(--page-muted);font-size:.75rem;font-weight:500}
body.soccer-landing .sc-tech-legend span{display:inline-flex;align-items:center;gap:8px}
body.soccer-landing .sc-tech-legend span::before{content:'';width:18px;height:8px;border-radius:99px}
body.soccer-landing .sc-tech-legend .is-clear::before{background:var(--page-accent)}
body.soccer-landing .sc-tech-legend .is-open::before{border:1px solid color-mix(in srgb,var(--page-accent) 45%,transparent);background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--page-accent) 30%,transparent) 0 3px,transparent 3px 7px)}
body.soccer-landing .sc-tech-diagram figcaption{margin-top:14px;color:var(--page-muted);font-size:.8rem;line-height:1.6}
body.soccer-landing .sc-tech-reads{margin:0;padding:0;list-style:none;border-bottom:1px solid var(--page-border)}
body.soccer-landing .sc-tech-reads li{display:grid;grid-template-columns:3rem minmax(0,1fr);gap:0 20px;padding:28px 0;border-top:1px solid var(--page-border)}
body.soccer-landing .sc-tech-reads .sc-num{grid-row:span 2;margin:0;padding-top:.5em}
body.soccer-landing .sc-tech-reads h3{margin-bottom:10px;font-size:clamp(1.25rem,2vw,1.55rem);letter-spacing:-.04em}
body.soccer-landing .sc-tech-reads p{max-width:38em;margin:0;color:var(--page-muted);font-size:.98rem;line-height:1.65}
body.soccer-landing .sc-tech-notes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px clamp(24px,3vw,40px);margin-top:clamp(56px,7vw,96px)}
body.soccer-landing .sc-tech-notes>div{position:relative;padding-top:22px;border-top:1px solid var(--page-border)}
body.soccer-landing .sc-tech-notes>div::before{content:'';position:absolute;top:-1px;left:0;width:32px;height:2px;background:var(--page-accent)}
body.soccer-landing .sc-tech-notes h3{margin-bottom:10px;font-size:1.1rem;letter-spacing:-.03em}
body.soccer-landing .sc-tech-notes p{margin:0;color:var(--page-muted);font-size:.92rem;line-height:1.6}

/* Footage fit */
body.soccer-landing .sc-fit{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:hidden;border:1px solid var(--page-border);border-radius:14px}
body.soccer-landing .sc-fit>div{padding:clamp(24px,4vw,48px)}
body.soccer-landing .sc-fit>div+div{border-left:1px solid var(--page-border);background:var(--page-surface)}
body.soccer-landing .sc-fit h3{margin-bottom:18px;font-size:1.4rem;letter-spacing:-.04em}
body.soccer-landing .sc-fit ul{margin:0;padding:0;list-style:none}
body.soccer-landing .sc-fit li{position:relative;padding:13px 0 13px 24px;border-top:1px solid var(--page-border);color:var(--page-muted);font-size:.95rem;line-height:1.55}
body.soccer-landing .sc-fit li::before{content:'';position:absolute;top:21px;left:0;width:8px;height:8px;background:var(--page-accent)}
body.soccer-landing .sc-fit>div+div li::before{background:var(--page-navy)}

/* FAQ */
body.soccer-landing .sc-faq-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:clamp(32px,7vw,104px)}
body.soccer-landing .sc-faq details{border-top:1px solid var(--page-border)}
body.soccer-landing .sc-faq details:last-child{border-bottom:1px solid var(--page-border)}
body.soccer-landing .sc-faq summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;font-size:1.05rem;font-weight:600;letter-spacing:-.025em;list-style:none;cursor:pointer}
body.soccer-landing .sc-faq summary::-webkit-details-marker{display:none}
body.soccer-landing .sc-faq summary::after{content:'+';flex:none;color:var(--page-accent);font-size:1.5rem;font-weight:400;line-height:1}
body.soccer-landing .sc-faq details[open] summary::after{content:'−'}
body.soccer-landing .sc-faq summary:hover{color:var(--page-accent)}
body.soccer-landing .sc-faq summary:focus-visible{outline-offset:2px}
body.soccer-landing .sc-faq p{max-width:36em;margin:0 0 24px;color:var(--page-muted);line-height:1.65}

/* Closing CTA */
body.soccer-landing .sc-cta{padding:clamp(72px,9vw,120px) 0;background:var(--sc-tint)}
body.soccer-landing .sc-cta-inner{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:32px 48px}
body.soccer-landing .sc-cta h2{max-width:12em;font-size:clamp(2rem,4.4vw,3.6rem);line-height:1.04;letter-spacing:-.062em}
body.soccer-landing .sc-cta .sc-actions{margin-top:0}

/* Responsive */
@media (max-width:991.98px){
 body.soccer-landing .sc-hero-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:"heading" "summary" "media";gap:24px;align-items:start}
 body.soccer-landing .sc-hero h1{max-width:18em}
 body.soccer-landing .sc-hero-video{width:100%}
 body.soccer-landing .sc-head,body.soccer-landing .sc-faq-grid,body.soccer-landing .sc-feature,body.soccer-landing .sc-tech-split{grid-template-columns:minmax(0,1fr)}
 body.soccer-landing .sc-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 32px}
 body.soccer-landing .sc-tech-notes{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:767px){
 body.soccer-landing .sc-steps{grid-template-columns:minmax(0,1fr);gap:0}
 body.soccer-landing .sc-steps::before{top:6px;bottom:30px;left:6px;right:auto;width:1px;height:auto}
 body.soccer-landing .sc-steps li{padding:0 0 36px 40px}
 body.soccer-landing .sc-steps li:last-child{padding-bottom:0}
 body.soccer-landing .sc-fit{grid-template-columns:minmax(0,1fr)}
 body.soccer-landing .sc-fit>div+div{border-top:1px solid var(--page-border);border-left:0}
 body.soccer-landing .sc-tech-notes{grid-template-columns:minmax(0,1fr);gap:32px}
 body.soccer-landing .sc-tech-reads li{grid-template-columns:2.25rem minmax(0,1fr);gap:0 14px}
 body.soccer-landing .sc-tech-lane{grid-template-columns:6.5em minmax(0,1fr)}
 body.soccer-landing .sc-actions .button{flex:1 1 100%}
 body.soccer-landing .sc-cta-inner{display:block}
 body.soccer-landing .sc-cta .sc-actions{margin-top:28px}
 body.soccer-landing .sc-hero-player{border-radius:12px}
 body.soccer-landing .sc-play{width:64px;height:64px}
 body.soccer-landing .sc-play svg{width:26px;height:26px;margin-left:3px}
}
@media (prefers-reduced-motion:reduce){
 html:has(body.soccer-landing){scroll-behavior:auto}
 body.soccer-landing *,body.soccer-landing *::before,body.soccer-landing *::after{animation:none!important;transition:none!important}
}
