/* -------------------------------------------------------------
   Sticky modern header
------------------------------------------------------------- */
.sticky-header {
    position: sticky;
    top: 0;
    z-index: 1030;
    background: rgba(33,37,41,0.8);
    backdrop-filter: blur(6px);
    transition: 0.25s;
}

.sticky-header.scrolled {
    background: rgba(33,37,41,0.96);
    box-shadow: 0 4px 12px rgba(0,0,0,0.25);
}

header.hero {
    background: linear-gradient(135deg, #343536, #272033);
    color: white;
    padding: 80px 0;
    text-align: center;
}

footer {
    background: #343a40;
    color: white;
    padding: 20px 0;
    margin-top: 40px;
    text-align: center;
}

/* -------------------------------------------------------------
   Captcha / Forms
------------------------------------------------------------- */
.captcha-box {
    font-weight: bold;
    font-size: 1.5em;
    background: #eee;
    text-align: center;
    letter-spacing: 4px;
    user-select: none;
    margin-bottom: 10px;
}

/* -------------------------------------------------------------
   News cards
------------------------------------------------------------- */
#news .card {
    transition: transform 0.3s, box-shadow 0.3s;
}

#news .card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

/* -------------------------------------------------------------
   Partner cards
------------------------------------------------------------- */
.partner-card {
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.3s, box-shadow 0.3s;
}

.partner-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}

.partner-card .visit-btn {
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.9;
    transition: opacity 0.3s;
}

.partner-card .visit-btn:hover {
    opacity: 1;
}

/* -------------------------------------------------------------
   Layout helpers
------------------------------------------------------------- */
.position-relative { position: relative; }
.position-absolute { position: absolute; }

div#news {
    background-color: rgb(0, 79, 140);
    background-image: url(https://wapgames.lt/assets/img/bg-0.webp);
    background-size: cover;
    border-radius: 10px;
}

h3.mb-4.text-center {
    margin: 0;
    font-size: 37px;
    font-weight: 600;
    line-height: 56px;
    color: #ffffff;
}

p.mb-2.text-muted {
    margin-top: -39px;
}

div#partner-link {
    padding: 5px;
}

.text-muted {
    --bs-text-opacity: 1;
    color: rgb(255 255 255 / 75%) !important;
}

/* =============================================================
   RESPONSIVE CONTAINER WIDTHS (MODERN RESOLUTIONS)
   Sorted: 1400 → 1920 → 2560 → 3440 → 5120
============================================================= */

/* Bootstrap XXL (1400px) */
@media (min-width: 1400px) { 
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1320px;
    }
}

/* FullHD / 2K (1920px) */
@media (min-width: 1920px) {
    .container {
        max-width: 1600px;
    }
}

/* QHD / 1440p / 27–32" (2560px) */
@media (min-width: 2560px) {
    .container {
        max-width: 1900px;
    }
}

/* Ultrawide (3440px) */
@media (min-width: 3440px) {
    .container {
        max-width: 2300px;
    }
}

/* Super Ultrawide / 5K (5120px) */
@media (min-width: 5120px) {
    .container {
        max-width: 2600px;
    }
}
@media (min-width: 1400px) {
    h4 { font-size: 24px; }
}

@media (min-width: 1920px) {
    h4 { font-size: 26px; }
}

@media (min-width: 2560px) {
    h4 { font-size: 35px; }
}
@media (min-width: 1920px) {
    .card-body { font-size: 18px; }
}

@media (min-width: 2560px) {
    .card-body { font-size: 22px; }
}

@media (min-width: 3440px) {
    .card-body { font-size: 22px; }
}
h3.mb-4.text-center {
    margin: 0;
    font-size: 32px;
    font-weight: 600;
    line-height: 1.2;
    color: #ffffff;
}

/* >= 1400px */
@media (min-width: 1400px) {
    h3.mb-4.text-center {
        font-size: 37px;
    }
}

/* >= 1920px */
@media (min-width: 1920px) {
    h3.mb-4.text-center {
        font-size: 42px;
    }
}

/* >= 2560px */
@media (min-width: 2560px) {
    h3.mb-4.text-center {
        font-size: 48px;
    }
}

/* >= 3440px */
@media (min-width: 3440px) {
    h3.mb-4.text-center {
        font-size: 54px;
    }
}
@media (min-width: 2560px) {
    .form-control {
        font-size: 1.25rem;
        padding: .65rem 1rem;
    }
}
p.card-text.flex-grow-1 {
    font-size: 17px; /* bazinis dydis */
}

/* ≥ 1920px */
@media (min-width: 1920px) {
    p.card-text.flex-grow-1 {
        font-size: 22px;
    }
}

/* ≥ 2560px */
@media (min-width: 2560px) {
    p.card-text.flex-grow-1 {
        font-size: 24px;
    }
}

/* ≥ 3440px */
@media (min-width: 3440px) {
    p.card-text.flex-grow-1 {
        font-size: 26px;
    }
}

/* ≥ 5120px */
@media (min-width: 5120px) {
    p.card-text.flex-grow-1 {
        font-size: 28px;
    }
}
/* ≥ 1920px */
@media (min-width: 1920px) {
    .btn {
        --bs-btn-font-size: 22px;
        --bs-btn-padding-x: 1rem;
        --bs-btn-padding-y: 0.5rem;
    }
}

/* ≥ 2560px */
@media (min-width: 2560px) {
    .btn {
        --bs-btn-font-size: 24px;
        --bs-btn-padding-x: 1.25rem;
        --bs-btn-padding-y: 0.6rem;
    }
}

/* ≥ 3440px */
@media (min-width: 3440px) {
    .btn {
        --bs-btn-font-size: 26px;
        --bs-btn-padding-x: 1.5rem;
        --bs-btn-padding-y: 0.75rem;
    }
}

/* ≥ 5120px */
@media (min-width: 5120px) {
    .btn {
        --bs-btn-font-size: 28px;
        --bs-btn-padding-x: 1.75rem;
        --bs-btn-padding-y: 1rem;
    }
}
/* ≥ 2560px */
@media (min-width: 2560px) {
    li.nav-item {
        font-size: 25px;
    }
}

/* ≥ 3440px */
@media (min-width: 3440px) {
    li.nav-item {
        font-size: 25px;
    }
}

/* ≥ 5120px */
@media (min-width: 5120px) {
    li.nav-item {
        font-size: 40px;
    }
}
/* ≥ 2560px */
@media (min-width: 2560px) {
    .fw-bold {
        font-size: 35px;
    }
}

/* ≥ 3440px */
@media (min-width: 3440px) {
    .fw-bold {
        font-size: 35px;
    }
}

/* ≥ 5120px */
@media (min-width: 5120px) {
    .fw-bold {
        font-size: 35px;
    }
}