@font-face {
    font-family: "Sofia Sans";
    src: url("fonts/sofia-sans-cyrillic.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    unicode-range: U+0300-0301, U+0400-045F, U+0490-0491, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
    font-family: "Sofia Sans";
    src: url("fonts/sofia-sans-latin.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── RESET ── */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.visually-hidden {
    position: absolute !important;

    width: 1px !important;
    height: 1px !important;

    padding: 0 !important;
    margin: -1px !important;

    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

html {
    scroll-behavior: smooth;
    overflow-y: scroll;
    scrollbar-gutter: stable;
}

html,
body {
    margin: 0;
    padding: 0;
    width: 100%;
}

body {
    font-family: "Sofia Sans", sans-serif;
    font-size: 18px;
    color: #111;
    line-height: 1.7;
    overflow-x: hidden;
}


/* ── HEADER ── */

header {
    position: sticky;
    top: 0;
    left: 0;

    width: 100%;
    max-width: none;

    margin: 0;
    padding: 15px 40px;

    z-index: 1000;

    background-color: #406e45;

    display: flex;
    justify-content: space-between;
    align-items: center;

    box-sizing: border-box;
}

.logo {
    display: block;
    margin: 0;
    padding: 0;
}

.logo img {
    height: 60px;
    width: auto;
    display: block;
}

nav {
    display: flex;
    align-items: center;

    margin: 0;
    padding: 0;
}

nav a,
nav .dropdown-trigger {
    margin-left: 32px;

    color: white;
    text-decoration: none;
    font-size: 18px;
}

nav > a:first-child {
    margin-left: 0;
}


/* ── DROPDOWN ── */

.dropdown {
    position: relative;
    display: inline-block;

    margin-left: 32px;
}

.dropdown > a,
.dropdown > .dropdown-trigger {
    margin-left: 0;

    padding: 0;

    font-family: inherit;
    line-height: inherit;

    background: none;
    border: 0;

    cursor: pointer;
}

.dropdown-menu {
    position: absolute;

    top: 100%;
    left: 0;

    margin-top: 6px;

    min-width: 230px;
    padding: 8px 0;

    background: #fff;

    border: 1px solid #ddd;
    border-radius: 0;

    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);

    opacity: 0;
    visibility: hidden;

    transform: translateY(-8px);

    transition: 0.2s ease;

    z-index: 1000;
}

.dropdown:hover > .dropdown-menu,
.dropdown:focus-within > .dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown-trigger:focus-visible {
    outline: 2px solid white;
    outline-offset: 5px;
}

.dropdown-menu a {
    display: block;

    margin-left: 0;
	
	align-items: center;
	
	justify-content: center;

    padding: 12px 18px;

    color: #111;

    font-size: 18px;
}

/* ─────────────────────────────
   NESTED DROPDOWN
   Без собствено оръжие
───────────────────────────── */

.dropdown-submenu {
    position: relative;
}


/* Parent row */

.dropdown-submenu > .submenu-trigger {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 18px;

    width: 100%;

    margin-left: 0;
    padding: 12px 18px;

    color: #111;

    font-size: 18px;
    text-decoration: none;

    white-space: nowrap;
}


.submenu-arrow {
    margin-left: auto;

    font-size: 24px;
    line-height: 1;

    transition: transform 0.2s ease;
}


.dropdown-submenu:hover > .submenu-trigger .submenu-arrow {
    transform: translateX(3px);
}


/* Second-level menu */

.submenu-menu {
    position: absolute;

    top: -8px;
    left: calc(100% - 1px);

    min-width: 235px;

    padding: 8px 0;

    background: #fff;

    border: 1px solid #ddd;

    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);

    opacity: 0;
    visibility: hidden;

    transform: translateX(-8px);

    transition:
        opacity 0.2s ease,
        transform 0.2s ease,
        visibility 0.2s ease;

    pointer-events: none;

    z-index: 1100;
}


/* Open the second level only when this row is hovered */

.dropdown-submenu:hover > .submenu-menu {
    opacity: 1;
    visibility: visible;

    transform: translateX(0);

    pointer-events: auto;
}


.submenu-menu a {
    display: block;

    margin-left: 0;
    padding: 12px 18px;

    color: #111;

    font-size: 18px;
    text-decoration: none;

    white-space: nowrap;
}


.dropdown-menu a:hover,
.dropdown-submenu > .submenu-trigger:hover,
.submenu-menu a:hover {
    background: #f3f3f1;
}


/* Correct sticky-header offsets for submenu destinations */

#combined-packages,
#prices,
#no-gun {
    scroll-margin-top: 110px;
}


/* Keep the nested menu on-screen on smaller desktop widths */

@media (max-width: 1050px) {

    .submenu-menu {
        left: auto;
        right: calc(100% - 1px);

        transform: translateX(8px);
    }

    .dropdown-submenu:hover > .submenu-menu {
        transform: translateX(0);
    }

}



/* ── SECTIONS ── */

section {
    max-width: 740px;

    margin: 0 auto;

    padding: 100px 40px;

    border-bottom: 1px solid #ddd;
}


h1 {
    font-size: 72px;
    line-height: 1.1;

    margin-bottom: 24px;
}

h2 {
    font-size: 32px;

    margin-bottom: 20px;
}

p {
    margin-bottom: 16px;

    color: #333;
}


/* ── HERO ── */

#hero {
    position: relative;

    width: 100%;
    max-width: none;

    min-height: 80vh;

    display: flex;

    justify-content: center;
    align-items: center;

    overflow: hidden;
}

#hero::before {
    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            rgba(0, 0, 0, 0.45),
            rgba(0, 0, 0, 0.3)
        ),
        url("images/diana_1-960.webp")
        center / cover no-repeat;

    filter: blur(4px);

    transform: scale(1.08);

    z-index: -1;
}

.hero-content {
    width: 100%;

    max-width: 1000px;

    padding: 0 40px;
}

#hero h1,
#hero p {
    color: white;
}

#hero a {
    color: white;

    text-decoration: underline;

    text-decoration-thickness: 2px;

    text-underline-offset: 5px;
}


/* ── RESERVATION BUTTONS ── */

.booking-button,
#hero .booking-button {
    display: inline-flex;
    min-height: 56px;

    align-items: center;
    justify-content: center;

    padding: 13px 30px;

    color: white;
    background: #406e45;
    border: 1px solid #406e45;

    font-size: 20px;
    font-weight: 650;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;

    box-shadow: 0 8px 20px rgba(24, 55, 29, 0.22);

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}

.booking-button:hover,
#hero .booking-button:hover {
    color: white;
    background: #315936;
    border-color: #315936;
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: 0 11px 24px rgba(24, 55, 29, 0.28);
}

.booking-button:focus-visible {
    outline: 3px solid rgba(105, 163, 113, 0.55);
    outline-offset: 4px;
}

#hero .booking-button {
    margin-top: 8px;
}


/* ── SHOOTING ZONES BACKGROUND IMAGES ── */

.range-zone {
    position: relative;

    max-width: none;

    width: 100%;

    min-height: 500px;

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding: 0 80px;

    overflow: hidden;

    color: white;
}

.range-zone.has-booking-button {
    min-height: 500px;
}

.range-zone.has-booking-button .range-content {
    min-height: 410px;

    display: flex;
    flex-direction: column;
}

.range-booking-button {
    align-self: center;

    margin-top: auto;
}

.range-booking-button:hover {
    transform: translateY(-2px);
}


/* ── BLURRED BACKGROUNDS ── */

.range-zone::before {
    content: "";

    position: absolute;

    inset: -20px;

    background-position: center;

    background-size: cover;

    background-repeat: no-repeat;

    filter: blur(5px);

    transform: scale(1.08);

    z-index: -2;
}


/* ── DARK OVERLAY ── */

.range-zone::after {
    content: "";

    position: absolute;

    inset: 0;

    background: rgba(0, 0, 0, 0.45);

    z-index: -1;
}


/* ── BACKGROUND IMAGES ── */

.zone-50-100::before {
    background-image: url("images/gligan.webp");
}

#course-shooting-training::before {
    background-image: url("images/course_background_1.webp");
}

#course-selective-hunting::before {
    background-image: url("images/course_background_2.webp");
}

#course-hunting-right::before {
    background-image: url("images/course_background_3.webp");
}

.zone-25m::before {
    background-image: url("images/diana_1.webp");
}

.zone-skeet::before {
    background-image: url("images/diana_3.webp");
}

.zone-moving_target::before {
    background-image: url("images/chichka.webp");
}

/* ── RANGE CONTENT ── */

.range-content {
    width: 42%;

    max-width: 650px;
}

.range-content h2 {
    color: white;

    /* Keep shooting-range headings on one line on desktop */
    font-size: clamp(28px, 2.4vw, 38px);
    line-height: 1.15;
    white-space: nowrap;
}

.range-content p {
    color: white;

    font-size: 20px;
}

#course-hunting-right .range-content,
#course-selective-hunting .range-content,
#course-shooting-training .range-content {
    min-height: 410px;
    display: flex;
    flex-direction: column;
}

.course-registration-phone {
    margin-top: auto;

    text-align: center;
}

.course-registration-phone a {
    color: white;
}


/* ── RANGE IMAGE SLIDER ── */

.range-slider {
    width: 42%;

    height: 410px;

    position: relative;

    overflow: hidden;

    border-radius: 0;
}

.range-slider img {
    position: absolute;

    inset: 0;

    width: 110%;

    height: 100%;

    object-fit: cover;

    opacity: 0;

    transition: opacity 1s ease-in-out;

    cursor: pointer;
}

.range-slider img.active {
    opacity: 1;
}

.range-slider img.active:hover {
    transform: scale(1.02);
}


/* ── RANGE VIDEO ── */

.range-video {
    width: 42%;

    height: 410px;

    position: relative;

    overflow: hidden;
}

.range-video video,
.range-video img {
    width: 100%;

    height: 100%;

    object-fit: cover;

    position: absolute;

    inset: 0;
}

.range-video img {
    opacity: 0;

    transition: opacity 1s ease;

    cursor: pointer;
}


/* ── CONTACT LINKS ── */

.contact-link {
    color: #111;
}


/* ─────────────────────────────
   ABOUT
───────────────────────────── */

#about {
    position: relative;

    width: 100%;
    max-width: none;

    margin: 0;
    padding: 110px 40px;

    overflow: hidden;
    isolation: isolate;
}

#about::before,
#about::after {
    content: "";

    position: absolute;

    pointer-events: none;
}

#about::before {
    inset: -16px;
    z-index: 0;

    background: url("images/porta.webp") center / cover no-repeat;

    filter: blur(6px);
    transform: scale(1.04);
}

#about::after {
    inset: 0;
    z-index: 0;

    background: rgba(0, 0, 0, 0.66);
}

.about-inner {
    position: relative;
    z-index: 1;

    width: 100%;
    max-width: 1200px;

    margin: 0 auto;

    display: grid;
    grid-template-columns: minmax(0, 1200px);

    gap: 34px;
    justify-content: center;
    justify-items: center;
    text-align: center;
}

.about-heading {
    position: static;
}

.about-heading h2 {
    margin-bottom: 8px;

    color: white;

    font-size: 42px;
    line-height: 1.1;
}

.about-kicker {
    margin: 0;

    color: #b9d9bd;

    font-size: 21px;
    font-weight: 650;
    line-height: 1.35;
}

.about-story {
    width: 100%;
    max-width: 1200px;
}

.about-story p {
    margin-bottom: 28px;

    color: rgba(255, 255, 255, 0.94);

    font-size: 19px;
    line-height: 1.8;

    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
}

.about-story p:last-child {
    margin-bottom: 0;
}

.about-team {
    padding: 24px 26px;

    background: rgba(0, 0, 0, 0.36);
    border-top: 4px solid #8fbd94;
    text-align: center;
}

.manager-phone-link {
    color: #8fbd94;
    font-weight: 750;
    white-space: nowrap;
    text-decoration-color: currentColor;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;

    transition: color 0.2s ease;
}

.manager-phone-link:hover {
    color: #b9d9bd;
}

.manager-phone-link:focus-visible {
    color: #b9d9bd;
    outline: 3px solid rgba(185, 217, 189, 0.5);
    outline-offset: 4px;
}


/* About responsive */

@media (max-width: 900px) {

    #about {
        padding: 85px 35px;
    }

    .about-inner {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .about-heading {
        position: static;
    }

    .about-heading h2 {
        font-size: 36px;
    }

}


@media (max-width: 600px) {

    #about {
        padding: 65px 22px;
    }

    .about-heading h2 {
        font-size: 32px;
    }

    .about-kicker {
        font-size: 19px;
    }

    .about-story p {
        font-size: 17px;
        line-height: 1.7;
    }

    .about-team {
        padding: 20px;
    }

}


/* ─────────────────────────────
   GALLERY — TWO CONTINUOUS ROWS
───────────────────────────── */

#gallery {
    width: 100%;
    max-width: none;

    margin: 0;
    padding: 0;

    overflow: hidden;
}

#gallery h2 {
    width: 100%;
    max-width: 1700px;

    margin: 0 auto 42px;
    padding: 0 40px;

    text-align: left;
}


/* Viewport clips the moving images at the page edges */

.gallery-marquee {
    width: 100%;

    overflow: hidden;
}

.gallery-marquee + .gallery-marquee {
    margin-top: 1px;
}


/* Two identical sets are placed inside each track
   so the motion can loop without a visible jump. */

.gallery-track {
    display: flex;

    width: max-content;

    will-change: transform;
}

.gallery-set {
    display: flex;

    gap: 1px;

    padding-right: 1px;
}


/* Individual gallery images */

.gallery-marquee-image {
    display: block;

    width: clamp(300px, 31vw, 520px);
    height: clamp(185px, 19vw, 300px);

    flex: 0 0 auto;

    object-fit: cover;
    object-position: center;

    cursor: pointer;

    transition:
        transform 0.2s ease,
        opacity 0.2s ease;
}

.gallery-marquee-image:hover {
    transform: scale(1.015);
    opacity: 0.94;
}


/* TOP ROW — moves to the right */

.gallery-marquee--right .gallery-track {
    animation: galleryMoveRight 100s linear infinite;
    animation-delay: -13s;
}


/* BOTTOM ROW — moves to the left */

.gallery-marquee--left .gallery-track {
    animation: galleryMoveLeft 100s linear infinite;
    animation-delay: -27s;
}


.gallery-marquee:hover .gallery-track {
    animation-play-state: paused;
}


@keyframes galleryMoveLeft {

    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }

}


@keyframes galleryMoveRight {

    from {
        transform: translateX(-50%);
    }

    to {
        transform: translateX(0);
    }

}


/* Gallery lightbox image should stay fully visible */

#galleryLightbox img {
    max-width: 90vw;
    max-height: 90vh;

    width: auto;
    height: auto;

    object-fit: contain;
}


/* Gallery responsive */

@media (max-width: 900px) {

    #gallery {
        padding: 0;
    }

    #gallery h2 {
        padding: 0 35px;
    }

    .gallery-marquee-image {
        width: clamp(270px, 48vw, 430px);
        height: clamp(170px, 30vw, 265px);
    }

}


@media (max-width: 600px) {

    #gallery {
        padding: 0;
    }

    #gallery h2 {
        margin-bottom: 30px;
        padding: 0 22px;
    }

    .gallery-marquee + .gallery-marquee {
        margin-top: 1px;
    }

    .gallery-set {
        gap: 1px;
        padding-right: 1px;
    }

    .gallery-marquee-image {
        width: 76vw;
        height: 47vw;
        max-height: 270px;
    }

    .gallery-marquee--right .gallery-track,
    .gallery-marquee--left .gallery-track {
        animation-duration: 42s;
    }

}


/* Respect reduced-motion accessibility settings */

@media (prefers-reduced-motion: reduce) {

    .gallery-marquee--right .gallery-track,
    .gallery-marquee--left .gallery-track {
        animation-play-state: paused;
    }

}


#moving_target {
    border-bottom: none;
}

/* ─────────────────────────────
   SINGLE PACKAGES
───────────────────────────── */

.single-packages {
    width: 100%;
    max-width: 1700px;

    margin: 0 auto;
    padding: 100px 40px;

    border-bottom: none;
}


/* Header */

.single-packages-header {
    margin-bottom: 55px;
}

.single-packages-header h2 {
    margin-bottom: 10px;

    font-size: 40px;
    line-height: 1.2;
}


/* Category */

.single-category {
    --category-gap: 0px;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    column-gap: var(--category-gap);
    row-gap: 28px;

    margin-bottom: 70px;
}

.single-category:last-child {
    margin-bottom: 0;
}

