/* =====================================================
   RESET
===================================================== */

*{
    box-sizing:border-box;
}

html, body{
    margin:0;
    padding:0;
    overflow-x:hidden;
}

/* =====================================================
   VARIABLES
===================================================== */

:root{
    --primary:#1e3a2f;
    --accent:#ff6a00;
    --light:#f4f4f4;
    --dark:#0d0d0d;
}

/* =====================================================
   BASE
===================================================== */

body{
    font-family:'Readex Pro', sans-serif;
    background:var(--light);
    color:#222;
    line-height:1.6;
}

/* =====================================================
   HEADER
===================================================== */

.site-header{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:80px;
    background:var(--primary);
    z-index:1000;
}

.nav-container{
    max-width:1200px;
    margin:auto;
    height:80px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:0 20px;
}

.logo a{
    color:#fff;
    font-weight:700;
    font-size:1.3rem;
    text-decoration:none;
}

.nav-menu{
    display:flex;
    gap:35px;
}

.nav-menu a{
    color:#fff;
    text-decoration:none;
    font-weight:600;
}

.nav-menu a:hover{
    color:var(--accent);
}

.hamburger{
    display:none;
    flex-direction:column;
    gap:5px;
    cursor:pointer;
}

.hamburger span{
    width:26px;
    height:3px;
    background:#fff;
}

/* =====================================================
   HERO (ETUSIVU)
===================================================== */

.hero-2026{
    margin-top:80px;
    min-height:calc(100vh - 80px);
    background:
        linear-gradient(rgba(0,0,0,.5),rgba(0,0,0,.5)),
        url('/assets/img/hero-atv.jpg') center/cover no-repeat;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:#fff;
}

.hero-overlay{
    padding:120px 20px;
    max-width:900px;
}

.hero-overlay h1{
    font-size:3rem;
    font-weight:800;
}

.hero-overlay p{
    font-size:1.3rem;
}

/* =====================================================
   BUTTONS
===================================================== */

.btn-primary,
.btn-secondary{
    display:inline-block;
    padding:14px 34px;
    margin:8px;
    border-radius:40px;
    font-weight:600;
    text-decoration:none;
}

.btn-primary{
    background:var(--accent);
    color:#fff;
}

.btn-secondary{
    background:#fff;
    color:#000;
}

/* =====================================================
   ATV HERO (GALLERIA / KEVÄT)
===================================================== */

.atv-hero{
    margin-top:80px;
    min-height:60vh;
    background:
        linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.9)),
        url('/assets/img/hero.jpg') center/cover no-repeat;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:60px 20px;
}

.atv-overlay h1{
    font-size:2.4rem;
    font-weight:900;
    color:var(--accent);
}

.atv-overlay p{
    color:#fff;
}

/* =====================================================
   GALLERY
===================================================== */

.atv-gallery-page{
    max-width:1400px;
    margin:60px auto;
    padding:40px 20px;
}

.gallery-set{
    margin-bottom:60px;
}

.set-header{
    text-align:center;
    margin-bottom:20px;
}

.set-number.big{
    display:inline-block;
    padding:14px 40px;
    border-radius:40px;
    border:2px solid var(--accent);
    color:var(--accent);
    font-weight:800;
    cursor:pointer;
}

/* Oletuksena piilossa */
.set-grid{
    display:none;
    margin-top:20px;
}

/* Aktiivinen kansio */
.set-grid.open{
    display:grid;
    gap:15px;
}

/* Desktop */
@media (min-width:901px){
    .set-grid.open{
        grid-template-columns:repeat(5,1fr);
    }
}

/* Mobile */
@media (max-width:900px){
    .set-grid.open{
        grid-template-columns:repeat(2,1fr);
    }

    .set-item img{
        height:140px;
    }
}

/* Yleinen kuvatyyli */
.set-item img{
    width:100%;
    height:200px;
    object-fit:cover;
    border-radius:12px;
}

/* =====================================================
   LIGHTBOX
===================================================== */

.lightbox{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.95);
    display:flex;
    justify-content:center;
    align-items:center;
    visibility:hidden;
    opacity:0;
    transition:0.3s;
    z-index:9999;
}

.lightbox.active{
    visibility:visible;
    opacity:1;
}

.lightbox img{
    max-width:85vw;
    max-height:85vh;
    object-fit:contain;
    border-radius:14px;
}

/* =====================================================
   MOBILE NAVIGATION
===================================================== */

@media (max-width:900px){

    body{
        background:#0b0f14;
        color:#fff;
    }

    .nav-menu{
        display:none;
        position:absolute;
        top:80px;
        left:0;
        width:100%;
        background:var(--primary);
        flex-direction:column;
        padding:25px;
        gap:20px;
    }

    .nav-menu.active{
        display:flex;
    }

    .hamburger{
        display:flex;
    }

    .hero-overlay h1{
        font-size:2.2rem;
    }

}
/* ================= FOOTER FIX ================= */

