/* Public ZurekoBet only. Academy's composition principles, not its stylesheet. */
html:has([data-home-public]) { height:auto; overflow-y:auto; scroll-behavior:smooth; scroll-padding-top:var(--home-public-navbar-height,64px); }
body.od-app:has([data-home-public]) { height:auto; overflow:visible; background:var(--ng-surface-page); }
body.od-app:has([data-home-public]) > .od-hd-scale-shell { width:100%; height:auto; min-height:100dvh!important; overflow:visible; zoom:1; }
/* Local compatibility aliases; the palette lives only in accent-controls.css. */
.od-public-home [data-home-tone] { --home-tone:var(--ng-accent-color); }
.od-public-home .od-neon-global-1 { --home-neon:var(--ng-neon-color,var(--ng-accent-color,var(--ng-accent-red))); --home-hover-shadow:var(--ng-neon-shadow); }
.od-public-home .od-public-plan { --ng-neon-color:var(--plan-accent); }
.od-public-home .od-public-service-card { --ng-accent-card-padding:26px; }
.od-public-home .od-home-demo { --ng-accent-card-padding:16px; }
.od-public-home .od-home-example-disclaimer { margin:10px 0 0; color:var(--ng-text-muted); font-size:11px; line-height:1.5; }
.od-public-home .od-service-preview { display:grid; grid-template-rows:28px 28px minmax(0,1fr) auto; }
.od-public-home .od-service-preview-layout { height:auto; min-height:0; }
.od-public-home .od-service-preview > .od-home-example-disclaimer { padding:0 12px 12px; }
.od-public-home .od-public-contact-details { --ng-accent-card-padding:18px; }
@media(max-width:991.98px) { .od-public-home .od-public-service-card { --ng-accent-card-padding:22px; } }
@media(max-width:575.98px) { .od-public-home .od-home-color-card:not(.od-public-service-card) { --ng-accent-card-padding:16px; } }