.single-category h3 {
    grid-column: 1 / -1;

    margin-bottom: 8px;
    padding-bottom: 12px;

    font-size: 25px;
    font-weight: 650;

    border-bottom: 2px solid #406e45;
}


/* Gun card */

.single-gun {
    display: grid;
    grid-template-columns: minmax(400px, 1.4fr) minmax(180px, 0.6fr);
    grid-template-rows: 1fr auto;

    align-items: stretch;
    column-gap: 24px;
    row-gap: 18px;

    min-width: 0;
    min-height: 330px;

    padding: 18px;

    background: #f7f7f5;
    border: 1px solid #e5e5e5;

    overflow: hidden;

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.single-gun:hover {
    transform: translateY(-3px);

    box-shadow:
        0 12px 32px rgba(0, 0, 0, 0.07);
}


/* Center the odd last gun when needed */

.centered-gun {
    grid-column: 1 / -1;

    width: calc((100% - var(--category-gap)) / 2);

    justify-self: center;
}


/* Gun image */

.gun-photo {
    grid-column: 1;
    grid-row: 1 / 3;

    display: block;

    width: 100%;
    height: 310px;

    margin: 0;

    object-fit: cover;
    object-position: center;

    cursor: pointer;

    transition:
        transform 0.2s ease,
        opacity 0.2s ease;
}

.gun-photo:hover {
    transform: scale(1.015);
    opacity: 0.94;
}


/* Gun information */

.gun-info {
    grid-column: 2;
    grid-row: 1;

    display: flex;
    flex-direction: column;
    justify-content: flex-start;

    min-width: 0;
    padding-top: 4px;
}

.gun-info strong {
    font-size: 21px;
    font-weight: 650;
    line-height: 1.25;
}

.gun-info span {
    margin-top: 8px;

    color: #666;

    font-size: 16px;
    line-height: 1.45;
}


/* Price badge */

.single-price {
    grid-column: 2;
    grid-row: 2;

    align-self: end;
    justify-self: start;

    padding: 7px 14px;

    color: white;
    background: #406e45;

    font-size: 20px;
    font-weight: 700;

    white-space: nowrap;
}


/* Medium desktop / tablet */

@media (max-width: 1200px) {

    .single-packages {
        max-width: 1100px;
        padding: 80px 35px;
    }

    .single-category {
        --category-gap: 0px;
    }

    .single-gun {
        grid-template-columns: minmax(260px, 1.3fr) minmax(150px, 0.7fr);

        column-gap: 20px;
        min-height: 250px;
        padding: 16px;
    }

    .gun-photo {
        height: 220px;
    }

}


/* Tablet / small laptop: one gun per row */

@media (max-width: 900px) {

    .single-packages {
        max-width: 780px;
        padding: 75px 35px;
    }

    .single-category {
        grid-template-columns: 1fr;

        row-gap: 20px;
    }

    .single-gun {
        grid-template-columns: 320px minmax(0, 1fr);

        min-height: 230px;
    }

    .centered-gun {
        grid-column: 1;

        width: 100%;
    }

    .gun-photo {
        height: 215px;
    }

}


/* Mobile */

@media (max-width: 650px) {

    .single-packages {
        padding: 60px 22px;
    }

    .single-packages-header {
        margin-bottom: 40px;
    }

    .single-packages-header h2 {
        font-size: 32px;
    }

    .single-category {
        margin-bottom: 50px;
    }

    .single-category h3 {
        font-size: 22px;
    }

    .single-gun {
        grid-template-columns: 175px minmax(0, 1fr);

        min-height: 155px;

        column-gap: 16px;
        row-gap: 10px;

        padding: 12px;
    }

    .gun-photo {
        height: 130px;
    }

    .gun-info strong {
        font-size: 17px;
    }

    .gun-info span {
        margin-top: 4px;

        font-size: 14px;
    }

    .single-price {
        padding: 5px 10px;

        font-size: 17px;
    }

}


/* Very small phones */

@media (max-width: 430px) {

    .single-gun {
        grid-template-columns: 135px minmax(0, 1fr);

        column-gap: 12px;
    }

    .gun-photo {
        height: 102px;
    }

    .gun-info strong {
        font-size: 16px;
    }

    .gun-info span {
        font-size: 13px;
    }

    .single-price {
        font-size: 16px;
    }

}


/* ── LIGHTBOX ── */

.lightbox {
    display: none;

    position: fixed;

    inset: 0;

    background: rgba(0, 0, 0, 0.92);

    justify-content: center;

    align-items: center;

    z-index: 9999;
}

.lightbox img {
    max-width: 90vw;

    max-height: 90vh;

    width: auto;

    height: auto;

    object-fit: contain;

    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);

    cursor: default;
}


/* ── LIGHTBOX CLOSE BUTTON ── */

.lightbox-close {
    position: absolute;

    top: 20px;

    right: 30px;

    background: none;

    border: none;

    color: white;

    font-size: 55px;

    line-height: 1;

    cursor: pointer;

    z-index: 10001;

    padding: 5px 10px;
}

.lightbox-close:hover {
    opacity: 0.7;
}


/* ── LIGHTBOX PREVIOUS / NEXT ── */

.lightbox-prev,
.lightbox-next {
    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    background: none;

    border: none;

    color: white;

    font-size: 60px;

    cursor: pointer;

    padding: 20px;

    z-index: 10001;
}

.lightbox-prev {
    left: 20px;
}

.lightbox-next {
    right: 20px;
}

.lightbox-prev:hover,
.lightbox-next:hover {
    opacity: 0.7;
}


/* ─────────────────────────────
   NEWS
───────────────────────────── */

#news {
    position: relative;

    width: 100%;
    max-width: none;

    padding: 42px 40px 50px;

    overflow: hidden;
    isolation: isolate;

    background: #1c241e;
}

#news::before {
    content: "";

    position: absolute;
    inset: 0;
    z-index: 0;

    pointer-events: none;

    background:
        linear-gradient(rgba(0, 0, 0, 0.68), rgba(0, 0, 0, 0.68)),
        url("images/news_background2.webp") center / cover no-repeat;
}

.news-inner {
    position: relative;
    z-index: 1;

    width: 100%;
    max-width: 1400px;

    margin: 0 auto;
}

.news-section-heading {
    display: block;

    margin-bottom: 30px;
    text-align: center;
}

.news-section-heading h2 {
    margin: 0;

    color: white;

    font-size: clamp(32px, 3.4vw, 46px);
    line-height: 1.1;

    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.72);
}

.news-featured {
    width: 100%;
    max-width: 1200px;

    display: block;

    margin: 0 auto;

    overflow: visible;

    background: transparent;
    border: 0;
    box-shadow: none;
}

.news-featured > h3 {
    margin: 0 0 22px;

    color: white;

    font-size: clamp(24px, 2.3vw, 34px);
    font-weight: 600;
    line-height: 1.15;

    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.72);
}

.news-image-link {
    position: relative;

    min-height: 0;
    aspect-ratio: auto;

    display: block;

    overflow: hidden;

    background: #1e2b20;
    border: 2px solid #406e45;

    text-decoration: none;
}

.news-image-link::after {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background: linear-gradient(to top, rgba(0, 0, 0, 0.2), transparent 22%);
}

.news-image-link img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: contain;

    transition: transform 0.45s ease, filter 0.45s ease;
}

.news-image-link:hover img,
.news-image-link:focus-visible img {
    transform: scale(1.025);
    filter: brightness(1.06);
}

.news-image-link:focus-visible {
    outline: 3px solid #8fbd94;
    outline-offset: 4px;
}

.news-image-label {
    position: absolute;
    right: 40px;
    bottom: 16px;
    z-index: 1;

    padding: 0;

    color: white;
    background: transparent;

    font-size: 22px;
    font-weight: 750;
    text-decoration: underline;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.9);
}

.news-content {
    display: block;

    padding: 20px 6px 0;
}

.news-content p {
    margin: 0 0 12px;

    color: rgba(255, 255, 255, 0.96);

    font-size: 19px;
    font-weight: 600;
    line-height: 1.5;

    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.72);
}

@media (max-width: 600px) {
    #news {
        padding: 34px 22px 40px;
    }

    .news-section-heading {
        margin-bottom: 22px;
    }

    .news-featured > h3 {
        margin-bottom: 16px;

        font-size: 22px;
    }

    .news-image-label {
        right: 18px;
        bottom: 11px;

        font-size: 17px;
    }

    .news-content {
        padding: 16px 2px 0;
    }

    .news-content p {
        font-size: 17px;
        font-weight: 550;
        line-height: 1.55;
    }
}


/* ── CONTACT LOCATION + WORKING HOURS ── */

#contacts {
    position: relative;

    width: 100%;
    max-width: none;

    padding-top: 130px;

    overflow: hidden;
    isolation: isolate;
}

#contacts::before,
#contacts::after {
    content: "";

    position: absolute;

    pointer-events: none;
}

#contacts::before {
    inset: -16px;
    z-index: 0;

    background: url("images/lozen_karta-960.webp") center / cover no-repeat;

    filter: blur(6px);
    transform: scale(1.04);
}

#contacts::after {
    inset: 0;
    z-index: 0;

    background: rgba(0, 0, 0, 0.66);
}

#contacts > h2,
#contacts > p,
#contacts > .contact-location-grid {
    position: relative;
    z-index: 1;

    width: 100%;
    max-width: 1400px;

    margin-left: auto;
    margin-right: auto;
}

#contacts > h2,
#contacts > p {
    transform: translateY(24px);
}

.contact-phones {
    display: grid;
    grid-template-columns: max-content max-content minmax(0, 1fr);
    column-gap: 18px;
    row-gap: 6px;
    align-items: baseline;
}

.contact-phones-title {
    grid-column: 1 / -1;
    margin-bottom: 2px;
}

.contact-phone-row {
    display: contents;
}

.contact-phone-note {
    color: rgba(255, 255, 255, 0.86);
}

.booking-terms {
    position: relative;
    top: auto;
    right: auto;
    z-index: 1;

    width: 100%;
    max-width: 1400px;
    margin: 0 auto 42px;
    padding: 0;

    color: rgba(255, 255, 255, 0.94);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
}

.booking-terms h3 {
    margin: 0 0 20px;

    color: #fff;
    font-family: inherit;
    font-size: 32px;
    font-weight: 700;
    line-height: inherit;
}

.booking-terms ul {
    margin: 0;
    padding-left: 20px;
}

.booking-terms li {
    margin: 0 0 10px;
    line-height: 1.45;
}

.booking-terms li:last-child {
    margin-bottom: 0;
}

#contacts > h2,
#contacts > p,
#contacts .contact-link,
#contacts .contact-map-address {
    color: rgba(255, 255, 255, 0.94);

    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
}

.contact-location-grid {
    width: 100%;

    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(360px, 0.75fr);
    gap: 30px;
    align-items: stretch;

    margin-top: 34px;
}

.contact-map {
    min-width: 0;

    display: flex;
    flex-direction: column;
}

.contact-map-address {
    margin: 0 0 12px;

    align-self: flex-end;

    text-align: right;

    color: #222;

    font-weight: 600;
}

.map-container {
    width: 100%;
    flex: 1;
    min-height: 520px;

    overflow: hidden;

    background: #e9e9e7;
    border: 1px solid #ddd;
}

.map-container iframe {
    display: block;

    width: 100%;
    height: 100%;
    min-height: 520px;

    border: 0;
}


.map-consent {
    min-height: 520px;
    height: 100%;
    display: grid;
    place-items: center;
    padding: 32px;
    text-align: center;
    background:
        linear-gradient(rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.92)),
        url("images/lozen_karta-960.webp") center / cover no-repeat;
}

.map-consent-content {
    width: min(520px, 100%);
    padding: 30px;
    border: 1px solid rgba(64, 110, 69, 0.24);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.12);
}

.map-consent-content h3 {
    margin-bottom: 10px;
    color: #315535;
    font-size: 26px;
}

.map-consent-content p {
    color: #333;
    line-height: 1.55;
}

.map-load-button {
    margin: 20px 0 12px;
    padding: 12px 22px;
    border: 2px solid #315535;
    border-radius: 5px;
    color: #fff;
    background: #406e45;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.map-load-button:hover,
.map-load-button:focus-visible {
    background: #315535;
}

.map-load-button:focus-visible {
    outline: 3px solid #d1a937;
    outline-offset: 3px;
}

.map-consent-content .map-privacy-note {
    margin: 0;
    font-size: 14px;
}

.map-privacy-note a {
    color: #315535;
    font-weight: 700;
    text-underline-offset: 3px;
}

.working-hours {
    min-height: 520px;

    display: flex;
    flex-direction: column;

    padding: 36px;

    background: #f7f7f5;
    border: 1px solid #ddd;
}

.working-hours h3 {
    margin: 0;
    padding-bottom: 16px;

    color: #111;
    border-bottom: 3px solid #406e45;

    font-size: 32px;
    font-weight: 650;
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.working-hours-list {
    margin: 22px 0 0;
}

.working-hours-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;

    padding: 17px 0;

    border-bottom: 1px solid #ddd;
}

.working-hours-row:first-child {
    padding-top: 0;
}

.working-hours-row dt {
    color: #222;

    font-weight: 600;
    line-height: 1.35;
}

.working-hours-row dd {
    margin: 0;

    color: #111;

    font-weight: 500;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.working-hours-note {
    margin: auto 0 0;
    padding: 20px 0 0 16px;

    color: #222;
    border-left: 4px solid #406e45;

    font-weight: 700;
    line-height: 1.5;
}

@media (max-width: 1000px) {

    .booking-terms {
        position: relative;
        top: auto;
        right: auto;

        width: 100%;
        max-width: 1400px;
        margin: 0 auto 34px;
    }

    .contact-location-grid {
        grid-template-columns: 1fr;
    }

    .map-container,
    .map-container iframe {
        min-height: 400px;
    }

    .working-hours {
        min-height: 0;
    }

}




/* ─────────────────────────────
   OWN GUN PRICE LIST
───────────────────────────── */

#own-gun {
    width: 100%;
    max-width: 1700px;

    margin: 0 auto;
    padding: 100px 40px;
}


.own-gun-header {
    max-width: 850px;
    margin-bottom: 65px;
}

.own-gun-header h2 {
    margin-bottom: 12px;

    font-size: 40px;
    line-height: 1.15;
}

.own-gun-header p {
    margin: 0;

    font-size: 19px;
}


/* Main price blocks */

.price-block {
    margin-bottom: 34px;
    padding: 38px 42px;

    background: #f7f7f5;

    border: 1px solid #e5e5e5;
}

.price-block:last-child {
    margin-bottom: 0;
}


.price-block-heading {
    display: flex;

    gap: 22px;
    align-items: flex-start;

    margin-bottom: 30px;
    padding-bottom: 22px;

    border-bottom: 2px solid #406e45;
}


.price-number {
    flex: 0 0 auto;

    color: #406e45;

    font-size: 18px;
    font-weight: 800;
    line-height: 1.2;

    letter-spacing: 0.08em;
}


.price-block-heading h3 {
    margin: 0;

    font-size: 27px;
    font-weight: 700;
    line-height: 1.2;
}


.price-note {
    margin: 6px 0 0;

    color: #666;

    font-size: 15px;
}


/* Simple service-price rows */

.price-list {
    display: grid;
}

.price-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;

    gap: 28px;
    align-items: center;

    padding: 16px 0;

    border-bottom: 1px solid #ddd;
}

.price-row:last-child {
    border-bottom: none;
}


.price-row span {
    min-width: 0;

    color: #222;

    font-size: 17px;
    line-height: 1.5;
}


.price-row span small {
    display: block;

    margin-top: 4px;

    color: #777;

    font-size: 14px;
}


.price-row strong {
    color: #406e45;

    font-size: 19px;
    font-weight: 750;

    white-space: nowrap;
}


/* 25 m table */

.time-price-table {
    width: 100%;

    margin-bottom: 28px;

    border: 1px solid #dededb;
}


.time-price-head,
.time-price-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1.35fr;

    gap: 20px;
    align-items: center;

    padding: 14px 18px;
}


.time-price-head {
    background: #406e45;

    color: white;

    font-size: 15px;
    font-weight: 700;
}


.time-price-row {
    border-bottom: 1px solid #dededb;
}

.time-price-row:last-child {
    border-bottom: none;
}


.time-price-row strong {
    color: #406e45;

    font-size: 18px;
}


.price-info-box {
    margin-bottom: 25px;
    padding: 20px 22px;

    background: white;

    border-left: 4px solid #406e45;

    color: #333;

    font-size: 16px;
    line-height: 1.65;
}


