/*
Theme Name: Betheme Child
Theme URI: https://themes.muffingroup.com/betheme
Author: Muffin group
Author URI: https://muffingroup.com
Description: Child Theme for Betheme
Template: betheme
Version: 2.0.2
*/

/* Betheme hides the Woo header login modal inside css/woocommerce.css
   (mfn-woo). That sheet no longer loads outside real Woo views
   (client 02.09 weight cut), so reproduce the hide/show pair here —
   without it the modal rendered unstyled below the footer. */
.mfn-header-login { display: none; }
.mfn-show-login-modal .mfn-header-login { display: block; }

/* 1. Fix Header Title Cutoff (Under Navigation) */
/* Reset padding since we are re-enabling the header */
.single-post #Content {
    padding-top: 0 !important;
}

.single-post #Header_wrapper {
    padding-top: 200px !important;
    position: relative;
    padding-bottom: 30px !important;
    margin-bottom: 60px !important;
}

#Subheader {
    background-color: transparent !important;
}

.custom-nav-prev .photo,
.custom-nav-next .photo {
    background-color: #0D2B44 !important;
    background-size: cover !important;
    background-position: center;
    background-repeat: no-repeat;
    width: 100% !important;
    /* adjust as needed */
    height: 100% !important;
    /* adjust as needed */
    min-height: 80px !important;
    /* fallback minimum height */
}

/* Remove default img styles if any remain */
.custom-nav-prev .photo img,
.custom-nav-next .photo img {
    display: none;
}



/* Overlay for Header Wrapper */
#Header_wrapper::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    /* White overlay with opacity */
    backdrop-filter: grayscale(100%);
    z-index: 0;
    pointer-events: none;
    /* Allow clicks through */
}

#Header_wrapper .header_placeholder {
    position: relative;
    z-index: 1;
}

/* 2. Fix Sidebar Layout (Force Sidebar to Right) */
@media only screen and (min-width: 960px) {

    /* Only apply when sidebar is actually present */
    .single-post.has-sidebar .sections_group,
    .single-post.sidebar-right .sections_group,
    .single-post.sidebar-left .sections_group {
        width: 70% !important;
        float: left !important;
        box-sizing: border-box;
        padding-right: 20px;
    }

    .single-post.has-sidebar .sidebar,
    .single-post.sidebar-right .sidebar,
    .single-post.sidebar-left .sidebar {
        width: 30% !important;
        float: right !important;
        box-sizing: border-box;
        display: block !important;
    }
}

/* 3. Related Posts Images */
.single-post .section-post-related .image_frame {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    min-height: 150px;
    /* Ensure it takes space */
    background-color: #f0f0f0;
    /* Placeholder color */
    border-radius: 0 !important;
    /* Square corners */
    margin-left: 0;
}

/* 4. Custom Navigation Arrows */
.custom-nav-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.custom-nav-wrapper .entry-title {
    flex-grow: 1;
    padding: 0 60px;
    /* Space for arrows */
}

.custom-nav-prev,
.custom-nav-next {
    text-decoration: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    color: #333;
}

.custom-nav-prev {
    left: 0;
}

.custom-nav-next {
    right: 0;
    flex-direction: row-reverse;
    /* Arrow on right */
}

.nav-arrow {
    font-size: 30px;
    line-height: 1;
    display: flex;
    align-items: center;
}

.nav-content {
    display: flex;
    align-items: center;
    opacity: 0;
    /* Hidden by default */
    visibility: hidden;
    transition: all 0.3s ease;
    background: #fff;
    padding: 10px 15px;
    border-radius: 4px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    white-space: nowrap;
    border: 1px solid #f0f0f0;
}

.custom-nav-prev .nav-content {
    left: 100%;
    /* Show to the right of arrow */
    margin-left: 10px;
}

.custom-nav-next .nav-content {
    right: 100%;
    /* Show to the left of arrow */
    margin-right: 10px;
    flex-direction: row-reverse;
    /* Image on right for next */
}

/* Show content on hover */
.custom-nav-prev:hover .nav-content,
.custom-nav-next:hover .nav-content {
    opacity: 1;
    visibility: visible;
}

/* Navigation Photo Container */
.nav-content .photo {
    width: 80px !important;
    min-width: 80px !important;
    height: 60px;
    /* Increased height for better aspect ratio */
    background-color: #0D2B44 !important;
    /* Requested background */
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 10px;
    overflow: hidden;
}

.nav-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    border-radius: 0;
    display: block;
}

