/* Brighter desktop atmosphere: navy stays the anchor, silver and RAL-3000-like red open the page. */
@media (min-width: 901px) {
    body {
        background:
            radial-gradient(circle at 88% 9%, rgba(196, 28, 28, .35), transparent 25rem),
            radial-gradient(circle at 8% 32%, rgba(203, 211, 218, .2), transparent 31rem),
            radial-gradient(circle at 82% 70%, rgba(196, 28, 28, .2), transparent 34rem),
            linear-gradient(180deg, #112641 0%, #172e49 42%, #0d2038 100%);
        background-attachment: fixed;
    }

    .page-main {
        background:
            linear-gradient(105deg, rgba(203, 211, 218, .045), transparent 24%),
            repeating-linear-gradient(118deg, transparent 0 11rem, rgba(255, 255, 255, .018) 11rem 11.08rem);
    }

    .hero-panel,
    .content-card,
    .info-card,
    .post-card,
    .destination-card,
    .instagram-card,
    .news-card,
    .story-card,
    .vehicle-explorer,
    .contact-card,
    .contact-place,
    .legal-content,
    .support-hero__aside,
    .support-form-wrap .ffm-card,
    .board-card,
    .youth-card {
        border-color: rgba(203, 211, 218, .22);
        background-color: rgba(24, 48, 76, .94);
        box-shadow: 0 26px 75px rgba(2, 8, 18, .2);
    }

    .hero-panel,
    .contact-card,
    .contact-place,
    .legal-content,
    .support-hero__aside {
        background:
            radial-gradient(circle at 100% 0, rgba(196, 28, 28, .27), transparent 48%),
            linear-gradient(145deg, rgba(31, 58, 88, .97), rgba(18, 39, 65, .98));
    }

    .site-footer {
        background: rgba(7, 20, 36, .82);
    }

    .site-header:not(.is-scrolled) .header-surface {
        background: linear-gradient(110deg, rgba(24, 48, 76, .94), rgba(9, 24, 43, .92));
    }

    .about-intro,
    .content-section,
    .instagram-news,
    .contact-people,
    .support-form-section,
    .youth-experience {
        position: relative;
    }

    .about-intro::before,
    .instagram-news::before,
    .contact-people::before,
    .support-form-section::before,
    .youth-experience::before {
        content: "";
        position: absolute;
        z-index: -1;
        inset: -3rem calc(50% - 50vw);
        border-top: 1px solid rgba(203, 211, 218, .08);
        border-bottom: 1px solid rgba(203, 211, 218, .08);
        background: linear-gradient(90deg, rgba(203, 211, 218, .07), rgba(196, 28, 28, .055), rgba(203, 211, 218, .04));
    }
}

/* Brighter overall balance: more mid-blue and silver, while navy remains the frame. */
body {
    position: relative;
    isolation: isolate;
    background:
        linear-gradient(68deg, transparent 0 8%, rgba(196,28,28,.15) 8% 13%, rgba(218,225,231,.1) 13% 15%, transparent 15%) 0 66rem / 100% 46rem no-repeat,
        linear-gradient(180deg, #152d49 0%, #1c3a59 48%, #102943 100%);
    background-attachment: fixed;
}

body::before {
    content: "";
    position: fixed;
    z-index: 1;
    top: 8.5rem;
    right: -6vw;
    width: 112vw;
    height: 8.4rem;
    background: linear-gradient(180deg,
        rgba(244,255,0,.7) 0 29%,
        transparent 29% 35%,
        rgba(203,211,218,.72) 35% 64%,
        transparent 64% 70%,
        rgba(244,255,0,.7) 70% 100%);
    -webkit-mask: repeating-linear-gradient(78deg, #000 0 1.02rem, transparent 1.02rem 1.15rem);
    mask: repeating-linear-gradient(78deg, #000 0 1.02rem, transparent 1.02rem 1.15rem);
    box-shadow: 0 0 3.5rem rgba(218,225,231,.1);
    opacity: .16;
    pointer-events: none;
    transform: rotate(-7deg);
    transform-origin: right center;
}

body::after {
    content: "";
    position: fixed;
    z-index: 0;
    top: 0;
    left: 15vw;
    width: 7rem;
    height: 8.5rem;
    background: linear-gradient(90deg,
        rgba(244,255,0,.68) 0 29%,
        transparent 29% 35%,
        rgba(203,211,218,.7) 35% 64%,
        transparent 64% 70%,
        rgba(244,255,0,.68) 70% 100%);
    -webkit-mask: repeating-linear-gradient(168deg, #000 0 1.02rem, transparent 1.02rem 1.15rem);
    mask: repeating-linear-gradient(168deg, #000 0 1.02rem, transparent 1.02rem 1.15rem);
    box-shadow: 0 0 3rem rgba(218,225,231,.08);
    opacity: .12;
    pointer-events: none;
    transform: none;
}

body::after {
    display: none;
}

.page-main,
.site-footer {
    position: relative;
    z-index: 2;
}

.page-main {
    background: linear-gradient(180deg, rgba(255,255,255,.018), rgba(203,211,218,.045));
}

.page-main::before {
    display: none;
}

.hero-panel,
.content-card,
.info-card,
.post-card,
.destination-card,
.instagram-card,
.news-card,
.story-card,
.vehicle-explorer,
.contact-card,
.contact-place,
.legal-content,
.support-hero__aside,
.support-form-wrap .ffm-card,
.board-card,
.youth-card {
    border-color: rgba(219, 227, 234, .25);
    background-color: rgba(29, 57, 86, .93);
    box-shadow: 0 22px 65px rgba(2, 8, 18, .16);
}

.site-footer {
    background: rgba(12, 33, 55, .88);
}

@media (max-width: 900px) {
    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
        overflow-x: clip;
    }

    html {
        background: #132b47;
    }

    body {
        background: #132b47;
        background-attachment: initial;
    }

    body::before {
        display: none;
    }

    .page-main {
        isolation: isolate;
        overflow: hidden;
        background:
            linear-gradient(68deg, transparent 0 7%, rgba(196,28,28,.13) 7% 14%, rgba(218,225,231,.08) 14% 16%, transparent 16%) 0 53rem / 100% 40rem no-repeat,
            linear-gradient(180deg, #132b47 0%, #193653 52%, #0e2741 100%);
    }

    .page-main::before {
        content: "";
        position: absolute;
        z-index: 0;
        top: 7rem;
        right: -4rem;
        display: block;
        width: calc(100% + 8rem);
        height: 6.5rem;
        background: linear-gradient(180deg,
            rgba(244,255,0,.68) 0 29%,
            transparent 29% 35%,
            rgba(203,211,218,.7) 35% 64%,
            transparent 64% 70%,
            rgba(244,255,0,.68) 70% 100%);
        -webkit-mask: repeating-linear-gradient(78deg, #000 0 .78rem, transparent .78rem .89rem);
        mask: repeating-linear-gradient(78deg, #000 0 .78rem, transparent .78rem .89rem);
        opacity: .13;
        pointer-events: none;
        transform: rotate(-7deg);
        transform-origin: right center;
    }

    .page-main > * {
        position: relative;
        z-index: 1;
    }

    body::after {
        position: absolute;
        top: 0;
        left: 15vw;
        width: 5.2rem;
        height: 7rem;
        background: linear-gradient(90deg,
            rgba(244,255,0,.64) 0 29%,
            transparent 29% 35%,
            rgba(203,211,218,.66) 35% 64%,
            transparent 64% 70%,
            rgba(244,255,0,.64) 70% 100%);
        -webkit-mask: repeating-linear-gradient(168deg, #000 0 .78rem, transparent .78rem .89rem);
        mask: repeating-linear-gradient(168deg, #000 0 .78rem, transparent .78rem .89rem);
        opacity: .09;
    }

    .primary-nav {
        background: rgba(16, 39, 64, .98);
    }
}