/**
 * Stili pagina: index
 */

/* CSS Ottimizzato e Unificato - NUOVO HERO DESIGN */
        * { margin: 0; padding: 0; box-sizing: border-box; }
        
        body {
            font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;
            line-height: 1.6;
            color: #333;
            overflow-x: hidden;
        }

        .hero-title {
            font-family: 'Oswald', Impact, 'Arial Narrow', sans-serif;
            font-size: clamp(3rem, 7vw, 5.6rem);
            font-weight: 700;
            line-height: 0.95;
            color: #ffffff;
            background: none;
            -webkit-text-fill-color: currentColor;
            -webkit-background-clip: unset;
            background-clip: unset;
            text-transform: uppercase;
            letter-spacing: -0.5px;
            margin-bottom: 22px;
            max-width: 680px;
            animation: fadeInUp 0.9s ease-out 0.4s both;
        }

        .title-line        { display: block; }
        .title-line-red    { display: block; color: #e5101a; }
        .title-line-outline {
            display: block;
            color: transparent;
            -webkit-text-stroke: 2px rgba(255, 255, 255, 0.55);
            paint-order: stroke fill;
        }

        .hero-subtitle {
            font-size: clamp(0.88rem, 1.5vw, 1.05rem);
            font-weight: 300;
            line-height: 1.85;
            margin-bottom: 36px;
            opacity: 0.68;
            max-width: 460px;
            animation: fadeInUp 1s ease-out 0.65s both;
        }

        .container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

        /* Header */
        .header {
            background: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(10px);
            padding: 20px 0;
            position: fixed;
            width: 100%;
            top: 0;
            z-index: 1000;
            transition: all 0.3s ease;
        }

        .header.scrolled {
            background: rgba(255, 255, 255, 0.98);
            box-shadow: 0 2px 20px rgba(0,0,0,0.1);
        }

        .header-content {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .logo { height: 60px; }

        .navbar {
            display: flex;
            gap: 15px;
            background: rgba(35,35,35,0.1);
            padding: 8px 16px;
            border-radius: 22px;
        }

        .nav-item {
            padding: 6px 12px;
            border-radius: 22px;
            text-decoration: none;
            color: rgba(0,0,0,0.6);
            font-weight: 400;
            font-size: 15px;
            transition: all 0.3s;
        }

        .nav-item.active {
            background: linear-gradient(153deg, rgba(255,0,0,0.75) 19%, rgba(213,6,6,0.75) 100%);
            color: white;
            font-weight: 700;
        }

        .nav-item:hover { background: rgba(255,0,0,0.1); }

        /* HERO SECTION — Left-aligned Premium */
        .hero {
            height: 100vh;
            margin-top: calc(-1 * var(--hdr-height, 68px));
            background: #080505;
            position: relative;
            display: flex;
            align-items: center;
            padding-top: var(--hdr-height, 68px);
            padding-bottom: 40px;
            overflow: hidden;
        }

        .hero-bg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: url('../../images/general/hero-bg.png') center 30%/cover;
            opacity: 0.42;
            z-index: 1;
        }

        .hero-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(
                100deg,
                rgba(5, 1, 1, 0.94) 0%,
                rgba(8, 3, 3, 0.88) 36%,
                rgba(5, 2, 2, 0.44) 58%,
                rgba(5, 2, 2, 0.08) 100%
            );
            z-index: 2;
        }

        /* Right-side player image — editorial split */
        .hero-player {
            position: absolute;
            top: 0;
            right: 0;
            width: 54%;
            height: 100%;
            background: url('../../images/general/basketball-player-action-sunset-1.png') right center / cover no-repeat;
            z-index: 3;
            -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,0.55) 22%, black 48%);
            mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,0.55) 22%, black 48%);
        }

        .hero-content {
            position: relative;
            z-index: 4;
            color: white;
            text-align: left;
            max-width: 1200px;
            width: 100%;
            margin: 0 auto;
            padding: 0 64px;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
        }

        .hero-badge {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            font-size: 0.68rem;
            font-weight: 600;
            letter-spacing: 3px;
            text-transform: uppercase;
            color: rgba(255, 255, 255, 0.5);
            margin-bottom: 22px;
            animation: fadeInUp 1s ease-out 0.2s both;
        }

        .hero-badge::before {
            content: '';
            display: block;
            width: 28px;
            height: 1.5px;
            background: #e5101a;
            flex-shrink: 0;
        }

        .hero-divider {
            width: 44px;
            height: 3px;
            background: #e5101a;
            margin-bottom: 22px;
            animation: fadeInUp 1s ease-out 0.55s both;
        }

        .hero-actions {
            display: flex;
            gap: 12px;
            flex-wrap: wrap;
            animation: fadeInUp 1s ease-out 0.8s both;
        }

        /* Hero Floating Elements */
        .hero-floats {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 2;
            pointer-events: none;
        }

        .float-element {
            position: absolute;
            background: rgba(255, 17, 17, 0.1);
            border-radius: 50%;
            animation: float 6s ease-in-out infinite;
        }

        .float-1 {
            width: 100px;
            height: 100px;
            top: 20%;
            left: 10%;
            animation-delay: 0s;
        }

        .float-2 {
            width: 150px;
            height: 150px;
            top: 60%;
            right: 15%;
            animation-delay: 2s;
        }

        .float-3 {
            width: 80px;
            height: 80px;
            bottom: 30%;
            left: 20%;
            animation-delay: 4s;
        }

        /* Buttons */
        .btn-primary {
            background: linear-gradient(135deg, #ff1111 0%, #d50c0a 100%);
            color: white;
            border: none;
            padding: 15px 30px;
            border-radius: 50px;
            font-weight: 700;
            font-size: 1rem;
            cursor: pointer;
            transition: all 0.3s ease;
            text-decoration: none;
            display: inline-block;
            position: relative;
            overflow: hidden;
        }

        .btn-primary::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
            transition: left 0.5s;
        }

        .btn-primary:hover::before a {
            left: 100%;
        }

        .btn-primary:hover a {
            color: white;
            transform: translateY(-2px);
            box-shadow: 0 10px 30px rgba(255, 17, 17, 0.4);
        }

        .btn-secondary {
            background: transparent;
            color: white;
            border: 2px solid rgba(255, 255, 255, 0.3);
            padding: 13px 28px;
            border-radius: 50px;
            font-weight: 700;
            font-size: 1rem;
            cursor: pointer;
            transition: all 0.3s ease;
            text-decoration: none;
            display: inline-block;
            backdrop-filter: blur(10px);
        }

        .btn-secondary:hover {
            background: rgba(255, 255, 255, 0.1);
            border-color: rgba(255, 255, 255, 0.5);
            transform: translateY(-2px);
            color: white;
        }

        /* Scroll Indicator */
        .scroll-indicator {
            position: absolute;
            bottom: 30px;
            left: 50%;
            transform: translateX(-50%);
            z-index: 3;
            animation: bounce 2s infinite;
        }

        .scroll-indicator a {
            color: white;
            text-decoration: none;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 10px;
            opacity: 0.7;
            transition: opacity 0.3s;
        }

        .scroll-indicator a:hover {
            opacity: 1;
        }

        .scroll-arrow {
            width: 30px;
            height: 30px;
            border: 2px solid white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        /* ── Partners / Sponsor ticker ── */
        .partners {
            /* Stesso angolo del clip-path: 40px su 100vw (sale verso destra) */
            --partners-cut: 40px;
            --partners-skew: -2deg;
            --partners-skew: calc(atan(var(--partners-cut) / 100vw) * -1);
            background: oklch(11% 0.01 22);
            overflow: hidden;
            position: relative;
            clip-path: polygon(0 var(--partners-cut), 100% 0, 100% calc(100% - var(--partners-cut)), 0 100%);
            margin-top: calc(-1 * var(--partners-cut));
            margin-bottom: calc(-1 * var(--partners-cut));
            padding: 96px 0 88px;
            z-index: 1;
        }

        .partners-header {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 24px;
            padding: 0 40px;
            margin-bottom: 48px;
        }

        .partners-header::before,
        .partners-header::after {
            content: '';
            flex: 1;
            max-width: 140px;
            height: 1px;
            background: linear-gradient(to right, transparent, rgba(229, 16, 26, 0.5));
        }

        .partners-header::after {
            background: linear-gradient(to left, transparent, rgba(229, 16, 26, 0.5));
        }

        .partners-label {
            font-size: 0.62rem;
            font-weight: 700;
            letter-spacing: 4px;
            text-transform: uppercase;
            color: rgba(255, 255, 255, 0.4);
            white-space: nowrap;
            margin: 0;
        }

        .partners-rows {
            display: flex;
            flex-direction: column;
            gap: 32px;
            padding: 8px 0;
        }

        .partners-row {
            width: 100%;
            transform: skewY(var(--partners-skew));
            transform-origin: center center;
        }

        .partners-track-mask {
            display: flex;
            align-items: center;
            width: 100%;
            overflow: hidden;
            padding: 6px 0;
            mask-image: linear-gradient(to right, transparent 0%, black 12%, black 88%, transparent 100%);
            -webkit-mask-image: linear-gradient(to right, transparent 0%, black 12%, black 88%, transparent 100%);
        }

        .sponsors-carousel {
            display: flex;
            width: max-content;
            animation: scroll-infinite 32s linear infinite;
            gap: clamp(40px, 6vw, 72px);
            align-items: center;
            will-change: transform;
        }

        .sponsors-carousel--reverse {
            animation-direction: reverse;
        }

        .sponsor-ticker__item {
            flex-shrink: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            min-width: 100px;
            height: 52px;
            padding: 0 4px;
            text-decoration: none;
            filter: grayscale(1) brightness(0.55) contrast(1.1);
            opacity: 0.55;
            transform: skewY(calc(var(--partners-skew) * -1));
            transition: filter 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                        opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                        transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            transform-origin: center center;
        }

        a.sponsor-ticker__item:focus-visible {
            outline: 2px solid rgba(229, 16, 26, 0.85);
            outline-offset: 4px;
            border-radius: 2px;
        }

        .sponsor-ticker__item:hover,
        .sponsor-ticker__item:focus-visible {
            filter: grayscale(0) brightness(1) contrast(1);
            opacity: 1;
            transform: skewY(calc(var(--partners-skew) * -1)) scale(1.08);
            z-index: 2;
        }

        .sponsor-ticker__img {
            display: block;
            height: 44px;
            width: auto;
            max-width: 148px;
            object-fit: contain;
            pointer-events: none;
        }

        .partners-cta {
            margin: 40px 0 0;
            text-align: center;
        }

        .partners-cta-link {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.72rem;
            font-weight: 600;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: rgba(240, 237, 237, 0.45);
            text-decoration: none;
            transition: color 0.25s ease;
        }

        .partners-cta-link:hover {
            color: rgba(229, 16, 26, 0.9);
        }

        /* Fallback se atan() non è supportato (mobile incluso) */
        @supports not (width: calc(atan(1px / 1px) * 1px)) {
            @media (max-width: 480px) {
                .partners {
                    --partners-skew: -6.1deg;
                }
            }

            @media (min-width: 481px) and (max-width: 768px) {
                .partners {
                    --partners-skew: -4.2deg;
                }
            }

            @media (min-width: 769px) and (max-width: 1024px) {
                .partners {
                    --partners-skew: -2.8deg;
                }
            }
        }

        @media (prefers-reduced-motion: reduce) {
            .academy-carousel-container.is-manual-scroll {
                overflow-x: auto;
                overflow-y: hidden;
                -webkit-overflow-scrolling: touch;
                overscroll-behavior-x: contain;
                scroll-snap-type: x proximity;
                scroll-padding-inline: 20px;
                mask-image: none;
                -webkit-mask-image: none;
            }

            .academy-carousel-container.is-manual-scroll .academy-carousel {
                animation: none !important;
                transform: none;
                width: max-content;
                padding: 4px 20px 12px;
            }

            .academy-carousel-container.is-manual-scroll .academy-card-slide[aria-hidden="true"] {
                display: none;
            }

            .academy-carousel-container.is-manual-scroll .academy-card-slide {
                scroll-snap-align: start;
            }

            .partners-row {
                transform: none;
            }

            .partners-track-mask {
                mask-image: none;
                -webkit-mask-image: none;
            }

            .sponsors-carousel {
                flex-wrap: wrap;
                justify-content: center;
                width: 100%;
                max-width: 1100px;
                margin: 0 auto;
                padding: 0 24px;
                gap: 24px 40px;
                animation: none;
            }

            .sponsor-ticker__item {
                transform: none;
                opacity: 0.85;
                filter: grayscale(0.4) brightness(0.85);
            }

            .sponsor-ticker__item:hover,
            .sponsor-ticker__item:focus-visible {
                transform: none;
            }
        }

        /* About Section */
        .about {
            padding: 100px 0;
            position: relative;
            z-index: 2;
        }

        .about-content {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 80px;
            align-items: center;
        }

        .about-image {
            position: relative;
        }

        .about-image::before {
            content: '';
            position: absolute;
            top: -20px;
            right: -20px;
            width: 62%;
            height: 62%;
            background: #e5101a;
            z-index: 0;
            border-radius: 3px;
        }

        .about-image img {
            width: 100%;
            border-radius: 4px;
            position: relative;
            z-index: 1;
        }

        .section-label {
            font-size: 0.6rem;
            font-weight: 700;
            letter-spacing: 3.5px;
            text-transform: uppercase;
            color: rgba(229, 16, 26, 0.9);
            margin-bottom: 14px;
        }

        .section-title {
            font-family: 'Oswald', Impact, 'Arial Narrow', sans-serif;
            font-size: clamp(1.8rem, 3.5vw, 2.8rem);
            font-weight: 700;
            margin-bottom: 24px;
            line-height: 1.1;
            letter-spacing: -0.5px;
        }

        .section-description {
            font-size: 1rem;
            color: #4a4a4a;
            line-height: 1.75;
            margin-bottom: 32px;
        }

        /* NUOVO: Academy Section con Carosello Scorrevole */
        .academy {
            background: #f8f8f8;
            padding: 100px 0;
            overflow: hidden;
        }

        .academy-header {
            text-align: left;
            margin-bottom: 64px;
        }

        .academy-carousel-container {
            position: relative;
            overflow: hidden;
            margin: 0 -20px;
            mask-image: linear-gradient(to right, transparent 0%, black 6%, black 94%, transparent 100%);
            -webkit-mask-image: linear-gradient(to right, transparent 0%, black 6%, black 94%, transparent 100%);
        }

        .academy-carousel {
            display: flex;
            animation: scroll-academy 25s linear infinite;
            gap: 30px;
            align-items: stretch;
        }

        .academy-card-slide {
            flex-shrink: 0;
            width: 320px;
        }

        .academy-card-inner {
            background: white;
            border-radius: 12px;
            overflow: hidden;
            border: 1px solid rgba(0,0,0,0.08);
            transition: box-shadow 0.32s ease, border-color 0.32s ease;
            height: 420px;
            display: flex;
            flex-direction: column;
        }

        .academy-card-slide:hover .academy-card-inner {
            box-shadow: 0 8px 28px rgba(0,0,0,0.1);
            border-color: rgba(229, 16, 26, 0.28);
        }

        .academy-card-slide img {
            width: 100%;
            height: 200px;
            object-fit: cover;
            flex-shrink: 0;
            transition: transform 0.5s ease;
        }

        .academy-card-slide:hover img {
            transform: scale(1.04);
        }

        .academy-card-content {
            padding: 20px 22px 22px;
            flex-grow: 1;
            display: flex;
            flex-direction: column;
        }

        .categoria-badge {
            display: block;
            font-size: 0.55rem;
            font-weight: 700;
            letter-spacing: 3.5px;
            text-transform: uppercase;
            margin-bottom: 8px;
            background: none;
            padding: 0;
            border-radius: 0;
            width: auto;
        }

        .categoria-senior .categoria-badge {
            color: rgba(229, 16, 26, 0.9);
        }

        .categoria-giovanili .categoria-badge,
        .categoria-minibasket .categoria-badge {
            color: rgba(26, 26, 26, 0.4);
        }

        .academy-card-slide h3 {
            font-family: 'Oswald', Impact, 'Arial Narrow', sans-serif;
            font-size: clamp(1.1rem, 2vw, 1.3rem);
            font-weight: 700;
            color: #1a1a1a;
            line-height: 1.15;
            letter-spacing: -0.3px;
            margin-bottom: 10px;
        }

        .academy-card-slide p {
            font-size: 0.83rem;
            color: #5a5a5a;
            line-height: 1.6;
            margin-bottom: 18px;
            flex-grow: 1;
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        .academy-card-slide .btn-primary {
            background: transparent;
            color: rgba(229, 16, 26, 0.65);
            border: none;
            padding: 0;
            border-radius: 0;
            font-size: 0.68rem;
            font-weight: 700;
            letter-spacing: 2.5px;
            text-transform: uppercase;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            width: auto;
            transition: color 0.25s ease;
            overflow: visible;
        }

        .academy-card-slide .btn-primary::before {
            display: none;
        }

        .academy-card-slide .btn-primary::after {
            content: '\2192';
        }

        .academy-card-slide .btn-primary:hover {
            color: #e5101a;
        }

        /* Footer — full styles in includes/footer.php */

        /* Animations */
        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(30px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes float {
            0%, 100% {
                transform: translateY(0px);
            }
            50% {
                transform: translateY(-20px);
            }
        }

        @keyframes bounce {
            0%, 20%, 50%, 80%, 100% {
                transform: translateY(0) translateX(-50%);
            }
            40% {
                transform: translateY(-10px) translateX(-50%);
            }
            60% {
                transform: translateY(-5px) translateX(-50%);
            }
        }

        /* NUOVO: Animazioni scroll infinito */
        @keyframes scroll-infinite {
            0% {
                transform: translateX(0);
            }
            100% {
                transform: translateX(-50%);
            }
        }

        @keyframes scroll-academy {
            0% {
                transform: translateX(0);
            }
            100% {
                transform: translateX(-50%);
            }
        }

        .partners-row:hover .sponsors-carousel {
            animation-play-state: paused;
        }

        /* Responsive */
        @media (max-width: 768px) {
            .hero {
                min-height: 100svh;
                height: auto;
                align-items: flex-end;
                padding-bottom: 72px;
            }

            .hero-overlay {
                background: linear-gradient(
                    180deg,
                    oklch(8% 0.02 22 / 0.96) 0%,
                    oklch(10% 0.02 22 / 0.9) 50%,
                    oklch(12% 0.02 22 / 0.75) 100%
                );
            }

            .hero-player {
                width: 100%;
                height: 42%;
                top: auto;
                bottom: 0;
                right: 0;
                opacity: 0.5;
                -webkit-mask-image: linear-gradient(to top, black 15%, transparent 72%);
                mask-image: linear-gradient(to top, black 15%, transparent 72%);
            }

            .hero-content {
                padding: 0 var(--page-gutter, 20px);
                padding-top: 24px;
            }

            .hero-title {
                font-size: clamp(2.2rem, 11vw, 3.4rem);
                max-width: 100%;
            }

            .title-line-outline {
                -webkit-text-stroke-width: 1px;
            }

            .hero-subtitle {
                max-width: 100%;
                margin-bottom: 28px;
            }

            .stat-item {
                padding: 14px 16px;
            }

            .stat-number {
                font-size: 1.5rem;
            }

            .hero-actions {
                flex-direction: column;
                align-items: stretch;
                width: 100%;
            }

            .hero-actions .btn-primary,
            .hero-actions .btn-secondary {
                text-align: center;
                width: 100%;
            }

            .about-content {
                grid-template-columns: 1fr;
            }

            .about-image::before {
                display: none;
            }

            .hero-floats {
                display: none;
            }

            .scroll-indicator {
                display: none;
            }

            .partners {
                padding: 88px 0 80px;
            }

            .sponsor-ticker__item {
                min-width: 88px;
                height: 46px;
            }

            .sponsor-ticker__img {
                height: 36px;
                max-width: 120px;
            }

            .sponsors-carousel {
                gap: 32px;
            }

            .partners-rows {
                gap: 20px;
            }

            /* Accademie mobile: autoscroll JS + swipe (classe .is-touch-scroll da index.js) */
            .academy-carousel-container.is-touch-scroll {
                overflow-x: auto;
                overflow-y: hidden;
                -webkit-overflow-scrolling: touch;
                overscroll-behavior-x: contain;
                touch-action: pan-x;
                scroll-behavior: auto;
                margin: 0;
                mask-image: linear-gradient(to right, transparent 0%, black 4%, black 96%, transparent 100%);
                -webkit-mask-image: linear-gradient(to right, transparent 0%, black 4%, black 96%, transparent 100%);
                scrollbar-width: none;
            }

            .academy-carousel-container.is-touch-scroll::-webkit-scrollbar {
                display: none;
            }

            .academy-carousel-container.is-touch-scroll .academy-carousel {
                animation: none;
                transform: none;
                width: max-content;
                padding: 4px 20px 12px;
                gap: 16px;
            }

            .academy-carousel-container.is-touch-scroll .academy-card-slide {
                width: min(88vw, 300px);
            }

            .academy-carousel-container.is-touch-scroll .academy-card-inner {
                height: auto;
                min-height: 380px;
            }
        }

        @media (max-width: 480px) {
            .hero-content {
                padding: 0 20px;
            }

            .stat-item {
                padding: 12px 12px;
            }

            .stat-number {
                font-size: 1.3rem;
            }

            .partners {
                padding: 80px 0 72px;
            }

            .sponsor-ticker__img {
                height: 32px;
                max-width: 100px;
            }

            .sponsors-carousel {
                gap: 24px;
            }

            .academy-carousel-container.is-touch-scroll .academy-card-slide {
                width: min(92vw, 280px);
            }

            .academy-carousel-container.is-touch-scroll .academy-carousel {
                gap: 14px;
                padding-inline: 16px;
            }
        }