.nav-title {
    font-size: 13px;
    line-height: 1.2;
    /* Compact line height */
    color: #444;
    /* Body text color */
    max-width: 150px;
    /* Limit width */
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 5. Dropdown Styling (Categories & Tags) */
.post-meta {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 20px;
    gap: 15px;
}

.post-meta .author-date {
    display: flex;
    align-items: center;
    gap: 15px;
}

.post-meta .category {
    position: relative;
    display: inline-block;
    margin: 0;
    /* Handled by gap */
}

.post-meta .category .cat-btn {
    cursor: pointer;
    padding: 6px 15px;
    background: #f9f9f9;
    border-radius: 3px;
    display: inline-block;
    font-size: 13px;
    color: #666;
    transition: all 0.3s;
    border: 1px solid #eee;
}

.post-meta .category .cat-btn:hover {
    background: #fff;
    color: #000;
    border-color: #ddd;
}

.post-meta .category .cat-wrapper {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    /* Center dropdown */
    background: #fff;
    border: 1px solid #eee;
    padding: 15px;
    z-index: 100;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
    min-width: 220px;
    white-space: normal;
    border-radius: 4px;
    margin-top: 0px;
}

.post-meta .category:hover .cat-wrapper {
    display: block;
}

.post-meta .category .cat-wrapper ul {
    list-style: none;
    margin: 0;
    padding: 0;
    background-color: transparent !important;
}

.post-meta .category .cat-wrapper li {
    margin-bottom: 8px;
    border-bottom: 1px solid #f5f5f5;
    background-color: transparent !important;
    padding-bottom: 8px;
    text-align: left;
    /* Align text left inside dropdown */
}

.post-meta .category .cat-wrapper li:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.post-meta .category .cat-wrapper a {
    display: block;
    background-color: transparent !important;
    color: #666;
    text-decoration: none;
    transition: color 0.2s;
    font-size: 13px;
    line-height: 1.4;
}

.post-meta .category .cat-wrapper a:hover {
    color: #0D2B44 !important;
    /* Highlight text only */
}

/* 6. Related Posts Styling */

/* Flexbox for Equal Heights */
.section-post-related .section-related-ul {
    display: flex;
    flex-wrap: wrap;
}

.section-post-related .column {
    display: flex;
}

.section-post-related .column .mcb-column-inner {
    background: #fff;
    /* White background as per image */
    padding-bottom: 20px;
    border-radius: 0 !important;
    display: flex;
    flex-direction: column;
    width: 100%;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    /* Subtle shadow */
}

.section-post-related .image_wrapper {
    position: relative;
    overflow: hidden;
    margin-left: 0 !important;
}

.section-post-related .image_wrapper img {
    border-radius: 0 !important;
    width: 100%;
    height: 200px;
    /* Fixed height for images */
    object-fit: cover;
}

/* Date Badge Overlay */
.section-post-related .date_label {
    position: absolute;
    top: 20px;
    left: 0;
    background-color: #0D2B44 !important;
    /* Dark Blue */
    color: #fff;
    padding: 5px 15px;
    font-size: 12px;
    font-weight: bold;
    z-index: 10;
    /* Triangle effect on right */
    clip-path: polygon(0 0, 100% 0, 90% 50%, 100% 100%, 0 100%);
    padding-right: 20px;
    /* Extra padding for the cut */
}

/* Description Area */
.section-post-related .desc {
    padding: 20px;
    flex-grow: 1;
    font-size: 14px !important;
    line-height: 1.2 !important;
    display: flex;
    flex-direction: column;
    align-items: center;

    /* Center everything */
    text-align: center;
}

/* Author */
.post-author-related {
    color: #999;
    font-size: 14px;
    margin-bottom: 10px;
}

/* Title */
.section-post-related .desc h4 {
    margin-bottom: 20px;
    font-weight: bold;
    font-size: 18px;
    line-height: 1.3;
}

.section-post-related .desc h4 a {
    color: #0D2B44;
    /* Dark Blue */
    text-decoration: none;
}

.section-post-related .desc h4 a:hover {
    color: #0D2B44;
}

.wp-caption-text {
    background-color: #0D2B44 !important;
    color: #fff !important;
    padding-top: 30px !important;
    padding-bottom: 15px !important;
    margin-top: -20px !important;
}

/* Button */
.section-post-related .button {
    margin-top: auto;
    /* Push to bottom */
    padding: 10px 25px !important;
    font-size: 14px !important;
    line-height: 14px !important;
    background-color: #fff !important;
    color: #555 !important;
    border: 1px solid #ddd !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transition: all 0.3s;
}

.section-post-related .button:hover {
    background-color: #f5f5f5 !important;
    border-color: #ccc !important;
    color: #333 !important;
}

.section-post-related .button .button_icon {
    display: none;
}

.section-related-adjustment {
    border-top: none !important;
}

/* Fixed navigation styling - image cover and text adjustments */
.fixed-nav .photo {
    position: relative;
    overflow: hidden;
    width: 80px;
    height: 100%;
    min-height: 80px;
    /* ensure some height */
    background-color: transparent !important;
    /* override theme's #eee */
}

.fixed-nav .photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}

/* Override theme's default hidden description */
.fixed-nav .desc {
    width: auto !important;
    /* allow wider block */
    max-width: none !important;
    min-width: 200px;
    /* wider block */
    margin: 0 !important;
    /* remove negative margins that hide the desc */
    opacity: 0 !important;
    /* Hidden by default */
    visibility: hidden !important;
    /* Hidden by default */
    transition: all 0.3s ease-in-out;
    /* Smooth transition */
    position: static !important;
    /* override any absolute positioning */
    float: none !important;
    display: block !important;
    background: #fff !important;
    /* keep background */
    padding: 6px 15px !important;
    /* keep original padding */
    min-height: 68px !important;
    z-index: 91 !important;
}

.fixed-nav .desc h6 {
    font-size: 14px !important;
    /* slightly smaller font */
    line-height: 1.2 !important;
    margin-bottom: 5px;
    font-weight: normal;
}

.fixed-nav .desc .date {
    font-size: 11px;
    line-height: 1.1;
    display: inline-block;
    width: 100%;
    padding-top: 3px;
    border-top: 1px solid #eee;
}

/* Ensure fixed-nav container has proper layout */
.fixed-nav {
    display: flex !important;
    align-items: center !important;
    position: fixed !important;
    bottom: 70px !important;
    height: 80px !important;
    z-index: 90 !important;
}

.fixed-nav.fixed-nav-prev {
    flex-direction: row !important;
    left: 0 !important;
    right: auto !important;
}

.fixed-nav.fixed-nav-next {
    flex-direction: row-reverse !important;
    right: 0 !important;
    left: auto !important;
}

/* Override theme's hover effects that change margins */
.fixed-nav-prev:hover .desc,
.fixed-nav-next:hover .desc {
    margin: 0 !important;
    opacity: 1 !important;
    /* Show on hover */
    visibility: visible !important;
    /* Show on hover */
}

/* Override theme's float and margin for arrow, photo, desc */
.fixed-nav-prev .arrow,
.fixed-nav-prev .photo,
.fixed-nav-prev .desc,
.fixed-nav-next .arrow,
.fixed-nav-next .photo,
.fixed-nav-next .desc {
    float: none !important;
    margin: 0 !important;
}

.fixed-nav-prev .desc,
.fixed-nav-next .desc {
    border: 1px solid #eee;
}

/* Override theme's responsive adjustments for photo margins */
@media only screen and (max-width: 1430px) {

    .fixed-nav-prev .photo,
    .fixed-nav-next .photo {
        margin-left: 0 !important;
        margin-right: 0 !important;
        position: relative !important;
    }

    .fixed-nav-prev:hover .photo,
    .fixed-nav-next:hover .photo {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* Ensure arrow styling */
.fixed-nav .arrow {
    display: block !important;
    width: 45px !important;
    height: 80px !important;
    font-size: 15px !important;
    position: relative !important;
    z-index: 92 !important;
    color: #fff !important;
    line-height: 80px !important;
    text-align: center !important;
    background-color: #0D2B44 !important;
    /* match theme color */
}

/* Remove border from aside widgets */
aside::after,
.widget::after {
    border: none !important;
    display: none !important;
}

/* Style Contact Form 7 Submit Button */
input.wpcf7-form-control.wpcf7-submit {
    background-color: #0D2B44 !important;
    color: #fff !important;
    border: none !important;
    padding: 20px 40px !important;
    transition: background-color 0.3s;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
}

input.wpcf7-form-control.wpcf7-submit:hover {
    background-color: #002a52 !important;
}

/* Force Menu Sidebar to Left */
body.mfn-menu-sidebar-open #Side_slide {
    right: auto !important;
    left: 0 !important;
}

body #Side_slide {
    right: auto !important;
    left: -100% !important;
}

