/*
 * Oceans Holiday Getaways — v5.3 full-bleed layout
 * Blade/HTML public frontend only.
 *
 * The outer website now reaches the viewport edges. Readability is preserved
 * with internal container padding rather than external page gutters.
 */

:root {
    --ohg-fullbleed-inner: clamp(1.25rem, 3.2vw, 3.75rem);
    --ohg-fullbleed-inner-wide: clamp(1.5rem, 4vw, 4.5rem);
    --ohg-fullbleed-max: 1540px;
}

/* Full-width site chrome and page surfaces — no left/right outer gap. */
.ohg-site #main-content,
.ohg-site .ohg-navbar-shell,
.ohg-site .subscribe,
.ohg-site .footer,
.ohg-site .copyright,
.ohg-topbar .container-xxl {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Navbar is flush with the viewport while retaining its polished sticky feel. */
.ohg-site .ohg-navbar-shell {
    top: 0 !important;
    margin-top: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-top: 0 !important;
    border-radius: 0 0 18px 18px !important;
    box-shadow: 0 10px 30px rgba(7, 31, 58, .10) !important;
}

.ohg-site .ohg-navbar-shell.is-scrolled {
    transform: none !important;
    box-shadow: 0 14px 36px rgba(7, 31, 58, .15) !important;
}

/* Keep navbar content readable without recreating an outer navbar gap. */
.ohg-site .ohg-navbar-shell .container-xxl,
.ohg-topbar .container-xxl {
    width: 100% !important;
    max-width: var(--ohg-fullbleed-max) !important;
    margin-inline: auto !important;
    padding-left: var(--ohg-fullbleed-inner) !important;
    padding-right: var(--ohg-fullbleed-inner) !important;
}

/* The page itself is edge-to-edge; vertical rhythm remains between sections. */
.ohg-site #main-content {
    padding: 0 !important;
}

.ohg-site #main-content > .ohg-hero,
.ohg-site #main-content > .ohg-section,
.ohg-site #main-content > .gallery,
.ohg-site #main-content > .blog,
.ohg-site #main-content > .testimonial,
.ohg-site #main-content > .contact,
.ohg-site #main-content > .ohg-workspace-page,
.ohg-site #main-content > .ohg-booking-wrap,
.ohg-site #main-content > .bg-breadcrumb,
.ohg-site #main-content > .container-fluid:not(.subscribe):not(.footer):not(.copyright) {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Hero should feel intentionally full-bleed rather than like a giant card. */
.ohg-site .ohg-hero {
    border-radius: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    box-shadow: inset 0 -1px 0 rgba(255,255,255,.08), 0 18px 45px rgba(7,31,58,.16) !important;
}

/* Content stays comfortably padded INSIDE full-width sections. */
.ohg-site #main-content .container-xxl,
.ohg-site #main-content .container,
.ohg-site .subscribe > .container,
.ohg-site .footer > .container,
.ohg-site .copyright > .container {
    width: 100% !important;
    max-width: var(--ohg-fullbleed-max) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: var(--ohg-fullbleed-inner-wide) !important;
    padding-right: var(--ohg-fullbleed-inner-wide) !important;
}

/* Keep section separation through backgrounds and subtle horizontal rules. */
.ohg-site #main-content > .ohg-section,
.ohg-site #main-content > .gallery,
.ohg-site #main-content > .blog,
.ohg-site #main-content > .testimonial,
.ohg-site #main-content > .contact {
    border-top: 1px solid rgba(7,31,58,.07) !important;
    border-bottom: 1px solid rgba(7,31,58,.07) !important;
}

/* Footer/newsletter are also true full-bleed bands. */
.ohg-site .subscribe,
.ohg-site .footer,
.ohg-site .copyright {
    border-radius: 0 !important;
}

.ohg-site .subscribe {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Secondary-page headers should join the full-width composition. */
.ohg-site .bg-breadcrumb {
    border-radius: 0 !important;
}

/* Preserve visible, useful internal spacing on smaller screens. */
@media (max-width: 1199.98px) {
    :root {
        --ohg-fullbleed-inner: clamp(1.15rem, 3vw, 2.5rem);
        --ohg-fullbleed-inner-wide: clamp(1.2rem, 3.4vw, 2.75rem);
    }
}

@media (max-width: 767.98px) {
    :root {
        --ohg-fullbleed-inner: clamp(.9rem, 4.3vw, 1.25rem);
        --ohg-fullbleed-inner-wide: clamp(.95rem, 4.6vw, 1.35rem);
    }

    .ohg-site .ohg-navbar-shell {
        border-radius: 0 0 14px 14px !important;
    }

    .ohg-site #main-content .container-xxl,
    .ohg-site #main-content .container,
    .ohg-site .subscribe > .container,
    .ohg-site .footer > .container,
    .ohg-site .copyright > .container {
        padding-left: var(--ohg-fullbleed-inner-wide) !important;
        padding-right: var(--ohg-fullbleed-inner-wide) !important;
    }
}

@media (max-width: 420px) {
    :root {
        --ohg-fullbleed-inner: .9rem;
        --ohg-fullbleed-inner-wide: 1rem;
    }

    .ohg-site .ohg-navbar-shell {
        border-radius: 0 0 12px 12px !important;
    }
}
