/* Custom styles for Theme V2 */

/* Anchor scrolling: offset for the sticky navbar so #hash targets aren't hidden
   under the fixed header. Applies to native #hash jumps and scrollIntoView. */
html {
    scroll-padding-top: 90px;
}

/* Fix for FontAwesome icons inside .icon containers in V2 theme */
.icon .fa,
.icon .fas,
.icon .far,
.icon .fab,
.icon .fa-solid,
.icon .fa-regular,
.icon .fa-brands {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900;
    /* Default to solid, specific classes usually override */
}

.icon .fa-regular,
.icon .far {
    font-weight: 400 !important;
}

.icon .fa-brands,
.icon .fab {
    font-family: "Font Awesome 6 Brands" !important;
    font-weight: 400 !important;
}

/* Fix for icon_box_grid to expand to full width of column when layout is 1 or 2 columns */
.icon-box {
    max-width: 100% !important;
    width: 100% !important;
}

/* Counters block image responsive fix */
.counters-image {
    width: 100%;
    height: auto;
    max-height: 600px;
    object-fit: contain;
    display: block;
    margin: 0 auto;
    border-radius: 10px;
}

/* Hero block image responsive fix */
.hero-image {
    width: 100%;
    height: auto;
    max-height: 800px;
    object-fit: cover;
    border-radius: 10px;
}

/* Navbar font size adjustments */
.rd-navbar-static .rd-navbar-nav>li>a,
.rd-navbar-fullwidth .rd-navbar-nav>li>a {
    font-size: 16px;
    /* было 13px */
}

@media (min-width: 1200px) {

    .rd-navbar-static .rd-navbar-nav>li>a,
    .rd-navbar-fullwidth .rd-navbar-nav>li>a {
        font-size: 16px;
        /* было 14px */
    }
}

/* Alternative Background */
.bg-theme-alt {
    background-color: var(--theme-bg-alt) !important;
}

/* Navbar visibility and style fixes for mobile */
.rd-navbar-fixed .rd-navbar-nav li>a {
    display: block;
    font-size: 16px;
}

/* Main menu links - Theme Green */
.rd-navbar-fixed .rd-nav-link {
    padding: 14px 56px 14px 16px;
    color: var(--theme-text) !important;
}

/* Submenu links - Theme Black with indentation */
.rd-navbar-fixed .rd-dropdown-link {
    padding: 10px 56px 10px 32px !important;
    color: var(--theme-black) !important;
}

/* ========================================
   Hero Block V2 - 3 Layout Variants
   ======================================== */

/* VARIANT 1: Background + Gradient */
.hero-variant-1 {
    padding: 80px 0;
    position: relative;
    background-size: cover;
    background-position: center right;
}

.hero-variant-1 .row {
    min-height: 500px;
}

.hero-variant-1 h1 {
    font-size: clamp(28px, 4vw, 40px);
    line-height: 1.2;
    margin-bottom: 24px;
}

.hero-variant-1 p {
    font-size: clamp(16px, 2vw, 18px);
    line-height: 1.6;
    max-width: 600px;
}

@media (min-width: 768px) {
    .hero-variant-1 {
        padding: 100px 0;
    }

    .hero-variant-1 .row {
        min-height: 550px;
    }
}

@media (min-width: 1200px) {
    .hero-variant-1 {
        padding: 120px 0;
    }

    .hero-variant-1 .row {
        min-height: 600px;
    }
}

/* VARIANT 2: Flex Columns */
.hero-variant-2 {
    padding: 60px 0;
}

.hero-variant-2 h1 {
    font-size: clamp(28px, 4vw, 40px);
    line-height: 1.2;
    margin-bottom: 24px;
}

.hero-variant-2 p {
    font-size: clamp(16px, 2vw, 18px);
    line-height: 1.6;
    margin-bottom: 32px;
}

@media (min-width: 768px) {
    .hero-variant-2 {
        padding: 80px 0;
    }
}

/* VARIANT 3: Hybrid (desktop flex, mobile background) */
.hero-variant-3 {
    padding: 60px 0;
    position: relative;
}

.hero-variant-3 .hero-bg-mobile {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    z-index: 0;
}

.hero-variant-3 .row {
    min-height: 500px;
}

