/* Flyer identity: keep the decorative strip proportional without covering content. */
.header-inner{height:96px}
.brand img{width:82px;height:82px;object-fit:contain}
.hero{--flyer-strip:clamp(48px,7.5vw,80px);--flyer-left:max(0px,calc((100% - 1240px)/2 - 140px))}
.hero::after{top:0;bottom:auto;left:var(--flyer-left);width:116px;background-image:url('brand/franja-flyer-2.png');background-size:contain;background-repeat:no-repeat;background-position:left top;opacity:1}
.hero-strip-ball{position:absolute;left:calc(var(--flyer-left) + clamp(14px,2vw,28px));top:34px;width:clamp(56px,7vw,76px);height:auto;z-index:1;pointer-events:none;filter:drop-shadow(10px 18px 14px #0006);transform:rotate(-18deg)}
.hero-grid{width:calc(100% - var(--flyer-strip) - 88px);margin-left:max(calc(var(--flyer-strip) + 36px),calc((100% - 1240px)/2));margin-right:40px;max-width:1240px;min-height:625px;gap:24px}
.hero-copy{min-width:0}
h1{font-size:clamp(50px,5.1vw,80px)}
.hero-art{height:555px;width:100%;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 80% 50%,#04669470,transparent 65%),linear-gradient(145deg,#06344b,#031321);border:1px solid #5d94ac30;border-radius:100px 15px 15px 15px}
.hero-court{position:absolute;width:90%;height:60%;border:1px solid #66bade1c;transform:rotate(-24deg);top:28%;left:35%;background:linear-gradient(90deg,transparent 49.7%,#66bade1c 50%,transparent 50.3%),linear-gradient(0deg,transparent 49.7%,#66bade1c 50%,transparent 50.3%)}
.hero-art .visual-brand{width:clamp(170px,17vw,240px);height:auto;left:22px;right:auto;top:30px;object-fit:contain;filter:none;z-index:2}
.hero-player{position:absolute;width:91%;height:56%;object-fit:contain;right:-9%;bottom:74px;z-index:1;filter:brightness(0) invert(1);opacity:.95}
.hero-ball{position:absolute;width:100px;right:20px;top:42px;z-index:3}
.hero-art .photo-caption{left:auto;right:22px;top:165px;font-size:8px;letter-spacing:2px;color:#8db5c8}
.hero-art .date-card{z-index:4;left:18px;right:18px;bottom:18px;background:#031b2bf2}
.categories-section::before{display:none}

/* Scroll sequence: natural document scrolling, with one sticky stage. */
.story{background:var(--deep);color:white;position:relative;background-image:linear-gradient(#a8d1e506 1px,transparent 1px),linear-gradient(90deg,#a8d1e506 1px,transparent 1px);background-size:24px 24px}
.story-stage{padding:65px 24px}
.story-intro{text-align:center;margin:0 auto 50px;max-width:1050px}
.story-intro .eyebrow{color:#8cabbb;margin-bottom:20px}
.story-intro h2{font-size:clamp(40px,7vw,100px);letter-spacing:-.055em;line-height:.96}
.story-intro h2 span{color:var(--lime)}
.story-intro>p:last-child{font-size:11px;color:#819cac;letter-spacing:1px;margin-top:30px}
.story-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-width:1000px;margin:auto;gap:24px}
.story-card{background:#0c2b3e;border:1px solid #63879b60;box-shadow:0 25px 70px #0005;border-radius:20px;padding:30px;position:relative}
.story-card:nth-child(2){background:#123951}.story-card:nth-child(3){background:#092e44}.story-card:nth-child(4){background:#143748}
.story-number{position:absolute;right:26px;top:24px;font:11px Inter,sans-serif;letter-spacing:2px;color:#7292a6}
.story-card img{height:165px;width:190px;object-fit:contain;object-position:left center;margin-bottom:20px;filter:brightness(0) invert(1)}
.story-card .eyebrow{font-size:8px;color:var(--lime);letter-spacing:2px;margin-bottom:12px}
.story-card h3{font:700 clamp(25px,2.8vw,37px)/1 Display,Arial,sans-serif;letter-spacing:-1.2px;margin-bottom:15px}
.story-card>p:not(.eyebrow){font-size:12px;color:#adc2cf;max-width:340px;line-height:1.7}
.story-card a{font-size:11px;display:inline-flex;gap:22px;border-bottom:2px solid var(--lime);padding-bottom:5px;margin-top:20px;transition:color .2s,border-color .2s}
.story-card a:hover{color:var(--lime);border-color:white}
.story-pagination{display:none}
.story-enhanced{height:440vh}
.story-enhanced .story-stage{position:sticky;top:var(--story-top,96px);height:var(--story-height,calc(100vh - 96px));padding:0;overflow:hidden;display:grid;place-items:center}

.story-enhanced .story-intro{position:absolute;width:100%;margin:0;padding:24px;will-change:transform,opacity}
.story-enhanced .story-cards{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;width:min(440px,70vw);max-width:none;gap:0;margin:0;transform:translateY(-8px)}
.story-enhanced .story-card{grid-area:1/1;will-change:transform,opacity;transform-origin:center;opacity:0}
.story-enhanced .story-card:nth-child(1){z-index:1}.story-enhanced .story-card:nth-child(2){z-index:2}.story-enhanced .story-card:nth-child(3){z-index:3}.story-enhanced .story-card:nth-child(4){z-index:4}
.story-enhanced .story-card img{height:clamp(85px,20vh,150px);margin-bottom:16px}
.story-enhanced .story-pagination{position:absolute;bottom:24px;display:flex;gap:8px;z-index:8}
.story-dot{width:30px;height:24px;background:transparent;position:relative;padding:0}
.story-dot::after{content:'';position:absolute;left:0;right:0;top:11px;height:3px;background:#456373;transition:background .25s,transform .25s}
.story-dot[aria-current=true]::after{background:var(--lime);transform:scaleY(1.5)}

/* Same timings and rotation as the purchased accordion, with native details fallback. */
.faq details,.faq details:first-child{padding:0;border-bottom:1px solid #cbdbe3}
.faq summary{padding:22px 0;align-items:center;font-size:15px;line-height:1.4}
.faq summary::after{display:none}
.faq-toggle{width:29px;height:29px;border:1.5px solid #c4d6df;border-radius:50%;flex:0 0 auto;position:relative;transition:transform .35s cubic-bezier(.2,.8,.2,1),background .25s,border-color .25s;color:#173b50}
.faq-toggle::before,.faq-toggle::after{content:'';position:absolute;left:7px;top:12px;width:12px;height:1.5px;background:currentColor}
.faq-toggle::after{transform:rotate(90deg)}
.faq summary:hover .faq-toggle{border-color:#008ec4;background:#e0f3fa}
.faq details[data-expanded=true] .faq-toggle{transform:rotate(135deg);background:#079cda;border-color:#079cda;color:white}
.faq details p{padding:0 42px 22px 0;line-height:1.75;font-size:13px}

/* JSON-driven fixtures, with connectors drawn from winnerOf references. */
.group-card tbody th{white-space:normal;min-width:135px;font-size:11px;line-height:1.45}
.qualifying td:first-child{color:#008dbc;font-weight:700}
.match-team{align-items:center;min-height:49px}.match-team>span:first-child:not(.set-scores){line-height:1.45;min-width:0}.set-scores{flex-shrink:0}
.match-status{font-size:9px;white-space:nowrap}.is-live{color:#b95b00}.is-live::before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:#ff9400;margin-right:5px}.is-finished{color:#1a8053}
.bracket{min-width:0;width:max-content;position:relative;gap:40px}
.round{flex:0 0 280px;width:280px;position:relative;z-index:1}
.round-matches{height:var(--bracket-height);grid-template-rows:repeat(var(--round-count),minmax(0,1fr))}
.bracket .bracket-match::before,.bracket .bracket-match::after{display:none}
.bracket-match{box-shadow:0 3px 12px #102b4005;border-radius:10px}
.bracket-match .match-team{font-size:11px;min-height:50px}
.bracket-lines{position:absolute;left:0;top:0;overflow:visible;pointer-events:none;fill:none;stroke:#9db8c8;stroke-width:1.5}
.bracket-match .winner{color:#00759e;background:#edf8fc;font-weight:700}
.live-match{border-color:#e8b774}
#final-match{border-color:#119ed0;box-shadow:0 0 0 4px #e3f3fa}
.bracket .champion{width:190px;flex-basis:190px;padding:0 10px}.champion p{font-size:12px}.champion h3{font-size:25px}

@media(max-width:1100px) and (min-width:761px){.hero-grid{grid-template-columns:1fr 1fr;width:calc(100% - var(--flyer-strip) - 56px);margin-left:calc(var(--flyer-strip) + 24px);margin-right:32px}.hero-buttons{gap:8px;flex-wrap:wrap}.hero-art .visual-brand{width:155px}.hero-ball{width:75px;right:10px}.hero-art .date-card{padding:13px}.hero-art .date-card strong{font-size:22px}.hero-art .date-card .year{width:44px;height:44px}}
@media(max-width:760px){.header-inner{height:80px}.brand img{width:62px;height:68px}.nav{top:80px}.hero{--flyer-strip:22px}.hero-grid{width:calc(100% - 66px);margin-left:44px;margin-right:22px;min-height:0;gap:0}.hero h1{font-size:clamp(40px,10.8vw,70px);letter-spacing:-2.5px}.hero-buttons{flex-wrap:wrap}.hero-description{font-size:12px}.hero-art{height:550px;border-top-left-radius:70px}.hero-art .visual-brand{width:170px;top:25px;left:18px}.hero-player{width:105%;height:53%;right:-13%;bottom:72px}.hero-ball{width:67px;right:9px;top:45px}.hero-art .photo-caption{right:12px;top:145px;font-size:7px}.hero-art .date-card{left:12px;right:12px;padding:12px;bottom:12px}.hero-art .date-card strong{font-size:clamp(18px,5.6vw,28px)}.hero-art .date-card .year{width:42px;height:42px;font-size:11px}.date-card small{font-size:8px;letter-spacing:1.3px}.story-stage{padding:48px 24px}.story-cards{grid-template-columns:1fr;gap:20px}.story-intro h2{font-size:43px}.story-intro>p:last-child{display:none}.story-card{padding:25px}.story-card img{height:135px}.story-card h3{font-size:30px}.faq summary{font-size:13px;padding:19px 0}.faq details p{font-size:12px}.group-card tbody th{min-width:125px}.hero::after{background-size:auto 100%;background-position:left top}}
@media(prefers-reduced-motion:reduce){.story-dot::after,.faq-toggle{transition:none}.story-intro>p:last-child{display:none}}

@media(min-width:761px) and (max-height:650px){.story-enhanced .story-card{padding:16px 22px;max-height:calc(var(--story-height) - 85px);overflow:auto}.story-enhanced .story-card img{height:60px;margin-bottom:8px}.story-enhanced .story-card h3{font-size:25px;margin-bottom:8px}.story-enhanced .story-card a{margin-top:10px}.story-enhanced .story-cards{transform:translateY(8px)}}
.story[data-motion="static"] .story-intro>p:last-child{display:none}
@media(max-width:760px){.hero::after,.hero-strip-ball{display:none}.hero-grid{width:calc(100% - 40px);margin-left:20px;margin-right:20px}}