body.mfn-menu-sidebar-open #Side_slide {
    left: 0 !important;
}

/* --- TAXONOMY PAGE STYLES --- */

/* Hide default BeTheme subheader (duplicate title + breadcrumbs) */
body.tax-sailing_area #Subheader,
body.tax-sailing_area #Header_wrapper,
body.tax-charter_type #Subheader,
body.tax-charter_type #Header_wrapper,
body.tax-yacht_builder #Subheader,
body.tax-yacht_builder #Header_wrapper,
body.tax-yacht_type #Subheader,
body.tax-yacht_type #Header_wrapper,
body.tax-yacht_tag #Subheader,
body.tax-yacht_tag #Header_wrapper {
    display: none !important;
}

/* Remove white gap above hero on taxonomy pages */
body.tax-sailing_area #Wrapper,
body.tax-sailing_area #Content,
body.tax-charter_type #Wrapper,
body.tax-charter_type #Content,
body.tax-yacht_builder #Wrapper,
body.tax-yacht_builder #Content,
body.tax-yacht_type #Wrapper,
body.tax-yacht_type #Content,
body.tax-yacht_tag #Wrapper,
body.tax-yacht_tag #Content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* Hero bleeds under transparent header */
body.tax-sailing_area .cw-yacht-hero-slider,
body.tax-charter_type .cw-yacht-hero-slider,
body.tax-yacht_builder .cw-yacht-hero-slider,
body.tax-yacht_type .cw-yacht-hero-slider,
body.tax-yacht_tag .cw-yacht-hero-slider {
    margin-top: 0;
    padding-top: 0;
    position: relative;
    z-index: 1;
    display: block;
}

/* Location dropdown styling — light, no rounded corners */
.cw-location-dropdown-wrapper {
    display: inline-flex !important;
    align-items: center !important;
    position: relative;
}

.cw-location-dropdown-wrapper select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background: rgba(255, 255, 255, 0.1);
    background-image: none !important;
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: #fff;
    padding: 10px 36px 10px 16px;
    font-size: 13px;
    font-weight: 300;
    border-radius: 0;
    cursor: pointer;
    min-width: 220px;
    letter-spacing: 0.5px;
    outline: none;
    transition: border-color 0.3s ease, background 0.3s ease;
    height: 40px;
    line-height: 20px;
    margin: 0 !important;
}

/* Kill native arrow in IE/Edge */
.cw-location-dropdown-wrapper select::-ms-expand {
    display: none;
}

/* Kill native arrow in Firefox */
.cw-location-dropdown-wrapper select:-moz-focusring {
    color: transparent;
    text-shadow: 0 0 0 #fff;
}

.cw-location-dropdown-wrapper::after {
    content: '';
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid #fff;
    pointer-events: none;
}

.cw-location-dropdown-wrapper select:hover {
    border-color: rgba(255, 255, 255, 0.7);
    background: rgba(255, 255, 255, 0.15);
}

/* When dropdown is opened/focused, browser forces white bg — so use dark text */
.cw-location-dropdown-wrapper select:focus {
    color: #333 !important;
    background: #fff !important;
    border-color: #ccc !important;
}

.cw-location-dropdown-wrapper:has(select:focus)::after {
    border-top-color: #333 !important;
}

/* Dropdown options (visible once opened) */
.cw-location-dropdown-wrapper select option {
    color: #333 !important;
    background: #fff !important;
    padding: 8px 12px;
    font-weight: 400;
}

/* Dropdown on white header: dark text + dark border */
.mcb-header-section.header-white .cw-location-dropdown-wrapper select,
.mcb-header-section:hover .cw-location-dropdown-wrapper select {
    color: #444 !important;
    border-color: rgba(68, 68, 68, 0.3) !important;
    background: rgba(0, 0, 0, 0.03) !important;
}

.mcb-header-section.header-white .cw-location-dropdown-wrapper::after,
.mcb-header-section:hover .cw-location-dropdown-wrapper::after {
    border-top-color: #444 !important;
}

/* Full-width content area — stays within theme container */
body.tax-sailing_area .cw-term-content,
body.tax-charter_type .cw-term-content,
body.tax-yacht_builder .cw-term-content,
body.tax-yacht_type .cw-term-content,
body.tax-sailing_area .cw-term-description,
body.tax-charter_type .cw-term-description,
body.tax-yacht_builder .cw-term-description,
body.tax-yacht_type .cw-term-description {
    max-width: 100%;
    width: 100%;
    /* 15px = the theme body size (client 23.09). This rule wins over
       cw-templates.css on taxonomy archives, so it must carry the same value
       or the two disagree. */
    font-size: 15px;
    line-height: 1.8;
}

/* Footer background — force navy */
#Footer,
#footer,
#Footer .footer_copy,
#footer .footer_copy,
.footer_copy,
#Footer .widgets_wrapper,
#footer .widgets_wrapper,
.footer_wrap {
    background-color: #0d2b44 !important;
}

#Footer .footer_copy .container,
#footer .footer_copy .container {
    background-color: transparent !important;
}

/* Blog sidebar sticky fix — ensure no overflow:hidden on parents */
body.blog #Content .content_wrapper,
body.archive #Content .content_wrapper,
body.page-template-page-news #Content .content_wrapper,
body.post-type-archive-product #Content .content_wrapper,
body.tax-product_cat #Content .content_wrapper,
body.tax-sailing_area #Content .content_wrapper,
body.tax-yacht_type #Content .content_wrapper,
body.tax-yacht_builder #Content .content_wrapper,
body.tax-charter_type #Content .content_wrapper,
body.tax-yacht_tag #Content .content_wrapper {
    overflow: visible !important;
}

/* Also ensure #Content itself doesn't clip sticky */
body.post-type-archive-product #Content,
body.tax-sailing_area #Content,
body.tax-yacht_type #Content,
body.tax-yacht_builder #Content,
body.tax-charter_type #Content,
body.tax-yacht_tag #Content {
    overflow: visible !important;
}

/* ============================================
   CW HAMBURGER OFF-CANVAS MENU — clean styling
   ============================================ */

/* Force hide all submenus by default */
#menu-cw-hamburger.mfn-sidemenu-menu .sub-menu,
#menu-cw-hamburger .sub-menu,
.mfn-sidemenu-menu .sub-menu {
    display: none !important;
    list-style: none;
    margin: 0;
    padding: 4px 0 12px 0;
    background: transparent;          /* ← убрали серый фон */
    border-top: 1px solid #eef0f3;
}