.site-footer{
    background:#0f141a;
    color:#fff;
    padding:60px 20px;
    text-align:center;
}

.site-footer .footer-container{
    max-width:1200px;
    margin:0 auto;
}

.site-footer a{
    color:var(--accent);
    text-decoration:none;
}

.site-footer a:hover{
    text-decoration:underline;
}
/* ================= DESKTOP DARK SECTION ================= */

@media (min-width:901px){

    body{
        background:
            radial-gradient(circle at center,
                rgba(255,106,0,0.15) 0%,
                rgba(255,106,0,0.05) 30%,
                #0b0f14 70%
            );
        color:#ffffff;
    }

    section{
        color:#ffffff;
    }

}
/* =====================================================
   PREMIUM GLOW DESKTOP
===================================================== */

@media (min-width:901px){

    body{
        background:
            radial-gradient(circle at 20% 10%,
                rgba(255,106,0,0.25) 0%,
                rgba(255,106,0,0.12) 25%,
                rgba(0,0,0,0) 50%
            ),
            radial-gradient(circle at 80% 90%,
                rgba(255,106,0,0.18) 0%,
                rgba(255,106,0,0.08) 25%,
                rgba(0,0,0,0) 50%
            ),
            linear-gradient(
                180deg,
                #0b0f14 0%,
                #0f141a 40%,
                #0c1116 100%
            );

        color:#ffffff;
    }

    main{
        position:relative;
        z-index:2;
    }

    /* Kevyt sisähehku sisältöalueelle */
    section{
        position:relative;
    }

    section::before{
        content:"";
        position:absolute;
        inset:0;
        background:radial-gradient(
            circle at center,
            rgba(255,106,0,0.05) 0%,
            rgba(255,106,0,0.02) 40%,
            rgba(0,0,0,0) 70%
        );
        pointer-events:none;
        z-index:-1;
    }

}
@media (min-width:901px){

    body{
        animation:premiumGlow 12s ease-in-out infinite;
    }

    @keyframes premiumGlow{
        0%,100%{
            filter:brightness(1);
        }
        50%{
            filter:brightness(1.08);
        }
    }

}
/* ================= FOOTER CENTER DESKTOP ================= */

@media (min-width:901px){

    .site-footer{
        text-align:center !important;
    }

    .site-footer .footer-container{
        max-width:1200px;
        margin:0 auto;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:15px;
    }

    .site-footer p,
    .site-footer div,
    .site-footer small{
        text-align:center !important;
    }

}
/* ================= GALLERY NUMBERS GRID DESKTOP ================= */

@media (min-width:901px){

    .atv-gallery-page{
        display:grid;
        grid-template-columns:repeat(6, 1fr);
        gap:25px;
        max-width:1400px;
        margin:80px auto;
    }

    .gallery-set{
        display:contents;
    }

    .set-header{
        text-align:center;
    }

    .set-number.big{
        width:100%;
        padding:18px 0;
        font-size:1.4rem;
    }

    /* Aktiivisen kansion kuvat koko riville */
    .set-grid.open{
        grid-column:1 / -1;
        display:grid;
        grid-template-columns:repeat(5,1fr);
        gap:18px;
        margin-top:25px;
    }

}
/* ================= MOBILE GALLERY NUMBERS 3 PER ROW ================= */

@media (max-width:900px){

    /* Numerot gridiksi */
    .atv-gallery-page{
        display:grid;
        grid-template-columns:repeat(3, 1fr);
        gap:14px;
        padding:30px 16px 60px 16px;
    }

    .gallery-set{
        display:contents;
    }

    .set-header{
        text-align:center;
    }

    .set-number.big{
        width:100%;
        padding:14px 0;
        font-size:1.1rem;
    }

    /* Kaikki kuvat piilossa oletuksena */
    .set-grid{
        display:none !important;
    }

    /* Vain aktiivinen aukeaa */
    .set-grid.open{
        grid-column:1 / -1;
        display:grid !important;
        grid-template-columns:repeat(2,1fr);
        gap:10px;
        margin-top:18px;
    }

    .set-item img{
        width:100%;
        height:120px;
        object-fit:cover;
        border-radius:10px;
    }

}
/* ================= FOOTER DESKTOP CENTER HARD FIX ================= */

@media (min-width:901px){

    footer,
    .site-footer{
        width:100%;
        text-align:center !important;
    }

    footer > *,
    .site-footer > *{
        max-width:1200px;
        margin:0 auto !important;
        text-align:center !important;
    }

    .site-footer{
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
    }

    .site-footer *{
        text-align:center !important;
    }

}
/* =====================================================
   RESET
===================================================== */

*{
    box-sizing:border-box;
}

html, body{
    margin:0;
    padding:0;
    overflow-x:hidden;
}

/* =====================================================
   VARIABLES
===================================================== */

