.worldcup-section {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
    gap: clamp(24px, 4vw, 52px);
}

.worldcup-section .section-head {
    min-width: 0;
    margin-bottom: 0;
}

.worldcup-section .worldcup-slider {
    width: 100%;
    min-width: 0;
}

@media (max-width: 900px) {
    .worldcup-section {
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
    }
}

.worldcup-slider {
    max-width: 540px;
    margin-inline: auto;
    overflow: hidden;
    border: 1px solid var(--card-border);
    border-radius: var(--radius);
    background: var(--bg-soft);
    box-shadow: var(--shadow);
}

.worldcup-slider__track {
    display: flex;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    scrollbar-color: var(--gold) var(--bg-soft);
}

.worldcup-slider.is-ready .worldcup-slider__track { scrollbar-width: none; }
.worldcup-slider.is-ready .worldcup-slider__track::-webkit-scrollbar { display: none; }

.worldcup-slider__slide {
    flex: 0 0 100%;
    min-width: 0;
    margin: 0;
    scroll-snap-align: start;
    scroll-snap-stop: always;
}

.worldcup-slider__image {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    background: #07090d;
}

.worldcup-slider__image--standings { object-position: center bottom; }

.worldcup-slider__slide figcaption { display: none; }

.worldcup-slider__controls {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
}

.worldcup-slider__controls[hidden] { display: none; }

.worldcup-slider__arrow,
.worldcup-slider__dot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: var(--gold-light);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.worldcup-slider__arrow {
    width: 44px;
    height: 44px;
    border: 1px solid var(--card-border);
    border-radius: 50%;
    background: var(--card);
    transition: border-color .2s ease, background .2s ease;
}

.worldcup-slider__arrow:hover {
    border-color: var(--gold);
    background: var(--bg);
}

.worldcup-slider__arrow svg { width: 22px; height: 22px; }

.worldcup-slider__dots { display: flex; justify-content: center; }

.worldcup-slider__dot {
    width: 24px;
    height: 44px;
    border: 0;
    background: transparent;
}

.worldcup-slider__dot::before {
    content: "";
    width: 7px;
    height: 7px;
    border: 1px solid var(--gold);
    border-radius: 999px;
    transition: width .2s ease, background .2s ease;
}

.worldcup-slider__dot[aria-current="true"]::before {
    width: 18px;
    background: var(--gold-light);
}

.worldcup-slider__arrow:focus-visible,
.worldcup-slider__dot:focus-visible {
    outline: 2px solid var(--gold-light);
    outline-offset: 2px;
}

.worldcup-slider__track:focus-visible {
    outline: 2px solid var(--gold-light);
    outline-offset: -3px;
}

.worldcup-slider__status {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

@media (max-width: 560px) {
    .worldcup-slider__controls { padding: 6px 10px; }
}

@media (prefers-reduced-motion: reduce) {
    .worldcup-slider__arrow,
    .worldcup-slider__dot::before { transition: none; }
}