/* Show submenu only when parent has .is-open */
#menu-cw-hamburger .menu-item-has-children.is-open > .sub-menu,
.mfn-sidemenu-menu .menu-item-has-children.is-open > .sub-menu {
    display: block !important;
    animation: cw-slide-down 0.3s ease;
}

@keyframes cw-slide-down {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Hide ALL chevrons by default */
.mfn-sidemenu-menu .outer-menu-sub {
    display: none !important;
}

/* Show chevron ONLY on items that have children */
.mfn-sidemenu-menu .menu-item-has-children > .outer-menu-sub {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 56px;
    position: absolute !important;
    right: 0;
    top: 0;
    color: #94a3b8;
    cursor: pointer;
    background: transparent;
    z-index: 5;
}

.mfn-sidemenu-menu .menu-item-has-children > .outer-menu-sub:hover {
    color: #0d2b44;
}

/* Chevron drawn with CSS borders */
.mfn-sidemenu-menu .outer-menu-sub i {
    font-size: 0 !important;
    width: 10px;
    height: 10px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 0.25s ease;
    margin-top: -4px;
}

.mfn-sidemenu-menu .menu-item-has-children.is-open > .outer-menu-sub i {
    transform: rotate(-135deg);
    margin-top: 2px;
}

.mfn-menu-wrapper {
    border: none !important;
    padding: 0 !important;
}

.mfn-sidemenu-menu > li {
    position: relative;
    border-bottom: 1px solid #e7eaee !important;
    margin: 0;
}

.mfn-sidemenu-menu > li:last-child {
    border-bottom: none !important;
}

.mfn-sidemenu-menu > li > a.mfn-menu-link {
    padding: 18px 50px 18px 0 !important;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1.8px;
    text-transform: uppercase;
    color: #0d2b44 !important;
    border: none !important;
    display: block;
    transition: color 0.2s ease;
}

.mfn-sidemenu-menu > li > a.mfn-menu-link:hover {
    color: #c9a86a !important;
    background: transparent !important;
}

.mfn-sidemenu-menu .sub-menu li {
    border: none !important;
    margin: 0;
}

.mfn-sidemenu-menu .sub-menu li a.mfn-menu-link {
    padding: 9px 20px 9px 4px !important;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.3px;
    text-transform: none;
    color: #4a5568 !important;
    border: none !important;
    display: block;
    transition: color 0.2s ease, padding-left 0.2s ease;
}

.mfn-sidemenu-menu .sub-menu li a.mfn-menu-link:hover {
    color: #0d2b44 !important;
    padding-left: 12px !important;
    background: transparent !important;
}

.mfn-sidemenu-menu .sub-menu .outer-menu-sub {
    display: none !important;
}

.mfn-sidemenu-menu .menu-item-helper,
.mfn-sidemenu-menu .menu-sub {
    display: none !important;
}


/* ============================================
   CW TOP HEADER MENU — main-menu + main-menu-right
   ============================================ */

/* Top-level items */
#menu-main-menu > li > a.mfn-menu-link,
#menu-main-menu-right > li > a.mfn-menu-link {
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 1.6px !important;
    text-transform: uppercase !important;
    padding: 14px 8px !important;
    transition: color 0.2s ease;
}

#menu-main-menu > li > a.mfn-menu-link:hover,
#menu-main-menu-right > li > a.mfn-menu-link:hover {
    color: #0d2b44 !important;
}

/* Chevron next to top-level items with children */
#menu-main-menu > li > a .menu-sub i,
#menu-main-menu-right > li > a .menu-sub i {
    font-size: 0 !important;
    display: inline-block;
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    margin-left: 3px;
    margin-top: -5px;
    vertical-align: middle;
    transition: transform 0.25s ease;
}


#menu-main-menu .sub-menu .menu-sub,
#menu-main-menu-right .sub-menu .menu-sub {
   /* display: none !important; */
}

/* Dropdown panel */
#menu-main-menu .sub-menu,
#menu-main-menu-right .sub-menu {
    background: #ffffff !important;
    border: 1px solid #eef0f3 !important;
    border-bottom: 3px solid #0d2b44 !important;
    box-shadow: 0 12px 32px rgba(13, 43, 68, 0.12) !important;
    padding: 8px 0 !important;
    min-width: 240px !important;
    border-radius: 0 !important;
}

/* Dropdown items */
#menu-main-menu .sub-menu li a.mfn-menu-link,
#menu-main-menu-right .sub-menu li a.mfn-menu-link {
    font-size: 13px !important;
    font-weight: 400 !important;
    letter-spacing: 0.3px !important;
    text-transform: none !important;
    color: #4a5568 !important;
    padding: 10px 24px !important;
    border: none !important;
    transition: color 0.2s ease, background 0.2s ease, padding-left 0.2s ease;
}

#menu-main-menu .sub-menu li a.mfn-menu-link:hover,
#menu-main-menu-right .sub-menu li a.mfn-menu-link:hover {
    color: #0d2b44 !important;
    background: #f7f8fa !important;
    
}

/* Active / current page in dropdown */
#menu-main-menu .sub-menu li.current-menu-item > a.mfn-menu-link,
#menu-main-menu-right .sub-menu li.current-menu-item > a.mfn-menu-link {
    color: #0d2b44 !important;
    font-weight: 500 !important;
}

/* Nested submenu (3rd level — Top Builders / Mediterranean / Caribbean) */
#menu-main-menu .sub-menu .sub-menu,
#menu-main-menu-right .sub-menu .sub-menu {
    border-top: 1px solid #eef0f3 !important;
    margin-left: 0 !important;
}

/* Helper spans cleanup */
#menu-main-menu .menu-item-helper,
#menu-main-menu-right .menu-item-helper {
    display: none !important;
}

/* =====================================================
   CF7 — CharterWorld Contact Forms — Strong Override
   ===================================================== */

body .wpcf7 .charterworld-contact-form,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form {
    max-width: 620px !important;
    width: 100% !important;
}

body .wpcf7 .charterworld-contact-form .row,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .row {
    margin-bottom: 20px !important;
}

body .wpcf7 .charterworld-contact-form .twelve.columns,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .twelve.columns {
    width: 100% !important;
    float: none !important;
    margin-left: 0 !important;
}

body .wpcf7 .charterworld-contact-form p,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form p {
    margin: 0 !important;
}