:root{
    --primary:#1e3a2f;
    --accent:#ff6a00;
    --light:#f4f4f4;
    --dark:#0d0d0d;
}

/* =====================================================
   BASE
===================================================== */

body{
    font-family:'Readex Pro', sans-serif;
    background:var(--light);
    color:#222;
    line-height:1.6;
}

/* =====================================================
   HEADER
===================================================== */

.site-header{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:80px;
    background:var(--primary);
    z-index:1000;
}

.nav-container{
    max-width:1200px;
    margin:auto;
    height:80px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:0 20px;
}

.logo a{
    color:#fff;
    font-weight:700;
    font-size:1.3rem;
    text-decoration:none;
}

.nav-menu{
    display:flex;
    gap:35px;
}

.nav-menu a{
    color:#fff;
    text-decoration:none;
    font-weight:600;
}

.nav-menu a:hover{
    color:var(--accent);
}

.hamburger{
    display:none;
    flex-direction:column;
    gap:5px;
    cursor:pointer;
}

.hamburger span{
    width:26px;
    height:3px;
    background:#fff;
}

/* =====================================================
   HERO (ETUSIVU)
===================================================== */

.hero-2026{
    margin-top:80px;
    min-height:calc(100vh - 80px);
    background:
        linear-gradient(rgba(0,0,0,.5),rgba(0,0,0,.5)),
        url('/assets/img/hero-atv.jpg') center/cover no-repeat;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:#fff;
}

.hero-overlay{
    padding:120px 20px;
    max-width:900px;
}

.hero-overlay h1{
    font-size:3rem;
    font-weight:800;
}

.hero-overlay p{
    font-size:1.3rem;
}

/* =====================================================
   BUTTONS
===================================================== */

.btn-primary,
.btn-secondary{
    display:inline-block;
    padding:14px 34px;
    margin:8px;
    border-radius:40px;
    font-weight:600;
    text-decoration:none;
}

.btn-primary{
    background:var(--accent);
    color:#fff;
}

.btn-secondary{
    background:#fff;
    color:#000;
}

/* =====================================================
   ATV HERO (GALLERIA / KEVĆ„T)
===================================================== */

.atv-hero{
    margin-top:80px;
    min-height:60vh;
    background:
        linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.9)),
        url('/assets/img/hero.jpg') center/cover no-repeat;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:60px 20px;
}

.atv-overlay h1{
    font-size:2.4rem;
    font-weight:900;
    color:var(--accent);
}

.atv-overlay p{
    color:#fff;
}

/* =====================================================
   GALLERY
===================================================== */

.atv-gallery-page{
    max-width:1400px;
    margin:60px auto;
    padding:40px 20px;
}

.gallery-set{
    margin-bottom:60px;
}

.set-header{
    text-align:center;
    margin-bottom:20px;
}

.set-number.big{
    display:inline-block;
    padding:14px 40px;
    border-radius:40px;
    border:2px solid var(--accent);
    color:var(--accent);
    font-weight:800;
    cursor:pointer;
}

/* Oletuksena piilossa */
.set-grid{
    display:none;
    margin-top:20px;
}

/* Aktiivinen kansio */
.set-grid.open{
    display:grid;
    gap:15px;
}

/* Desktop */
@media (min-width:901px){
    .set-grid.open{
        grid-template-columns:repeat(5,1fr);
    }
}

/* Mobile */
@media (max-width:900px){
    .set-grid.open{
        grid-template-columns:repeat(2,1fr);
    }

    .set-item img{
        height:140px;
    }
}

/* Yleinen kuvatyyli */
.set-item img{
    width:100%;
    height:200px;
    object-fit:cover;
    border-radius:12px;
}

/* =====================================================
   LIGHTBOX
===================================================== */

.lightbox{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.95);
    display:flex;
    justify-content:center;
    align-items:center;
    visibility:hidden;
    opacity:0;
    transition:0.3s;
    z-index:9999;
}

.lightbox.active{
    visibility:visible;
    opacity:1;
}

.lightbox img{
    max-width:85vw;
    max-height:85vh;
    object-fit:contain;
    border-radius:14px;
}

/* =====================================================
   MOBILE NAVIGATION
===================================================== */

@media (max-width:900px){

    body{
        background:#0b0f14;
        color:#fff;
    }

    .nav-menu{
        display:none;
        position:absolute;
        top:80px;
        left:0;
        width:100%;
        background:var(--primary);
        flex-direction:column;
        padding:25px;
        gap:20px;
    }

    .nav-menu.active{
        display:flex;
    }

    .hamburger{
        display:flex;
    }

    .hero-overlay h1{
        font-size:2.2rem;
    }

}
/* ================= FOOTER FIX ================= */

.site-footer{
    background:#0f141a;
    color:#fff;
    padding:60px 20px;
    text-align:center;
}

.site-footer .footer-container{
    max-width:1200px;
    margin:0 auto;
}

.site-footer a{
    color:var(--accent);
    text-decoration:none;
}