.hero-variant-3 h1 {
    font-size: clamp(28px, 4vw, 40px);
    line-height: 1.2;
    margin-bottom: 24px;
}

.hero-variant-3 p {
    font-size: clamp(16px, 2vw, 18px);
    line-height: 1.6;
}

@media (min-width: 768px) {
    .hero-variant-3 {
        padding: 80px 0;
    }

    .hero-variant-3 .hero-bg-mobile {
        display: none;
        /* На десктопе background не нужен */
    }
}

/* ========================================
   Button Groups - Flex Container
   ======================================== */

.group-btn {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    align-items: center;
}

/* Ensure buttons in hero are properly styled */
.group-btn .btn {
    margin: 0 !important;
    /* Remove default margins when inside group-btn */
}

/* ========================================
   IconBoxGrid V2 — collapse (all screens)
   ======================================== */
.icon-box-grid-collapsed .icon-box-grid-extra {
    display: none;
}

/* ========================================
   Footer (.bg-nero) — link visibility fix
   link-default по умолчанию #222 → не виден на чёрном фоне.
   ======================================== */
.bg-nero .link-default,
.bg-nero .link-default:active,
.bg-nero .link-default:focus {
    color: var(--theme-white) !important;
}

.bg-nero .link-default:hover {
    color: var(--theme-primary) !important;
}

/* Recently Fixed checkmark: цвет управляется темой (colors_*.css → --theme-check-color) */


/* ============================================================
   Book Now CTA — high-conversion attention-grabbing button.
   Applied via class 'js-cta-primary' on the navbar CTA.
   ============================================================ */