body .wpcf7 .charterworld-contact-form label,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form label {
    display: block !important;
    margin-bottom: 14px !important;
    margin-top: 12px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #0d2b44 !important;
    letter-spacing: 0.3px !important;
}

body .wpcf7 .charterworld-contact-form input[type="text"],
body .wpcf7 .charterworld-contact-form input[type="email"],
body .wpcf7 .charterworld-contact-form input[type="tel"],
body .wpcf7 .charterworld-contact-form select,
body .wpcf7 .charterworld-contact-form textarea,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form input[type="text"],
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form input[type="email"],
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form input[type="tel"],
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form select,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form textarea {
    width: 100% !important;
    min-height: 46px !important;
    padding: 10px 16px !important;
    border: 1px solid #d0d5dd !important;
    border-radius: 6px !important;
    background-color: #fff !important;
    color: #111 !important;
    font-size: 15px !important;
    font-family: inherit !important;
    box-sizing: border-box !important;
    transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
    outline: none !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}

body .wpcf7 .charterworld-contact-form input:focus,
body .wpcf7 .charterworld-contact-form select:focus,
body .wpcf7 .charterworld-contact-form textarea:focus,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form input:focus,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form select:focus,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form textarea:focus {
    border-color: #0d2b44 !important;
    box-shadow: 0 0 0 3px rgba(13, 43, 68, 0.1) !important;
}

body .wpcf7 .charterworld-contact-form select,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23666' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    padding-right: 40px !important;
    cursor: pointer !important;
}

body .wpcf7 .charterworld-contact-form textarea,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form textarea {
    min-height: 120px !important;
    resize: vertical !important;
}

body .wpcf7 .charterworld-contact-form .wpcf7-form-control-wrap,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .wpcf7-form-control-wrap {
    display: block !important;
}

body .wpcf7 .charterworld-contact-form .wpcf7-not-valid-tip,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .wpcf7-not-valid-tip {
    font-size: 13px !important;
    color: #dc3545 !important;
    margin-top: 5px !important;
}

body .wpcf7 .charterworld-contact-form .wpcf7-not-valid,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .wpcf7-not-valid {
    border-color: #dc3545 !important;
}

body .wpcf7 .charterworld-contact-form .wpcf7-response-output,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .wpcf7-response-output {
    margin: 20px 0 0 0 !important;
    padding: 12px 18px !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
}

body .wpcf7 .charterworld-contact-form .charterworld-consent,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .charterworld-consent {
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.55 !important;
    color: #555 !important;
}

body .wpcf7 .charterworld-contact-form .charterworld-consent .wpcf7-list-item,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .charterworld-consent .wpcf7-list-item {
    margin: 0 !important;
}

body .wpcf7 .charterworld-contact-form .charterworld-consent .wpcf7-list-item-label,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .charterworld-consent .wpcf7-list-item-label {
    display: inline !important;
}

body .wpcf7 .charterworld-contact-form .charterworld-consent input[type="checkbox"],
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .charterworld-consent input[type="checkbox"] {
    margin-right: 8px !important;
    accent-color: #0d2b44 !important;
}

body .wpcf7 .charterworld-contact-form .wpcf7-submit,
body .wpcf7 .charterworld-contact-form input[type="submit"],
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .wpcf7-submit,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form input[type="submit"] {
    min-width: 180px !important;
    padding: 14px 32px !important;
    border: 0 !important;
    border-radius: 4px !important;
    background: #0d2b44 !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: background 0.25s ease, opacity 0.25s ease !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
}

body .wpcf7 .charterworld-contact-form .wpcf7-submit:hover,
body .wpcf7 .charterworld-contact-form input[type="submit"]:hover,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .wpcf7-submit:hover,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form input[type="submit"]:hover {
    background: #1a3f5c !important;
}

body .wpcf7 .charterworld-contact-form .wpcf7-submit:disabled,
body .wpcf7 .charterworld-contact-form input[type="submit"]:disabled,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .wpcf7-submit:disabled,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form input[type="submit"]:disabled {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}

body .wpcf7 .charterworld-contact-form .wpcf7-spinner,
body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .wpcf7-spinner {
    display: inline-block !important;
    vertical-align: middle !important;
    margin-left: 12px !important;
}

.cw-term-content .carousel-container {display:none!important;} /* fixing silder in content */

@media (max-width: 768px) {
    body .wpcf7 .charterworld-contact-form,
    body .cw-enquiry-popup .wpcf7 .charterworld-contact-form {
        max-width: 100% !important;
    }

    body .wpcf7 .charterworld-contact-form .wpcf7-submit,
    body .wpcf7 .charterworld-contact-form input[type="submit"],
    body .cw-enquiry-popup .wpcf7 .charterworld-contact-form .wpcf7-submit,
    body .cw-enquiry-popup .wpcf7 .charterworld-contact-form input[type="submit"] {
        width: 100% !important;
    }
}


/* ===== Location Hero Cards (Gallery Grid Style) ===== */
.cw-location-hero-cards {
    width: 100%;
    overflow: hidden;
    padding-top: 2px;
}

.cw-hero-cards-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2px;
    margin: 0;
    padding: 0;
}

.cw-hero-card {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    text-decoration: none;
    color: #fff;
    background: #0d2b44;
}

.cw-hero-card:hover {
    text-decoration: none;
    color: #fff;
}

.cw-hero-card-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: transform 0.4s ease;
    z-index: 1;
}

.cw-hero-card:hover .cw-hero-card-bg {
    transform: scale(1.05);
}

.cw-hero-card-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.15);
    z-index: 2;
    transition: background 0.3s ease;
}

.cw-hero-card:hover .cw-hero-card-overlay {
    background: rgba(0, 0, 0, 0.3);
}