.site-footer a:hover{
    text-decoration:underline;
}
/* ================= DESKTOP DARK SECTION ================= */

@media (min-width:901px){

    body{
        background:
            radial-gradient(circle at center,
                rgba(255,106,0,0.15) 0%,
                rgba(255,106,0,0.05) 30%,
                #0b0f14 70%
            );
        color:#ffffff;
    }

    section{
        color:#ffffff;
    }

}
/* =====================================================
   PREMIUM GLOW DESKTOP
===================================================== */

@media (min-width:901px){

    body{
        background:
            radial-gradient(circle at 20% 10%,
                rgba(255,106,0,0.25) 0%,
                rgba(255,106,0,0.12) 25%,
                rgba(0,0,0,0) 50%
            ),
            radial-gradient(circle at 80% 90%,
                rgba(255,106,0,0.18) 0%,
                rgba(255,106,0,0.08) 25%,
                rgba(0,0,0,0) 50%
            ),
            linear-gradient(
                180deg,
                #0b0f14 0%,
                #0f141a 40%,
                #0c1116 100%
            );

        color:#ffffff;
    }

    main{
        position:relative;
        z-index:2;
    }

    /* Kevyt sisĆ¤hehku sisĆ¤ltĆ¶alueelle */
    section{
        position:relative;
    }

    section::before{
        content:"";
        position:absolute;
        inset:0;
        background:radial-gradient(
            circle at center,
            rgba(255,106,0,0.05) 0%,
            rgba(255,106,0,0.02) 40%,
            rgba(0,0,0,0) 70%
        );
        pointer-events:none;
        z-index:-1;
    }

}
@media (min-width:901px){

    body{
        animation:premiumGlow 12s ease-in-out infinite;
    }

    @keyframes premiumGlow{
        0%,100%{
            filter:brightness(1);
        }
        50%{
            filter:brightness(1.08);
        }
    }

}
/* ================= FOOTER CENTER DESKTOP ================= */

@media (min-width:901px){

    .site-footer{
        text-align:center !important;
    }

    .site-footer .footer-container{
        max-width:1200px;
        margin:0 auto;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:15px;
    }

    .site-footer p,
    .site-footer div,
    .site-footer small{
        text-align:center !important;
    }

}
/* ================= GALLERY NUMBERS GRID DESKTOP ================= */

@media (min-width:901px){

    .atv-gallery-page{
        display:grid;
        grid-template-columns:repeat(6, 1fr);
        gap:25px;
        max-width:1400px;
        margin:80px auto;
    }

    .gallery-set{
        display:contents;
    }

    .set-header{
        text-align:center;
    }

    .set-number.big{
        width:100%;
        padding:18px 0;
        font-size:1.4rem;
    }

    /* Aktiivisen kansion kuvat koko riville */
    .set-grid.open{
        grid-column:1 / -1;
        display:grid;
        grid-template-columns:repeat(5,1fr);
        gap:18px;
        margin-top:25px;
    }

}
/* ================= MOBILE GALLERY NUMBERS 3 PER ROW ================= */

@media (max-width:900px){

    /* Numerot gridiksi */
    .atv-gallery-page{
        display:grid;
        grid-template-columns:repeat(3, 1fr);
        gap:14px;
        padding:30px 16px 60px 16px;
    }

    .gallery-set{
        display:contents;
    }

    .set-header{
        text-align:center;
    }

    .set-number.big{
        width:100%;
        padding:14px 0;
        font-size:1.1rem;
    }

    /* Kaikki kuvat piilossa oletuksena */
    .set-grid{
        display:none !important;
    }

    /* Vain aktiivinen aukeaa */
    .set-grid.open{
        grid-column:1 / -1;
        display:grid !important;
        grid-template-columns:repeat(2,1fr);
        gap:10px;
        margin-top:18px;
    }

    .set-item img{
        width:100%;
        height:120px;
        object-fit:cover;
        border-radius:10px;
    }

}
/* ================= FOOTER DESKTOP CENTER HARD FIX ================= */

@media (min-width:901px){

    footer,
    .site-footer{
        width:100%;
        text-align:center !important;
    }

    footer > *,
    .site-footer > *{
        max-width:1200px;
        margin:0 auto !important;
        text-align:center !important;
    }

    .site-footer{
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
    }

    .site-footer *{
        text-align:center !important;
    }

}
/* =================================================
   PREMIUM GLASS PANEL – DESKTOP
   (ei koske lomake.php eikä mobiilia)
================================================= */