/* The image covers the entire first screen, independent of the content grid. */
.od-public-home .od-home-cover.od-hero { position:relative; isolation:isolate; display:flex; align-items:center; min-height:calc(100svh - var(--home-navbar-height,64px)); padding:clamp(44px,6vh,88px) 0 112px; overflow:clip; background:#06111d; }
.od-home-cover-image { position:absolute; z-index:-3; inset:0; width:100%; height:100%; object-fit:cover; object-position:65% 52%; transform:translateY(var(--home-hero-shift,0px)) scale(1.07); }
.od-home-cover::before { content:""; position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg,rgba(2,8,19,.82),rgba(2,8,19,.4) 55%,rgba(2,8,19,.22)); }
.od-home-cover::after { content:""; position:absolute; inset:auto 0 0; height:160px; z-index:-1; background:linear-gradient(0deg,var(--ng-surface-page),transparent); pointer-events:none; }
.od-public-home .od-home-cover .od-home-container { width:min(1560px,calc(100% - 80px)); max-width:none; padding-inline:0; }
.od-public-home .od-home-cover .od-home-panel--hero { grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(28px,4vw,80px); padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
.od-home-cover .od-home-panel--hero::before { content:none; }
.od-home-cover .od-home-drone-show { --ng-drone-text-scale:.85; height:clamp(120px,12svh,160px); max-width:600px; margin-bottom:18px; }
.od-public-home .od-home-cover .od-hero__title { max-width:19ch; margin:22px 0; color:#fff; font-size:clamp(34px,3.8vw,66px); line-height:1.1; text-wrap:balance; }
.od-public-home .od-home-cover .od-hero__title .od-public-hero-accent {
    color:var(--ng-accent-red); background:none; -webkit-text-fill-color:currentColor;
    text-shadow:0 0 2px var(--ng-accent-red),0 0 8px var(--ng-accent-red),0 0 18px color-mix(in srgb,var(--ng-accent-red) 90%,transparent),0 0 36px color-mix(in srgb,var(--ng-accent-red) 70%,transparent),0 0 60px color-mix(in srgb,var(--ng-accent-red) 45%,transparent);
}
.od-public-home .od-home-cover .od-hero__lead { max-width:54ch; color:#e4e9f2; font-size:clamp(14px,1.1vw,18px); line-height:1.8; }
.od-home-cover-copy > .od-subtitle-badge-global-1 { color:#fff; background:rgba(255,58,77,.13); box-shadow:inset 0 0 0 1px rgba(255,95,111,.65); }
.od-public-home .od-home-cover .od-public-actions .od-button-global-2--secondary { color:#fff; background:rgba(8,16,31,.32); box-shadow:inset 0 0 0 1px rgba(255,255,255,.5); }
.od-home-cover .od-home-demo { --home-demo-surface-opacity:35%; max-width:540px; justify-self:end; backdrop-filter:blur(8px); }
/* Only cover demo surfaces are translucent; text, logos and controls stay opaque. */
html[data-theme] body.od-app .od-home-cover .od-home-demo.od-accent-card-global-1 {
    background:color-mix(in srgb,color-mix(in srgb,var(--ng-accent-color) 5%,var(--ng-surface-home-panel)) var(--home-demo-surface-opacity),transparent)!important;
}
.od-home-cover .od-home-demo .od-home-demo-teams { background:transparent; }
.od-home-cover .od-home-demo .od-home-demo-card,
.od-home-cover .od-home-demo .od-home-demo-score .od-score-league {
    background:color-mix(in srgb,var(--ng-global-26) var(--home-demo-surface-opacity),transparent);
}
.od-home-cover .od-home-demo .od-home-demo-results > div {
    background:color-mix(in srgb,color-mix(in srgb,var(--ng-value-positive) 6%,var(--ng-surface-home-panel)) var(--home-demo-surface-opacity),transparent);
}
/* Score has one translucent table surface, not three stacked fills. */
.od-home-cover .od-home-demo .od-home-demo-score :is(.od-score-league__head,.od-score-match,.od-score-match-odds strong) { background:transparent; }
.od-home-scroll-cue { display:flex; align-items:center; gap:12px; width:max-content; margin-top:28px; color:#e2e8f0; font-size:12px; text-decoration:none; }
.od-home-scroll-cue i { display:grid; place-items:center; width:32px; height:32px; border:1px solid rgba(255,255,255,.35); border-radius:50%; }
.od-home-scroll-cue:hover,.od-home-scroll-cue:focus-visible { color:#fff; }
html[data-theme="light"] .od-public-home .od-home-cover .od-home-scroll-cue { color:var(--ng-text); }
html[data-theme="light"] .od-home-cover .od-home-scroll-cue i { border-color:color-mix(in srgb,var(--ng-text) 35%,transparent); }
.od-public-home .od-public-section { position:relative; padding-block:14px; scroll-margin-top:0; }
.od-public-home #sobre-nosotros { padding-top:14px; }
/* Compact public content only; hero and the service preview keep their sizes. */
.od-public-home .od-public-section .od-home-panel:not(.od-public-services-heading) { padding:clamp(24px,2.2vw,36px); }
.od-public-home .od-section-heading { gap:20px; margin-bottom:18px; }
.od-public-home .od-section-heading > div { padding-bottom:10px; }
.od-public-home .od-public-services-heading .od-section-heading { margin-bottom:0; }
.od-public-home .od-public-billing { margin-bottom:16px; }
.od-public-home .od-public-contact { align-items:start; gap:24px; }
.od-public-contact-intro { min-width:0; }
.od-public-home .od-public-contact-intro .od-section-heading { margin-bottom:16px; }
.od-public-home .od-public-contact-intro > p { margin-top:0; }
.od-public-home .od-public-contact .od-button-global-2 { margin-top:16px; }
.od-public-home .od-public-contact-details { grid-template-columns:repeat(2,minmax(0,1fr)); align-content:start; gap:16px 20px; --ng-accent-card-padding:18px; }
.od-public-contact-details > div { min-width:0; }
.od-public-contact-details > div:first-child { grid-column:1/-1; }
.od-public-home .od-public-contact-details p { margin-top:6px; }

/* Decorative PNGs stay outside text hit areas. */
.od-public-home .od-home-about-visual { grid-template-columns:minmax(0,1.3fr) minmax(280px,.9fr); min-height:0; align-items:center; margin-bottom:16px; }
.od-home-stadium-visual { position:relative; height:210px; display:grid; place-items:center; }
.od-home-stadium-visual > img { width:100%; max-width:230px; height:auto; object-fit:contain; pointer-events:none; }
.od-public-home .od-home-color-card .od-feature-card__icon { color:var(--home-tone); border-color:color-mix(in srgb,var(--home-tone) 28%,var(--od-border)); background:color-mix(in srgb,var(--home-tone) 11%,var(--ng-surface-home-panel)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--home-tone) 18%,transparent); }
.od-public-service-card--calculator { position:relative; overflow:hidden; }
.od-public-home .od-public-service-card--calculator { padding-right:clamp(120px,12vw,170px)!important; }
.od-home-calculator-art { position:absolute; right:-20px; bottom:-8px; width:clamp(140px,14vw,190px); height:auto; pointer-events:none; transform:rotate(-8deg); opacity:.85; }
.od-public-service-card--calculator > :not(img) { position:relative; z-index:1; }

/* Four colored stages, without the removed ball or scroll-driven selection. */
.od-home-step-track { position:relative; height:30px; margin:4px 12.5% 12px; }
.od-home-step-rail { position:absolute; left:0; right:0; top:15px; height:2px; background:linear-gradient(90deg,var(--ng-accent-green),var(--ng-accent-purple),var(--ng-accent-blue),var(--ng-accent-gold)); }
.od-home-step-stops { display:flex; justify-content:space-between; position:absolute; left:0; right:0; top:11px; }
.od-home-step-stops span { --ng-accent-color:var(--ng-accent-green); width:10px; height:10px; border-radius:50%; background:var(--ng-accent-color); box-shadow:0 0 16px color-mix(in srgb,var(--ng-accent-color) 45%,transparent); }.od-home-step-stops span:nth-child(2) { --ng-accent-color:var(--ng-accent-purple); }.od-home-step-stops span:nth-child(3) { --ng-accent-color:var(--ng-accent-blue); }.od-home-step-stops span:nth-child(4) { --ng-accent-color:var(--ng-accent-gold); }
.od-public-home .od-public-step { cursor:pointer; border:1px solid color-mix(in srgb,var(--home-tone) 35%,var(--od-border)); background:color-mix(in srgb,var(--home-tone) 10%,var(--ng-surface-home-panel)); box-shadow:0 4px 14px -8px var(--home-tone); color:var(--home-tone); font:inherit; }
.od-public-home .od-public-step:focus-visible { outline:2px solid var(--home-tone); outline-offset:4px; }

/* FAQ: natural-height copy + tactics cutout; no reserved empty image stage. */
.od-public-home .od-home-faq-layout { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(22px,4vw,64px); overflow:hidden; }
.od-home-faq-layout .od-home-faq-intro { display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:14px; margin:0; position:relative; min-height:0; padding-bottom:0; align-self:start; }
.od-home-faq-intro .od-text-body-global-1 { max-width:38ch; }
.od-home-faq-art { position:static; width:180px; max-width:100%; height:auto; pointer-events:none; }
.od-public-home .od-public-faq { align-content:start; gap:12px; }
@media(hover:hover) and (pointer:fine) {
    .od-public-home .od-home-color-card:hover { transform:translateY(-3px); }
}
@media(prefers-reduced-motion:no-preference) {
    .od-home-scroll-cue i { animation:od-cue-drift 3s ease-in-out infinite; }
    .od-home-calculator-art { animation:od-object-float 7s ease-in-out infinite; }
    .od-public-home .od-home-reveal { opacity:0; transform:translateY(18px); transition:opacity .65s ease,transform .65s ease; }
    .od-public-home .od-home-reveal.is-visible { opacity:1; transform:none; }
}
@keyframes od-cue-drift { 50% { transform:translateY(5px); } }
@keyframes od-object-float { 50% { transform:translateY(-8px) rotate(-5deg); } }
/* Like Academy, desktop uses a fixed viewport frame plus a separate bottom
   row. A min-height alone lets copy/padding push the scroll cue off-screen. */
@media(min-width:992px) {
    .od-public-home .od-home-cover.od-hero { height:calc(100svh - var(--home-navbar-height,64px)); min-height:0; padding:0; }
    .od-public-home .od-home-cover .od-home-container { display:grid; grid-template-rows:minmax(0,1fr) auto; gap:24px; height:100%; padding-block:clamp(24px,5svh,72px) 28px; }
    .od-home-cover .od-home-panel--hero { align-self:center; }
    .od-home-cover .od-home-scroll-cue { margin:0; align-self:end; }
}
@media(min-width:992px) and (max-height:800px) {
    .od-home-cover .od-home-drone-show { height:100px; margin-bottom:12px; }
    .od-public-home .od-home-cover .od-home-container { gap:16px; padding-block:24px; }
    .od-public-home .od-home-cover .od-hero__title { margin-block:18px; font-size:clamp(34px,min(3.2vw,6.2svh),50px); line-height:1.12; }
    .od-public-home .od-home-cover .od-hero__lead { margin-bottom:20px; font-size:14px; line-height:1.65; }
    .od-home-cover::after { height:100px; }
    .od-home-cover .od-home-demo { --ng-accent-card-padding:12px; padding:12px; }
    .od-home-cover .od-home-demo .od-home-demo-card { min-height:112px; gap:6px; padding:8px; }
    .od-home-cover .od-home-demo-results { margin-top:12px; }
    .od-home-cover .od-home-demo-results > div { min-height:50px; padding-block:6px; }
    .od-home-cover .od-home-demo-controls { margin-top:12px; }
}
@media(min-width:992px) and (max-height:600px) {
    .od-home-cover .od-home-drone-show { height:90px; margin-bottom:8px; }
    .od-public-home .od-home-cover .od-home-container { gap:10px; padding-block:16px; }
    .od-public-home .od-home-cover .od-hero__title { font-size:clamp(30px,3vw,38px); margin-block:12px; }
    .od-public-home .od-home-cover .od-hero__lead { font-size:13px; line-height:1.5; margin-bottom:14px; }
    .od-home-cover .od-home-scroll-cue { font-size:11px; }.od-home-cover .od-home-scroll-cue i { width:26px; height:26px; }
}
@media(min-width:1900px) { .od-public-home .od-home-cover .od-home-container { width:min(1700px,calc(100% - 128px)); }.od-home-cover .od-home-demo { max-width:620px; } }
@media(max-width:991.98px) {
    .od-public-home .od-home-cover .od-home-container { width:calc(100% - 40px); }
    .od-public-home .od-home-cover .od-home-panel--hero { grid-template-columns:1fr; gap:32px; }
    .od-home-cover .od-home-demo { justify-self:start; max-width:600px; }
    .od-public-home .od-home-cover.od-hero { padding:46px 0 96px; }
    .od-public-home .od-home-cover .od-hero__title { font-size:clamp(32px,5.5vw,52px); }
    .od-public-home .od-public-section .od-home-panel:not(.od-public-services-heading) { padding:24px; }
}
@media(max-width:575.98px) {
    .od-public-home .od-home-cover .od-home-container { width:calc(100% - 32px); }
    .od-public-home .od-home-cover .od-hero__title { font-size:34px; }
    .od-home-cover-image { object-position:74% 50%; }
    .od-public-home .od-home-cover .od-hero__lead { font-size:14px; }
    .od-public-home .od-home-about-visual { grid-template-columns:1fr; gap:6px; }
    .od-home-stadium-visual { height:180px; }.od-home-stadium-visual > img { width:100%; max-width:180px; }
    .od-public-home .od-home-faq-layout { grid-template-columns:1fr; gap:18px; }
    .od-home-faq-layout .od-home-faq-intro { display:grid; grid-template-columns:minmax(0,1fr) 90px; gap:14px 10px; padding:0; min-height:0; }
    .od-home-faq-intro > div,.od-home-faq-intro > p { grid-column:1; min-width:0; max-width:100%; }
    .od-public-home .od-home-faq-intro h2 { font-size:24px; overflow-wrap:anywhere; }
    .od-home-faq-intro > p { font-size:13px; }
    .od-home-faq-art { position:static; grid-column:2; grid-row:1/3; align-self:end; width:90px; margin:0; }
    .od-public-home .od-public-faq summary { padding:15px; min-height:56px; font-size:13px; }.od-public-home .od-public-faq details > p { padding:0 15px 15px; font-size:13px; }
    .od-home-step-track { margin-inline:22px; }
    .od-public-home .od-public-section { padding-block:10px; }
    .od-public-home .od-public-section .od-home-panel:not(.od-public-services-heading) { padding:20px 18px; }
    .od-public-home .od-public-contact { gap:20px; }
    .od-public-home .od-public-contact-details { gap:14px; --ng-accent-card-padding:16px; }
}
@media(max-width:359.98px) { .od-public-home .od-public-contact-details { grid-template-columns:1fr; } }
@media(prefers-reduced-motion:reduce) {
    html:has([data-home-public]) { scroll-behavior:auto; }
    .od-public-home *,.od-public-home *::before,.od-public-home *::after { animation:none!important; transition:none!important; }
    .od-home-cover-image { transform:none; }.od-public-home .od-home-reveal { opacity:1; transform:none; }
}