.cw-hero-card-label {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    margin: 0;
    padding: 14px 18px;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ===== Location Bottom Sections ===== */
.cw-location-bottom-sections {
    padding: 40px 0 20px;
    background: #ffffff;
}

.cw-location-bottom-block {
    margin-bottom: 40px;
}

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

/* Location content — table text left-aligned, images have horizontal margins */
.location-content-div .cw-term-content table td,
.location-content-div .cw-term-content table th {
    text-align: left;
}

.location-content-div .cw-term-content img {
    margin-left: 12px;
    margin-right: 12px;
    max-width: calc(100% - 24px);
    height: auto;
}

@media (max-width: 1200px) {
    .cw-hero-cards-container {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .cw-hero-cards-container {
        grid-template-columns: repeat(2, 1fr);
    }

    .cw-hero-card-label {
        font-size: 12px;
        padding: 10px 14px;
    }
}

@media (max-width: 576px) {
    .cw-hero-cards-container {
        grid-template-columns: 1fr;
    }

    .cw-hero-card {
        aspect-ratio: 16 / 9;
    }
}

/* Responsive: stack title and dropdown on mobile */
@media (max-width: 768px) {
    body.tax-sailing_area .cw-page-hero h1 {
        font-size: 32px !important;
    }

    .cw-location-dropdown-wrapper select {
        min-width: 160px;
        font-size: 12px;
    }
}

/* Enquiry popup — ensure it appears above the header and hero */
#cw-enquiry-popup,
body .cw-enquiry-popup {
    z-index: 2147483647 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    /* Force GPU compositor layer so it sorts above header's compositor layer */
    transform: translateZ(0);
}

#cw-enquiry-popup .cw-enquiry-popup__overlay {
    z-index: 2147483646 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: rgba(0, 0, 0, 0.6);
}

#cw-enquiry-popup .cw-enquiry-popup__dialog {
    z-index: 2147483647 !important;
    position: relative;
    background: #fff;
}

/* Popup form fields — force high stack inside dialog */
#cw-enquiry-popup .wpcf7-form-control-wrap,
#cw-enquiry-popup select,
#cw-enquiry-popup input,
#cw-enquiry-popup textarea {
    position: relative;
    z-index: 2147483647;
}

/* When the enquiry popup is open (body gets .cw-enquiry-popup-open), drop the
   header & cards below the overlay. NOTE: the old condition used
   :has(#cw-enquiry-popup:not([style*="display: none"])) — but the popup is
   hidden via CSS (display:none from a class), not inline style, so that
   selector always matched and permanently forced z-index:1 on the sticky
   yacht nav, letting sections/footer scroll over it. */
body.cw-enquiry-popup-open .mfn-header-tmpl-builder .mcb-header-section,
body.cw-enquiry-popup-open .cw-hero-card,
body.cw-enquiry-popup-open .cw-yacht-hero-slider,
body.cw-enquiry-popup-open .cw-page-hero,
body.cw-enquiry-popup-open .cw-sticky-yacht-nav {
    z-index: 1 !important;
}

/* Client 03.09: the Comment/Question textarea (rows=10, ~220px) made the
   popup taller than a laptop screen. Keep it a compact field and never let
   the dialog exceed the viewport. */
#cw-enquiry-popup textarea,
body .cw-enquiry-popup .wpcf7 textarea {
    height: 96px !important;
    min-height: 96px !important;
}

#cw-enquiry-popup .cw-enquiry-popup__dialog {
    max-height: calc(100vh - 32px);
    overflow-y: auto;
}

/* =====================================================
   Mobile header: bigger, left-aligned, readable logo.
   Transparent before scroll, white + visible on scroll.
   ===================================================== */
@media only screen and (max-width: 767px) {

    /* Drop the empty left menu wrap (its only column is hide-mobile) so the
       logo sits flush left instead of being centred by the leftover space. */
    #mfn-header-template .mcb-header-wrap:has(.column_header_menu.hide-mobile):not(:has(.column_header_burger)):not(:has(.column_plain_text)) {
        display: none !important;
    }

    /* Let the logo column use its natural width (it ships with a tiny custom width). */
    #mfn-header-template .mcb-header-wrap:has(.column_header_logo) {
        width: auto !important;
        flex: 0 1 auto !important;
        max-width: none !important;
    }
    #mfn-header-template .column_header_logo,
    #mfn-header-template .column_header_logo .mcb-column-inner,
    #mfn-header-template .column_header_logo .logo-wrapper {
        width: auto !important;
        max-width: none !important;
    }

    /* Bigger, readable logo. */
    #mfn-header-template .column_header_logo .logo-wrapper img {
        width: auto !important;
        height: 30px !important;
        max-width: 230px !important;
    }

    /* Keep the header visible on scroll (betheme slides it up via transform)
       and give it a white background so the dark logo stays readable. */
    #mfn-header-template .mcb-section {
        transform: none !important;
    }
    body.cw-header-scrolled #mfn-header-template .mcb-section {
        background: #fff !important;
        box-shadow: 0 1px 4px rgba(0, 0, 0, .08);
    }
    /* Betheme inverts the logo to white for transparent headers; once the
       header background is white the dark logo must show (no filter). */
    body.cw-header-scrolled #mfn-header-template .mcb-header-section .logo-wrapper img {
        filter: none !important;
        transition: none !important;
    }

    /* Footer columns on mobile: align left instead of center. */
    #mfn-footer-template .mcb-wrap-inner {
        justify-content: flex-start !important;
    }
    #mfn-footer-template .mcb-column-inner,
    #mfn-footer-template .mfn-footer-menu,
    #mfn-footer-template h4 {
        text-align: left !important;
    }

    /* The burger icon is white (betheme transparent-header style); on the
       white scrolled header both the icon lines and its frame must turn dark
       to stay visible. */
    body.cw-header-scrolled #mfn-header-template .mfn-header-menu-burger .icon-menu-fine {
        color: #0D2B44 !important;
    }
    body.cw-header-scrolled #mfn-header-template .mfn-header-menu-burger {
        border-color: rgba(13, 43, 68, 0.5) !important;
    }

    /* Content sections: symmetric side padding on mobile (betheme leaves only
       a right padding, which shifts content left with a big right gap). */
    #Content .section_wrapper {
        padding-left: 33px !important;
        padding-right: 33px !important;
    }

    /* Footer menu columns on mobile: space between the 2x2 rows so the
       heading underlines of different rows do not look merged. */
    #mfn-footer-template .mcb-wrap:has(.column_footer_menu) {
        margin-bottom: 30px !important;
    }
}

/* =====================================================
   Footer: the first menu item must render like the rest
   (betheme styles it as a heading), and the column h4
   headings get an underline separator.
   ===================================================== */
.mfn-footer-menu li:first-child {
    margin-bottom: 8px;
    padding-bottom: 0;
    border-bottom: 0;
}
.mfn-footer-menu li:first-child a {
    letter-spacing: normal;
    text-transform: none;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: rgba(255, 255, 255, 0.85);
}
.mfn-footer-menu li:first-child a:hover {
    color: #FFFFFF !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
}
#mfn-footer-template h4 {
    display: block;
    width: 100%;
    margin-bottom: 10px !important;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}
/* The heading column item is inline (only as wide as its text); make it span
   the footer column and draw the underline on the column itself. The line
   starts flush with the menu items below (no left inset) and ends 24px
   before the column edge so the lines of adjacent columns do not touch, and
   it is spaced 18px above the menu so it never sticks to it. */