@media (min-width:901px){

    body:not(.lomake-page) main{
        max-width:1200px;
        margin:100px auto 80px auto;
        padding:50px 60px;

        background:rgba(15,20,26,0.75);
        backdrop-filter:blur(18px);
        -webkit-backdrop-filter:blur(18px);

        border-radius:22px;

        box-shadow:
            0 0 0 1px rgba(255,106,0,0.15),
            0 20px 60px rgba(0,0,0,0.6),
            0 0 120px rgba(255,106,0,0.08);

        position:relative;
        z-index:2;
    }

    /* Pehmeä sisäinen glow */
    body:not(.lomake-page) main::before{
        content:"";
        position:absolute;
        inset:0;
        border-radius:22px;

        background:radial-gradient(
            circle at 30% 20%,
            rgba(255,106,0,0.15),
            transparent 60%
        );

        pointer-events:none;
        z-index:-1;
    }

}
/* ================= ATV SPONSOR SIZE FIX ================= */

.atv-sponsors{
    padding:40px 0;
}

.atv-sponsor-row{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:40px;
    flex-wrap:wrap;
}

.atv-sponsor-row img{
    max-height:45px;      /* pienempi */
    width:auto;
    object-fit:contain;
    filter:drop-shadow(0 0 8px rgba(255,106,0,0.25));
    transition:0.3s ease;
}

.atv-sponsor-row img:hover{
    transform:scale(1.05);
}
/* ================= ATV CTA PREMIUM ================= */