.price-list-secondary {
    margin-top: 8px;
}


/* Ammunition */

.ammo-columns {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 24px;
}


.ammo-card {
    padding: 26px;

    background: white;

    border: 1px solid #dededb;
}


.ammo-card h4 {
    margin: 0 0 4px;

    font-size: 22px;
    line-height: 1.25;
}


.ammo-card > p {
    margin: 0 0 18px;

    color: #777;

    font-size: 14px;
}


.ammo-list > div {
    display: flex;

    justify-content: space-between;
    align-items: center;

    gap: 20px;

    padding: 10px 0;

    border-bottom: 1px solid #ececea;
}


.ammo-list > div:last-child {
    border-bottom: none;
}


.ammo-list span {
    font-weight: 600;
}


.ammo-list strong {
    color: #406e45;

    font-weight: 750;

    white-space: nowrap;
}


/* Responsive */

@media (max-width: 1100px) {

    #own-gun {
        padding: 80px 35px;
    }

    .ammo-columns {
        grid-template-columns: 1fr 1fr;
    }

    .ammo-card:last-child {
        grid-column: 1 / -1;
    }

}


@media (max-width: 700px) {

    #own-gun {
        padding: 65px 22px;
    }

    .own-gun-header {
        margin-bottom: 45px;
    }

    .own-gun-header h2 {
        font-size: 32px;
    }

    .price-block {
        padding: 26px 20px;
    }

    .price-block-heading {
        gap: 14px;
    }

    .price-block-heading h3 {
        font-size: 23px;
    }

    .price-row {
        grid-template-columns: 1fr;

        gap: 6px;
    }

    .price-row strong {
        justify-self: start;
    }

    .time-price-head,
    .time-price-row {
        grid-template-columns: 1fr;
        gap: 5px;
    }

    .time-price-head span:not(:first-child) {
        display: none;
    }

    .time-price-row {
        padding: 16px 18px;
    }

    .time-price-row strong::before {
        display: inline-block;

        min-width: 155px;

        color: #666;

        font-size: 13px;
        font-weight: 500;
    }

    .time-price-row strong:nth-child(2)::before {
        content: "Работни дни: ";
    }

    .time-price-row strong:nth-child(3)::before {
        content: "Почивни/празнични: ";
    }

    .ammo-columns {
        grid-template-columns: 1fr;
    }

    .ammo-card:last-child {
        grid-column: auto;
    }

}


/* ─────────────────────────────
   COMBINED PACKAGES
───────────────────────────── */

.packages {
    width: 100%;
    max-width: 1700px;

    margin: 0 auto;
    padding: 100px 40px;
}


/* Main headings */

.packages > h2:first-child {
    margin-bottom: 10px;

    font-size: 40px;
}

.packages > p {
    max-width: 750px;
    margin-bottom: 60px;
}


.packages > p:first-of-type {
    font-size: 19px;
}

.packages > h2:nth-of-type(2) {
    margin-bottom: 45px;

    font-size: 38px;
    line-height: 1.2;
}


/* Package card */

.package {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 720px;

    /* Keep the information column exactly aligned with the image vertically. */
    align-items: stretch;
    gap: 70px;

    margin: 0 0 45px;
    padding: 45px;

    background: #f7f7f5;

    border: 1px solid #e5e5e5;

    overflow: hidden;

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.package:hover {
    transform: translateY(-4px);

    box-shadow:
        0 15px 40px rgba(0, 0, 0, 0.08);
}


/* Package text */

.package-text {
    width: 100%;

    /* Title stays at the image top; booking button stays at the image bottom. */
    display: flex;
    flex-direction: column;
    align-self: stretch;
}

.package-text h2 {
    margin-bottom: 25px;

    font-size: 34px;
    font-weight: 650;
    line-height: 1.15;
}

.package-text p {
    margin: 0;

    color: #333;

    font-size: 18px;
    line-height: 1.5;
}


/* Price badge */

.package-price {
    display: block;
    width: max-content;

    /* Push the price + booking button group to the image bottom. */
    margin-top: auto;
    margin-bottom: 12px;
    padding: 8px 16px;

    color: white;
    background: #406e45;

    font-size: 20px;
    font-weight: 650;
    line-height: 1.55;
}

.package-booking-button {
    margin-top: 0;
    align-self: flex-start;
}


/* Package image */

.package-image {
    width: 100%;

    display: block;
    overflow: hidden;
}

.package-image img {
    display: block;

    width: 100%;
    height: 500px;

    max-width: none;

    object-fit: cover;
    object-position: center;

    border-radius: 0;

    cursor: pointer;

    transition:
        transform 0.3s ease,
        opacity 0.2s ease;
}

.package-image--contain img {
    object-fit: contain;
    background: #f7f7f5;
}

.package:hover .package-image img {
    transform: scale(1.015);
}

.package-image img:hover {
    opacity: 0.94;
}

/* Keyboard focus for images that open the gun/package lightbox */
.gun-photo:focus-visible,
.package-image img:focus-visible {
    outline: 3px solid #406e45;
    outline-offset: 4px;
}

.package:hover .package-image--contain img,
.package-image--contain img:hover {
    transform: none;
}


/* Alternate image/text sides */

.package:nth-of-type(even) {
    grid-template-columns: 720px minmax(0, 1fr);
}

.package:nth-of-type(even) .package-image {
    grid-column: 1;
    grid-row: 1;
}

.package:nth-of-type(even) .package-text {
    grid-column: 2;
    grid-row: 1;
}


/* Tablet */

@media (max-width: 1200px) {

    .packages {
        padding: 80px 35px;
    }

    .package {
        grid-template-columns: minmax(0, 1fr) 520px;

        gap: 45px;
        padding: 35px;
    }

    .package:nth-of-type(even) {
        grid-template-columns: 520px minmax(0, 1fr);
    }

    .package-image img {
        height: 380px;
    }

}


/* Mobile */

@media (max-width: 800px) {

    .packages {
        padding: 60px 22px;
    }

    .packages > h2:nth-of-type(2) {
        font-size: 32px;
    }

    .package,
    .package:nth-of-type(even) {
        display: flex;
        flex-direction: column;

        gap: 25px;

        margin-bottom: 30px;
        padding: 25px;
    }

    .package-text,
    .package:nth-of-type(even) .package-text {
        order: 1;

        width: 100%;

        /* On stacked mobile cards the text returns to its natural height. */
        display: block;
        align-self: auto;
        text-align: left;
    }

    .package-price {
        margin-top: 8px;
        margin-bottom: 0;
        padding: 7px 13px;
        font-size: 18px;
    }

    .package-booking-button {
        margin-top: 12px;
    }

    .package-image,
    .package:nth-of-type(even) .package-image {
        order: 2;

        width: 100%;
    }

    .package-image img {
        width: 100%;
        height: 300px;
    }

    .package-text h2 {
        font-size: 29px;
    }

}


/* ── ANCHOR SCROLL OFFSET ── */

#prices {
    scroll-margin-top: 100px;
}

#own-gun,
#no-gun {
    scroll-margin-top: 100px;
}


/* ── MOBILE ── */

@media (max-width: 768px) {


    .carousel {
        height: 350px;
    }

    .carousel-track img.active {
        width: 280px;

        height: 280px;
    }

    .carousel-track img.previous {
        transform:
            translateX(-220px)
            scale(0.75);
    }

    .carousel-track img.next {
        transform:
            translateX(220px)
            scale(0.75);
    }

    .carousel-btn {
        width: 40px;

        height: 40px;

        font-size: 22px;
    }


    /* Range sections on mobile */



#course-hunting-right .range-content,
#course-selective-hunting .range-content,
#course-shooting-training .range-content {
    min-height: 0;
}

    .course-registration-phone {
        margin-top: 24px;
    }





    /* Lightbox on mobile */

    .lightbox img {
        max-width: 94vw;

        max-height: 80vh;
    }



    .lightbox-prev {
        left: 5px;
    }

    .lightbox-next {
        right: 5px;
    }


    /* Header on mobile */

    header {
        padding: 15px 20px;
    }

    nav a,
    nav .dropdown-trigger {
        font-size: 16px;

        margin-left: 18px;
    }

    .dropdown {
        margin-left: 18px;
    }

}


/* ── FOOTER ── */

footer {
    position: relative;

    width: 100%;
    min-height: 90px;

    margin: 0;
    padding: 15px 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    text-align: center;

    font-size: 14px;

    color: white;

    background-color: #406e45;
}

/* Logo stays left while the copyright remains centered on the same row. */
.footer-logo {
    position: absolute;

    top: 50%;
    left: 40px;

    display: block;

    margin: 0;
    padding: 0;

    transform: translateY(-50%);
}

.footer-logo img {
    display: block;

    height: 60px;
    width: auto;
}

footer p {
    color: white;
    margin: 0;
    white-space: nowrap;
}


/* ═══════════════════════════════════════════════════════
   MOBILE NAVIGATION + FINAL RESPONSIVE PASS
   Added for the complete phone/tablet version.
   Desktop behaviour above 900px remains unchanged.
═══════════════════════════════════════════════════════ */

/* Hamburger is hidden on desktop. */
.menu-toggle {
    display: none;
}

/* Back-to-top button: true color inversion against its backdrop. */
.back-to-top {
    position: fixed;
    right: 28px;
    bottom: 28px;

    width: 58px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: white;
    background: transparent;
    border: 3px solid currentColor;
    border-radius: 50%;

    mix-blend-mode: difference;

    text-decoration: none;

    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);

    transition:
        opacity 0.2s ease,
        visibility 0.2s ease,
        transform 0.2s ease;

    z-index: 1400;
}

.back-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.back-to-top:hover {
    transform: translateY(-3px);
}

.back-to-top svg {
    width: 30px;
    height: 30px;

    fill: none;
    stroke: currentColor;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.back-to-top:focus-visible,
.menu-toggle:focus-visible {
    outline: 3px solid white;
    outline-offset: 3px;
}


/* ─────────────────────────────
   TABLET + MOBILE HEADER
───────────────────────────── */

@media (max-width: 900px) {

    header {
        min-height: 76px;
        padding: 12px 20px;
    }

    .logo img {
        height: 52px;
    }

    .menu-toggle {
        width: 48px;
        height: 48px;

        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 6px;

        margin: 0;
        padding: 0;

        color: white;
        background: transparent;
        border: 0;

        cursor: pointer;

        z-index: 1300;
    }

    .menu-toggle span {
        display: block;

        width: 28px;
        height: 2px;

        background: currentColor;

        transition:
            transform 0.25s ease,
            opacity 0.2s ease;
    }

    header.menu-open .menu-toggle span:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }

    header.menu-open .menu-toggle span:nth-child(2) {
        opacity: 0;
    }

    header.menu-open .menu-toggle span:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }

    nav {
        position: absolute;
        top: 100%;
        left: 0;

        width: 100%;

        display: block;

        max-height: 0;

        margin: 0;
        padding: 0;

        overflow: hidden;

        background: #406e45;
        box-shadow: 0 12px 22px rgba(0, 0, 0, 0.18);

        opacity: 0;
        visibility: hidden;

        transition:
            max-height 0.3s ease,
            opacity 0.2s ease,
            visibility 0.2s ease;

        z-index: 1200;
    }

    header.menu-open nav {
        max-height: calc(100vh - 76px);
        max-height: calc(100dvh - 76px);

        overflow-y: auto;

        opacity: 1;
        visibility: visible;
    }

    body.mobile-nav-open {
        overflow: hidden;
    }

    nav > a,
    .dropdown > a,
    .dropdown > .dropdown-trigger {
        width: 100%;

        display: flex;
        align-items: center;
        justify-content: space-between;

        margin: 0;
        padding: 15px 20px;

        color: white;

        font-size: 17px;
        line-height: 1.3;

        border-top: 1px solid rgba(255, 255, 255, 0.12);
    }

    nav > a:first-child {
        margin-left: 0;
    }

    .dropdown {
        position: static;

        display: block;

        width: 100%;

        margin: 0;
    }

    .dropdown-menu {
        position: static;

        display: none;

        min-width: 0;

        margin: 0;
        padding: 0;

        background: #365f3a;

        border: 0;
        box-shadow: none;

        opacity: 1;
        visibility: visible;

        transform: none;

        transition: none;
    }

    .dropdown.open > .dropdown-menu {
        display: block;
    }

    .dropdown-menu a {
        width: 100%;

        display: flex;
        align-items: center;

        margin: 0;
        padding: 14px 20px 14px 38px;

        color: white;

        font-size: 16px;
        line-height: 1.35;

        white-space: normal;

        border-top: 1px solid rgba(255, 255, 255, 0.10);
    }

    .dropdown-menu a:hover,
    .dropdown-submenu > .submenu-trigger:hover,
    .submenu-menu a:hover {
        background: rgba(255, 255, 255, 0.08);
    }

    .dropdown-submenu {
        position: static;
    }

    .dropdown-submenu > .submenu-trigger {
        width: 100%;

        display: flex;
        align-items: center;
        justify-content: space-between;

        margin: 0;
        padding: 14px 20px 14px 38px;

        color: white;

        font-size: 16px;
        line-height: 1.35;

        white-space: normal;

        border-top: 1px solid rgba(255, 255, 255, 0.10);
    }

    .submenu-arrow {
        flex: 0 0 auto;

        margin-left: 16px;

        color: white;

        transition: transform 0.2s ease;
    }

    .dropdown-submenu.open > .submenu-trigger .submenu-arrow {
        transform: rotate(90deg);
    }

    .submenu-menu {
        position: static;

        display: none;

        min-width: 0;

        margin: 0;
        padding: 0;

        background: #315535;

        border: 0;
        box-shadow: none;

        opacity: 1;
        visibility: visible;

        transform: none;

        pointer-events: auto;

        transition: none;
    }

    .dropdown-submenu.open > .submenu-menu {
        display: block;
    }

    .submenu-menu a {
        margin: 0;
        padding: 13px 20px 13px 56px;

        color: white;

        font-size: 15px;
        line-height: 1.35;

        white-space: normal;

        border-top: 1px solid rgba(255, 255, 255, 0.08);
    }

}


/* ─────────────────────────────
   COMPLETE PHONE LAYOUT
───────────────────────────── */