#mfn-footer-template .mcb-wrap:has(.column_footer_menu) .column_column {
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    margin: 0 24px 18px 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
    padding-bottom: 8px;
}
#mfn-footer-template .mcb-wrap:has(.column_footer_menu) .column_column .mcb-column-inner {
    margin-bottom: 0 !important;
}
#mfn-footer-template .mcb-wrap:has(.column_footer_menu) .column_column h4 {
    border-bottom: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 6px !important;
}


/* =====================================================
   P4.1: crawlable location section nav — CSS dropdown +
   Locations Directory link block (replaces <select>).
   ===================================================== */
/* Browse accordion (2026-08-22): heading row + right-aligned toggle +
   full-width inline panel. Replaces the popup dropdowns on location and
   builder pages; column count adapts to the block width. */
.cw-browse-accordion { margin: 0 0 10px; }
.cw-browse-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* nowrap on desktop so the Browse button stays to the right of the
       heading even when the heading is long (client, 2026-08-29); the
       heading text wraps inside its own box instead. */
    flex-wrap: nowrap;
    gap: 15px;
    margin-bottom: 20px;
}
.cw-browse-head > h1, .cw-browse-head > h2,
.cw-browse-head > h3, .cw-browse-head > h4 {
    flex: 1 1 auto;
    min-width: 0;
}
.cw-browse-head .cw-browse-toggle { flex: 0 0 auto; }
@media (max-width: 768px) {
    .cw-browse-head { flex-wrap: wrap; }
}
.cw-browse-toggle {
    background: #fff;
    border: 1px solid #d8dee6;
    border-radius: 4px;
    padding: 10px 16px;
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #0D2B44;
    cursor: pointer;
    font-family: inherit;
    white-space: nowrap;
}
.cw-browse-toggle:hover { border-color: #0D2B44; background: #eef3f8; }
.cw-browse-toggle .cw-dd-caret { display: inline-block; transition: transform .2s ease; }
.cw-browse-toggle[aria-expanded="true"] .cw-dd-caret { transform: rotate(180deg); }
/* Collapsed via grid-template-rows 0fr -> 1fr (client 02.09): the panel
   links stay rendered at all times — no display:none, so crawlability and
   link discoverability are unaffected. The .inner clips, the .body carries
   the visual chrome. */
.cw-browse-panel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .35s ease;
    width: 100%;
    box-sizing: border-box;
}
.cw-browse-panel-inner {
    min-height: 0;
    overflow: hidden;
}
.cw-browse-panel-body {
    box-sizing: border-box;
    background: #fff;
    border: 1px solid #e6eaf0;
    box-shadow: 0 12px 32px rgba(13, 43, 68, .08);
    padding: 18px 24px;
    margin-bottom: 30px;
}
.cw-browse-accordion.open .cw-browse-panel { grid-template-rows: 1fr; }
.cw-browse-panel ul { list-style: none; margin: 0; padding: 0; }
.cw-browse-panel .cw-dd-list { columns: 220px; column-gap: 26px; }
/* Beat the old popup-menu 2-column rule for the location pages group. */
.cw-browse-panel .cw-dd-group--pages .cw-dd-list { columns: 220px; column-gap: 26px; }
.cw-browse-panel .cw-dd-list li { break-inside: avoid; --cw-dd: 0; }
.cw-browse-panel li.cw-dd-depth-1 { --cw-dd: 1; }
.cw-browse-panel li.cw-dd-depth-2 { --cw-dd: 2; }
.cw-browse-panel li.cw-dd-depth-3 { --cw-dd: 3; }
.cw-browse-panel li.cw-dd-depth-4 { --cw-dd: 4; }
.cw-browse-panel li.cw-dd-depth-5 { --cw-dd: 5; }
.cw-browse-panel li.cw-dd-depth-6 { --cw-dd: 6; }
.cw-browse-panel li a {
    display: block;
    padding: 7px calc(8px + var(--cw-dd) * 14px);
    color: #333;
    font-size: 13px;
    text-decoration: none;
}
.cw-browse-panel li a:hover { background: #eef3f8; color: #0D2B44; }
.cw-browse-panel li.cw-dd-depth-0 > a { font-weight: 600; color: #0D2B44; }
/* Parent entry at the top of a Browse panel (client review 28.08). */
.cw-browse-panel li.cw-dd-parent > a { font-weight: 700; color: #0D2B44; }
.cw-browse-panel li.cw-dd-active > a { color: #0D2B44; font-weight: 600; }
.cw-browse-panel .cw-dd-group--side {
    border-top: 1px solid #e6eaf0;
    margin-top: 16px;
    padding-top: 16px;
}
.cw-location-dropdown { position: relative; display: inline-block; }
.cw-location-dropdown-toggle {
    background: #fff;
    border: 1px solid #d8dee6;
    border-radius: 4px;
    padding: 10px 16px;
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #0D2B44;
    cursor: pointer;
    font-family: inherit;
}
.cw-location-dropdown-menu {
    display: none;
    position: absolute;
    right: 0;
    top: 100%;
    z-index: 9999;
    min-width: 300px;
    max-height: 70vh;
    overflow: auto;
    background: #fff;
    border: 1px solid #e6eaf0;
    box-shadow: 0 12px 32px rgba(13, 43, 68, .15);
    list-style: none;
    margin: 6px 0 0;
    padding: 8px 0;
}
.cw-location-dropdown.open .cw-location-dropdown-menu { display: block; }
.cw-location-dropdown-menu li { --cw-dd: 0; }
.cw-location-dropdown-menu li.cw-dd-depth-1 { --cw-dd: 1; }
.cw-location-dropdown-menu li.cw-dd-depth-2 { --cw-dd: 2; }
.cw-location-dropdown-menu li.cw-dd-depth-3 { --cw-dd: 3; }
.cw-location-dropdown-menu li.cw-dd-depth-4 { --cw-dd: 4; }
.cw-location-dropdown-menu li.cw-dd-depth-5 { --cw-dd: 5; }
.cw-location-dropdown-menu li.cw-dd-depth-6 { --cw-dd: 6; }
.cw-location-dropdown-menu li a {
    display: block;
    padding: 7px calc(16px + var(--cw-dd) * 14px);
    color: #333;
    font-size: 13px;
    text-decoration: none;
}
.cw-location-dropdown-menu li a:hover { background: #eef3f8; color: #0D2B44; }
.cw-location-dropdown-menu li.cw-dd-depth-0 a { font-weight: 600; color: #0D2B44; }
.cw-location-dropdown-menu li.cw-dd-active > a { color: #0D2B44; font-weight: 600; }

.cw-location-directory {
    background: #f5f7fa;
    border-top: 3px solid #0D2B44;
    padding: 34px 0;
}
.cw-location-directory-inner { max-width: 1200px; margin: 0 auto; padding: 0 30px; }
.cw-location-directory-title {
    font-size: 20px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #0D2B44;
    margin: 0 0 18px;
}
.cw-location-directory-list {
    list-style: none;
    margin: 0;
    padding: 0;
    columns: 4 220px;
    column-gap: 32px;
}
.cw-location-directory-list li { margin: 0 0 6px; break-inside: avoid; }
.cw-location-directory-list li a { color: #444; font-size: 13px; text-decoration: none; }
.cw-location-directory-list li a:hover { color: #0D2B44; text-decoration: underline; }
@media (max-width: 767px) {
    .cw-location-directory-list { columns: 1; }
    .cw-location-dropdown-menu { position: static; max-height: none; }
}




/* =====================================================
   P5 review: hero Browse dropdown (not clipped) + content spacing
   ===================================================== */

/* Clip the slider visuals only; the hero section itself must not clip the
   dropdown menu. The menu is lifted to position:fixed via JS so it escapes
   the overflow:hidden slider container. */

.cw-location-hero-slider { overflow: visible !important; }
.cw-location-hero-slider .cw-hero-slider-container { overflow: hidden; }

/* Multi-column layout for the location Browse dropdown (hero + content). */
.cw-location-dropdown-menu--multicolumn {
    min-width: 420px;
    max-width: 640px;
    max-height: 75vh;
    columns: 2 220px;
    column-gap: 24px;
}
.cw-location-dropdown-menu--multicolumn li { break-inside: avoid; }

/* Grouped mega-menu layout (old-site style: heading per section). */
.cw-location-dropdown-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.cw-location-dropdown-menu--grouped {
    display: none;
    gap: 26px;
    box-sizing: border-box;
    width: min(96vw, 980px);
    max-width: 980px;
    min-width: 0;
    padding: 18px 24px;
}
.cw-location-dropdown.open .cw-location-dropdown-menu--grouped {
    display: flex;
}
.cw-dd-group { min-width: 0; }
.cw-dd-group--pages { flex: 2 1 58%; }
.cw-dd-group--pages .cw-dd-list { columns: 2 200px; column-gap: 26px; }
.cw-dd-group--pages .cw-dd-list li { break-inside: avoid; }
.cw-dd-group--side {
    flex: 1 1 42%;
   /* border-left: 1px solid #e6eaf0; */
    padding-left: 24px;
}
.cw-dd-heading {
    margin: 0 0 10px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: #0D2B44;
}
.cw-dd-heading a { color: inherit; text-decoration: none; }
.cw-dd-heading a:hover { text-decoration: underline; }
.cw-dd-heading--link { margin-top: 18px; }
.cw-dd-group--side .cw-dd-heading { padding-right: 30px; }

/* Close (×) button pinned to the menu's top-right corner. */
.cw-dd-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 32px;
    height: 32px;
    padding: 0;
    border: none;
    border-radius: 4px;
    background: transparent;
    color: #0D2B44;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    z-index: 2;
}
.cw-dd-close:hover { background: #eef3f8; color: #000; }

/* Builders jump-menu: single column, scrollable. */
.cw-builder-dropdown-menu {
    min-width: 260px;
    max-width: 360px;
    max-height: 75vh;
}

/* Content no longer sticks to the hero-cards section above it. */
#cw-location-content { padding-top: 60px; }

/* Yacht-name search field matches the other sidebar fields. */
.cw-search-field input[type="text"] {
    width: 100%;
    padding: 10px 12px;
    font-size: 13px;
    color: #444;
    border: 1px solid #ddd;
    border-radius: 0;
    background: #fff;
    outline: none;
    box-sizing: border-box;
}
@media (max-width: 767px) {
    .cw-location-dropdown-menu--multicolumn {
        min-width: 0;
        max-width: calc(100vw - 32px);
        columns: 1;
    }
    .cw-location-dropdown-menu--grouped {
        flex-direction: column;
        gap: 18px;
        width: calc(100vw - 32px);
    }
    .cw-dd-group--pages .cw-dd-list { columns: 1; }
    .cw-dd-group--side {
        border-left: none;
        padding-left: 0;
        border-top: 1px solid #e6eaf0;
        padding-top: 14px;
    }
}

/* Charter Specials (legacy price_rates parity — inc/cw-specials.php) */
.yacht-special {
    margin-top: 12px;
    padding: 12px 16px;
    border: 1px solid #e3c878;
    border-left: 4px solid #c9a24b;
    background: #fdf8ec;
    max-width: 520px;
}
.yacht-special .special-description {
    display: block;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #9a7b2d;
}
.yacht-special .special-rate {
    margin-top: 4px;
    font-size: 18px;
    font-weight: 700;
    color: #0D2B44;
}
.yacht-special .special-text {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.6;
    color: #555;
}
.yacht-special .special-location {
    margin-top: 6px;
    font-size: 12px;
    letter-spacing: 0.5px;
    color: #777;
}

/* Hero variant — the special block sits on the dark hero overlay. */
.cw-yacht-hero-titleblock .yacht-special {
    display: inline-block;
    background: rgba(13, 43, 68, 0.55);
    border-color: rgba(227, 200, 120, 0.9);
    border-left-color: #e3c878;
}
.cw-yacht-hero-titleblock .yacht-special .special-description { color: #e3c878; }
.cw-yacht-hero-titleblock .yacht-special .special-rate { color: #fff; }
.cw-yacht-hero-titleblock .yacht-special .special-text { color: rgba(255, 255, 255, 0.9); }
.cw-yacht-hero-titleblock .yacht-special .special-location { color: rgba(255, 255, 255, 0.7); }

/* [cw_specials_list] grid on the specials page */
.cw-specials-grid {
    display: grid;
    gap: 24px;
    margin: 20px 0;
}
.cw-specials-grid--cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cw-specials-grid--cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cw-specials-grid--cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cw-special-card .yacht-special {
    max-width: none;
    margin: 10px 0;
}
.cw-special-card .cw-card-image {
    position: relative;
    aspect-ratio: 3/2;
    overflow: hidden;
}
.cw-special-card .cw-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
@media (max-width: 960px) {
    .cw-specials-grid--cols-3,
    .cw-specials-grid--cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .cw-specials-grid { grid-template-columns: 1fr !important; }
}