.atv-cta-btn{
    display:inline-block;
    padding:16px 40px;
    background:linear-gradient(45deg,#ff6a00,#ff8c1a);
    color:#000;
    font-weight:800;
    border-radius:40px;
    text-decoration:none;
    letter-spacing:1px;
    box-shadow:0 8px 30px rgba(255,106,0,0.4);
    transition:all 0.25s ease;
}

.atv-cta-btn:hover{
    transform:translateY(-4px);
    box-shadow:0 15px 40px rgba(255,106,0,0.6);
}
/* ================= ATV SPONSORS PREMIUM ================= */

.atv-sponsor-row img{
    max-height:40px;
    width:auto;
    object-fit:contain;

    filter:drop-shadow(0 0 8px rgba(255,106,0,0.3));
    transition:all 0.3s ease;

    animation:sponsorGlow 4s ease-in-out infinite;
}

@keyframes sponsorGlow{
    0%,100%{
        filter:drop-shadow(0 0 6px rgba(255,106,0,0.25));
    }
    50%{
        filter:drop-shadow(0 0 16px rgba(255,106,0,0.6));
    }
}

.atv-sponsor-row img:hover{
    transform:scale(1.08);
}
/* ================= CTA PREMIUM GLOW ================= */

.atv-cta-btn{
    display:inline-block;
    padding:16px 42px;
    background:linear-gradient(45deg,#ff6a00,#ff8c1a);
    color:#000;
    font-weight:800;
    border-radius:40px;
    text-decoration:none;
    letter-spacing:1px;

    box-shadow:0 10px 30px rgba(255,106,0,0.4);
    transition:all 0.3s ease;

    animation:ctaBreath 3s ease-in-out infinite;
}

@keyframes ctaBreath{
    0%,100%{
        box-shadow:0 8px 25px rgba(255,106,0,0.4);
    }
    50%{
        box-shadow:0 15px 45px rgba(255,106,0,0.8);
    }
}

.atv-cta-btn:hover{
    transform:translateY(-4px);
}
/* ================= GALLERY BUTTON PREMIUM GLOW ================= */

.set-number.big{
    position:relative;
    overflow:hidden;

    animation:galleryBreath 3.5s ease-in-out infinite;
    transition:all 0.3s ease;
}

/* Hidas hengittävä glow */
@keyframes galleryBreath{
    0%,100%{
        box-shadow:
            0 0 8px rgba(255,106,0,0.4),
            0 0 18px rgba(255,106,0,0.2);
    }
    50%{
        box-shadow:
            0 0 18px rgba(255,106,0,0.8),
            0 0 35px rgba(255,106,0,0.5);
    }
}

/* Hover boost desktopilla */
@media (min-width:901px){
    .set-number.big:hover{
        transform:translateY(-3px) scale(1.05);
        box-shadow:
            0 0 25px rgba(255,106,0,1),
            0 0 50px rgba(255,106,0,0.6);
    }
}

/* Aktiivinen numero vahvemmaksi */
.set-number.big.active,
.set-grid.open + .set-header .set-number.big{
    background:linear-gradient(45deg,#ff6a00,#ff8c1a);
    color:#000;
    box-shadow:
        0 0 25px rgba(255,106,0,1),
        0 0 60px rgba(255,106,0,0.7);
}
/* =================================================
   GLOBAL HEADER – NEON BLUE + ORANGE ACCENT
================================================= */

.site-header{
    background:linear-gradient(
        180deg,
        #0a1118 0%,
        #0d1822 100%
    ) !important;

    box-shadow:
        0 0 25px rgba(0,180,255,0.6),
        0 0 60px rgba(0,180,255,0.3);

    border-bottom:1px solid rgba(0,180,255,0.4);
}

/* Logo oranssiksi */
.logo a{
    color:#ff6a00 !important;
    font-weight:800;
    text-shadow:
        0 0 8px rgba(255,106,0,0.7),
        0 0 18px rgba(255,106,0,0.4);
}

/* Nav linkit */
.nav-menu a{
    color:#ffffff !important;
    position:relative;
    transition:0.3s ease;
}

/* Hover oranssiksi */
.nav-menu a:hover{
    color:#ff6a00 !important;
    text-shadow:
        0 0 10px rgba(255,106,0,0.8),
        0 0 25px rgba(255,106,0,0.5);
}

/* Aktiivinen linkki (jos käytössä) */
.nav-menu a.active{
    color:#ff6a00 !important;
}

/* Hamburger */
.hamburger span{
    background:#00b4ff !important;
    box-shadow:0 0 8px rgba(0,180,255,0.8);
}
@keyframes headerGlow{
    0%,100%{
        box-shadow:
            0 0 20px rgba(0,180,255,0.5),
            0 0 40px rgba(0,180,255,0.2);
    }
    50%{
        box-shadow:
            0 0 35px rgba(0,180,255,0.9),
            0 0 70px rgba(0,180,255,0.5);
    }
}

.site-header{
    animation:headerGlow 6s ease-in-out infinite;
}
/* ================= NEON UNDERLINE NAV ================= */

.nav-menu a{
    position:relative;
    color:#ffffff !important;
}

.nav-menu a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-6px;
    width:0%;
    height:2px;
    background:#00b4ff;
    box-shadow:0 0 8px #00b4ff, 0 0 18px #00b4ff;
    transition:width 0.3s ease;
}

.nav-menu a:hover::after{
    width:100%;
}
/* ================= HEADER LIGHT STREAK ================= */

.site-header{
    position:relative;
    overflow:hidden;
}

.site-header::before{
    content:"";
    position:absolute;
    top:0;
    left:-100%;
    width:60%;
    height:100%;

    background:linear-gradient(
        120deg,
        transparent 0%,
        rgba(0,180,255,0.4) 50%,
        transparent 100%
    );

    animation:lightSweep 8s linear infinite;
}

@keyframes lightSweep{
    0%{ left:-100%; }
    100%{ left:150%; }
}
/* ================= MOBILE NAV NEON FIX ================= */

@media (max-width:900px){

    .nav-menu{
        background:linear-gradient(
            180deg,
            #0a1118 0%,
            #0d1822 100%
        ) !important;

        box-shadow:
            0 0 25px rgba(0,180,255,0.6),
            0 0 60px rgba(0,180,255,0.3);

        border-top:1px solid rgba(0,180,255,0.4);
    }

    .nav-menu a{
        color:#ff6a00 !important;
        text-shadow:
            0 0 10px rgba(255,106,0,0.8),
            0 0 20px rgba(255,106,0,0.4);
    }

    .nav-menu a:hover{
        color:#ffffff !important;
        text-shadow:
            0 0 10px rgba(255,255,255,0.8);
    }

}
/* ================= MOBILE NAV FIX ================= */

@media (max-width:900px){

    .site-header{
        overflow:visible !important;   /* Poistetaan piilottava overflow */
    }

    .nav-menu{
        position:absolute;
        top:80px;
        left:0;
        width:100%;

        z-index:9999 !important;       /* Varmistetaan että tulee kaiken päälle */
        display:none;
    }

    .nav-menu.active{
        display:flex !important;
        flex-direction:column;
    }

}
/* =================================================
   NEON FOOTER – MATCH HEADER STYLE
================================================= */

.site-footer{
    position:relative;
    overflow:hidden;

    background:linear-gradient(
        180deg,
        #0a1118 0%,
        #0d1822 100%
    );

    border-top:1px solid rgba(0,180,255,0.4);

    box-shadow:
        0 0 25px rgba(0,180,255,0.6),
        0 0 60px rgba(0,180,255,0.3);

    color:#ffffff;
}

/* Oranssit linkit */
.site-footer a{
    color:#ff6a00;
    text-decoration:none;
    transition:0.3s ease;
}

.site-footer a:hover{
    text-shadow:
        0 0 10px rgba(255,106,0,0.9),
        0 0 25px rgba(255,106,0,0.6);
}
/* ================= FOOTER LIGHT STREAK ================= */

.site-footer::before{
    content:"";
    position:absolute;
    top:0;
    left:-100%;
    width:60%;
    height:100%;

    background:linear-gradient(
        120deg,
        transparent 0%,
        rgba(0,180,255,0.35) 50%,
        transparent 100%
    );

    animation:footerSweep 10s linear infinite;
}

@keyframes footerSweep{
    0%{ left:-100%; }
    100%{ left:150%; }
}
@keyframes footerGlow{
    0%,100%{
        box-shadow:
            0 0 20px rgba(0,180,255,0.4),
            0 0 40px rgba(0,180,255,0.2);
    }
    50%{
        box-shadow:
            0 0 35px rgba(0,180,255,0.8),
            0 0 70px rgba(0,180,255,0.4);
    }
}

.site-footer{
    animation:footerGlow 8s ease-in-out infinite;
}
/* ===== STRONGER FOOTER BASE ===== */

.site-footer{
    background:#0a1118 !important;
    padding:60px 20px;

    border-top:2px solid #00b4ff;

    box-shadow:
        0 -10px 30px rgba(0,180,255,0.4),
        0 -20px 60px rgba(0,0,0,0.8);
}
/* ================= NAV PAGE ================= */

.nav-page{
    text-align:center;
    padding:80px 20px;
}

.nav-page h1{
    font-size:2.4rem;
    margin-bottom:10px;
    color:#ff6a00;
}

.nav-grid{
    margin-top:50px;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:25px;
    max-width:900px;
    margin-left:auto;
    margin-right:auto;
}

.nav-grid a{
    display:block;
    padding:18px;
    border-radius:16px;
    text-decoration:none;
    font-weight:700;
    background:rgba(15,20,26,0.8);
    color:#fff;
    border:1px solid rgba(0,180,255,0.4);

    box-shadow:0 0 20px rgba(0,180,255,0.2);
    transition:0.3s ease;
}

.nav-grid a:hover{
    transform:translateY(-5px);
    background:linear-gradient(45deg,#ff6a00,#ff8c1a);
    color:#000;
    box-shadow:0 0 35px rgba(255,106,0,0.8);
}
/* ================= MEGA NAVIGATION ================= */

.nav-dropdown{
    position:relative;
    cursor:pointer;
    font-weight:600;
    color:#ff6a00;
}

.nav-dropdown span{
    padding:8px 0;
    display:inline-block;
}

.dropdown-content{
    position:absolute;
    top:100%;
    left:0;
    min-width:220px;
    background:#0a1118;
    border-radius:14px;
    padding:15px;
    display:none;
    flex-direction:column;
    gap:12px;

    border:1px solid rgba(0,180,255,0.4);
    box-shadow:0 0 25px rgba(0,180,255,0.4);
}

.dropdown-content a{
    color:#fff;
    text-decoration:none;
    font-weight:500;
    transition:0.2s;
}

.dropdown-content a:hover{
    color:#ff6a00;
    transform:translateX(5px);
}

.nav-dropdown:hover .dropdown-content{
    display:flex;
}
@media (max-width:900px){

    .nav-dropdown{
        width:100%;
    }

    .dropdown-content{
        position:relative;
        background:none;
        border:none;
        box-shadow:none;
        padding:10px 0 0 10px;
        display:none;
    }

    .nav-dropdown.active .dropdown-content{
        display:flex;
    }
}
/* ===== ACTIVE LINK ===== */

.active-link{
    color:#ff6a00 !important;
    text-shadow:0 0 10px #ff6a00;
}

/* ===== DROPDOWN DESKTOP ===== */

.nav-dropdown{
    position:relative;
    cursor:pointer;
}

.dropdown-content{
    position:absolute;
    top:100%;
    left:0;
    min-width:220px;
    background:#0a1118;
    border-radius:14px;
    padding:15px;
    display:none;
    flex-direction:column;
    gap:12px;
    border:1px solid rgba(0,180,255,0.4);
    box-shadow:0 0 25px rgba(0,180,255,0.4);
}

.nav-dropdown:hover .dropdown-content{
    display:flex;
}

/* ===== MOBILE ===== */

@media (max-width:900px){

    .nav-menu{
        display:none;
        flex-direction:column;
        width:100%;
        background:linear-gradient(135deg,#05131c,#0a2230);
        padding:25px;
        position:absolute;
        top:80px;
        left:0;
    }

    .nav-menu.active{
        display:flex;
    }

    .dropdown-content{
        position:relative;
        background:none;
        border:none;
        box-shadow:none;
        padding-left:15px;
        display:none;
    }

    .nav-dropdown.active .dropdown-content{
        display:flex;
    }

    .hamburger{
        display:flex;
        flex-direction:column;
        gap:5px;
        cursor:pointer;
    }

    .hamburger span{
        width:26px;
        height:3px;
        background:#00b4ff;
        box-shadow:0 0 8px #00b4ff;
    }
}
/* ===== DESKTOP DROPDOWN FIX ===== */

.site-header{
    overflow:visible !important; /* estää dropdownin leikkautumisen */
    z-index:1000;
}

.nav-menu{
    display:flex;
    align-items:center;
    gap:25px;
    position:relative;
}

.nav-dropdown{
    position:relative;
}

.nav-dropdown button{
    background:none;
    border:none;
    color:#ff6a00;
    font-weight:600;
    cursor:pointer;
    font-family:inherit;
}

.dropdown-content{
    position:absolute;
    top:120%;
    left:0;
    min-width:230px;
    background:#0a1118;
    border-radius:14px;
    padding:15px;
    display:none;
    flex-direction:column;
    gap:12px;

    border:1px solid rgba(0,180,255,0.4);
    box-shadow:0 0 25px rgba(0,180,255,0.4);

    z-index:9999;
}

/* Desktop hover toimii nyt */
@media (min-width:901px){
    .nav-dropdown:hover .dropdown-content{
        display:flex;
    }
}

/* Mobile */
@media (max-width:900px){

    .nav-menu{
        display:none;
        flex-direction:column;
        background:#05131c;
        position:absolute;
        top:80px;
        left:0;
        width:100%;
        padding:25px;
    }

    .nav-menu.active{
        display:flex;
    }

    .dropdown-content{
        position:relative;
        background:none;
        border:none;
        box-shadow:none;
        padding-left:15px;
        display:none;
    }

    .nav-dropdown.active .dropdown-content{
        display:flex;
    }
}
/* ================= PREMIUM SOCIAL FOOTER ================= */

.social-glow-wrapper{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:30px;
    margin-top:40px;
    flex-wrap:wrap;
}

.social-box{
    display:flex;
    align-items:center;
    gap:12px;
    padding:16px 28px;
    border-radius:50px;
    font-weight:600;
    text-decoration:none;
    color:#fff;
    transition:0.3s ease;
    position:relative;
    overflow:hidden;
    min-width:180px;
    justify-content:center;
}

.social-box i{
    font-size:1.2rem;
}

/* FACEBOOK */
.social-box.facebook{
    background:#1877f2;
    box-shadow:0 0 20px rgba(24,119,242,0.6);
}

.social-box.facebook:hover{
    box-shadow:0 0 40px rgba(24,119,242,1);
    transform:translateY(-4px);
}

/* INSTAGRAM */
.social-box.instagram{
    background:linear-gradient(45deg,#f58529,#dd2a7b,#8134af,#515bd4);
    box-shadow:0 0 20px rgba(221,42,123,0.6);
}

.social-box.instagram:hover{
    box-shadow:0 0 40px rgba(221,42,123,1);
    transform:translateY(-4px);
}

/* YOUTUBE */
.social-box.youtube{
    background:#ff0000;
    box-shadow:0 0 20px rgba(255,0,0,0.6);
}

.social-box.youtube:hover{
    box-shadow:0 0 40px rgba(255,0,0,1);
    transform:translateY(-4px);
}

/* Premium glow animation */
@keyframes socialPulse{
    0%,100%{filter:brightness(1);}
    50%{filter:brightness(1.15);}
}

.social-box{
    animation:socialPulse 3s infinite ease-in-out;
}

/* ================= MOBILE ================= */

@media(max-width:768px){

    .social-glow-wrapper{
        flex-direction:column;
        gap:18px;
    }

    .social-box{
        width:100%;
        max-width:320px;
    }

}
/* ================= DESKTOP DROPDOWN STABLE FIX ================= */

@media (min-width:901px){

    .nav-dropdown{
        position:relative;
    }

    /* POISTA väli */
    .dropdown-content{
        top:100%;           /* EI 120% */
        margin-top:0;       /* EI väliä */
    }

    /* Tee suurempi hover-alue */
    .nav-dropdown::after{
        content:"";
        position:absolute;
        left:0;
        right:0;
        top:100%;
        height:15px;        /* täyttää hover-raon */
    }

    /* Hover pysyy päällä */
    .nav-dropdown:hover .dropdown-content,
    .nav-dropdown:focus-within .dropdown-content{
        display:flex;
    }

    /* Helpompi klikata */
    .dropdown-content a{
        padding:10px 12px;
        border-radius:8px;
        transition:0.2s;
    }

    .dropdown-content a:hover{
        background:rgba(255,106,0,0.15);
    }

}
/* ================= MOBILE PERFORMANCE MODE ================= */

@media (max-width:900px){

    /* Poista raskaat animaatiot */
    *{
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.15s !important;
    }

    /* Poista heavy glow box-shadow */
    .social-box,
    .set-number.big,
    .atv-cta-btn,
    .btn-primary,
    .btn-secondary{
        box-shadow:none !important;
        filter:none !important;
    }

    /* Kevyt hover-efekti */
    .social-box:active,
    .atv-cta-btn:active,
    .btn-primary:active{
        transform:scale(0.97);
    }

    /* Kevennä header glow */
    .site-header{
        box-shadow:0 0 10px rgba(0,180,255,0.3) !important;
    }

    /* Kevyt taustagradient ilman bluria */
    .atv-gallery-page{
        background:#0f141a !important;
    }

}
    /* ETUSIVUN HERO-TYYLIT */
    .main-hero {
        height: 90vh;
        /* TÄSSÄ MUUTOS: Viittaus omaan kansioosi */
        background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.8)), 
                    url('https://satakunnankompijat.fi/assets/img/nort_kevat.jpg') center/cover no-repeat;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        position: relative;
    }
    /* ... muu koodi pysyy samana ... */