@media (max-width: 768px) {

    body {
        font-size: 17px;
    }

    section {
        padding: 60px 22px;
    }

    h1 {
        font-size: clamp(36px, 10vw, 46px);
        line-height: 1.08;
    }

    h2 {
        font-size: 30px;
        line-height: 1.15;
    }


    /* Home hero */

    #hero {
        min-height: calc(100vh - 76px);
        min-height: calc(100svh - 76px);
    }

    .hero-content {
        padding: 54px 22px;
    }

    #hero h1 {
        margin-bottom: 20px;
    }

    #hero p {
        font-size: 17px;
        line-height: 1.65;
    }


    /* About */

    #about {
        padding: 60px 22px;
    }

    .about-inner {
        gap: 28px;
    }

    .about-heading h2 {
        font-size: 31px;
    }

    .about-kicker {
        font-size: 18px;
    }

    .about-story p {
        margin-bottom: 22px;

        font-size: 17px;
        line-height: 1.68;
    }

    .about-team {
        padding: 18px;
    }


    /* Gallery */

    #gallery {
        padding: 0;
    }

    #gallery h2 {
        margin-bottom: 28px;
        padding: 0 22px;
    }

    .gallery-marquee-image {
        width: 82vw;
        height: 52vw;
        max-height: 270px;
    }

    .gallery-set {
        gap: 1px;
        padding-right: 1px;
    }


    /* Contacts + map */

    #contacts {
        padding: 80px 22px 60px;
    }

    .map-container {
        height: 300px;
        min-height: 300px;
        margin-top: 0;
    }

    .map-container iframe {
        min-height: 300px;
    }

    .working-hours {
        padding: 28px 22px;
    }

    .working-hours h3 {
        font-size: 27px;
    }

    .working-hours-row {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .working-hours-note {
        margin-top: 24px;
    }

    .contact-phones {
        grid-template-columns: max-content max-content;
        column-gap: 12px;
        row-gap: 6px;
    }

    .contact-phone-note {
        grid-column: 1 / -1;
        margin: -2px 0 6px;
        padding-left: 0;
    }


    /* Shooting zones */

    .range-zone {
        min-height: 0;

        flex-direction: column;

        gap: 28px;

        padding: 48px 22px;
    }

    .range-zone.has-booking-button {
        min-height: 0;
        padding-bottom: 48px;
    }

    .range-zone.has-booking-button .range-content {
        min-height: 0;
    }

    .range-booking-button {
        width: max-content;
        max-width: 100%;
        margin-top: 24px;
    }

    .range-content {
        width: 100%;
        max-width: none;
    }

    .range-content h2 {
        margin-bottom: 16px;

        font-size: 29px;
        line-height: 1.15;

        white-space: normal;
    }

    .range-content p {
        margin-bottom: 0;

        font-size: 17px;
        line-height: 1.6;
    }

    .range-slider,
    .range-video {
        width: 100%;
        height: clamp(240px, 72vw, 330px);
    }

    .range-slider img {
        width: 100%;
    }


    /* Own-gun prices */

    #own-gun {
        padding: 58px 18px;
    }

    .own-gun-header {
        margin-bottom: 38px;
    }

    .own-gun-header h2 {
        font-size: 30px;
    }

    .own-gun-header p {
        font-size: 17px;
        line-height: 1.55;
    }

    .price-block {
        margin-bottom: 24px;
        padding: 22px 16px;
    }

    .price-block-heading {
        gap: 12px;

        margin-bottom: 20px;
        padding-bottom: 17px;
    }

    .price-number {
        font-size: 14px;
    }

    .price-block-heading h3 {
        font-size: 21px;
        line-height: 1.2;
    }

    .price-note {
        font-size: 14px;
    }

    .price-row {
        grid-template-columns: 1fr;

        gap: 5px;

        padding: 14px 0;
    }

    .price-row span {
        font-size: 16px;
        line-height: 1.45;
    }

    .price-row strong {
        justify-self: start;

        font-size: 18px;
    }

    .time-price-head,
    .time-price-row {
        grid-template-columns: 1fr;

        gap: 5px;
    }

    .time-price-head {
        padding: 12px 14px;
    }

    .time-price-row {
        padding: 14px;
    }

    .time-price-row strong::before {
        min-width: 135px;
    }

    .price-info-box {
        padding: 17px;

        font-size: 15px;
        line-height: 1.55;
    }

    .ammo-card {
        padding: 20px;
    }

    .ammo-card h4 {
        font-size: 20px;
    }


    /* Combined packages */

    .packages {
        padding: 58px 18px;
    }

    .packages > h2:first-child {
        font-size: 30px;
    }

    .packages > p:first-of-type {
        margin-bottom: 42px;

        font-size: 17px;
    }

    .packages > h2:nth-of-type(2) {
        margin-bottom: 30px;

        font-size: 29px;
    }

    .package,
    .package:nth-of-type(even) {
        gap: 20px;

        margin-bottom: 24px;
        padding: 18px;
    }

    .package-text h2 {
        margin-bottom: 18px;

        font-size: 27px;
    }

    .package-text p {
        font-size: 16px;
        line-height: 1.5;
    }

    .package-price {
        padding: 7px 13px;

        font-size: 18px;
    }

    .package-image img {
        width: 100%;
        height: clamp(210px, 60vw, 300px);
    }


    /* Single packages */

    .single-packages {
        padding: 58px 18px;
    }

    .single-packages-header {
        margin-bottom: 34px;
    }

    .single-packages-header h2 {
        font-size: 30px;
    }

    .single-category {
        row-gap: 18px;

        margin-bottom: 42px;
    }

    .single-category h3 {
        font-size: 21px;
    }

    .single-gun {
        grid-template-columns: minmax(150px, 44%) minmax(0, 1fr);

        min-height: 0;

        column-gap: 14px;
        row-gap: 9px;

        padding: 12px;
    }

    .gun-photo {
        height: 145px;
    }

    .gun-info strong {
        font-size: 17px;
    }

    .gun-info span {
        font-size: 14px;
    }

    .single-price {
        padding: 5px 10px;

        font-size: 16px;
    }


    /* Lightboxes */

    .lightbox img,
    #galleryLightbox img {
        max-width: 94vw;
        max-height: 78vh;
    }

    .lightbox-close {
        top: 8px;
        right: 10px;

        font-size: 44px;
    }

    .lightbox-prev,
    .lightbox-next {
        font-size: 38px;
        padding: 9px;
    }


    /* Footer: logo left and copyright centered on the same row. */

    footer {
        min-height: 82px;

        padding: 15px 20px;

        font-size: 13px;
        line-height: 1.4;
    }

    .footer-logo {
        top: 50%;
        left: 20px;
    }

    .footer-logo img {
        height: 52px;
    }

    footer p {
        max-width: calc(100% - 210px);

        margin: 0 auto;
        font-size: 11px;
    }


    /* Back to top */

    .back-to-top {
        right: 18px;
        bottom: 18px;

        width: 50px;
        height: 50px;

        border-width: 3px;
    }

    .back-to-top svg {
        width: 26px;
        height: 26px;
    }

}


/* Small phones */

@media (max-width: 520px) {

    .single-gun {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: auto auto;

        column-gap: 12px;
    }

    .gun-photo {
        grid-column: 1 / -1;
        grid-row: 1;

        width: 100%;
        height: clamp(190px, 58vw, 240px);
    }

    .gun-info {
        grid-column: 1;
        grid-row: 2;

        padding-top: 2px;
    }

    .single-price {
        grid-column: 2;
        grid-row: 2;

        align-self: end;
        justify-self: end;
    }

    .centered-gun {
        width: 100%;
    }

    .range-content h2 {
        font-size: 27px;
    }

    .time-price-row strong::before {
        display: block;

        min-width: 0;
        margin-bottom: 2px;
    }

}


/* ─────────────────────────────
   EXPANDING COURSE CARDS
───────────────────────────── */

.course-card-section {
    position: relative;
    z-index: 20;

    width: 100%;
    max-width: none;
    height: 210px;

    margin: 0;
    padding: 0;

    overflow: visible;

    background: rgba(15, 25, 18, 0.82);
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);

    -webkit-backdrop-filter: blur(18px) saturate(115%);
    backdrop-filter: blur(18px) saturate(115%);
}

.course-card-grid {
    width: 100%;
    height: 210px;

    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: end;

    isolation: isolate;
}

.course-card {
    --course-image: none;

    position: relative;

    height: 210px;

    overflow: visible;

    outline: none;
    cursor: pointer;
}

.course-card-content {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 1;

    width: 100%;
    height: 210px;

    display: flex;
    flex-direction: column;
    justify-content: flex-start;

    padding: 18px;

    overflow: hidden;

    color: white;
    background: rgba(13, 22, 16, 0.58);
    border-right: 1px solid rgba(255, 255, 255, 0.13);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        inset 0 -1px 0 rgba(0, 0, 0, 0.2);

    -webkit-backdrop-filter: blur(14px) saturate(120%);
    backdrop-filter: blur(14px) saturate(120%);

    transition:
        width 0.38s ease,
        height 0.38s ease,
        box-shadow 0.38s ease;
}

.course-card-content::before {
    content: "";

    position: absolute;
    inset: 0;
    z-index: 1;

    background:
        linear-gradient(
            to top,
            rgba(4, 10, 6, 0.9) 0%,
            rgba(10, 24, 14, 0.54) 52%,
            rgba(10, 20, 13, 0.22) 100%
        );

    opacity: 0.08;

    transition: opacity 0.32s ease;
}

.course-card-content::after {
    content: "";

    position: absolute;
    inset: 0;
    z-index: 0;

    width: 100%;
    height: 100%;

    background-color: rgba(24, 36, 27, 0.72);
    background-image: var(--course-image);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;

    filter: none;
}

.course-card h3,
.course-card-details {
    position: relative;
    z-index: 2;
}

.course-card h3 {
    align-self: flex-start;

    margin: 0;
    padding: 7px 12px;

    color: white;
    background: rgba(14, 30, 19, 0.62);
    border: 1px solid rgba(255, 255, 255, 0.16);

    -webkit-backdrop-filter: blur(10px) saturate(120%);
    backdrop-filter: blur(10px) saturate(120%);

    font-size: clamp(17px, 1.35vw, 22px);
    font-weight: 750;
    line-height: 1.12;

    transition:
        color 0.25s ease,
        background-color 0.25s ease;
}

.course-card-details {
    width: 100%;
    max-height: 0;

    flex: 1;
    display: flex;
    flex-direction: column;

    margin-top: 16px;

    overflow: hidden;

    opacity: 0;
    transform: translateY(18px);

    transition:
        max-height 0.32s ease,
        opacity 0.28s ease 0.06s,
        transform 0.32s ease 0.04s;
}

.course-card-details p {
    margin: 0;

    color: white;

    font-size: 18px;
    line-height: 1.5;

    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
}

.course-card-option-list {
    display: grid;
    gap: 14px;

    margin-top: auto;
}

.course-card-option {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: end;

    padding-bottom: 14px;

    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.course-card-option:last-child {
    padding-bottom: 0;

    border-bottom: 0;
}

.course-card-option-label {
    min-height: 38px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    align-self: end;

    line-height: 1.05 !important;
}

.course-card-price {
    width: fit-content;
    min-width: 86px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    justify-self: end;

    margin-top: 14px;
    margin-left: auto;
    padding: 7px 14px;

    color: white;
    background: #406e45;

    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;

    white-space: nowrap;
    text-align: center;
}

.course-card-details > .course-card-price {
    margin-top: auto;
}

.course-card-option .course-card-price {
    margin-top: 0;
}

.course-card-price strong {
    font-size: inherit;
    font-weight: inherit;
}

.course-card-training-description {
    margin-bottom: 16px !important;
}

.course-card:hover,
.course-card:focus-visible,
.course-card:focus-within {
    z-index: 5;
}

.course-card:hover .course-card-content,
.course-card:focus-visible .course-card-content,
.course-card:focus-within .course-card-content {
    height: 365px;

    box-shadow:
        0 -20px 42px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.course-card:hover .course-card-content::before,
.course-card:focus-visible .course-card-content::before,
.course-card:focus-within .course-card-content::before {
    opacity: 1;
}

.course-card:hover h3,
.course-card:focus-visible h3,
.course-card:focus-within h3 {
    color: white;
    background: rgba(64, 110, 69, 0.78);
}

.course-card:hover .course-card-details,
.course-card:focus-visible .course-card-details,
.course-card:focus-within .course-card-details {
    max-height: 400px;

    opacity: 1;
    transform: translateY(0);
}

.course-card--training:hover .course-card-content,
.course-card--training:focus-visible .course-card-content,
.course-card--training:focus-within .course-card-content {
    height: 500px;
}

.course-card--training:hover .course-card-details,
.course-card--training:focus-visible .course-card-details,
.course-card--training:focus-within .course-card-details {
    max-height: 500px;
}

@media (max-width: 1000px), (hover: none) {

    .course-card-section {
        height: auto;

        padding: 38px 24px;

        background: rgba(15, 25, 18, 0.86);
    }

    .course-card-grid {
        height: auto;

        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;

        align-items: stretch;
    }

    .course-card,
    .course-card:hover,
    .course-card:focus-visible,
    .course-card:focus-within {
        height: 300px;

        border: 0;
    }

    .course-card-content,
    .course-card:hover .course-card-content,
    .course-card:focus-visible .course-card-content,
    .course-card:focus-within .course-card-content {
        height: 300px;

        border: 1px solid rgba(255, 255, 255, 0.16);
        box-shadow:
            0 12px 30px rgba(0, 0, 0, 0.24),
            inset 0 1px 0 rgba(255, 255, 255, 0.12);
    }

    .course-card-content::before {
        opacity: 0.92;
    }

    .course-card h3 {
        color: white;
        background: rgba(64, 110, 69, 0.76);
    }

    .course-card-details {
        max-height: 400px;

        opacity: 1;
        transform: translateY(0);
    }

    .course-card--training,
    .course-card--training:hover,
    .course-card--training:focus-visible,
    .course-card--training:focus-within,
    .course-card--training .course-card-content,
    .course-card--training:hover .course-card-content,
    .course-card--training:focus-visible .course-card-content,
    .course-card--training:focus-within .course-card-content {
        height: 420px;
    }


}

@media (max-width: 600px) {

    .course-card-section {
        padding: 28px 18px;
    }

    .course-card-grid {
        grid-template-columns: 1fr;
    }

    .course-card,
    .course-card:hover,
    .course-card:focus-visible,
    .course-card:focus-within {
        height: 280px;
    }

    .course-card-content,
    .course-card:hover .course-card-content,
    .course-card:focus-visible .course-card-content,
    .course-card:focus-within .course-card-content {
        height: 280px;
    }

    .course-card h3 {
        font-size: 20px;
    }

    .course-card-details p {
        font-size: 18px;
    }

    .course-card--training,
    .course-card--training:hover,
    .course-card--training:focus-visible,
    .course-card--training:focus-within,
    .course-card--training .course-card-content,
    .course-card--training:hover .course-card-content,
    .course-card--training:focus-visible .course-card-content,
    .course-card--training:focus-within .course-card-content {
        height: 400px;
    }

    .course-card--training .course-card-details {
        max-height: 500px;
    }

}

@media (prefers-reduced-motion: reduce) {

    .course-card,
    .course-card-content,
    .course-card-content::before,
    .course-card-content::after,
    .course-card h3,
    .course-card-details {
        transition: none;
    }

}


/* Very narrow phones */

@media (max-width: 380px) {

    header {
        padding-left: 16px;
        padding-right: 14px;
    }

    .logo img {
        height: 48px;
    }

    nav > a,
    .dropdown > a,
    .dropdown > .dropdown-trigger {
        padding-left: 16px;
        padding-right: 16px;
    }

    section,
    #about,
    #contacts {
        padding-left: 18px;
        padding-right: 18px;
    }

    #own-gun,
    .packages,
    .single-packages {
        padding-left: 14px;
        padding-right: 14px;
    }

    .price-block {
        padding-left: 14px;
        padding-right: 14px;
    }

    .footer-logo {
        left: 16px;
    }

}


/* Keep the footer at the bottom on an intentionally empty page.
   The selector matches Services only when header and footer are adjacent. */
body:has(> header + footer) {
    min-height: 100vh;
    min-height: 100svh;

    display: flex;
    flex-direction: column;
}

body:has(> header + footer) > footer {
    margin-top: auto;
}


/* ─────────────────────────────
   XL SINGLE-GUN PACKAGES
───────────────────────────── */

.single-price {
    min-width: 86px;
    text-align: center;
}

.single-gun.has-xl-package {
    grid-template-rows: auto auto auto auto;
    row-gap: 0;

    align-content: start;
}

.single-gun.has-xl-package .gun-photo {
    grid-row: 1 / 5;

    height: 100%;
    min-height: 310px;
}

.xl-package-info {
    grid-column: 2;
    grid-row: 3;

    display: flex;
    flex-direction: column;

    gap: 0;
    margin-top: 24px;
}

.single-gun.has-xl-package > .single-price {
    align-self: start;

    margin-top: 8px;
}

.xl-package-info strong {
    font-size: 21px;
    font-weight: 650;
    line-height: 1.25;
}

.xl-package-info span {
    margin-top: 8px;

    color: #666;

    font-size: 16px;
    font-weight: 400;
    line-height: 1.45;
}


@media (max-width: 1200px) {

    .single-gun.has-xl-package .gun-photo {
        min-height: 270px;
    }

}

@media (max-width: 900px) {

    .single-gun.has-xl-package .gun-photo {
        min-height: 250px;
    }

}

@media (max-width: 520px) {

    .single-price {
        min-width: 78px;
    }

    .single-gun.has-xl-package {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: auto auto auto auto auto;
    }

    .single-gun.has-xl-package .gun-photo {
        grid-column: 1 / -1;
        grid-row: 1;

        height: clamp(190px, 58vw, 240px);
        min-height: 0;
    }

    .single-gun.has-xl-package .gun-info {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .single-gun.has-xl-package > .single-price:not(.xl-package-price) {

        justify-self: start;
    }


    .single-gun.has-xl-package .xl-package-info strong {
        font-size: 17px;
    }

    .single-gun.has-xl-package .xl-package-info span {
        font-size: 14px;
    }

    .single-gun.has-xl-package .xl-package-price {

        justify-self: start;
    }

}


/* ─────────────────────────────
   UNIFIED SINGLE-PACKAGE CARDS
───────────────────────────── */

.single-gun,
.single-gun.has-xl-package {
    height: 380px;
    min-height: 380px;

    row-gap: 8px;
    align-content: stretch;
}

.single-gun .gun-info {
    padding-top: 0;
}


.single-gun > .gun-photo,
.single-gun.has-xl-package > .gun-photo,
.single-gun-media {
    grid-column: 1;
    grid-row: 1 / 7;

    width: 100%;
    height: 100%;
    min-height: 0;
}

.single-gun > .gun-photo,
.single-gun.has-xl-package > .gun-photo {
    object-fit: contain;
    object-position: center;
    background: #f7f7f5;
}

.single-gun-media {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px;

    overflow: hidden;
}

.single-gun-media .gun-photo {
    grid-column: auto;
    grid-row: auto;

    width: 100%;
    height: 100%;
    min-height: 0;

    object-fit: contain;
    object-position: center;
    background: #f7f7f5;
}

.single-gun > .gun-photo:hover,
.single-gun-media .gun-photo:hover {
    transform: none;
}

.single-gun > .single-price:not(.xl-package-price) {
    grid-column: 2;
    grid-row: 2;

    margin-top: 0;
}

.single-gun .xl-package-info {
    grid-column: 2;
    grid-row: 3;

    margin-top: 0;
}

.single-gun .xl-package-price {
    grid-column: 2;
    grid-row: 4;
}


@media (max-width: 1200px) {

    .single-gun,
    .single-gun.has-xl-package {
        height: 380px;
        min-height: 380px;
    }

}

@media (max-width: 900px) {

    .single-gun,
    .single-gun.has-xl-package {
        height: 360px;
        min-height: 360px;
    }

}

@media (max-width: 650px) {

    .single-gun,
    .single-gun.has-xl-package {
        height: 360px;
        min-height: 360px;
    }

    .single-booking-button {
        padding-left: 20px;
        padding-right: 20px;
    }

}

@media (max-width: 520px) {

    .single-gun,
    .single-gun.has-xl-package {
        height: auto;
        min-height: 0;

        row-gap: 12px;
    }

    .single-gun > .gun-photo,
    .single-gun.has-xl-package > .gun-photo,
    .single-gun-media {

        height: 220px;
        min-height: 0;
    }

    .single-gun .gun-info {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .single-gun > .single-price:not(.xl-package-price) {
        grid-column: 1;
        grid-row: 3;
    }

    .single-gun .xl-package-info {
        grid-column: 1 / -1;
        grid-row: 4;

        margin-top: 8px;
    }

    .single-gun .xl-package-price {
        grid-column: 1;
        grid-row: 5;
    }


}

/* ─────────────────────────────
   SERVICE / GUNSMITH PAGE
   Сервизиране
───────────────────────────── */

#servizirane {
    width: 100%;
    max-width: none;

    margin: 0;
    padding: 0;

    background: #fff;
    border-bottom: 1px solid #ddd;
}

.service-page-inner {
    width: 100%;
    max-width: 1700px;

    margin: 0 auto;
    padding: 100px 40px;
}

.service-page-heading {
    max-width: 930px;
    margin-bottom: 65px;
}

.service-page-kicker {
    margin: 0 0 10px;

    color: #406e45;

    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;

    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.service-page-heading h1 {
    max-width: 920px;

    margin: 0 0 18px;

    font-size: 48px;
    font-weight: 700;
    line-height: 1.08;
}

.service-page-heading > p:last-child {
    max-width: 760px;

    margin: 0;

    color: #444;

    font-size: 19px;
    line-height: 1.6;
}

.service-page-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 28px;
}

.service-page-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    padding: 38px 42px;

    background: #f7f7f5;

    border: 1px solid #e5e5e5;

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.service-page-card:hover {
    transform: translateY(-4px);

    box-shadow:
        0 15px 40px rgba(0, 0, 0, 0.08);
}

.service-card-heading {
    display: flex;

    gap: 22px;
    align-items: flex-start;

    margin-bottom: 28px;
    padding-bottom: 22px;

    border-bottom: 2px solid #406e45;
}

.service-card-number {
    flex: 0 0 auto;

    padding-top: 3px;

    color: #406e45;

    font-size: 18px;
    font-weight: 800;
    line-height: 1.2;

    letter-spacing: 0.08em;
}

.service-card-heading h2 {
    margin: 0 0 8px;

    font-size: 27px;
    font-weight: 700;
    line-height: 1.2;
}

.service-card-heading p {
    margin: 0;

    color: #666;

    font-size: 16px;
    line-height: 1.55;
}

.service-type-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    column-gap: 28px;

    margin: 0 0 26px;
    padding: 0;

    list-style: none;
}

.service-type-list li {
    position: relative;

    min-width: 0;
    padding: 12px 0 12px 20px;

    color: #222;

    font-size: 17px;
    line-height: 1.45;

    border-bottom: 1px solid #ddd;
}

.service-type-list li::before {
    content: "";

    position: absolute;
    top: 22px;
    left: 0;

    width: 7px;
    height: 7px;

    background: #406e45;
}

.service-main-price,
.service-price-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;

    gap: 28px;
    align-items: center;

    padding: 16px 0;

    border-bottom: 1px solid #ddd;
}