.js-cta-primary {
    background-color: #ff6b00 !important;
    background-image: linear-gradient(135deg, #ff6b00 0%, #ff8c00 100%) !important;
    color: #fff !important;
    border-color: #ff6b00 !important;
    box-shadow: 0 6px 18px rgba(255, 107, 0, .35);
    font-weight: 700;
    letter-spacing: .2px;
    position: relative;
    transition: transform .12s ease, box-shadow .2s ease;
}

.js-cta-primary:hover,
.js-cta-primary:focus {
    background-color: #e85e00 !important;
    background-image: linear-gradient(135deg, #e85e00 0%, #ff7a00 100%) !important;
    color: #fff !important;
    border-color: #e85e00 !important;
    box-shadow: 0 8px 22px rgba(255, 107, 0, .45);
    transform: translateY(-1px);
}

/* Soft attention pulse — once every 4 seconds, only when not hovered. */
@keyframes cta-pulse {
    0% { box-shadow: 0 6px 18px rgba(255, 107, 0, .35), 0 0 0 0 rgba(255, 107, 0, .55); }
    60% { box-shadow: 0 6px 18px rgba(255, 107, 0, .35), 0 0 0 14px rgba(255, 107, 0, 0); }
    100% { box-shadow: 0 6px 18px rgba(255, 107, 0, .35), 0 0 0 0 rgba(255, 107, 0, 0); }
}
.js-cta-primary:not(:hover) {
    animation: cta-pulse 4.2s ease-out infinite;
}
@media (prefers-reduced-motion: reduce) {
    .js-cta-primary:not(:hover) { animation: none; }
}

/* ============================================================
   Navbar 2-row CTA banner (Save $25 — Book Now)
   - Mobile: full-width row below logo/menu line
   - Desktop: centered pill on its own row below the menu
   ============================================================ */
.rd-navbar-mobile-cta {
    /* On desktop (rd-navbar-static) we want to show this row, centered. */
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 8px 12px 12px;
    box-sizing: border-box;
}

/* Desktop CTA: pill, max-width so it doesn't span the full row.
   Force the CTA block onto its own row below the main navbar line by
   making the panel wrap and giving the CTA block a 100% width + late order. */
@media (min-width: 992px) {
    .rd-navbar-static .rd-navbar-inner {
        position: relative !important;
        padding-bottom: 54px !important; /* Make room at the bottom of the desktop navbar */
    }
    .rd-navbar-static .rd-navbar-panel {
        position: static !important; /* Allow absolute child to reference .rd-navbar-inner */
    }
    .rd-navbar-static .rd-navbar-mobile-cta {
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 8px !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        padding: 0 !important;
        margin: 0 !important;
        z-index: 10 !important;
    }
    .rd-navbar-mobile-cta .btn-mobile-cta {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 260px;
        max-width: 360px;
        height: 44px;
        padding: 0 28px;
        border-radius: 999px;
        font-size: 14px;
        font-weight: 800;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        text-decoration: none;
        border: none;
        color: #fff !important;
        background-color: #ff6b00;
        background-image: linear-gradient(135deg, #ff6b00 0%, #ff8c00 100%);
        box-shadow: 0 6px 18px rgba(255, 107, 0, .35);
        transition: transform .12s ease, box-shadow .2s ease;
    }
    .rd-navbar-mobile-cta .btn-mobile-cta:hover,
    .rd-navbar-mobile-cta .btn-mobile-cta:focus {
        background-color: #e85e00;
        background-image: linear-gradient(135deg, #e85e00 0%, #ff7a00 100%);
        transform: translateY(-1px);
        box-shadow: 0 8px 22px rgba(255, 107, 0, .45);
    }
}

@media (max-width: 991px) {
    /* Set two-row height and wrap elements */
    .rd-navbar-fixed .rd-navbar-panel {
        height: 104px !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        padding-top: 4px !important;
        padding-bottom: 6px !important;
    }

    html.rd-navbar-fixed-linked .page {
        padding-top: 104px !important;
    }

    /* Force row 1 elements to stay inside the top row (56px) */
    .rd-navbar-fixed .rd-navbar-toggle,
    .rd-navbar-fixed .rd-navbar-brand,
    .rd-navbar-fixed .rd-navbar-panel-actions {
        height: 56px !important;
        display: flex !important;
        align-items: center !important;
    }

    .rd-navbar-fixed .rd-navbar-brand {
        margin-left: 12px !important;
    }

    /* Row 2: Full-width CTA container */
    .rd-navbar-fixed .rd-navbar-mobile-cta {
        display: flex !important;
        flex: 1 0 100% !important;
        width: 100% !important;
        height: 40px !important;
        padding: 0 10px 4px 10px !important;
        box-sizing: border-box !important;
        z-index: 1001 !important;
    }

    /* Premium full-width CTA button */
    .rd-navbar-fixed .btn-mobile-cta {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        height: 100% !important;
        border-radius: 6px !important;
        font-size: 14px !important;
        font-weight: 800 !important;
        letter-spacing: 0.5px !important;
        text-transform: uppercase !important;
        text-decoration: none !important;
        border: none !important;
        color: #fff !important;
        background-color: #ff6b00 !important;
        background-image: linear-gradient(135deg, #ff6b00 0%, #ff8c00 100%) !important;
        box-shadow: 0 4px 12px rgba(255, 107, 0, .35) !important;
        transition: transform .12s ease, box-shadow .2s ease !important;
    }

    .rd-navbar-fixed .btn-mobile-cta:hover,
    .rd-navbar-fixed .btn-mobile-cta:focus,
    .rd-navbar-fixed .btn-mobile-cta:active {
        color: #fff !important;
        background-color: #e85e00 !important;
        background-image: linear-gradient(135deg, #e85e00 0%, #ff7a00 100%) !important;
        transform: translateY(-1px) !important;
    }
}

/* ============================================================
   Trust Strip (Above Header)
   - Hidden completely on mobile (< 768px) to save precious screen real estate
   - Shown on tablet and desktop (>= 768px)
   ============================================================ */
.trust-strip {
    display: none; /* Hidden on mobile by default */
    background: #1a2b49;  /* Dark Navy */
    color: rgba(255, 255, 255, 0.92);
    font-size: 13px;
    padding: 8px 0;
    text-align: center;
    letter-spacing: 0.3px;
}

.trust-strip .container {
    display: flex;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
}

.trust-strip .trust-item {
    white-space: nowrap;
}

.trust-strip .trust-item--md,
.trust-strip .trust-item--lg {
    display: none;
}

@media (min-width: 768px) {
    .trust-strip {
        display: block; /* Show on tablet and desktop */
    }
    .trust-strip .trust-item--md {
        display: inline; /* Show tablet-level trust items */
    }
}

@media (min-width: 992px) {
    .trust-strip .trust-item--lg {
        display: inline; /* Show desktop-level trust items */
    }
}