/* ==========================================================================
   Centrum Pomiaru Hałasu
   Global Styles
   ========================================================================== */

/* ==========================================================================
   Material Symbols
   ========================================================================== */

.material-symbols-outlined {
    font-variation-settings:
        "FILL" 0,
        "wght" 400,
        "GRAD" 0,
        "opsz" 24;
}


/* ==========================================================================
   Base
   ========================================================================== */

html {
    scroll-behavior: smooth;
}

body {
    background-color: #f7f9fb;
}


/* ==========================================================================
   Hero
   ========================================================================== */

.hero-gradient {
    background: linear-gradient(
        135deg,
        rgba(247, 249, 251, 0.98) 0%,
        rgba(44, 66, 123, 0.08) 100%
    );
}


/* ==========================================================================
   Glass Cards
   ========================================================================== */

.glass-card {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(226, 232, 240, 0.5);
}


/* ==========================================================================
   Home Page Tabs
   ========================================================================== */

#tab-warszawa:checked ~ .content-warszawa {
    display: block;
}

#tab-warszawa:checked ~ .content-rzeszow {
    display: none;
}

#tab-rzeszow:checked ~ .content-warszawa {
    display: none;
}

#tab-rzeszow:checked ~ .content-rzeszow {
    display: block;
}

#tab-warszawa:checked ~ .toggle-bg {
    transform: translateX(0);
}

#tab-rzeszow:checked ~ .toggle-bg {
    transform: translateX(100%);
}