.service-main-price {
    margin-top: auto;
    border-top: 1px solid #ddd;
}

.service-price-list {
    display: grid;
    margin-top: auto;
}

.service-main-price span,
.service-price-row span {
    min-width: 0;

    color: #222;

    font-size: 17px;
    line-height: 1.5;
}

.service-main-price strong,
.service-price-row strong {
    color: #406e45;

    font-size: 19px;
    font-weight: 750;

    white-space: nowrap;
}

.service-price-row:last-child {
    border-bottom: 0;
}

.service-page-contact {
    display: flex;

    justify-content: space-between;
    align-items: center;

    gap: 32px;

    margin-top: 34px;
    padding: 26px 30px;

    background: #f7f7f5;

    border: 1px solid #e5e5e5;
    border-left: 4px solid #406e45;
}

.service-page-contact p {
    max-width: 900px;

    margin: 0;

    color: #333;

    font-size: 16px;
    line-height: 1.6;
}

.service-page-contact a {
    display: inline-flex;

    flex: 0 0 auto;
    align-items: center;

    gap: 12px;

    padding: 11px 18px;

    color: #fff;
    background: #406e45;

    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;

    transition:
        background-color 0.2s ease,
        transform 0.2s ease;
}

.service-page-contact a:hover {
    background: #315936;
    transform: translateX(2px);
}

.service-page-contact a:focus-visible {
    outline: 3px solid rgba(64, 110, 69, 0.28);
    outline-offset: 4px;
}


@media (max-width: 1100px) {

    .service-page-inner {
        padding: 80px 35px;
    }

    .service-page-heading {
        margin-bottom: 52px;
    }

    .service-page-heading h1 {
        font-size: 42px;
    }

    .service-page-grid {
        grid-template-columns: 1fr;
    }

}


@media (max-width: 700px) {

    .service-page-inner {
        padding: 58px 18px;
    }

    .service-page-heading {
        margin-bottom: 38px;
    }

    .service-page-kicker {
        font-size: 13px;
    }

    .service-page-heading h1 {
        margin-bottom: 14px;

        font-size: 32px;
        line-height: 1.1;
    }

    .service-page-heading > p:last-child {
        font-size: 17px;
        line-height: 1.55;
    }

    .service-page-grid {
        gap: 24px;
    }

    .service-page-card {
        padding: 22px 16px;
    }

    .service-card-heading {
        gap: 12px;

        margin-bottom: 20px;
        padding-bottom: 17px;
    }

    .service-card-number {
        padding-top: 2px;
        font-size: 14px;
    }

    .service-card-heading h2 {
        font-size: 21px;
    }

    .service-card-heading p {
        font-size: 15px;
    }

    .service-type-list {
        grid-template-columns: 1fr;
        margin-bottom: 20px;
    }

    .service-type-list li {
        padding-top: 11px;
        padding-bottom: 11px;

        font-size: 16px;
    }

    .service-type-list li::before {
        top: 21px;
    }

    .service-main-price,
    .service-price-row {
        grid-template-columns: 1fr;

        gap: 5px;

        padding: 14px 0;
    }

    .service-main-price span,
    .service-price-row span {
        font-size: 16px;
        line-height: 1.45;
    }

    .service-main-price strong,
    .service-price-row strong {
        justify-self: start;
        font-size: 18px;
    }

    .service-page-contact {
        align-items: flex-start;
        flex-direction: column;

        gap: 18px;

        margin-top: 24px;
        padding: 20px 18px;
    }

    .service-page-contact a {
        width: 100%;

        justify-content: center;
    }

}


@media (max-width: 380px) {

    .service-page-inner {
        padding-left: 14px;
        padding-right: 14px;
    }

    .service-page-card {
        padding-left: 14px;
        padding-right: 14px;
    }

}


/* ─────────────────────────────
   EQUAL EXPANDED COURSE CARDS
   Keep all 5 course cards the same height when expanded.
───────────────────────────── */

/* Desktop */
@media (min-width: 1001px) and (hover: hover) {

    .course-card:hover .course-card-content,
    .course-card:focus-visible .course-card-content,
    .course-card:focus-within .course-card-content,
    .course-card--training:hover .course-card-content,
    .course-card--training:focus-visible .course-card-content,
    .course-card--training:focus-within .course-card-content {
        height: 390px;
    }

    .course-card:hover .course-card-details,
    .course-card:focus-visible .course-card-details,
    .course-card:focus-within .course-card-details,
    .course-card--training:hover .course-card-details,
    .course-card--training:focus-visible .course-card-details,
    .course-card--training:focus-within .course-card-details {
        max-height: 390px;
    }
}

/* Tablet / touch devices */
@media (max-width: 1000px), (hover: none) {

    .course-card,
    .course-card:hover,
    .course-card:focus-visible,
    .course-card:focus-within,
    .course-card--training,
    .course-card--training:hover,
    .course-card--training:focus-visible,
    .course-card--training:focus-within,
    .course-card-content,
    .course-card:hover .course-card-content,
    .course-card:focus-visible .course-card-content,
    .course-card:focus-within .course-card-content,
    .course-card--training .course-card-content,
    .course-card--training:hover .course-card-content,
    .course-card--training:focus-visible .course-card-content,
    .course-card--training:focus-within .course-card-content {
        height: 450px;
    }
}

/* Phones */
@media (max-width: 600px) {

    .course-card,
    .course-card:hover,
    .course-card:focus-visible,
    .course-card:focus-within,
    .course-card--training,
    .course-card--training:hover,
    .course-card--training:focus-visible,
    .course-card--training:focus-within,
    .course-card-content,
    .course-card:hover .course-card-content,
    .course-card:focus-visible .course-card-content,
    .course-card:focus-within .course-card-content,
    .course-card--training .course-card-content,
    .course-card--training:hover .course-card-content,
    .course-card--training:focus-visible .course-card-content,
    .course-card--training:focus-within .course-card-content {
        height: 430px;
    }
}

/* ─────────────────────────────
   TRAINING CARD — EXTENDED PRICE PANEL
   The first of the five course cards expands higher and to the right.
───────────────────────────── */

.course-card-training-details {
    min-width: 0;
}

.course-training-pricing {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;

    min-width: 0;
    margin-top: 2px;
}

.course-training-weapon {
    min-width: 0;
    padding: 13px;

    background: rgba(13, 27, 17, 0.68);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);

    -webkit-backdrop-filter: blur(10px) saturate(115%);
    backdrop-filter: blur(10px) saturate(115%);
}

.course-training-weapon h4 {
    margin: 0 0 10px;

    color: white;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.15;
}

.course-training-type + .course-training-type {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.course-training-type h5 {
    margin: 0 0 4px;

    color: white;
    font-size: 14px;
    font-weight: 750;
    line-height: 1.25;
}

.course-training-type h5 span {
    font-weight: 550;
    opacity: 0.85;
}

.course-training-note {
    margin: 0 0 8px !important;

    font-size: 12px !important;
    line-height: 1.3 !important;
    opacity: 0.82;
}

.course-training-variant {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: end;

    padding: 8px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.course-training-variant > div {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.course-training-variant strong,
.course-training-variant span,
.course-training-variant b {
    color: white;
}

.course-training-variant strong {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.22;
}

.course-training-variant > div > span:not(.course-training-size) {
    font-size: 13px;
    line-height: 1.2;
    opacity: 0.88;
}

.course-training-size {
    width: fit-content;
    margin-bottom: 2px;
    padding: 2px 6px;

    background: rgba(64, 110, 69, 0.82);
    border: 1px solid rgba(255, 255, 255, 0.14);

    font-size: 11px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: 0.02em;
}

.course-training-variant b {
    padding: 5px 8px;

    background: #406e45;

    font-size: 15px;
    font-weight: 800;
    line-height: 1.15;
    white-space: nowrap;
}

/* Tablet / touch: keep the card in the normal document flow so the full
   price list is readable without clipping. */
@media (max-width: 1000px), (hover: none) {

    .course-card--training,
    .course-card--training:hover,
    .course-card--training:focus-visible,
    .course-card--training:focus-within {
        height: auto;
        min-height: 0;
    }

    .course-card--training .course-card-content,
    .course-card--training:hover .course-card-content,
    .course-card--training:focus-visible .course-card-content,
    .course-card--training:focus-within .course-card-content {
        position: relative;
        width: 100%;
        height: auto;
        min-height: 0;
    }

    .course-card--training .course-card-details {
        max-height: none;
    }

    .course-training-pricing {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {

    .course-training-pricing {
        grid-template-columns: 1fr;
    }

    .course-training-weapon {
        padding: 14px;
    }

    .course-training-weapon h4 {
        font-size: 21px;
    }
}

@media (max-width: 420px) {

    .course-training-variant {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .course-training-variant b {
        justify-self: start;
    }
}

/* =========================================================
   TRAINING CARD — FINAL L-SHAPED DESKTOP EXPANSION

   IMPORTANT:
   - The first card keeps its ORIGINAL width.
   - Its LEFT part grows UPWARD to the SAME height as the other cards.
   - The detailed pricing opens in a SEPARATE panel TO THE RIGHT.
   - The right panel is bottom-aligned, so the whole shape is an "L",
     NOT one large rectangle.
   ========================================================= */
@media (min-width: 1001px) and (hover: hover) {

    .course-card--training:hover,
    .course-card--training:focus-visible,
    .course-card--training:focus-within {
        z-index: 50;
    }

    /* LEFT / VERTICAL LEG OF THE L
       Same width and same expanded height (365px) as the other four cards. */
    .course-card--training:hover .course-card-content,
    .course-card--training:focus-visible .course-card-content,
    .course-card--training:focus-within .course-card-content {
        width: 100%;
        height: 365px;
        padding: 18px;
        overflow: visible;

        background: rgba(12, 20, 14, 0.80);
        box-shadow:
            0 -24px 48px rgba(0, 0, 0, 0.36),
            inset 0 1px 0 rgba(255, 255, 255, 0.14);
    }

    /* Keep the photograph/background only inside the tall LEFT leg. */
    .course-card--training:hover .course-card-content::after,
    .course-card--training:focus-visible .course-card-content::after,
    .course-card--training:focus-within .course-card-content::after {
        inset: 0;
        width: 100%;
        height: 100%;
    }

    .course-card--training:hover .course-card-details,
    .course-card--training:focus-visible .course-card-details,
    .course-card--training:focus-within .course-card-details {
        max-height: 400px;
        overflow: visible;
    }

    /* Make the right panel position relative to .course-card-content,
       not relative to the details text box. */
    .course-card--training:hover .course-card-training-details,
    .course-card--training:focus-visible .course-card-training-details,
    .course-card--training:focus-within .course-card-training-details {
        position: static;
    }

    /* Description remains in the tall left leg. */
    .course-card--training .course-card-training-description {
        position: relative;
        z-index: 3;

        max-width: 100%;
        margin: 0 !important;

        font-size: 16px;
        line-height: 1.42;
    }

    /* RIGHT / HORIZONTAL LEG OF THE L
       A completely separate panel, attached at the bottom-right of
       the first card. It deliberately starts lower than the top of
       the tall left leg. */
    .course-card--training .course-training-pricing {
        position: absolute;
        left: calc(100% + 1px);
        bottom: 0;
        z-index: 5;

        width: clamp(720px, 66vw, 1040px);
        min-height: 455px;
        margin: 0;
        padding: 18px;

        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px;
        align-items: stretch;

        background: rgba(54, 72, 59, 0.96);
        border: 1px solid rgba(255, 255, 255, 0.14);
        border-left: 0;
        box-shadow:
            18px 14px 38px rgba(0, 0, 0, 0.28),
            inset 0 1px 0 rgba(255, 255, 255, 0.08);

        -webkit-backdrop-filter: blur(14px) saturate(115%);
        backdrop-filter: blur(14px) saturate(115%);
    }

    .course-card--training .course-training-weapon {
        min-width: 0;
        height: 100%;
        background: rgba(13, 27, 17, 0.48);
    }
}

/* COURSE PRICE OPTIONS CLEAN V4 */
/* IPSC / IDPA / Дефанзивна стрелба: exactly two price rows. */
.course-card-price-options {
    width: 100%;

    display: flex;
    flex-direction: column;
    gap: 18px;

    margin-top: auto;
}

.course-card-price-option {
    width: 100%;

    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
}

.course-card-price-label {
    min-width: 0;

    color: white;
    font-size: 18px;
    font-weight: 750;
    line-height: 1.12;

    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
}

.course-card-price-option .course-card-price {
    margin: 0;
    justify-self: end;
}

@media (max-width: 1200px) and (min-width: 1001px) {
    .course-card-price-label {
        font-size: 16px;
    }

    .course-card-price-option {
        gap: 10px;
    }

    .course-card-price-option .course-card-price {
        min-width: 82px;
        padding-left: 10px;
        padding-right: 10px;
        font-size: 18px;
    }
}


/* ─────────────────────────────
   COURSE TRAINING PRICE PANEL
   Remove the separator directly below "Индивидуално обучение"
───────────────────────────── */
.course-training-type h5 + .course-training-variant {
    border-top: 0;
}

/* ─────────────────────────────
   SINGLE-PACKAGE PRICES — MATCH COMBINED PACKAGES
   All prices are grouped directly above the booking button.
───────────────────────────── */

.single-gun,
.single-gun.has-xl-package {
    grid-template-rows: auto auto 1fr auto auto auto;
}

/* Match the combined-package price badge. */
.single-gun .single-price {
    display: block;
    width: max-content;
    min-width: 0;

    align-self: end;
    justify-self: start;

    margin: 0;
    padding: 8px 16px;

    color: white;
    background: #406e45;

    font-size: 20px;
    font-weight: 650;
    line-height: 1.55;
    text-align: left;
    white-space: nowrap;
}

/* Standard package: price directly above booking. */
.single-gun:not(.has-xl-package) > .single-price:not(.xl-package-price) {
    grid-column: 2;
    grid-row: 5;
    margin-bottom: 12px;
}

/* XL package descriptions stay at the top. */
.single-gun.has-xl-package .gun-info {
    grid-column: 2;
    grid-row: 1;
}

.single-gun.has-xl-package .xl-package-info {
    grid-column: 2;
    grid-row: 2;
    margin-top: 18px;
}

/* Both regular and XL prices sit together above booking. */
.single-gun.has-xl-package > .single-price:not(.xl-package-price) {
    grid-column: 2;
    grid-row: 4;
    margin-bottom: 8px;
}

.single-gun.has-xl-package .xl-package-price {
    grid-column: 2;
    grid-row: 5;
    margin-bottom: 12px;
}

.single-booking-button {
    grid-column: 2;
    grid-row: 6;

    align-self: end;
    justify-self: start;

    margin-top: 0;
}

@media (max-width: 520px) {

    .single-gun,
    .single-gun.has-xl-package {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: 220px auto auto auto auto auto auto;
    }

    .single-gun > .gun-photo,
    .single-gun.has-xl-package > .gun-photo,
    .single-gun-media {
        grid-column: 1 / -1;
        grid-row: 1;
    }

    .single-gun .gun-info,
    .single-gun.has-xl-package .gun-info {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .single-gun.has-xl-package .xl-package-info {
        grid-column: 1 / -1;
        grid-row: 3;
        margin-top: 8px;
    }

    .single-gun:not(.has-xl-package) > .single-price:not(.xl-package-price) {
        grid-column: 1;
        grid-row: 5;
        margin-bottom: 0;
    }

    .single-gun.has-xl-package > .single-price:not(.xl-package-price) {
        grid-column: 1;
        grid-row: 4;
        margin-bottom: 8px;
    }

    .single-gun.has-xl-package .xl-package-price {
        grid-column: 1;
        grid-row: 5;
        margin-bottom: 0;
    }

    .single-gun .single-price {
        padding: 7px 13px;
        font-size: 18px;
    }

    .single-booking-button {
        grid-column: 1 / -1;
        grid-row: 7;

        justify-self: center;

        margin-top: 12px;
        padding-left: 30px;
        padding-right: 30px;
    }

}


/* ─────────────────────────────
   TARGETED ALIGNMENT — 4 LONG-RIFLE XL CARDS
   Grand Power Stribog / Ruger AR556 / Schmeisser AR15 / SAR AK47
   Keep the photo box full-height so its top/bottom edges line up
   exactly with the title and booking button. Internal image padding
   prevents the rifle artwork from looking clipped at the bottom.
───────────────────────────── */

@media (min-width: 521px) {


    /* Title starts on the same horizontal line as the photo box. */

    /* Booking button ends on the same horizontal line as the photo box. */

}

@media (max-width: 520px) {


    .single-gun.single-gun--long-rifle-align .gun-info {
        padding-top: 0;
    }

    .single-gun.single-gun--long-rifle-align .single-booking-button {
        margin-bottom: 0;
    }

}


/* ─────────────────────────────
   FINAL FIX — 4 LONG-RIFLE XL SINGLE PACKAGES
   Root cause: after moving prices above the booking button, these cards gained
   extra grid rows, but the photo still did not span the full card height.
   This block makes the photo span the full card so the top of the name and the
   bottom of the booking button align to the real top/bottom of the photo.
   It also adds gentle internal spacing and disables hover zoom for these 4 images
   so they no longer look clipped at the bottom.
───────────────────────────── */

@media (min-width: 521px) {

    .single-gun.single-gun--long-rifle-align > .gun-photo {



        box-sizing: border-box;


    }


    .single-gun.single-gun--long-rifle-align .gun-info {
        margin-top: 0;
    }

    .single-gun.single-gun--long-rifle-align .single-booking-button {
        margin-top: 0;
        margin-bottom: 0;
    }

}

@media (max-width: 520px) {

    .single-gun.single-gun--long-rifle-align > .gun-photo {
        grid-row: 1;
        width: 100%;
        height: 220px;
        min-height: 220px;

        box-sizing: border-box;
        padding: 10px 0 14px;

        object-fit: contain;
        object-position: center center;

        background: #f7f7f5;
        transform: none;
    }

    .single-gun.single-gun--long-rifle-align > .gun-photo:hover {
        transform: none;
        opacity: 1;
    }

}


/* ─────────────────────────────
   V8 FINAL — 4 LONG-RIFLE XL CARDS
   Keep the existing 380px card/photo height, but compact only the vertical
   spacing in these four XL cards so the booking button fits completely.
   No internal image padding: the title and button align with the actual
   visible top/bottom edges of the photo.
───────────────────────────── */

@media (min-width: 521px) {

    .single-gun.single-gun--long-rifle-align {
        height: 380px;
        min-height: 380px;
        grid-template-rows: auto auto 1fr auto auto auto;
        row-gap: 4px;
        align-content: stretch;
    }

    .single-gun.single-gun--long-rifle-align > .gun-photo {
        grid-column: 1;
        grid-row: 1 / 7;
        width: 100%;
        height: 100%;
        min-height: 0;
        padding: 0;
        align-self: stretch;
        justify-self: stretch;
        object-fit: contain;
        object-position: center;
        background: #f7f7f5;
        transform: none;
    }

    .single-gun.single-gun--long-rifle-align > .gun-photo:hover {
        transform: none;
        opacity: 1;
    }

    .single-gun.single-gun--long-rifle-align .gun-info {
        grid-column: 2;
        grid-row: 1;
        align-self: start;
        padding-top: 0;
        margin: 0;
    }

    .single-gun.single-gun--long-rifle-align .xl-package-info {
        grid-column: 2;
        grid-row: 2;
        margin-top: 8px;
    }

    .single-gun.single-gun--long-rifle-align > .single-price:not(.xl-package-price) {
        grid-column: 2;
        grid-row: 4;
        margin-top: 0;
        margin-bottom: 4px;
    }

    .single-gun.single-gun--long-rifle-align .xl-package-price {
        grid-column: 2;
        grid-row: 5;
        margin-top: 0;
        margin-bottom: 4px;
    }

    .single-gun.single-gun--long-rifle-align .single-booking-button {
        grid-column: 2;
        grid-row: 6;
        align-self: end;
        justify-self: start;
        margin: 0;
    }

}


/* ─────────────────────────────
   HOME HERO — NO OWN WEAPON CTA
   Keeps both CTAs identical and places the white question between them.
───────────────────────────── */

.hero-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px;

    margin-top: 8px;
}

#hero .hero-actions .booking-button {
    margin-top: 0;

    font-family: inherit;
    font-size: 20px;
    font-weight: 650;
    line-height: 1.2;
}

.hero-no-gun-text {
    color: white;

    font-family: inherit;
    font-size: 20px;
    font-weight: 650;
    line-height: 1.2;
}

#hero .hero-packages-button {
    color: white;
    text-decoration: none;
}

@media (max-width: 760px) {

    .hero-actions {
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
    }

    .hero-no-gun-text {
        font-size: 18px;
    }

    #hero .hero-actions .booking-button {
        font-size: 18px;
    }

}


/* ─────────────────────────────
   HOME HERO — RIGHT-ALIGNED NO-GUN CTA GROUP
   Keep the question + second CTA together and align the whole group
   with the right edge of the hero text.
───────────────────────────── */

.hero-packages-cta {
    display: flex;
    align-items: center;
    gap: 18px;

    margin-left: auto;
}

@media (max-width: 760px) {

    .hero-packages-cta {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;

        margin-left: 0;
    }

}


/* ─────────────────────────────
   PRE-LAUNCH ACCESSIBILITY POLISH
   Does not alter the normal visual design.
───────────────────────────── */

.gallery-marquee-image:focus-visible {
    outline: 3px solid #ffffff;
    outline-offset: -6px;
}

.lightbox button:focus-visible,
.menu-toggle:focus-visible,
.booking-button:focus-visible,
.contact-link:focus-visible,
.back-to-top:focus-visible {
    outline: 3px solid currentColor;
    outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}


/* =========================================================
   SEPT 2026 REQUESTED CONTENT/LAYOUT FIXES
   - home: contacts before news
   - course phone badges in green boxes
   - remove separator lines in training pricing panel
   - single-package prices sit directly under their matching package type
   - add group-training note to IPSC / IDPA / Дефанзивна стрелба / SKEET
   ========================================================= */

/* Course registration phones: green badge, same visual language as booking buttons. */
.course-registration-phone {
    margin-top: auto;
    margin-bottom: 0;
    text-align: center;
}

.course-registration-phone .course-registration-phone-label,
.course-registration-phone a {
    color: white;
}

.course-registration-phone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    align-self: center;

    min-height: 56px;
    padding: 13px 24px;

    background: #406e45;
    border: 1px solid #406e45;
    box-shadow: 0 8px 20px rgba(24, 55, 29, 0.22);

    font-size: 20px;
    font-weight: 650;
    line-height: 1.2;
}

.course-registration-phone .course-registration-phone-label {
    font-weight: 650;
}

.course-registration-phone a {
    text-decoration: none;
    font-weight: 650;
}

.course-registration-phone a:hover,
.course-registration-phone a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 4px;
}

/* Remove the unwanted separator line above the first row in each training type. */
.course-training-type .course-training-variant:first-of-type {
    border-top: 0;
    padding-top: 4px;
}

/* Single packages: each price directly under its corresponding package type. */
.single-gun,
.single-gun.has-xl-package {
    grid-template-rows: auto auto auto 1fr auto;
}

.single-gun:not(.has-xl-package) > .single-price:not(.xl-package-price) {
    grid-column: 2;
    grid-row: 2;
    margin-top: 6px;
    margin-bottom: 12px;
}

.single-gun.has-xl-package .gun-info {
    grid-column: 2;
    grid-row: 1;
}

.single-gun.has-xl-package > .single-price:not(.xl-package-price) {
    grid-column: 2;
    grid-row: 2;
    margin-top: 6px;
    margin-bottom: 12px;
}

.single-gun.has-xl-package .xl-package-info {
    grid-column: 2;
    grid-row: 3;
    margin-top: 0;
}

.single-gun.has-xl-package .xl-package-price {
    grid-column: 2;
    grid-row: 4;
    margin-top: 6px;
    margin-bottom: 12px;
}

.single-booking-button {
    grid-column: 2;
    grid-row: 5;
    align-self: end;
    justify-self: start;
    margin-top: 0;
}

@media (max-width: 520px) {
    .single-gun,
    .single-gun.has-xl-package {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: 220px auto auto auto auto auto;
    }

    .single-gun .gun-info,
    .single-gun.has-xl-package .gun-info {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .single-gun:not(.has-xl-package) > .single-price:not(.xl-package-price) {
        grid-column: 1;
        grid-row: 3;
        margin-top: 6px;
        margin-bottom: 0;
    }

    .single-gun.has-xl-package > .single-price:not(.xl-package-price) {
        grid-column: 1;
        grid-row: 3;
        margin-top: 6px;
        margin-bottom: 8px;
    }

    .single-gun.has-xl-package .xl-package-info {
        grid-column: 1 / -1;
        grid-row: 4;
        margin-top: 0;
    }

    .single-gun.has-xl-package .xl-package-price {
        grid-column: 1;
        grid-row: 5;
        margin-top: 6px;
        margin-bottom: 0;
    }

    .single-booking-button {
        grid-column: 1 / -1;
        grid-row: 6;
        justify-self: center;
        margin-top: 12px;
        padding-left: 30px;
        padding-right: 30px;
    }
}

/* Long-rifle XL cards: keep the photo full-height while matching the new text order. */
@media (min-width: 521px) {
    .single-gun.single-gun--long-rifle-align {
        height: 380px;
        min-height: 380px;
        grid-template-rows: auto auto auto 1fr auto;
        row-gap: 4px;
        align-content: stretch;
    }

    .single-gun.single-gun--long-rifle-align > .gun-photo {
        grid-column: 1;
        grid-row: 1 / 6;
        width: 100%;
        height: 100%;
        min-height: 0;
        padding: 0;
        align-self: stretch;
        justify-self: stretch;
        object-fit: contain;
        object-position: center;
        background: #f7f7f5;
        transform: none;
    }

    .single-gun.single-gun--long-rifle-align > .gun-photo:hover {
        transform: none;
        opacity: 1;
    }

    .single-gun.single-gun--long-rifle-align .gun-info {
        grid-column: 2;
        grid-row: 1;
        align-self: start;
        padding-top: 0;
        margin: 0;
    }

    .single-gun.single-gun--long-rifle-align > .single-price:not(.xl-package-price) {
        grid-column: 2;
        grid-row: 2;
        margin-top: 6px;
        margin-bottom: 8px;
    }

    .single-gun.single-gun--long-rifle-align .xl-package-info {
        grid-column: 2;
        grid-row: 3;
        margin-top: 0;
    }

    .single-gun.single-gun--long-rifle-align .xl-package-price {
        grid-column: 2;
        grid-row: 4;
        margin-top: 6px;
        margin-bottom: 4px;
    }

    .single-gun.single-gun--long-rifle-align .single-booking-button {
        grid-column: 2;
        grid-row: 5;
        align-self: end;
        justify-self: start;
        margin: 0;
    }
}

/* IPSC / IDPA / Defensive / SKEET: show the requested group-training text inside the expanding details. */
.course-card-group-note {
    margin: 0 0 8px;
}

.course-card-group-note h4 {
    margin: 0 0 4px;
    color: white;
    font-size: 16px;
    font-weight: 750;
    line-height: 1.2;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
}

.course-card-group-note h4 span {
    font-weight: 550;
    opacity: 0.85;
}

.course-card-group-note p {
    margin: 0;
    color: rgba(255, 255, 255, 0.86);
    font-size: 12px;
    line-height: 1.3;
}

.course-card-price-option {
    padding-top: 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.course-card-group-note + .course-card-price-option {
    border-top: 0;
    padding-top: 4px;
}

@media (max-width: 700px) {
    .course-registration-phone {
        width: 100%;
        max-width: 100%;
        padding-left: 16px;
        padding-right: 16px;
        font-size: 18px;
        flex-wrap: wrap;
    }
}

/* SEPT 2026 — EXPANDING COURSE CARDS: +60PX TOTAL UPWARD */
@media (min-width: 1001px) and (hover: hover) {
    .course-card:hover .course-card-content,
    .course-card:focus-visible .course-card-content,
    .course-card:focus-within .course-card-content,
    .course-card--training:hover .course-card-content,
    .course-card--training:focus-visible .course-card-content,
    .course-card--training:focus-within .course-card-content {
        height: 450px;
    }

    .course-card:hover .course-card-details,
    .course-card:focus-visible .course-card-details,
    .course-card:focus-within .course-card-details,
    .course-card--training:hover .course-card-details,
    .course-card--training:focus-visible .course-card-details,
    .course-card--training:focus-within .course-card-details {
        max-height: 500px;
    }
}


/* =========================================================
   FINAL FIT FIX — SIMPLE EXPANDING COURSE CARDS
   Keep ALL five desktop cards at the exact same 450px expanded height.
   Compact only the inner spacing of IPSC / IDPA / Дефанзивна стрелба / SKEET
   so the last price row stays fully inside the card.
   ========================================================= */
@media (min-width: 1001px) and (hover: hover) {

    .course-card:hover .course-card-content,
    .course-card:focus-visible .course-card-content,
    .course-card:focus-within .course-card-content,
    .course-card--training:hover .course-card-content,
    .course-card--training:focus-visible .course-card-content,
    .course-card--training:focus-within .course-card-content {
        height: 450px;
    }

    .course-card:not(.course-card--training) .course-card-details {
        min-height: 0;
        margin-top: 12px;
    }

    .course-card:not(.course-card--training) .course-card-details > p {
        font-size: 17px;
        line-height: 1.38;
    }

    .course-card:not(.course-card--training) .course-card-price-options {
        gap: 8px;
        margin-top: auto;
    }

    .course-card:not(.course-card--training) .course-card-group-note {
        margin: 0 0 2px;
    }

    .course-card:not(.course-card--training) .course-card-group-note h4 {
        margin-bottom: 2px;
        font-size: 15px;
        line-height: 1.15;
    }

    .course-card:not(.course-card--training) .course-card-group-note p {
        font-size: 12px;
        line-height: 1.2;
    }

    .course-card:not(.course-card--training) .course-card-price-option {
        gap: 10px;
        padding-top: 6px;
    }

    .course-card:not(.course-card--training) .course-card-price-label {
        font-size: 17px;
        line-height: 1.05;
    }

    .course-card:not(.course-card--training) .course-card-price {
        min-width: 82px;
        margin: 0;
        padding: 6px 12px;
        font-size: 19px;
        line-height: 1.15;
    }
}

/* =========================================================
   RESPONSIVE FOOTER — TABLET / MOBILE
   Desktop footer remains unchanged above 900px.
   On narrower layouts, stack the logo above the copyright
   so neither element overlaps or gets squeezed.
   ========================================================= */
@media (max-width: 900px) {
    footer {
        min-height: 0;
        padding: 24px 20px 22px;

        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 12px;

        text-align: center;
    }

    .footer-logo {
        position: static;
        top: auto;
        left: auto;

        margin: 0;
        transform: none;
    }

    .footer-logo img {
        width: auto;
        max-width: min(190px, 70vw);
        height: 50px;
    }

    footer p {
        width: 100%;
        max-width: 520px;

        margin: 0;
        padding: 0;

        white-space: normal;
        overflow-wrap: anywhere;

        font-size: 13px;
        line-height: 1.45;
        text-align: center;
        text-wrap: balance;
    }
}

@media (max-width: 480px) {
    footer {
        padding: 20px 16px 18px;
        gap: 10px;
    }

    .footer-logo img {
        height: 44px;
        max-width: min(170px, 68vw);
    }

    footer p {
        max-width: 290px;
        font-size: 12px;
        line-height: 1.45;
    }
}


/* =========================================================
   MOBILE NAV — CENTER "БЕЗ СОБСТВЕНО ОРЪЖИЕ"
   Keep the submenu arrow fixed on the right while centering
   the label relative to the full menu row.
   ========================================================= */
@media (max-width: 900px) {
    .dropdown-submenu > .submenu-trigger {
        position: relative;
        justify-content: center;

        /* Equal side space keeps the text optically centered. */
        padding-left: 52px;
        padding-right: 52px;

        text-align: center;
    }

    .dropdown-submenu > .submenu-trigger .submenu-arrow {
        position: absolute;
        right: 20px;

        margin-left: 0;
    }
}


/* =========================================================
   MOBILE SINGLE PACKAGES — TWO-COLUMN XL LAYOUT
   - regular + XL package info side by side
   - each price directly below its own package type
   - booking button aligned left like combined packages
   ========================================================= */
@media (max-width: 520px) {

    /* Base mobile card */
    .single-gun,
    .single-gun.has-xl-package {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-rows: 220px auto auto auto;
        column-gap: 14px;
        row-gap: 10px;
        align-items: start;
    }

    /* Image always spans full width */
    .single-gun > .gun-photo,
    .single-gun.has-xl-package > .gun-photo,
    .single-gun-media {
        grid-column: 1 / -1;
        grid-row: 1;
        width: 100%;
    }

    /* Non-XL cards remain simple, left aligned */
    .single-gun:not(.has-xl-package) .gun-info {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .single-gun:not(.has-xl-package) > .single-price:not(.xl-package-price) {
        grid-column: 1;
        grid-row: 3;
        justify-self: start;
        margin: 6px 0 0;
    }

    .single-gun:not(.has-xl-package) .single-booking-button {
        grid-column: 1 / -1;
        grid-row: 4;
        justify-self: start;
        align-self: start;
        margin: 10px 0 0;
        padding-left: 30px;
        padding-right: 30px;
    }

    /* XL cards: regular package in left column */
    .single-gun.has-xl-package .gun-info {
        grid-column: 1;
        grid-row: 2;
        min-width: 0;
        margin: 0;
    }

    .single-gun.has-xl-package > .single-price:not(.xl-package-price) {
        grid-column: 1;
        grid-row: 3;
        justify-self: start;
        align-self: start;
        margin: 6px 0 0;
    }

    /* XL package in right column */
    .single-gun.has-xl-package .xl-package-info {
        grid-column: 2;
        grid-row: 2;
        min-width: 0;
        margin: 0;
    }

    .single-gun.has-xl-package .xl-package-price {
        grid-column: 2;
        grid-row: 3;
        justify-self: start;
        align-self: start;
        margin: 6px 0 0;
    }

    /* Booking button below both columns, aligned left */
    .single-gun.has-xl-package .single-booking-button {
        grid-column: 1 / -1;
        grid-row: 4;
        justify-self: start;
        align-self: start;
        margin: 12px 0 0;
        padding-left: 30px;
        padding-right: 30px;
    }

    /* Keep text readable in the two narrow columns */
    .single-gun.has-xl-package .gun-info strong,
    .single-gun.has-xl-package .xl-package-info strong {
        display: block;
        font-size: 18px;
        line-height: 1.2;
    }

    .single-gun.has-xl-package .gun-info span,
    .single-gun.has-xl-package .xl-package-info span {
        display: block;
        margin-top: 4px;
        font-size: 15px;
        line-height: 1.3;
    }

    .single-gun .single-price {
        width: max-content;
        max-width: 100%;
        padding: 7px 12px;
        font-size: 17px;
        white-space: nowrap;
    }

    /* Long-rifle XL cards must follow the same mobile grid. */
    .single-gun.single-gun--long-rifle-align {
        height: auto;
        min-height: 0;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-rows: 220px auto auto auto;
        column-gap: 14px;
        row-gap: 10px;
    }

    .single-gun.single-gun--long-rifle-align > .gun-photo {
        grid-column: 1 / -1;
        grid-row: 1;
    }

    .single-gun.single-gun--long-rifle-align .gun-info {
        grid-column: 1;
        grid-row: 2;
    }

    .single-gun.single-gun--long-rifle-align > .single-price:not(.xl-package-price) {
        grid-column: 1;
        grid-row: 3;
    }

    .single-gun.single-gun--long-rifle-align .xl-package-info {
        grid-column: 2;
        grid-row: 2;
    }

    .single-gun.single-gun--long-rifle-align .xl-package-price {
        grid-column: 2;
        grid-row: 3;
    }

    .single-gun.single-gun--long-rifle-align .single-booking-button {
        grid-column: 1 / -1;
        grid-row: 4;
        justify-self: start;
        margin-top: 12px;
    }
}


/* =========================================================
   MOBILE TRAINING SECTIONS — EQUAL WIDTH
   "Късо огнестрелно оръжие", "AR-15" and "AK-47"
   must all fill the exact same mobile container width.
   The global section rule uses auto margins, so override it here.
   ========================================================= */
@media (max-width: 700px) {
    .course-training-pricing {
        width: 100%;
        max-width: none;
        grid-template-columns: minmax(0, 1fr);
    }

    .course-training-weapon {
        width: 100%;
        max-width: none;
        min-width: 0;

        margin-left: 0;
        margin-right: 0;

        justify-self: stretch;
        box-sizing: border-box;
    }
}


/* =========================================================
   MOBILE GALLERY LIGHTBOX — VISUAL FINGER SWIPE
   The gallery marquee itself keeps its continuous animation.
   Only the opened lightbox image gets drag/slide behaviour.
   ========================================================= */
@media (max-width: 600px) {

    #galleryLightbox {
        overflow: hidden;
    }

    #galleryLightboxImage {
        will-change: transform, opacity;

        touch-action: pan-y;

        user-select: none;
        -webkit-user-select: none;
        -webkit-user-drag: none;

        transition:
            transform 0.2s ease,
            opacity 0.2s ease;
    }
}


/* =========================================================
   TABLET COURSES — 769px TO 1125px
   1) The three main course sections stack text above image.
   2) The five discipline/training cards use a clean
      1 + 2 + 2 layout:
         - training card = full width
         - IPSC / IDPA = two columns
         - Defensive / SKEET = two columns
   ========================================================= */
@media (min-width: 769px) and (max-width: 1125px) {

    /* -----------------------------------------------------
       THREE MAIN COURSE SECTIONS
       Text first, image underneath — like the phone layout.
       ----------------------------------------------------- */
    #course-hunting-right,
    #course-selective-hunting,
    #course-shooting-training {
        min-height: 0;

        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;

        gap: 30px;

        padding: 56px clamp(30px, 5vw, 60px);
    }

    #course-hunting-right .range-content,
    #course-selective-hunting .range-content,
    #course-shooting-training .range-content {
        width: 100%;
        max-width: none;
        min-height: 0;
    }

    #course-hunting-right .range-content h2,
    #course-selective-hunting .range-content h2,
    #course-shooting-training .range-content h2 {
        white-space: normal;
    }

    #course-hunting-right .course-registration-phone,
    #course-selective-hunting .course-registration-phone,
    #course-shooting-training .course-registration-phone {
        margin-top: 24px;
    }

    #course-hunting-right .range-slider,
    #course-selective-hunting .range-slider,
    #course-shooting-training .range-slider {
        width: 100%;
        height: clamp(330px, 46vw, 500px);

        flex: 0 0 auto;
    }

    #course-hunting-right .range-slider img,
    #course-selective-hunting .range-slider img,
    #course-shooting-training .range-slider img {
        width: 100%;
    }


    /* -----------------------------------------------------
       FIVE COURSE CARDS
       Force a tablet layout regardless of hover capability.
       ----------------------------------------------------- */
    .course-card-section {
        height: auto;

        padding: 36px 28px;

        overflow: visible;
    }

    .course-card-grid {
        width: 100%;
        height: auto;

        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;

        align-items: stretch;
    }

    /* First / detailed training card takes the full first row. */
    .course-card--training {
        grid-column: 1 / -1;
    }

    .course-card,
    .course-card:hover,
    .course-card:focus-visible,
    .course-card:focus-within {
        position: relative;

        height: auto;
        min-height: 420px;

        overflow: visible;
    }

    .course-card-content,
    .course-card:hover .course-card-content,
    .course-card:focus-visible .course-card-content,
    .course-card:focus-within .course-card-content {
        position: relative;
        left: auto;
        bottom: auto;

        width: 100%;
        height: 100%;
        min-height: 420px;

        overflow: hidden;

        border: 1px solid rgba(255, 255, 255, 0.16);

        box-shadow:
            0 12px 30px rgba(0, 0, 0, 0.24),
            inset 0 1px 0 rgba(255, 255, 255, 0.12);
    }

    .course-card-content::before {
        opacity: 0.92;
    }

    .course-card-details,
    .course-card:hover .course-card-details,
    .course-card:focus-visible .course-card-details,
    .course-card:focus-within .course-card-details {
        max-height: none;

        opacity: 1;
        transform: none;

        overflow: visible;
    }

    /* The large training card stays in normal flow on tablet. */
    .course-card--training,
    .course-card--training:hover,
    .course-card--training:focus-visible,
    .course-card--training:focus-within {
        height: auto;
        min-height: 0;
    }

    .course-card--training .course-card-content,
    .course-card--training:hover .course-card-content,
    .course-card--training:focus-visible .course-card-content,
    .course-card--training:focus-within .course-card-content {
        position: relative;

        width: 100%;
        height: auto;
        min-height: 0;

        padding: 20px;

        overflow: hidden;
    }

    .course-card--training .course-card-training-details,
    .course-card--training:hover .course-card-training-details,
    .course-card--training:focus-visible .course-card-training-details,
    .course-card--training:focus-within .course-card-training-details {
        position: static;
    }

    .course-card--training .course-training-pricing,
    .course-card--training:hover .course-training-pricing,
    .course-card--training:focus-visible .course-training-pricing,
    .course-card--training:focus-within .course-training-pricing {
        position: static;
        left: auto;
        bottom: auto;

        width: 100%;
        min-height: 0;

        margin-top: 18px;
        padding: 0;

        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;

        background: transparent;
        border: 0;
        box-shadow: none;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }

    .course-card--training .course-training-weapon {
        width: 100%;
        min-width: 0;
        height: auto;
    }

    /* The four smaller cards remain equal and balanced. */
    .course-card:not(.course-card--training) {
        min-height: 430px;
    }

    .course-card:not(.course-card--training) .course-card-content,
    .course-card:not(.course-card--training):hover .course-card-content,
    .course-card:not(.course-card--training):focus-visible .course-card-content,
    .course-card:not(.course-card--training):focus-within .course-card-content {
        height: 100%;
        min-height: 430px;
    }

    .course-card:not(.course-card--training) .course-card-details {
        min-height: 0;
        margin-top: 14px;
    }

    .course-card:not(.course-card--training) .course-card-price-options {
        margin-top: auto;
    }
}


/* =========================================================
   TABLET SHOOTING ZONES — 769px TO 1150px
   For all four shooting zones:
   text -> booking button -> image/video underneath.
   Phone and desktop layouts remain unchanged.
   ========================================================= */
@media (min-width: 769px) and (max-width: 1150px) {

    .zone-50-100,
    .zone-25m,
    .zone-skeet,
    .zone-moving_target {
        min-height: 0;

        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;

        gap: 30px;

        padding: 56px clamp(34px, 5vw, 64px);
    }

    .zone-50-100.has-booking-button,
    .zone-25m.has-booking-button,
    .zone-skeet.has-booking-button,
    .zone-moving_target.has-booking-button {
        min-height: 0;
        padding-bottom: 56px;
    }

    .zone-50-100 .range-content,
    .zone-25m .range-content,
    .zone-skeet .range-content,
    .zone-moving_target .range-content {
        width: 100%;
        max-width: none;
        min-height: 0;

        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    .zone-50-100 .range-content h2,
    .zone-25m .range-content h2,
    .zone-skeet .range-content h2,
    .zone-moving_target .range-content h2 {
        white-space: normal;
    }

    .zone-50-100 .range-booking-button,
    .zone-25m .range-booking-button,
    .zone-skeet .range-booking-button,
    .zone-moving_target .range-booking-button {
        align-self: flex-start;

        width: max-content;
        max-width: 100%;

        margin-top: 24px;
    }

    .zone-50-100 .range-slider,
    .zone-25m .range-slider,
    .zone-skeet .range-slider,
    .zone-moving_target .range-video {
        width: 100%;
        height: clamp(360px, 48vw, 520px);

        flex: 0 0 auto;
    }

    .zone-50-100 .range-slider img,
    .zone-25m .range-slider img,
    .zone-skeet .range-slider img {
        width: 100%;
    }

    .zone-moving_target .range-video video,
    .zone-moving_target .range-video img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}


/* =========================================================
   SHOOTING ZONES — BOOKING BUTTON ALWAYS CENTERED
   Applies on desktop, tablet and mobile.
   ========================================================= */
.zone-50-100 .range-booking-button,
.zone-25m .range-booking-button,
.zone-skeet .range-booking-button,
.zone-moving_target .range-booking-button {
    align-self: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}


/* =========================================================
   OWN-GUN ZONE BOOKING BUTTONS
   Same visual style as the site's other "Резервирай" buttons.
   Desktop: button on the right of the zone heading.
   Mobile: button centered below the heading text.
   ========================================================= */
.own-gun-prices .price-block-heading > .own-zone-booking-button {
    flex: 0 0 auto;
    align-self: center;

    margin-left: auto;

    white-space: nowrap;
}

@media (max-width: 700px) {

    .own-gun-prices .price-block-heading {
        display: grid;
        grid-template-columns: minmax(0, 1fr);

        gap: 0;
    }

    .own-gun-prices .price-block-heading > .price-number {
        display: none;
    }

    .own-gun-prices .price-block-heading > div {
        min-width: 0;
    }

    .own-gun-prices .price-block-heading > .own-zone-booking-button {
        justify-self: center;
        align-self: auto;

        width: max-content;
        max-width: 100%;

        margin: 18px auto 0;
    }
}


/* =========================================================
   BACK TO TOP — BLACK ON WHITE, INVERTED OVER CONTENT
   Keep BODY transparent so negative-z-index background
   images/pseudo-elements remain visible.
   ========================================================= */
html {
    background-color: #ffffff;
}

/* The existing mix-blend-mode:difference on .back-to-top
   now has a real white page backdrop to blend against. */
.back-to-top {
    color: #ffffff;
    background: transparent;
    mix-blend-mode: difference;
}

/* =========================================================
   LANGUAGE SWITCH + 18+ ACCESS CONFIRMATION
   ========================================================= */

nav .language-switch {
    margin-left: 24px;
    padding: 5px 11px;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 999px;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0.08em;
    transition: background-color 0.2s ease, color 0.2s ease;
}

nav .language-switch:hover,
nav .language-switch:focus-visible {
    color: #315535;
    background: #ffffff;
}

@media (min-width: 901px) and (max-width: 1180px) {
    html[lang="en"] header {
        padding-right: 24px;
        padding-left: 24px;
    }

    html[lang="en"] nav > a,
    html[lang="en"] nav > .dropdown > a,
    html[lang="en"] nav > .dropdown > .dropdown-trigger {
        font-size: 16px;
    }

    html[lang="en"] nav > a,
    html[lang="en"] nav > .dropdown,
    html[lang="en"] nav .language-switch {
        margin-left: 18px;
    }

    html[lang="en"] nav > a:first-child {
        margin-left: 0;
    }
}

body.access-gate-open {
    overflow: hidden;
}

.site-access-noscript {
    position: relative;
    z-index: 1500;
    padding: 14px 20px;
    color: #ffffff;
    background: #7b2525;
    text-align: center;
    font-size: 15px;
    font-weight: 750;
    line-height: 1.45;
}

/* Full-screen age/safety gate — matched to the supplied reference image. */
.site-access-gate {
    position: fixed;
    inset: 0;
    z-index: 10000;
    overflow-y: auto;
    background: #ffffff;
    font-family: "Sofia Sans", sans-serif;
}

.site-access-dialog {
    width: 100%;
    min-height: 100svh;
    color: #111111;
    background: #ffffff;
}

.site-access-topline {
    min-height: 72px;
    padding: 16px clamp(24px, 7.5vw, 62px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    color: #ffffff;
    background: #406e45;
}

.site-access-eyebrow,
.site-access-language {
    color: #ffffff;
    font-size: clamp(17px, 2.5vw, 24px);
    font-weight: 800;
    line-height: 1.15;
}

.site-access-eyebrow {
    letter-spacing: 0.01em;
}

.site-access-language {
    flex: 0 0 auto;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.site-access-content {
    width: min(85%, 674px);
    margin: 0 auto;
    padding: 20px 0 16px;
    text-align: center;
}

.site-access-dialog h2 {
    margin: 0;
    color: #050505;
    font-size: clamp(40px, 6.2vw, 52px);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -0.025em;
}

.site-access-intro {
    max-width: 610px;
    margin: 24px auto 28px;
    color: #5c5c5c;
    font-size: clamp(18px, 2.9vw, 22px);
    font-weight: 650;
    line-height: 1.26;
}

.site-access-checks {
    display: grid;
    gap: 16px;
    text-align: left;
}

.site-access-checks label {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 32px;
    align-items: center;
    min-height: 64px;
    padding: 14px 34px;
    color: #ffffff;
    background: #406e45;
    cursor: pointer;
}

.site-access-checks label + label {
    min-height: 148px;
}

.site-access-checks input {
    -webkit-appearance: none;
    appearance: none;
    width: 34px;
    height: 34px;
    margin: 0;
    display: grid;
    place-content: center;
    background: #ffffff;
    border: 0;
    border-radius: 0;
    cursor: pointer;
}

.site-access-checks input::before {
    content: "";
    width: 19px;
    height: 11px;
    border: solid #406e45;
    border-width: 0 0 4px 4px;
    transform: rotate(-45deg) scale(0);
    transform-origin: center;
    transition: transform 0.12s ease-in-out;
}

.site-access-checks input:checked::before {
    transform: rotate(-45deg) scale(1);
}

.site-access-checks span {
    font-size: clamp(18px, 2.7vw, 21px);
    font-weight: 750;
    line-height: 1.42;
}

.site-access-note {
    max-width: 560px;
    margin: 17px auto 0;
    color: #616161;
    font-size: clamp(15px, 2.4vw, 18px);
    font-weight: 650;
    line-height: 1.35;
    text-align: center;
}

.site-access-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    margin-top: 16px;
}

.site-access-enter {
    width: min(100%, 388px);
    min-height: 76px;
    padding: 12px 22px;
    color: #ffffff;
    font: inherit;
    font-size: clamp(20px, 3vw, 24px);
    font-weight: 800;
    line-height: 1.15;
    background: #406e45;
    border: 0;
    border-radius: 0;
    cursor: pointer;
    transition: background-color 0.2s ease, opacity 0.2s ease;
}

.site-access-enter:hover:not(:disabled),
.site-access-enter:focus-visible:not(:disabled) {
    background: #315535;
}

.site-access-enter:disabled {
    opacity: 1;
    cursor: not-allowed;
}

.site-access-enter:disabled::after {
    content: "";
}

.site-access-leave {
    color: #406e45;
    font-size: clamp(15px, 2.3vw, 18px);
    font-weight: 750;
    line-height: 1.2;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.site-access-dialog :focus-visible {
    outline: 3px solid #d1a937;
    outline-offset: 4px;
}

footer .site-safety-note {
    max-width: 720px;
    white-space: normal;
    text-align: center;
    font-size: 14px;
    line-height: 1.45;
    opacity: 0.9;
}

@media (min-width: 901px) {
    footer {
        min-height: 112px;
        flex-direction: column;
        gap: 5px;
        padding-right: 220px;
        padding-left: 220px;
    }
}

@media (max-width: 900px) {
    nav > a.language-switch {
        justify-content: flex-start;
        margin: 0;
        padding: 15px 20px;
        border-width: 1px 0 0;
        border-color: rgba(255, 255, 255, 0.12);
        border-radius: 0;
        font-size: 17px;
        letter-spacing: 0.06em;
    }
}

@media (max-width: 620px) {
    .site-access-topline {
        min-height: 64px;
        padding: 14px 20px;
    }

    .site-access-eyebrow,
    .site-access-language {
        font-size: 16px;
    }

    .site-access-content {
        width: min(90%, 674px);
        padding-top: 24px;
    }

    .site-access-dialog h2 {
        font-size: clamp(34px, 10vw, 44px);
    }

    .site-access-intro {
        margin: 18px auto 22px;
        font-size: 17px;
    }

    .site-access-checks {
        gap: 12px;
    }

    .site-access-checks label,
    .site-access-checks label + label {
        min-height: 0;
        grid-template-columns: 30px minmax(0, 1fr);
        gap: 18px;
        padding: 14px 18px;
    }

    .site-access-checks input {
        width: 28px;
        height: 28px;
    }

    .site-access-checks input::before {
        width: 16px;
        height: 9px;
        border-width: 0 0 3px 3px;
    }

    .site-access-checks span {
        font-size: 16px;
        line-height: 1.4;
    }

    .site-access-note {
        margin-top: 15px;
        font-size: 14px;
    }

    .site-access-actions {
        margin-top: 16px;
    }

    .site-access-enter {
        min-height: 62px;
        font-size: 20px;
    }

    .site-access-leave {
        font-size: 15px;
    }
}

@media (prefers-reduced-motion: reduce) {
    nav .language-switch,
    .site-access-enter,
    .site-access-checks input::before {
        transition: none;
    }
}


/* Privacy, error, and footer utility styles */
.footer-legal-links a {
    color: #fff;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}

footer .footer-legal-links {
    white-space: normal;
    font-size: 13px;
}

.legal-page {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    color: #222;
    background: #f5f5f2;
}

.legal-page .legal-header {
    position: relative;
    min-height: 92px;
}

.legal-page .legal-nav {
    display: flex;
    align-items: center;
    gap: 12px;
}

.legal-page .legal-nav a {
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

.legal-page .legal-nav a:hover,
.legal-page .legal-nav a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.legal-page .legal-main {
    width: min(920px, calc(100% - 40px));
    flex: 1;
    margin: 0 auto;
    padding: 64px 0 80px;
}

.legal-page .legal-card {
    padding: clamp(28px, 5vw, 58px);
    border: 1px solid #ddd;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.08);
}

.legal-page .legal-eyebrow {
    margin-bottom: 10px;
    color: #406e45;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.legal-page h1 {
    margin-bottom: 12px;
    color: #315535;
    font-size: clamp(34px, 6vw, 54px);
    line-height: 1.05;
}

.legal-page .legal-updated {
    margin-bottom: 36px;
    color: #666;
}

.legal-page .legal-section,
.not-found-page .not-found-grid section {
    max-width: none;
    margin: 0;
    padding: 0;
    border: 0;
}

.legal-page .legal-section + .legal-section {
    margin-top: 32px;
}

.legal-page .legal-section h2 {
    margin-bottom: 10px;
    color: #315535;
    font-size: 25px;
}

.legal-page .legal-section p,
.legal-page .legal-section li {
    line-height: 1.7;
}

.legal-page .legal-section p + p,
.legal-page .legal-section ul {
    margin-top: 10px;
}

.legal-page .legal-section ul {
    padding-left: 22px;
}

.legal-page .legal-section a,
.not-found-actions a {
    color: #315535;
    font-weight: 700;
    text-underline-offset: 3px;
}

.not-found-page .legal-main {
    display: grid;
    place-items: center;
}

.not-found-page .legal-card {
    text-align: center;
}

.not-found-page .error-code {
    margin: 0;
    color: #406e45;
    font-size: clamp(72px, 18vw, 150px);
    font-weight: 900;
    line-height: 0.9;
}

.not-found-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px;
    margin-top: 34px;
    text-align: left;
}

.not-found-grid h2 {
    margin-bottom: 8px;
    color: #315535;
}

.not-found-grid p {
    line-height: 1.6;
}

.not-found-actions {
    margin-top: 12px;
}

@media (max-width: 900px) {
    #hero {
        background-image:
            linear-gradient(rgba(0, 0, 0, 0.52), rgba(0, 0, 0, 0.52)),
            url("images/diana_1-960.webp");
    }

    .map-consent {
        min-height: 400px;
        padding: 20px;
    }

    .legal-page .legal-header {
        min-height: 82px;
        padding: 12px 20px;
        display: flex;
        align-items: center;
    }

    .legal-page .legal-header .logo {
        position: static;
        transform: none;
    }

    .legal-page .legal-nav {
        position: static;
        width: auto;
        height: auto;
        margin-left: auto;
        padding: 0;
        flex-direction: row;
        max-height: none;
        overflow: visible;
        background: transparent;
        transform: none;
        visibility: visible;
        opacity: 1;
    }

    .legal-page .legal-nav a,
    .legal-page .legal-nav a.language-switch {
        width: auto;
        margin: 0;
        padding: 8px 10px;
        border: 1px solid rgba(255, 255, 255, 0.45);
        border-radius: 4px;
        font-size: 14px;
    }

    .not-found-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 520px) {
    .map-consent {
        min-height: 300px;
        padding: 14px;
    }

    .map-consent-content {
        padding: 22px 18px;
    }

    .map-consent-content h3 {
        font-size: 22px;
    }

    .legal-page .legal-main {
        width: min(100% - 24px, 920px);
        padding: 30px 0 50px;
    }

    .legal-page .legal-card {
        padding: 24px 20px;
    }

    .legal-page .legal-header .logo img {
        max-width: 120px;
        height: auto;
    }
}

@media (min-width: 901px) {
    #hero {
        background-image:
            linear-gradient(rgba(0, 0, 0, 0.52), rgba(0, 0, 0, 0.52)),
            url("images/diana_1.webp");
    }
}


/* =========================================================
   IMAGE-BACKED PACKAGE CARDS
   The text panels use each card's own image as a blurred,
   darkened background instead of the previous white panel.
   ========================================================= */

.package,
.single-gun {
    --package-bg: none;

    position: relative;
    isolation: isolate;

    color: white;
    background: #17231b;
}

.package::before,
.single-gun::before {
    content: "";

    position: absolute;
    inset: -24px;
    z-index: 0;

    background-image: var(--package-bg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;

    filter: blur(16px);
    opacity: 0.82;
    transform: scale(1.06);
}

.package::after,
.single-gun::after {
    content: "";

    position: absolute;
    inset: 0;
    z-index: 0;

    background: rgba(0, 0, 0, 0.62);
}

.package > *,
.single-gun > * {
    position: relative;
    z-index: 1;
}

.package-text,
.gun-info,
.xl-package-info {
    color: white;
}

.package-text h2,
.package-text p,
.gun-info strong,
.gun-info span,
.xl-package-info strong,
.xl-package-info span {
    color: white;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.72);
}

.package-image--contain img,
.single-gun > .gun-photo,
.single-gun.has-xl-package > .gun-photo,
.single-gun-media .gun-photo {
    background: transparent;
}

.single-gun > .gun-photo,
.single-gun.has-xl-package > .gun-photo,
.single-gun-media .gun-photo {
    object-fit: cover;
    object-position: center;
}

/* Combined packages */
.package:has(.package-image img[src*="starter"]) {
    --package-bg: url("images/starter.webp");
}

.package:has(.package-image img[src*="pistolero"]) {
    --package-bg: url("images/pistolero.webp");
}

.package:has(.package-image img[src*="counter-strike"]) {
    --package-bg: url("images/counter-strike.webp");
}

.package:has(.package-image img[src*="old-classics"]) {
    --package-bg: url("images/old-classics.webp");
}

.package:has(.package-image img[src*="soviet-russia-arms"]) {
    --package-bg: url("images/soviet-russia-arms.webp");
}

.package:has(.package-image img[src*="cyber-warrior"]) {
    --package-bg: url("images/cyber-warrior.webp");
}

.package:has(.package-image img[src*="sniper"]) {
    --package-bg: url("images/sniper.webp");
}

/* Individual packages */
.single-gun:has(> .gun-photo[src*="makarov"]) {
    --package-bg: url("images/makarov.webp");
}

.single-gun:has(> .gun-photo[src*="glock17"]) {
    --package-bg: url("images/glock17.webp");
}

.single-gun:has(> .gun-photo[src*="glock19"]) {
    --package-bg: url("images/glock19.webp");
}

.single-gun:has(> .gun-photo[src*="CZ-P10"]) {
    --package-bg: url("images/CZ-P10.webp");
}

.single-gun:has(> .gun-photo[src*="Smith-Wesson-686"]) {
    --package-bg: url("images/Smith-Wesson-686.webp");
}

.single-gun:has(> .gun-photo[src*="Grand-Power-Stribog"]) {
    --package-bg: url("images/Grand-Power-Stribog.webp");
}

.single-gun:has(> .gun-photo[src*="Ruger-AR556"]) {
    --package-bg: url("images/Ruger-AR556.webp");
}

.single-gun:has(> .gun-photo[src*="Schmeisser-AR15"]) {
    --package-bg: url("images/Schmeisser-AR15.webp");
}

.single-gun:has(> .gun-photo[src*="SAR-AK47"]) {
    --package-bg: url("images/SAR-AK47.webp");
}

.single-gun:has(> .gun-photo[src*="Mossberg-500"]) {
    --package-bg: url("images/Mossberg-500.webp");
}

.single-gun:has(> .gun-photo[src*="Mossberg.webp"]) {
    --package-bg: url("images/Mossberg.webp");
}

.single-gun:has(> .gun-photo[src*="Maverick-88"]) {
    --package-bg: url("images/Maverick-88.webp");
}

.single-gun:has(> .gun-photo[src*="Bergara"]) {
    --package-bg: url("images/Bergara.webp");
}

.single-gun:has(> .gun-photo[src*="skeet.webp"]) {
    --package-bg: url("images/skeet.webp");
}