/*
 * Public site shell — LetsGoa-style layout adapted to the Dalal Counter palette.
 * Measurements mirror the reference; loaded after app.css (prebuilt Tailwind), so plain
 * selectors here win without unless a utility must be beaten.
 */

:root {
    --codearo-primary: #1935A4;
    --codearo-primary-hover: #062A60;
    --codearo-primary-soft: #EAF1FC;
    --codearo-secondary: #1698C2;
    --codearo-text: #15233B;
    --codearo-muted: #64748B;
    --codearo-line: #E1E8F2;
    --codearo-footer-bg: #062A60;

    --codearo-radius-header: 10px;
    --codearo-radius-panel: 12px;
    --codearo-radius-card: 20px;
    --codearo-radius-pill: 25px;

    --codearo-shadow-header: 0 3px 10px rgba(0, 0, 0, .1);
    --codearo-shadow-card: 0 8px 16px rgba(0, 0, 0, .15);
    --codearo-shadow-btn: 3px 3px 10px rgba(0, 0, 0, .2);

    --codearo-container: 1296px;
    --codearo-site-header-offset: 85px;

    /* Tailwind v4 reads these at runtime — swaps Lato for the LetsGoa-like face everywhere. */
    --font-sans: "Nunito", ui-sans-serif, system-ui, sans-serif;
    --font-heading: "Zain", ui-sans-serif, system-ui, sans-serif;
}

body {
    font-family: var(--font-sans);
    font-size: .95rem;
    line-height: 1.5;
    color: var(--codearo-text);
    background: #fff;
}

/* ---------- Buttons ---------- */

.codearo-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 16px;
    border: 0;
    border-radius: var(--codearo-radius-pill);
    background: var(--codearo-primary);
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    white-space: nowrap;
    text-decoration: none;
    box-shadow: var(--codearo-shadow-btn);
    cursor: pointer;
    transition: background-color .2s ease;
}
.codearo-btn:hover,
.group:hover .codearo-btn { background: var(--codearo-primary-hover); color: #fff; }
.codearo-btn:focus-visible { outline: 2px solid var(--codearo-primary); outline-offset: 3px; }

/* ---------- Header ---------- */

.codearo-header {
    position: fixed;
    top: 20px;
    left: 50%;
    z-index: 997;
    width: min(1320px, calc(100% - 40px));
    transform: translateX(-50%);
    border-radius: var(--codearo-radius-header);
    background: #fff;
    color: #000;
    box-shadow: var(--codearo-shadow-header);
}
.codearo-header-bar {
    height: 55px;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0 26px;
}
.codearo-header-brand { display: flex; align-items: center; flex-shrink: 0; height: 100%; }
.codearo-header-brand img { display: block; height: 38px; width: auto; max-width: 180px; object-fit: contain; }

.codearo-header-toggle {
    display: none;
    width: 32px;
    height: 32px;
    padding: 4px;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: #4b4b4b;
    cursor: pointer;
}
.codearo-header-toggle svg { width: 24px; height: 24px; display: block; }
.codearo-header-toggle .codearo-icon-close { display: none; }
.codearo-header.is-open .codearo-header-toggle .codearo-icon-open { display: none; }
.codearo-header.is-open .codearo-header-toggle .codearo-icon-close { display: block; }

.codearo-header-menu { flex: 1; display: flex; justify-content: center; height: 100%; }
.codearo-header-links { display: flex; align-items: center; gap: 22px; height: 100%; margin: 0; padding: 0; list-style: none; }
.codearo-header-links > li { position: relative; display: flex; align-items: center; height: 100%; }
.codearo-header-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 5.6px;
    border: 0;
    border-bottom: 3px solid transparent;
    background: none;
    color: #000;
    font: inherit;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    transition: color .2s ease;
}
.codearo-header-link:hover { color: var(--codearo-primary); }
.codearo-header-link.is-active { color: var(--codearo-primary); font-weight: 700; border-bottom-color: var(--codearo-primary); padding-bottom: 5.6px; }
.codearo-caret { width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid currentColor; }

.codearo-header-dropdown {
    position: absolute;
    top: calc(100% - 4px);
    left: 50%;
    z-index: 5;
    width: 300px;
    max-height: min(70vh, 520px);
    overflow-y: auto;
    padding: 10px 0;
    border-radius: var(--codearo-radius-header);
    background: #fff;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .14);
    opacity: 0;
    visibility: hidden;
    transform: translate(-50%, 6px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.codearo-has-dropdown:hover .codearo-header-dropdown,
.codearo-has-dropdown:focus-within .codearo-header-dropdown { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.codearo-dropdown-group { padding: 4px 0; }
.codearo-dropdown-group + .codearo-dropdown-group { border-top: 1px solid #f0f0f0; }
.codearo-dropdown-title { margin: 0; padding: 6px 20px 2px; color: var(--codearo-muted); font-size: 12px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
.codearo-dropdown-sub { margin: 0; padding: 6px 20px 0; color: #000; font-size: 14px; font-weight: 600; }
.codearo-dropdown-link { display: block; padding: 6px 20px 6px 28px; color: #222; font-size: 15px; text-decoration: none; }
.codearo-dropdown-link:hover { background: var(--codearo-primary-soft); color: var(--codearo-primary); }
.codearo-dropdown-empty { margin: 0; padding: 8px 20px; color: var(--codearo-muted); font-size: 14px; }

.codearo-header-actions { display: flex; align-items: center; gap: 24px; flex-shrink: 0; }
.codearo-header-action { color: #000; font-size: 15.2px; text-decoration: none; white-space: nowrap; }
.codearo-header-action:hover { color: var(--codearo-primary); }
.codearo-header-action-strong {
    display: inline-flex;
    align-items: center;
    height: 38px;
    padding: 0 20px;
    border-radius: var(--codearo-radius-pill);
    background: var(--codearo-primary);
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    box-shadow: var(--codearo-shadow-btn);
    transition: background-color .2s ease;
}
.codearo-header-action-strong:hover { background: var(--codearo-primary-hover); color: #fff; }

@media (max-width: 1199px) {
    .codearo-header-bar { padding: 0 16px; }
    .codearo-header-links { gap: 12px; }
    .codearo-header-link { font-size: 15px; }
    .codearo-header-actions { gap: 16px; }
}

/* Mobile: hamburger + logo + action; menu drops inside the same white card (LetsGoa pattern). */
@media (max-width: 991px) {
    .codearo-header { width: calc(100% - 39px); }
    .codearo-header-bar { flex-wrap: wrap; height: auto; column-gap: 8px; row-gap: 0; padding: 0 12px 0 16px; }
    .codearo-header-toggle { display: inline-flex; flex-shrink: 0; align-self: center; }
    .codearo-header-brand { height: 55px; }
    .codearo-header-brand img { height: 34px; max-width: 150px; }
    .codearo-header-actions { height: 55px; margin-left: auto; gap: 14px; }
    .codearo-header-actions .codearo-hide-mobile { display: none; }

    /* Full-width row under the bar, bleeding past the bar's side padding. */
    .codearo-header-menu {
        order: 10;
        flex: 0 0 calc(100% + 28px);
        margin: 0 -12px 0 -16px;
        display: none;
        height: auto;
        max-height: calc(100dvh - 100px);
        overflow-y: auto;
        padding: 4px 0 14px;
    }
    .codearo-header.is-open .codearo-header-menu { display: block; }
    .codearo-header-links { flex-direction: column; align-items: stretch; gap: 0; height: auto; }
    .codearo-header-links > li { display: block; height: auto; }
    .codearo-header-link {
        width: 100%;
        justify-content: space-between;
        padding: 10px 30px;
        border-bottom: 0;
        font-weight: 400;
    }
    .codearo-header-link.is-active { padding-bottom: 10px; border-bottom: 0; font-weight: 700; }
    .codearo-header-dropdown {
        position: static;
        width: auto;
        max-height: none;
        padding: 0 0 6px 14px;
        border-radius: 0;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        display: none;
    }
    .codearo-has-dropdown.is-open .codearo-header-dropdown { display: block; }
    .codearo-has-dropdown:hover .codearo-header-dropdown,
    .codearo-has-dropdown:focus-within .codearo-header-dropdown { transform: none; }
    .codearo-has-dropdown.is-open .codearo-caret { transform: rotate(180deg); }
}

/* ---------- Banner + overlapping panel (LetsGoa hero → white card that rides over it) ---------- */

/*
 * No stacking context and no overflow clipping on the banner itself: the media
 * and overlay sit below .codearo-panel (z 2) while .codearo-banner-inner (z 4) rises above
 * it, so dropdowns opened from the banner (search) are never hidden by the panel.
 */
.codearo-banner {
    position: relative;
    height: 420px;
    background: #062A60;
    color: #fff;
}
.codearo-banner > img,
.codearo-banner-media { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; }
.codearo-banner::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(6, 42, 96, .35) 0%, rgba(6, 42, 96, .7) 100%);
    pointer-events: none;
}
.codearo-banner-inner {
    position: relative;
    z-index: 4;
    width: min(var(--codearo-container), calc(100% - 32px));
    height: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 75px 0 50px;
}
.codearo-banner-copy { width: min(720px, 100%); text-align: center; margin: 0 auto; }
.codearo-banner-kicker { margin: 0 0 8px; color: #EAF1FC; font-size: 13px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; }
.codearo-banner-title { margin: 0; color: #fff; font-size: clamp(34px, 4.2vw, 54px); font-weight: 700; line-height: 1.1; text-shadow: 0 3px 14px rgba(0, 0, 0, .4); }
.codearo-banner-text { margin: 12px auto 0; max-width: 620px; color: rgba(255, 255, 255, .92); font-size: 15.5px; line-height: 1.5; }
.codearo-banner-crumbs { margin-top: 14px; display: flex; align-items: center; justify-content: center; gap: 8px; color: rgba(255, 255, 255, .85); font-size: 14px; }
.codearo-banner-crumbs a { color: inherit; text-decoration: none; }
.codearo-banner-crumbs a:hover { color: #fff; text-decoration: underline; }

.codearo-search {
    position: relative;
    margin-top: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 4px 0 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fff;
    color: #000;
    text-align: left;
}
.codearo-search > svg { width: 22px; height: 22px; flex-shrink: 0; color: #222; }
.codearo-search-trigger { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; background: none; color: #6b6b6b; font: inherit; font-size: 14px; text-align: left; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.codearo-search-trigger.has-value { color: #000; }
.codearo-search-submit { height: 32px; padding: 0 14px; font-size: 14px; box-shadow: none; }
.codearo-search-panel { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 40; max-height: 320px; overflow-y: auto; padding: 6px 0; border-radius: 8px; background: #fff; box-shadow: 0 16px 36px rgba(0, 0, 0, .18); }
.codearo-search-option { display: block; width: 100%; padding: 9px 14px; border: 0; background: none; color: #222; font: inherit; font-size: 14px; text-align: left; cursor: pointer; }
.codearo-search-option:hover,
.codearo-search-option[data-selected="true"] { background: var(--codearo-primary-soft); color: var(--codearo-primary); }
.codearo-search-error { margin: 6px 0 0; color: #ffd2cc; font-size: 13px; }

.codearo-panel {
    position: relative;
    z-index: 2;
    width: min(var(--codearo-container), calc(100% - 32px));
    margin: -60px auto 0;
    padding: 20px;
    border-radius: var(--codearo-radius-panel);
    background: #fff;
}

@media (max-width: 767px) {
    .codearo-banner { height: 400px; }
    .codearo-banner::after { background: linear-gradient(180deg, rgba(6, 42, 96, .25) 0%, rgba(6, 42, 96, .65) 100%); }
    .codearo-banner-inner { justify-content: center; padding: 90px 0 40px; }
    .codearo-panel { width: 100%; margin-top: -24px; padding: 16px 20px; border-radius: 0; }
}

/* ---------- Card grid ---------- */

.codearo-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 1399px) { .codearo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px)  { .codearo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575px)  { .codearo-grid { grid-template-columns: 1fr; } }

/* ---------- Cards (property / tour / destination) ---------- */

.codearo-card {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--codearo-radius-card);
    background: #fff;
    box-shadow: var(--codearo-shadow-card);
    color: #000;
}
.codearo-card-link { position: absolute; inset: 0; z-index: 3; border-radius: inherit; }
.codearo-card-link:focus-visible { outline: 2px solid var(--codearo-primary); outline-offset: 3px; }
.codearo-card-media { position: relative; height: 260px; flex-shrink: 0; overflow: hidden; background: #F7F9FD; }
.codearo-card-media img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .6s ease; }
.codearo-card:hover .codearo-card-media img { transform: scale(1.04); }
.codearo-card-placeholder { height: 100%; display: grid; place-items: center; padding: 12px; color: var(--codearo-muted); font-size: 12px; letter-spacing: .12em; text-align: center; text-transform: uppercase; }
.codearo-card-badge { position: absolute; left: 12px; bottom: 12px; padding: 2px 10px; border-radius: 4px; background: var(--codearo-primary); color: #fff; font-size: 13px; font-weight: 500; }
.codearo-card-body { flex: 1; display: flex; flex-direction: column; gap: 4px; padding: 16px; }
.codearo-card-meta { margin: 0; color: #000; font-size: 15.2px; line-height: 22.8px; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.codearo-card-title { margin: 0; color: #000; font-size: 17.6px; font-weight: 500; line-height: 21.12px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.codearo-card-title.is-upper { text-transform: uppercase; }
.codearo-card-foot { margin-top: auto; padding-top: 10px; display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.codearo-card-price-label { margin: 0; color: #000; font-size: 15.2px; line-height: 1.3; white-space: nowrap; }
.codearo-card-price { margin: 0; display: flex; align-items: baseline; gap: 2px; white-space: nowrap; color: var(--codearo-primary); font-size: 22.4px; font-weight: 700; line-height: 1.3; }
.codearo-card-price small { color: var(--codearo-muted); font-size: 13px; font-weight: 400; }
.codearo-card-foot .codearo-btn { position: relative; z-index: 2; pointer-events: none; }

@media (max-width: 575px) {
    .codearo-card-media { height: 230px; }
}

/* ---------- Sections ---------- */

.codearo-section { padding: 40px 0 24px; }
.codearo-container { width: min(var(--codearo-container), calc(100% - 32px)); margin: 0 auto; }
.codearo-section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.codearo-headline { margin: 0; padding: 16px 0 8px; color: var(--codearo-text); font-size: 32px; font-weight: 500; line-height: 1.2; }
.codearo-arrows { display: flex; gap: 6px; }
.codearo-arrow { width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #000; cursor: pointer; }
.codearo-arrow:hover { background: var(--codearo-primary-soft); color: var(--codearo-primary); }
.codearo-arrow.swiper-button-disabled { opacity: .3; cursor: default; }
.codearo-arrow svg { width: 20px; height: 20px; }
.codearo-about { padding: 8px 0 40px; }
.codearo-about h2 { margin: 0 0 8px; color: var(--codearo-text); font-size: 20px; font-weight: 500; line-height: 1.2; }
.codearo-about p { margin: 0; color: var(--codearo-text); font-size: 15.2px; line-height: 22.8px; }

@media (max-width: 767px) {
    .codearo-headline { padding-top: 8px; font-size: 24px; }
    .codearo-section-head { margin-bottom: 16px; }
}

/* ---------- Footer ---------- */

.codearo-footer { background: var(--codearo-footer-bg); color: rgba(255, 255, 255, .82); font-size: 15.2px; }
.codearo-footer-inner { width: min(var(--codearo-container), calc(100% - 32px)); margin: 0 auto; padding: 56px 0 40px; display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.3fr; gap: 32px; }
.codearo-footer-logo { display: inline-flex; padding: 8px 12px; border-radius: 8px; background: #fff; }
.codearo-footer-logo img { height: 52px; width: auto; display: block; }
.codearo-footer p { margin: 12px 0 0; color: rgba(255, 255, 255, .82); line-height: 22.8px; }
.codearo-footer h3 { margin: 0 0 8px; color: #fff; font-size: 17.6px; font-weight: 500; line-height: 21.12px; }
.codearo-footer h4 { margin: 14px 0 4px; color: #EAF1FC; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.codearo-footer ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.codearo-footer a { color: #fff; text-decoration: none; }
.codearo-footer a:hover { color: #EAF1FC; }
.codearo-footer-social { margin-top: 18px; display: flex; gap: 14px; }
.codearo-footer-social a { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(255, 255, 255, .35); border-radius: 50%; }
.codearo-footer-social svg { width: 18px; height: 18px; }
.codearo-footer-contact { border-left: 1px solid rgba(255, 255, 255, .25); padding-left: 32px; }
.codearo-footer-bottom { border-top: 1px solid rgba(255, 255, 255, .12); }
.codearo-footer-bottom > div { width: min(var(--codearo-container), calc(100% - 32px)); margin: 0 auto; padding: 16px 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; font-size: 13px; color: rgba(255, 255, 255, .65); }

@media (max-width: 991px) {
    .codearo-footer-inner { grid-template-columns: 1fr 1fr; }
    .codearo-footer-contact { border-left: 0; padding-left: 0; }
}
@media (max-width: 575px) {
    .codearo-footer-inner { grid-template-columns: 1fr; gap: 26px; padding-top: 40px; }
    .codearo-footer-bottom > div { justify-content: center; text-align: center; }
}

/* ---------- Listing filter bar (sits inside .codearo-panel) ---------- */

.codearo-filterbar { position: relative; z-index: 30; margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid var(--codearo-line); }
.codearo-panel + section { margin-top: 40px; }

/* ---------- One typeface everywhere (LetsGoa uses a single sans; no script/serif accents) ---------- */

:root { --font-sofia: var(--font-sans); --font-display: var(--font-sans); }
.font-\[\'Cormorant_Garamond\'\] { font-family: var(--font-sans); }
.codearo-section-kicker,
.codearo-section-kicker-light,
.codearo-home-section-kicker {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: .24em;
    text-transform: uppercase;
}
.codearo-section-kicker-light { color: #EAF1FC; }

/* ---------- Compact search bar (all booking fields on one white row) ---------- */

.codearo-searchbar {
    width: min(1100px, 100%);
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(0, 1.2fr) minmax(0, 1.2fr) minmax(0, .7fr) minmax(0, .7fr) minmax(0, .7fr) auto;
    align-items: center;
    padding: 6px;
    border-radius: var(--codearo-radius-header);
    background: #fff;
    color: #000;
    text-align: left;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .22);
}
.codearo-sb-field { position: relative; min-width: 0; height: 50px; display: flex; flex-direction: column; justify-content: center; gap: 1px; padding: 0 14px; border-right: 1px solid var(--codearo-line); cursor: pointer; }
.codearo-sb-label { color: var(--codearo-muted); font-size: 11px; font-weight: 600; letter-spacing: .08em; line-height: 1.2; text-transform: uppercase; }
.codearo-sb-field input,
.codearo-sb-field select,
.codearo-sb-trigger {
    width: 100%;
    min-width: 0;
    height: 24px;
    padding: 0;
    border: 0;
    outline: none;
    background: transparent;
    color: #000;
    font: inherit;
    font-size: 15px;
    line-height: 24px;
    cursor: pointer;
}
.codearo-sb-trigger { display: flex; align-items: center; justify-content: space-between; gap: 6px; text-align: left; }
.codearo-sb-trigger > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.codearo-sb-chevron { width: 16px; height: 16px; flex-shrink: 0; color: var(--codearo-muted); }
.codearo-sb-field:focus-within { border-radius: 6px; background: var(--codearo-primary-soft); }
.codearo-sb-submit { height: 50px; margin-left: 6px; padding: 0 24px; border-radius: 8px; box-shadow: none; font-weight: 500; }
.codearo-sb-submit svg { width: 18px; height: 18px; }
.codearo-searchbar .codearo-search-panel { top: calc(100% + 10px); right: auto; width: max(100%, 260px); }
.codearo-search-panel[data-open="false"] { display: none; }

@media (max-width: 991px) {
    .codearo-searchbar { grid-template-columns: repeat(6, minmax(0, 1fr)); row-gap: 0; padding: 4px 6px 6px; }
    .codearo-sb-field { border-right: 0; border-bottom: 1px solid var(--codearo-line); }
    .codearo-sb-dest { grid-column: span 6; }
    label.codearo-sb-field:nth-of-type(1), label.codearo-sb-field:nth-of-type(2) { grid-column: span 3; }
    label.codearo-sb-field:nth-of-type(3), label.codearo-sb-field:nth-of-type(4), label.codearo-sb-field:nth-of-type(5) { grid-column: span 2; }
    label.codearo-sb-field:nth-of-type(3), label.codearo-sb-field:nth-of-type(4) { border-right: 1px solid var(--codearo-line); }
    label.codearo-sb-field:nth-of-type(1) { border-right: 1px solid var(--codearo-line); }
    .codearo-sb-submit { grid-column: span 6; height: 44px; margin: 6px 0 0; justify-content: center; }
}

.codearo-searchbar.is-simple {
    display: flex;
    align-items: center;
    width: min(850px, 100%);
}
.codearo-searchbar.is-simple .codearo-sb-field {
    flex: 1;
}
.codearo-searchbar.is-simple .codearo-sb-field.is-wide {
    flex: 1.8;
}
@media (max-width: 991px) {
    .codearo-searchbar.is-simple {
        display: flex;
        flex-direction: column;
        width: 100%;
        padding: 6px;
    }
    .codearo-searchbar.is-simple .codearo-sb-field {
        width: 100%;
        border-right: 0;
        border-bottom: 1px solid var(--codearo-line);
    }
    .codearo-searchbar.is-simple .codearo-sb-submit {
        width: 100%;
        margin: 6px 0 0;
    }
}

@media (max-width: 991px) {
    .codearo-header-action-strong { height: 34px; padding: 0 16px; font-size: 14px; }
}

/* ---------- FAQ accordion ---------- */

.codearo-faq { padding: 8px 0 56px; }
.codearo-faq-list { display: grid; gap: 12px; }
.codearo-faq-item { overflow: hidden; border-radius: var(--codearo-radius-panel); background: #fff; box-shadow: 0 4px 12px rgba(0, 0, 0, .1); }
.codearo-faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; color: #000; font-size: 17.6px; font-weight: 500; line-height: 1.3; list-style: none; cursor: pointer; }
.codearo-faq-item summary::-webkit-details-marker { display: none; }
.codearo-faq-item summary:hover { color: var(--codearo-primary); }
.codearo-faq-item summary:focus-visible { outline: 2px solid var(--codearo-primary); outline-offset: -2px; border-radius: var(--codearo-radius-panel); }
.codearo-faq-icon { position: relative; width: 28px; height: 28px; flex-shrink: 0; border-radius: 50%; background: var(--codearo-primary-soft); }
.codearo-faq-icon::before,
.codearo-faq-icon::after { content: ""; position: absolute; top: 50%; left: 50%; width: 12px; height: 2px; border-radius: 2px; background: var(--codearo-primary); transform: translate(-50%, -50%); transition: transform .2s ease; }
.codearo-faq-icon::after { transform: translate(-50%, -50%) rotate(90deg); }
.codearo-faq-item[open] .codearo-faq-icon { background: var(--codearo-primary); }
.codearo-faq-item[open] .codearo-faq-icon::before,
.codearo-faq-item[open] .codearo-faq-icon::after { background: #fff; }
.codearo-faq-item[open] .codearo-faq-icon::after { transform: translate(-50%, -50%) rotate(0deg); }
.codearo-faq-item p { margin: 0; padding: 0 22px 20px; color: var(--codearo-text); font-size: 15.2px; line-height: 22.8px; }

@media (max-width: 767px) {
    .codearo-faq { padding-bottom: 40px; }
    .codearo-faq-item summary { padding: 16px; font-size: 16px; }
    .codearo-faq-item p { padding: 0 16px 16px; }
}

/* ---------- Stay / camp detail page (LetsGoa stay-details layout) ---------- */

.codearo-stay { width: min(var(--codearo-container), calc(100% - 32px)); margin: 0 auto; padding-top: 95px; color: var(--codearo-text); }
.codearo-stay-search { margin: 0 auto; box-shadow: 0 4px 16px rgba(0, 0, 0, .12); }
.codearo-stay-search .codearo-search-panel { z-index: 60; }
.codearo-stay-crumbs { margin: 36px 0 24px; display: flex; flex-wrap: wrap; gap: 8px; color: var(--codearo-muted); font-size: 16px; }
.codearo-stay-crumbs a { color: #000; text-decoration: none; }
.codearo-stay-crumbs a:hover { color: var(--codearo-primary); }

.codearo-stay-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: stretch; }
.codearo-stay-mosaic { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 16px; min-height: 530px; }
.codearo-stay-mosaic button { position: relative; width: 100%; height: 100%; display: block; padding: 0; border: 0; overflow: hidden; background: #F7F9FD; cursor: zoom-in; }
.codearo-stay-mosaic img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .5s ease; }
.codearo-stay-mosaic button:hover img { transform: scale(1.03); }
.codearo-stay-main { overflow: hidden; border-radius: var(--codearo-radius-card); background: #F7F9FD; }
.codearo-stay-main .codearo-card-placeholder { height: 100%; }
.codearo-stay-thumbs { display: grid; grid-auto-rows: 1fr; gap: 16px; }
.codearo-stay-thumbs button { border-radius: 15px; }
.codearo-stay-seeall { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(0, 0, 0, .45); color: #fff; font-size: 16px; }

.codearo-stay-info { padding: 24px; border-radius: var(--codearo-radius-card); background: #fff; box-shadow: var(--codearo-shadow-header); display: flex; flex-direction: column; }
.codearo-stay-tag { align-self: flex-start; margin: 0 0 10px; padding: 3px 10px; border-radius: 4px; background: var(--codearo-primary-soft); color: var(--codearo-primary); font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.codearo-stay-title { margin: 0; color: var(--codearo-text); font-size: 32px; font-weight: 500; line-height: 1.2; }
.codearo-stay-location { margin: 12px 0 0; color: var(--codearo-primary); font-size: 16px; font-weight: 500; }
.codearo-stay-tagline { margin: 8px 0 0; color: var(--codearo-muted); font-size: 15px; }
.codearo-stay-facts { margin: 24px 0 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4px 16px; font-size: 15.2px; }
.codearo-stay-facts dt { margin: 0; color: #000; }
.codearo-stay-facts dd { margin: 0; color: #000; font-size: 16px; font-weight: 500; }
.codearo-stay-subhead { margin: 22px 0 14px; color: var(--codearo-text); font-size: 18px; font-weight: 500; }
.codearo-stay-amenities { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 6px 22px; }
.codearo-stay-amenities li { display: inline-flex; align-items: center; gap: 8px; color: #000; font-size: 17px; }
.codearo-stay-amenities svg { width: 20px; height: 20px; flex-shrink: 0; color: #000; }
.codearo-stay-amenities.is-wide { gap: 12px 28px; }
.codearo-stay-amenities.is-wide li { min-width: 200px; font-size: 16px; }
.codearo-stay-activities li { align-items: flex-start; flex: 1 1 260px; }
.codearo-stay-activities li > svg, .codearo-stay-activities li > .codearo-ico { margin-top: 2px; }
.codearo-stay-activities small { display: block; margin-top: 2px; color: var(--codearo-muted); font-size: 13.5px; line-height: 1.4; }
.codearo-stay-more { margin-top: 10px; align-self: flex-start; color: var(--codearo-primary); font-size: 16px; text-decoration: none; }
.codearo-stay-more:hover { text-decoration: underline; }
button.codearo-stay-more { padding: 0; border: 0; background: none; font-family: inherit; cursor: pointer; }
.codearo-stay-more[hidden] { display: none; }
.codearo-stay-amenities.is-clamped { position: relative; overflow: hidden; }
.codearo-stay-amenities.is-clamped.is-expanded { max-height: none; }
.codearo-stay-actions { margin-top: auto; padding-top: 28px; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.codearo-stay-btn { min-height: 63px; display: inline-flex; align-items: center; justify-content: center; padding: 8px 16px; border: 1px solid var(--codearo-primary); border-radius: 15px; background: var(--codearo-primary); color: #fff; font: inherit; font-size: 20px; font-weight: 400; text-align: center; text-decoration: none; box-shadow: var(--codearo-shadow-btn); cursor: pointer; transition: background-color .2s ease, color .2s ease; }
.codearo-stay-btn:hover { background: var(--codearo-primary-hover); color: #fff; }
.codearo-stay-btn.is-outline { background: #fff; color: var(--codearo-primary); box-shadow: none; font-weight: 500; }
.codearo-stay-btn.is-outline:hover { background: var(--codearo-primary-soft); color: var(--codearo-primary); }

.codearo-stay-card { margin-top: 32px; padding: 20px 24px 28px; border-radius: var(--codearo-radius-card); background: #fff; box-shadow: var(--codearo-shadow-header); }
.codearo-stay-h2 { margin: 0 0 14px; color: var(--codearo-text); font-size: 18px; font-weight: 500; line-height: 1.3; }
.codearo-stay-h2.is-large { margin-bottom: 4px; font-size: 24px; font-weight: 700; }
.codearo-stay-h2.is-bold { margin-bottom: 4px; font-size: 22px; font-weight: 700; }
.codearo-stay-note { margin: 0 0 18px; color: #8a8f98; font-size: 13.5px; }
.codearo-stay-prose { color: var(--codearo-text); font-size: 16px; line-height: 1.45; }
.codearo-stay-prose p { margin: 0 0 12px; }
.codearo-stay-prose ul { margin: 0 0 12px; padding-left: 20px; list-style: disc; }

/* Inline images from the admin editor (quill-image.js): wrap left/right, center, full width, 25–100 % size. */
.codearo-stay-prose img { max-width: 100%; height: auto; border-radius: 12px; }
.codearo-stay-prose img.codearo-img--center { display: block; margin: 16px auto; }
.codearo-stay-prose img.codearo-img--full { display: block; width: 100%; margin: 16px 0; }
.codearo-stay-prose img.codearo-img--left { float: left; margin: 6px 24px 14px 0; }
.codearo-stay-prose img.codearo-img--right { float: right; margin: 6px 0 14px 24px; }
.codearo-stay-prose img.codearo-img--w25 { width: 25%; }
.codearo-stay-prose img.codearo-img--w50 { width: 50%; }
.codearo-stay-prose img.codearo-img--w75 { width: 75%; }
.codearo-stay-prose img.codearo-img--w100 { width: 100%; }
.codearo-stay-prose::after { content: ""; display: table; clear: both; }
@media (max-width: 640px) {
    .codearo-stay-prose img.codearo-img--left, .codearo-stay-prose img.codearo-img--right { float: none; display: block; width: 100%; margin: 14px 0; }
    .codearo-stay-prose img.codearo-img--w25 { width: 50%; }
}

.codearo-stay-rooms { padding: 16px 10px 10px; border: 1px solid #e3e5ea; box-shadow: none; border-radius: 16px; }
.codearo-stay-rooms > .codearo-stay-h2, .codearo-stay-rooms > .codearo-stay-note { padding: 0 2px; }
.codearo-room-empty { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 18px; border-radius: 12px; background: #F7F9FD; }
.codearo-room-empty p { margin: 0; }
.codearo-room { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4px; margin-top: 12px; padding: 4px; border-radius: 12px; background: #EAF1FC; }
.codearo-room-info { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 12px; padding: 5px 14px 14px 5px; border-radius: 6px; background: #fff; }
.codearo-room-photo { position: relative; height: 150px; overflow: hidden; border-radius: 8px; background: #F7F9FD; }
.codearo-room-photo button { width: 100%; height: 100%; display: block; padding: 0; border: 0; cursor: zoom-in; }
.codearo-room-photo img { width: 100%; height: 100%; display: block; object-fit: cover; }
.codearo-room-photo .codearo-card-placeholder { height: 100%; }
/* Tablet/desktop: the photo fills the whole left column of the room card (no empty space under it). */
@media (min-width: 768px) {
    .codearo-room-photo { height: auto; min-height: 150px; align-self: stretch; }
    .codearo-room-photo button { position: relative; }
    .codearo-room-photo img { position: absolute; inset: 0; }
}
.codearo-room-count { position: absolute; left: 8px; bottom: 8px; padding: 2px 8px; border-radius: 4px; background: rgba(0, 0, 0, .6); color: #fff; font-size: 12px; }
.codearo-room-text h3 { margin: 14px 0 6px; color: #111; font-size: 17px; font-weight: 700; line-height: 1.3; }
.codearo-room-sub { margin: 0 0 6px; color: var(--codearo-muted); font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.codearo-room-desc { margin: 0; color: #6b6f76; font-size: 14px; line-height: 20px; }
.codearo-room-chips { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 6px; }
.codearo-room-chips span { padding: 3px 8px; border-radius: 8px; background: #EAF1FC; color: #15233B; font-size: 12px; }
.codearo-room-plans { display: grid; gap: 4px; align-content: stretch; }
.codearo-room-plan { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 2.4fr); gap: 4px; }
.codearo-room-plan[data-codearo-extra-plan] { display: none; }
.codearo-room[data-expanded] .codearo-room-plan[data-codearo-extra-plan] { display: grid; }
.codearo-room-cell { padding: 14px 10px; border-radius: 6px; background: #fff; }
.codearo-room-plan-name { display: flex; flex-direction: column; justify-content: center; gap: 4px; }
.codearo-room-plan-name strong { color: #111; font-size: 15px; font-weight: 700; line-height: 1.3; }
.codearo-room-plan-name span { color: #7a7e85; font-size: 13px; }
.codearo-room-toggle { align-self: flex-start; padding: 0; border: 0; background: none; color: var(--codearo-primary); font: inherit; font-size: 15px; text-align: left; cursor: pointer; }
.codearo-room-toggle:hover { text-decoration: underline; }
.codearo-room-pax { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; text-align: center; }
.codearo-room-pax span { color: #6b6f76; font-size: 13px; }
.codearo-room-pax strong { color: #111; font-size: 13px; font-weight: 700; }
.codearo-room-price { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 1px; padding-left: 14px; }
.codearo-room-price s { color: #8a8f98; font-size: 13px; }
.codearo-room-amount { margin: 0; color: var(--codearo-primary); font-size: 22px; font-weight: 700; line-height: 1.2; }
.codearo-room-amount.is-small { font-size: 17px; }
.codearo-room-per, .codearo-room-fine { margin: 0; color: #7a7e85; font-size: 11px; line-height: 1.4; }
.codearo-room-price .codearo-btn { margin-top: 12px; padding: 6px 22px; }

.codearo-stay-why { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.codearo-stay-why-item { padding: 24px; border: 1px solid #e3e5ea; border-radius: 16px; }
.codearo-stay-why-item .codearo-stay-why-num { margin: 0 0 12px; color: var(--codearo-primary); font-size: 32px; font-weight: 800; line-height: 1; }
.codearo-stay-why-item h3 { margin: 0 0 8px; color: #111; font-size: 17px; font-weight: 700; }
.codearo-stay-why-item p:not(.codearo-stay-why-num) { margin: 0; color: #15233B; font-size: 14px; line-height: 20px; }

.codearo-stay-map { width: 100%; height: 400px; display: block; border: 0; border-radius: 12px; background: #EAF1FC; }
.codearo-stay-map.is-empty { display: grid; place-items: center; color: var(--codearo-muted); }

.codearo-stay-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: start; }
.codearo-stay-split .codearo-stay-card { border: 1px solid #e3e5ea; box-shadow: none; padding: 28px 30px; }
.codearo-stay-faq-item { margin-top: 16px; padding: 20px; border: 1px solid #e3e5ea; border-radius: 12px; }
.codearo-stay-faq-item h3 { margin: 0 0 6px; color: #111; font-size: 15px; font-weight: 700; line-height: 1.35; }
.codearo-stay-faq-item p { margin: 0; color: #6b6f76; font-size: 14px; line-height: 20px; }
.codearo-stay-access { display: flex; align-items: flex-start; gap: 14px; margin-top: 16px; padding: 16px 20px; border: 1px solid #e3e5ea; border-radius: 12px; }
.codearo-stay-access > span { width: 36px; height: 36px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: var(--codearo-primary-soft); color: var(--codearo-primary); }
.codearo-stay-access svg { width: 20px; height: 20px; }
.codearo-stay-access p { margin: 0; color: #6b6f76; font-size: 13px; }
.codearo-stay-access strong { color: #111; font-size: 15px; font-weight: 600; }
.codearo-stay-directions { margin-top: 18px; }

/* Floating WhatsApp button (every public page). Sits under sheets/modals (z ≥ 980). */
.codearo-wa-float {
    position: fixed; right: 22px; bottom: 22px; z-index: 970;
    display: inline-flex; align-items: center; gap: 0;
    height: 56px; padding: 0 14px; border-radius: 28px;
    background: #1935A4; color: #fff; text-decoration: none;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .18);
    transition: transform .2s ease, box-shadow .2s ease, gap .2s ease;
}
.codearo-wa-float svg { width: 28px; height: 28px; flex-shrink: 0; }
.codearo-wa-float__label { max-width: 0; overflow: hidden; white-space: nowrap; font-size: 15px; font-weight: 600; transition: max-width .25s ease; }
.codearo-wa-float:hover, .codearo-wa-float:focus-visible { color: #fff; transform: translateY(-2px); box-shadow: 0 12px 26px rgba(0, 0, 0, .22); gap: 8px; }
.codearo-wa-float:hover .codearo-wa-float__label, .codearo-wa-float:focus-visible .codearo-wa-float__label { max-width: 140px; }
@media (max-width: 767px) {
    .codearo-wa-float { right: 16px; bottom: 16px; height: 52px; padding: 0 12px; }
    /* Stay/tour pages pin a price bar to the bottom on phones — sit above it. */
    body:has(.codearo-stay-sticky) .codearo-wa-float { bottom: 96px; }
}
@media print { .codearo-wa-float { display: none; } }

.codearo-stay-sticky {
    position: sticky;
    bottom: 0;
    z-index: 50;
    margin: 32px -40px 0;
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 28px;
    border-radius: 14px 14px 0 0;
    background: #EAF1FC;
}
.codearo-stay-sticky p { margin: 0; color: #000; font-size: 15px; }
.codearo-stay-sticky strong { margin-left: 6px; color: var(--codearo-primary); font-size: 22px; font-weight: 700; }
.codearo-stay-sticky small { color: var(--codearo-muted); font-size: 13px; }

@media (max-width: 1199px) {
    .codearo-stay-top { grid-template-columns: 1fr; }
    .codearo-room { grid-template-columns: 1fr; }
    .codearo-stay-sticky { margin-inline: 0; }
}
@media (max-width: 991px) {
    .codearo-stay { padding-top: 92px; }
    .codearo-stay-crumbs { margin: 20px 0 16px; font-size: 14px; }
    .codearo-stay-why { grid-template-columns: 1fr; gap: 12px; }
    .codearo-stay-split { grid-template-columns: 1fr; gap: 0; }
}
@media (max-width: 767px) {
    .codearo-stay { width: calc(100% - 32px); }
    .codearo-stay-mosaic { grid-template-columns: 1fr; min-height: 0; gap: 8px; }
    .codearo-stay-main { height: 260px; border-radius: 16px; }
    .codearo-stay-thumbs { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 84px; gap: 8px; }
    .codearo-stay-thumbs button { border-radius: 10px; }
    .codearo-stay-info { padding: 20px; }
    .codearo-stay-title { font-size: 26px; }
    .codearo-stay-amenities li { font-size: 15px; }
    .codearo-stay-actions { gap: 12px; padding-top: 22px; }
    .codearo-stay-btn { min-height: 52px; font-size: 17px; }
    .codearo-stay-card { margin-top: 20px; padding: 18px 16px 22px; }
    .codearo-stay-rooms { padding: 14px 8px 8px; }
    .codearo-room-info { grid-template-columns: 1fr; padding: 5px 5px 12px; }
    .codearo-room-photo { height: 190px; }
    .codearo-room-text { padding: 0 8px; }
    .codearo-room-text h3 { margin-top: 6px; }
    .codearo-room-plan { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .codearo-room-plan-name { grid-column: 1 / -1; }
    .codearo-room-pax { align-items: flex-start; text-align: left; }
    .codearo-stay-split .codearo-stay-card { padding: 20px 16px; }
    .codearo-stay-faq-item, .codearo-stay-access { padding: 16px; }
    .codearo-stay-map { height: 280px; }
    .codearo-stay-sticky { margin: 20px -16px 0; min-height: 64px; padding: 10px 16px; border-radius: 0; }
    .codearo-stay-sticky p span { display: block; font-size: 12px; }
    .codearo-stay-sticky strong { margin-left: 0; font-size: 19px; }
}

/* ---------- Stay page: real-phone layout (LetsGoa on an actual device) ---------- */

/* Desktop: phone-only controls stay out of the way. */
.codearo-stay-summary, .codearo-sheet-head, .codearo-sheet-x, .codearo-stay-seemore, .codearo-sheet-backdrop { display: none; }
.codearo-acc-btn { padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: default; pointer-events: none; }

@media (max-width: 767px) {
    html.codearo-sheet-lock, html.codearo-sheet-lock body { overflow: hidden; }

    /* Grey band behind header + search summary + breadcrumb. */
    .codearo-stay { width: 100%; padding: 145px 12px 0; background: linear-gradient(#f3f4f6 0, #f3f4f6 212px, #fff 212px); }
    .codearo-stay-summary {
        position: fixed; top: 80px; left: 10px; right: 10px; z-index: 990;
        display: flex; align-items: center; justify-content: space-between; gap: 10px;
        padding: 8px 12px; border: 1px solid #dcdfe3; border-radius: 12px; background: #fff;
        color: var(--codearo-text); text-align: left; cursor: pointer;
    }
    .codearo-stay-summary span { min-width: 0; display: grid; gap: 2px; }
    .codearo-stay-summary strong { font-size: 14.4px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .codearo-stay-summary small { color: #5f6368; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .codearo-stay-summary svg { width: 24px; height: 24px; flex-shrink: 0; color: var(--codearo-primary); }

    /* Bottom sheets (search) and full-screen sheet (rooms). */
    .codearo-sheet-backdrop:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 1000; background: rgba(0, 0, 0, .5); }
    .codearo-stay-searchwrap {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 1001;
        max-height: 88vh; overflow-y: auto; padding: 18px 16px 22px;
        border-radius: 18px 18px 0 0; background: #fff;
        transform: translateY(105%); transition: transform .25s ease; visibility: hidden;
    }
    .codearo-stay-searchwrap.is-open { transform: none; visibility: visible; }
    .codearo-sheet-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
    .codearo-sheet-head h2 { margin: 0; color: #000; font-size: 24px; font-weight: 500; }
    .codearo-sheet-x { display: inline-grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #333; font-size: 30px; line-height: 1; cursor: pointer; }
    .codearo-stay-search { width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 0; box-shadow: none; }
    .codearo-stay-search .codearo-sb-field { grid-column: 1 / -1; height: 56px; padding: 0 14px; border: 1px solid #c9ccd1; border-radius: 8px; }
    .codearo-stay-search label.codearo-sb-field:nth-of-type(n+3) { grid-column: span 1; }
    .codearo-stay-search .codearo-sb-label { font-size: 12px; text-transform: none; letter-spacing: 0; font-weight: 500; }
    .codearo-stay-search .codearo-sb-field input, .codearo-stay-search .codearo-sb-field select, .codearo-stay-search .codearo-sb-trigger { font-size: 16px; }
    .codearo-stay-search .codearo-sb-submit { grid-column: 1 / -1; height: 52px; margin: 6px 0 0; border-radius: 26px; font-size: 17px; }
    .codearo-stay-search .codearo-search-panel { z-index: 5; width: 100%; max-height: 260px; }

    .codearo-stay-rooms {
        position: fixed; inset: 0; z-index: 1001; margin: 0; overflow-y: auto;
        padding: 18px 12px 24px; border: 0; border-radius: 0; background: #fff;
        transform: translateY(100%); transition: transform .28s ease; visibility: hidden;
    }
    .codearo-stay-rooms.is-open { transform: none; visibility: visible; }
    .codearo-rooms-x { display: inline-grid; position: absolute; top: 12px; right: 10px; }
    .codearo-stay-rooms > .codearo-stay-h2 { padding-right: 44px; }

    .codearo-stay-crumbs { margin: 0 0 18px; padding: 0 3px; gap: 6px 10px; font-size: 13.5px; }
    .codearo-stay-crumbs > span[aria-hidden] { font-size: 0; }
    .codearo-stay-crumbs > span[aria-hidden]::after { content: ">"; font-size: 13.5px; color: #333; font-weight: 600; }
    .codearo-stay-crumbs a, .codearo-stay-crumbs span { color: #333; }

    .codearo-stay-top { gap: 18px; }
    .codearo-stay-mosaic { gap: 8px; }
    .codearo-stay-main { height: 185px; border-radius: 10px; }
    .codearo-stay-thumbs { grid-auto-rows: 80px; }
    .codearo-stay-thumbs button { border-radius: 10px; }
    .codearo-stay-seeall { font-size: 14px; }

    .codearo-stay-info, .codearo-stay-card { border: 1px solid #e3e5ea; border-radius: 16px; box-shadow: 0 2px 4px rgba(0, 0, 0, .075); }
    .codearo-stay-info { padding: 18px 16px; }
    .codearo-stay-title { font-size: 22px; }
    .codearo-stay-location { margin-top: 6px; font-size: 17px; font-weight: 400; }
    .codearo-stay-facts { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); font-size: 16px; }
    .codearo-stay-facts dt { color: #555; }
    .codearo-stay-subhead { font-size: 17px; font-weight: 600; }
    .codearo-stay-amenities li { font-size: 15px; }
    .codearo-stay-more { font-size: 15px; font-weight: 500; }

    .codearo-stay-card { margin-top: 16px; padding: 16px; }
    .codearo-stay-about .codearo-stay-h2, #activities .codearo-stay-h2, #map .codearo-stay-h2 { font-size: 24px; font-weight: 500; }
    .codearo-stay-about:not(.is-expanded) .codearo-stay-prose { max-height: 270px; overflow: hidden; -webkit-mask-image: linear-gradient(#000 75%, transparent); mask-image: linear-gradient(#000 75%, transparent); }
    .codearo-stay-seemore { display: inline-block; margin-top: 4px; padding: 0; border: 0; background: none; color: var(--codearo-primary); font: inherit; font-size: 16px; font-weight: 500; cursor: pointer; }

    /* Number on the left, title + text on the right. */
    .codearo-stay-why-item { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; row-gap: 6px; align-items: start; padding: 18px 16px; border: 0; background: #EAF1FC; }
    .codearo-stay-why-item .codearo-stay-why-num { grid-row: span 2; margin: 0; font-size: 28.8px; }
    .codearo-stay-why-item h3 { margin: 0; font-size: 16px; font-weight: 600; }
    .codearo-stay-why-item p:not(.codearo-stay-why-num) { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }

    .codearo-stay-map { height: 240px; }

    /* Collapsible rows (LetsGoa's "Hotel Policies" pattern). */
    .codearo-acc { margin-top: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; }
    .codearo-stay-split .codearo-acc { padding: 0; border: 0; }
    .codearo-acc + .codearo-acc, .codearo-stay-split .codearo-acc { border-top: 1px solid #eceef1; }
    .codearo-acc > .codearo-stay-h2 { margin: 0; font-size: 16px; font-weight: 600; }
    .codearo-acc-btn { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 16px 4px; pointer-events: auto; cursor: pointer; }
    .codearo-acc-btn::after { content: ""; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 7px solid #777; transition: transform .2s ease; }
    .codearo-acc.is-open .codearo-acc-btn::after { transform: rotate(180deg); }
    .codearo-acc:not(.is-open) .codearo-acc-body { display: none; }
    .codearo-acc .codearo-acc-body { padding: 0 4px 16px; }
    #amenities.codearo-acc { margin-top: 16px; }

    /* Price row: plain white, not sticky. */
    .codearo-stay-sticky { position: static; margin: 8px -12px 0; min-height: 66px; padding: 10px 24px; border-radius: 0; background: #fff; }
    .codearo-stay-sticky p { display: grid; justify-items: center; }
    .codearo-stay-sticky p span { font-size: 15px; font-weight: 600; }
    .codearo-stay-sticky strong { color: #000; font-size: 20px; font-weight: 500; }
    .codearo-stay-sticky small { display: none; }
    .codearo-stay-sticky .codearo-btn { padding: 12px 28px; font-size: 16px; }
}

/* ---------- Stay page: phone "Room Types" view + fixed price bar (from real-device screenshots) ---------- */

.codearo-plan-m, .codearo-plan-chips, .codearo-room-cart, .codearo-show-phone { display: none; }

@media (max-width: 767px) {
    .codearo-hide-phone { display: none; }
    .codearo-show-phone { display: inline; }

    /* Main page: price bar pinned to the bottom of the screen. */
    .codearo-stay-sticky {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 980; margin: 0;
        padding: 10px 20px calc(10px + env(safe-area-inset-bottom));
        background: #fff; box-shadow: 0 -4px 14px rgba(0, 0, 0, .08);
    }
    .codearo-stay { padding-bottom: 90px; }

    /* Room Types sheet. */
    .codearo-stay-rooms { padding: 16px 12px 0; }
    .codearo-stay-rooms > .codearo-stay-note { display: none; }
    .codearo-room { display: block; margin-top: 14px; padding: 12px 0 14px; border: 1px solid #e3e5ea; border-radius: 14px; background: #fff; }
    .codearo-room-info { display: block; padding: 0 12px; background: none; }
    .codearo-room-photo { height: 168px; border-radius: 12px; }
    .codearo-room-text { padding: 0; }
    .codearo-room-text h3 { margin: 10px 0 4px; color: var(--codearo-primary); font-size: 16.5px; text-decoration: underline; text-underline-offset: 3px; }
    .codearo-room-sub, .codearo-room-chips { display: none; }
    .codearo-room-desc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 13px; }

    /* Plan cards scroll sideways; the next one peeks in. */
    .codearo-room-plans { display: flex; gap: 12px; margin-top: 12px; padding: 2px 12px 4px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
    .codearo-room-plans::-webkit-scrollbar { display: none; }
    .codearo-room-plan, .codearo-room[data-expanded] .codearo-room-plan[data-codearo-extra-plan], .codearo-room-plan[data-codearo-extra-plan] {
        flex: 0 0 84%; display: block; scroll-snap-align: start;
        padding: 14px 12px; border: 1px solid #e3e5ea; border-radius: 12px; background: #fff;
    }
    .codearo-room-plan.is-picked { border-color: var(--codearo-primary); box-shadow: 0 0 0 1px var(--codearo-primary); }
    .codearo-room-cell { padding: 0; border-radius: 0; background: none; }
    .codearo-room-pax, .codearo-room-toggle, .codearo-room-price > :not(.codearo-plan-m) { display: none; }
    .codearo-plan-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.codearo-plan-chips span { padding: 4px 8px; border-radius: 6px; background: #F7F9FD; color: #15233B; font-size: 12px; font-weight: 600; }
    .codearo-room-plan-name strong { font-size: 14px; }
    .codearo-room-plan-name span:not(.codearo-plan-chips span) { color: #1935A4; font-size: 12.5px; font-weight: 600; }
    .codearo-room-plan-name > span::before { content: "✓ "; }
    .codearo-room-price { display: block; padding: 0; }
    .codearo-plan-m { display: block; margin-top: 12px; padding-top: 12px; border-top: 1px solid #eceef1; }
    .codearo-plan-line { margin: 0 0 6px; display: flex; justify-content: space-between; gap: 10px; color: #555; font-size: 14px; }
    .codearo-plan-line b { color: var(--codearo-primary); font-size: 15px; font-weight: 700; }
    .codearo-plan-line.is-sub b { font-size: 13.5px; font-weight: 600; }
    .codearo-plan-count { margin: 10px 0 14px; display: flex; align-items: center; justify-content: space-between; color: #333; font-size: 14px; }
    .codearo-plan-count > div { display: flex; align-items: center; gap: 6px; }
    .codearo-plan-count button { width: 30px; height: 34px; padding: 0; border: 0; border-radius: 4px; background: #e5e7eb; color: #111; font-size: 18px; cursor: pointer; }
    .codearo-plan-count output { width: 46px; height: 38px; display: grid; place-items: center; border: 1px solid #9ca3af; border-radius: 4px; color: #111; font-size: 15px; }
    .codearo-plan-select { width: 100%; height: 42px; border: 1px solid var(--codearo-primary); border-radius: 21px; background: #fff; color: var(--codearo-primary); font: inherit; font-size: 16px; font-weight: 500; cursor: pointer; }
    .codearo-room-plan.is-picked .codearo-plan-select { background: var(--codearo-primary-soft); }

    /* Bottom cart bar inside the sheet. */
    .codearo-room-cart {
        position: sticky; bottom: 0; z-index: 3; margin: 16px -12px 0;
        display: grid; justify-items: center; gap: 8px;
        padding: 10px 16px calc(12px + env(safe-area-inset-bottom));
        background: #EAF1FC; box-shadow: 0 -4px 14px rgba(0, 0, 0, .06);
    }
    .codearo-room-cart p { margin: 0; display: grid; justify-items: center; text-align: center; }
    .codearo-room-cart strong { color: #000; font-size: 22px; font-weight: 500; }
    .codearo-room-cart span { color: #555; font-size: 13px; }
    .codearo-room-cart-btn { width: 100%; height: 48px; font-size: 17px; }
    .codearo-room-cart-btn:disabled { opacity: .55; cursor: not-allowed; }
}

/* ---------- Stay page: phone photo carousel, lightbox controls, room sheet spacing ---------- */


@media (max-width: 767px) {
    /* Room sheet: a lone plan card fills the row; no underline on room names; lighter cart. */
    .codearo-room-text h3 { text-decoration: none; }
    .codearo-room-plan:only-child { flex-basis: 100%; }
    .codearo-room-plans { padding: 2px 12px 2px; }
    .codearo-room { padding: 12px 0; }
    .codearo-room:last-of-type { margin-bottom: 18px; }
    .codearo-room-cart { gap: 6px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid #E1E8F2; box-shadow: 0 -6px 16px rgba(0, 0, 0, .07); }
    .codearo-room-cart strong { font-size: 20px; }
    .codearo-room-cart span { font-size: 12.5px; }
    .codearo-room-cart-btn { height: 46px; }
}

/* Admin-entered icons (heroicons / bootstrap icons) tinted with currentColor. */
.codearo-ico { width: 20px; height: 20px; flex-shrink: 0; display: inline-block; background: currentColor; -webkit-mask: var(--codearo-ico) center / contain no-repeat; mask: var(--codearo-ico) center / contain no-repeat; }
.codearo-stay-amenities .codearo-ico { color: var(--codearo-primary); }
.codearo-stay-why-item h3 { display: flex; align-items: center; gap: 8px; }
.codearo-stay-why-item h3 .codearo-ico { width: 18px; height: 18px; color: var(--codearo-primary); }
.codearo-plan-count small { display: block; color: #8a8f98; font-size: 11.5px; }
.codearo-room-pax span + strong + span { margin-top: 2px; font-size: 11.5px; }

/* Grid children must be allowed to shrink, or Swiper measures a huge width on phones. */
.codearo-stay-top > * { min-width: 0; }
@media (max-width: 1199px) { .codearo-stay-top { grid-template-columns: minmax(0, 1fr); } }
/* Desktop: photos take the info panel's height (images are positioned, so they add no height of their own). */
@media (min-width: 1200px) {
    .codearo-stay-mosaic { min-height: 420px; }
    .codearo-stay-main, .codearo-stay-mosaic button { position: relative; }
    .codearo-stay-mosaic img { position: absolute; inset: 0; }
}

/* ---------- Stay page photos: phone strip + gallery viewer ---------- */

.codearo-stay-mphotos { display: none; }
html.codearo-gl-lock, html.codearo-gl-lock body { overflow: hidden; }

@media (max-width: 767px) {
    .codearo-stay-mosaic { display: none; }
    .codearo-stay-mphotos { display: grid; gap: 8px; min-width: 0; }
.codearo-stay-mphotos button { position: relative; display: block; padding: 0; border: 0; overflow: hidden; background: #F7F9FD; cursor: zoom-in; }
    .codearo-stay-mphotos img { width: 100%; height: 100%; display: block; object-fit: cover; }
    .codearo-stay-mmain { height: 190px; border-radius: 14px; }
    /* Three thumbs in view; swipe sideways for the rest. */
    .codearo-stay-mstrip { display: flex; gap: 8px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
    .codearo-stay-mstrip::-webkit-scrollbar { display: none; }
    .codearo-stay-mstrip button { flex: 0 0 calc((100% - 16px) / 3); height: 82px; border-radius: 10px; scroll-snap-align: start; }
}

.codearo-gl { position: fixed; inset: 0; z-index: 2000; background: rgba(30, 30, 30, .92); color: #ccc; }
.codearo-gl[hidden] { display: none; }
.codearo-gl-bar { position: absolute; top: 0; left: 0; right: 0; z-index: 4; height: 44px; display: flex; align-items: center; justify-content: space-between; }
.codearo-gl-count { padding-left: 14px; color: #ddd; font-size: 13px; letter-spacing: .02em; }
.codearo-gl-tools { display: flex; background: rgba(30, 30, 30, .6); }
.codearo-gl-tools button, .codearo-gl-arrow { width: 44px; height: 44px; display: grid; place-items: center; padding: 0; border: 0; background: transparent; color: #ccc; cursor: pointer; }
.codearo-gl-tools button:hover, .codearo-gl-arrow:hover { color: #fff; }
.codearo-gl-tools svg, .codearo-gl-arrow svg { width: 22px; height: 22px; }
.codearo-gl-pause, .codearo-gl.is-playing .codearo-gl-play { display: none; }
.codearo-gl.is-playing .codearo-gl-pause { display: block; }
.codearo-gl-stage { width: 100%; height: 100%; }
.codearo-gl-stage .swiper-slide { display: flex; align-items: center; justify-content: center; overflow: hidden; }
.codearo-gl-stage .swiper-zoom-container > img { max-width: 100%; max-height: calc(100dvh - 110px); object-fit: contain; }
.codearo-gl-arrow { position: absolute; top: 50%; z-index: 4; transform: translateY(-50%); background: rgba(30, 30, 30, .6); }
.codearo-gl-arrow.is-prev { left: 0; }
.codearo-gl-arrow.is-next { right: 0; }
.codearo-gl-arrow.swiper-button-disabled { opacity: .35; cursor: default; }
.codearo-gl-grid { position: absolute; inset: 44px 0 0; z-index: 5; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); align-content: start; gap: 8px; padding: 12px; background: rgba(20, 20, 20, .97); }
.codearo-gl-grid[hidden] { display: none; }
.codearo-gl-grid button { aspect-ratio: 4 / 3; padding: 0; border: 2px solid transparent; border-radius: 6px; overflow: hidden; background: #333; cursor: pointer; }
.codearo-gl-grid button.is-active { border-color: #fff; }
.codearo-gl-grid img { width: 100%; height: 100%; display: block; object-fit: cover; }
@media (max-width: 767px) { .codearo-gl-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ---------- Newsletter band (rounded card in the page, not a full-bleed block) ---------- */

.codearo-newsletter { padding: 16px 0 48px; }
.codearo-newsletter-card { width: min(var(--codearo-container), calc(100% - 32px)); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 32px; padding: 32px 36px; border-radius: var(--codearo-radius-card); background: #EAF1FC; }
.codearo-newsletter-kicker { margin: 0 0 6px; color: var(--codearo-primary); font-size: 13px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; }
.codearo-newsletter-title { margin: 0; color: var(--codearo-text); font-size: 32px; font-weight: 500; line-height: 1.2; }
.codearo-newsletter-text { margin: 8px 0 0; color: #555; font-size: 15.2px; line-height: 22.8px; }
.codearo-newsletter-row { display: flex; gap: 10px; }
.codearo-newsletter-row input { flex: 1; min-width: 0; height: 48px; padding: 0 20px; border: 1px solid var(--codearo-line); border-radius: var(--codearo-radius-pill); background: #fff; color: #000; font: inherit; font-size: 15px; outline: none; }
.codearo-newsletter-row input:focus { border-color: var(--codearo-primary); box-shadow: 0 0 0 3px rgba(25, 53, 164, .12); }
.codearo-newsletter-row .codearo-btn { height: 48px; padding: 0 26px; }
.codearo-newsletter-note { margin: 10px 4px 0; color: #333; font-size: 14px; }
.codearo-newsletter-note.is-ok { color: var(--codearo-primary); }
.codearo-newsletter-note.is-error { color: #b42318; }

@media (max-width: 767px) {
    .codearo-newsletter { padding: 8px 0 32px; }
    .codearo-newsletter-card { grid-template-columns: 1fr; gap: 18px; padding: 24px 20px; border-radius: 16px; }
    .codearo-newsletter-title { font-size: 24px; }
    .codearo-newsletter-row { flex-direction: column; }
    .codearo-newsletter-row input { flex: none; width: 100%; }
    .codearo-newsletter-row .codearo-btn { width: 100%; }
}

/* ---------- Booking / tour inquiry popups (.codearo-modal) — site skin over the Tailwind markup ---------- */

.codearo-modal > .modal-box { width: min(640px, calc(100vw - 32px)); max-width: 640px; padding: 0; border: 0; border-radius: var(--codearo-radius-card); background: #fff; box-shadow: 0 24px 60px rgba(0, 0, 0, .25); color: var(--codearo-text); font-family: var(--font-sans); }
.codearo-modal::backdrop, .codearo-modal .modal-backdrop { background: rgba(6, 42, 96, .55); }
.codearo-modal .modal-box > div:first-child { position: sticky; top: 0; z-index: 2; align-items: center; padding: 20px 24px 16px; border-bottom: 1px solid #eceef1; background: #fff; }
.codearo-modal .modal-box > div:first-child p { color: var(--codearo-primary); font-size: 13px; font-weight: 600; letter-spacing: .24em; }
.codearo-modal .modal-box > div:first-child h3 { margin-top: 4px; color: var(--codearo-text); font-size: 26px; font-weight: 500; line-height: 1.2; }
.codearo-modal .modal-box form[method="dialog"] > button { width: 38px; height: 38px; min-height: 38px; border-radius: 50%; background: #F7F9FD; color: #15233B; font-size: 16px; }
.codearo-modal .modal-box form[method="dialog"] > button:hover { background: var(--codearo-primary-soft); color: var(--codearo-primary); }
.codearo-modal .modal-box > div:nth-child(2) { padding: 20px 24px 24px; }

/* Property + selected room summary as soft cards (like the stay info card). */
.codearo-modal .border-b.border-stone-200.pb-3 { padding: 12px 16px; border: 0; border-radius: 12px; background: #EAF1FC; }
.codearo-modal .border-b.border-stone-200.pb-3 p:last-child { color: #000; font-size: 17px; font-weight: 500; }
.codearo-modal [data-booking-context-display] { padding: 12px 16px; border: 0; border-radius: 12px; background: #EAF1FC; box-shadow: none; }
.codearo-modal [data-booking-context-display] p.text-sm { color: #000; font-size: 15px; font-weight: 500; }

/* Section + field labels. */
.codearo-modal .modal-box > div:nth-child(2) p.text-\[0\.68rem\] { color: #6b6f76; font-size: 12px; font-weight: 600; letter-spacing: .14em; }
.codearo-modal p.border-t { padding-top: 16px; border-color: #eceef1; }
.codearo-modal label.block { margin-bottom: 6px; color: #333; font-size: 14px; font-weight: 500; }

/* Fields: white, rounded, royal-blue focus — same as the search bar. */
.codearo-modal :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]), select, textarea) {
    height: 48px; padding: 0 14px; border: 1px solid #d8dce3; border-radius: 10px; background: #fff;
    color: #000; font-family: var(--font-sans); font-size: 15px; box-shadow: none;
}
.codearo-modal textarea { height: auto; min-height: 84px; padding: 12px 14px; }
.codearo-modal :is(input, select, textarea):focus { border-color: var(--codearo-primary); background: #fff; outline: none; box-shadow: 0 0 0 3px rgba(25, 53, 164, .12); }
.codearo-modal :is(input, select, textarea)::placeholder { color: #9aa0a6; }
.codearo-modal .border-red-400 { border-color: #e5484d; }

/* Actions: pill buttons. */
.codearo-modal .border-t.pt-4 { border-color: #eceef1; }
.codearo-modal :is([data-booking-submit-button], [data-tour-booking-submit]) { height: 50px; min-height: 50px; border: 0; border-radius: var(--codearo-radius-pill); background: var(--codearo-primary); color: #fff; font-family: var(--font-sans); font-size: 16px; font-weight: 500; box-shadow: var(--codearo-shadow-btn); }
.codearo-modal :is([data-booking-submit-button], [data-tour-booking-submit]):hover { background: var(--codearo-primary-hover); }
.codearo-modal :is([data-booking-submit-button], [data-tour-booking-submit]):disabled { background: var(--codearo-primary); color: #fff; opacity: .65; cursor: wait; }
.codearo-modal :is([data-booking-close], [data-tour-booking-close]) { height: 50px; min-height: 50px; padding: 0 26px; border: 1px solid var(--codearo-primary); border-radius: var(--codearo-radius-pill); background: #fff; color: var(--codearo-primary); font-family: var(--font-sans); font-size: 16px; font-weight: 500; }
.codearo-modal :is([data-booking-close], [data-tour-booking-close]):hover { background: var(--codearo-primary-soft); }

/* Phones: slides up as a bottom sheet. */
@media (max-width: 767px) {
    .codearo-modal { place-items: end center; }
    .codearo-modal > .modal-box { width: 100%; max-width: 100%; max-height: 92dvh; border-radius: 20px 20px 0 0; }
    .codearo-modal .modal-box > div:first-child { padding: 16px 16px 14px; }
    .codearo-modal .modal-box > div:first-child h3 { font-size: 22px; }
    .codearo-modal .modal-box > div:nth-child(2) { padding: 16px 16px calc(20px + env(safe-area-inset-bottom)); }
    .codearo-modal :is([data-booking-close], [data-tour-booking-close]) { width: 100%; }
}

/* Room name opens that room's photos. */
.codearo-room-name { padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.codearo-room-name:hover { color: var(--codearo-primary); }

@media (max-width: 767px) {
    /* Adults / children / rooms side by side in the popup. */
    .codearo-modal .sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
    .codearo-modal .sm\:grid-cols-3 label.block { min-height: 34px; font-size: 13px; line-height: 1.3; }
}

/* Stay page FAQ items open/close on click (same +/- icon as the home FAQ). */
.codearo-stay-faq-item { padding: 0; }
.codearo-stay-faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 20px; list-style: none; cursor: pointer; }
.codearo-stay-faq-item summary::-webkit-details-marker { display: none; }
.codearo-stay-faq-item summary h3 { margin: 0; }
.codearo-stay-faq-item summary:hover h3 { color: var(--codearo-primary); }
.codearo-stay-faq-item summary:focus-visible { outline: 2px solid var(--codearo-primary); outline-offset: -2px; border-radius: 12px; }
.codearo-stay-faq-item > p { padding: 0 20px 18px; }
.codearo-stay-faq-item .codearo-faq-icon { width: 24px; height: 24px; }
.codearo-stay-faq-item .codearo-faq-icon::before, .codearo-stay-faq-item .codearo-faq-icon::after { width: 10px; }
.codearo-stay-faq-item[open] .codearo-faq-icon { background: var(--codearo-primary); }
.codearo-stay-faq-item[open] .codearo-faq-icon::before, .codearo-stay-faq-item[open] .codearo-faq-icon::after { background: #fff; }
.codearo-stay-faq-item[open] .codearo-faq-icon::after { transform: translate(-50%, -50%) rotate(0deg); }
@media (max-width: 767px) { .codearo-stay-faq-item summary { padding: 14px 16px; } .codearo-stay-faq-item > p { padding: 0 16px 16px; } }

/* Stacked layout (phones/tablets): Getting there first, FAQs below. */
@media (max-width: 991px) {
    .codearo-stay-split .codearo-stay-getting { order: -1; }
    .codearo-stay-split .codearo-stay-faq.codearo-acc { border-top: 1px solid #eceef1; }
}

/* ---------- Tour detail page (itinerary & inclusions) ---------- */
.codearo-itinerary { display: flex; flex-direction: column; gap: 14px; margin-top: 16px; }
.codearo-itinerary-item { border: 1px solid #e3e5ea; border-radius: 12px; overflow: hidden; background: #fff; transition: border-color .2s, box-shadow .2s; }
.codearo-itinerary-item[open] { border-color: #d1d5db; box-shadow: 0 4px 14px rgba(0, 0, 0, .05); }
.codearo-itinerary-item summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 20px; list-style: none; cursor: pointer; user-select: none; }
.codearo-itinerary-item summary::-webkit-details-marker { display: none; }
.codearo-itinerary-head { display: flex; align-items: center; gap: 14px; min-width: 0; }
.codearo-itinerary-badge { display: inline-flex; align-items: center; justify-content: center; height: 32px; padding: 0 12px; border-radius: 6px; background: var(--codearo-primary-soft); color: var(--codearo-primary); font-size: 13px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; flex-shrink: 0; transition: background .2s, color .2s; }
.codearo-itinerary-item[open] .codearo-itinerary-badge { background: var(--codearo-primary); color: #fff; }
.codearo-itinerary-head h3 { margin: 0; color: #111; font-size: 16.5px; font-weight: 600; line-height: 1.35; }
.codearo-itinerary-item summary:hover .codearo-itinerary-head h3 { color: var(--codearo-primary); }
.codearo-itinerary-item .codearo-faq-icon { width: 24px; height: 24px; flex-shrink: 0; }
.codearo-itinerary-item .codearo-faq-icon::before, .codearo-itinerary-item .codearo-faq-icon::after { width: 10px; }
.codearo-itinerary-item[open] .codearo-faq-icon { background: var(--codearo-primary); }
.codearo-itinerary-item[open] .codearo-faq-icon::before, .codearo-itinerary-item[open] .codearo-faq-icon::after { background: #fff; }
.codearo-itinerary-item[open] .codearo-faq-icon::after { transform: translate(-50%, -50%) rotate(0deg); }
.codearo-itinerary-body { padding: 4px 20px 20px; border-top: 1px solid #f1f3f5; color: #4b5563; font-size: 15px; line-height: 1.6; }
.codearo-itinerary-body p { margin: 12px 0 0; }
@media (max-width: 767px) {
    .codearo-itinerary-item summary { padding: 14px 16px; }
    .codearo-itinerary-body { padding: 4px 16px 16px; }
    .codearo-itinerary-head { gap: 10px; }
    .codearo-itinerary-head h3 { font-size: 15px; }
}

.codearo-inc-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; margin-top: 16px; }
.codearo-inc-col { padding: 22px; border-radius: 12px; background: #fafafa; border: 1px solid #e9ecef; }
.codearo-inc-title { display: flex; align-items: center; gap: 8px; margin: 0 0 16px; font-size: 17px; font-weight: 600; }
.codearo-inc-title svg { width: 22px; height: 22px; flex-shrink: 0; }
.codearo-inc-title.is-in { color: #1935A4; }
.codearo-inc-title.is-ex { color: #854d0e; }
.codearo-inc-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
.codearo-inc-list li { display: flex; align-items: flex-start; gap: 10px; color: #374151; font-size: 15px; line-height: 1.45; }
.codearo-inc-list svg { width: 18px; height: 18px; flex-shrink: 0; margin-top: 2px; }
.codearo-inc-list.is-in svg { color: var(--codearo-primary); }
.codearo-inc-list.is-ex svg { color: #1698C2; }
.codearo-inc-list.is-terms { margin-top: 12px; }
.codearo-inc-list.is-terms svg { color: #6b7280; }
@media (max-width: 767px) {
    .codearo-inc-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    .codearo-inc-col { padding: 18px 16px; }
}

/* ---------- Search results / stays listing (LetsGoa stay search) ---------- */

.codearo-results-band { padding: 95px 0 26px; background: #f3f4f6; }
.codearo-results-band-inner { width: min(var(--codearo-container), calc(100% - 32px)); margin: 0 auto; }
.codearo-results-searchwrap .codearo-sheet-head { display: none; }
.codearo-results-searchwrap .codearo-searchbar { margin: 0 auto; box-shadow: 0 4px 16px rgba(0, 0, 0, .1); }
.codearo-results-crumbs { margin: 30px 0 6px; display: flex; align-items: center; gap: 4px; font-size: 15px; }
.codearo-results-crumbs a { color: #111827; font-weight: 500; text-decoration: none; }
.codearo-results-crumbs a:hover { color: var(--codearo-primary); }
.codearo-results-crumbs span { color: #6b7280; }
.codearo-results-crumbs span[aria-hidden] { color: #9ca3af; margin: 0 2px; }
.codearo-results-title { margin: 0; color: #111827; font-size: 32px; font-weight: 600; line-height: 1.2; letter-spacing: -0.01em; }

.codearo-results { width: min(var(--codearo-container), calc(100% - 32px)); margin: 0 auto; padding: 32px 0 56px; display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 24px; align-items: start; }
.codearo-results-main { min-width: 0; }

/* Filter panel (desktop sidebar). */
.codearo-flt { position: sticky; top: 95px; max-height: calc(100vh - 110px); overflow-y: auto; border: 1px solid #e3e5ea; border-radius: 14px; background: #fff; }
.codearo-flt-top { display: flex; align-items: center; gap: 10px; padding: 16px 18px 10px; }
.codearo-flt-top h2 { margin: 0; flex: 1; color: var(--codearo-text); font-size: 18px; font-weight: 600; }
.codearo-flt-top .codearo-sheet-x { display: none; }
.codearo-flt-clear { color: var(--codearo-primary); font-size: 14px; text-decoration: none; }
.codearo-flt-clear:hover { text-decoration: underline; }
.codearo-flt-section { padding: 4px 18px 12px; border-top: 1px solid #eceef1; }
.codearo-flt-section h3 { margin: 0; }
.codearo-flt-head { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 12px 0 6px; border: 0; background: none; color: #111; font: inherit; font-size: 15.5px; font-weight: 600; text-align: left; cursor: pointer; }
.codearo-flt-head::after { content: ""; width: 8px; height: 8px; border-right: 2px solid #555; border-bottom: 2px solid #555; transform: rotate(-135deg); transition: transform .2s ease; margin-right: 4px; }
.codearo-flt-section:not(.is-open) .codearo-flt-head::after { transform: rotate(45deg); }
.codearo-flt-section:not(.is-open) .codearo-flt-body { display: none; }
.codearo-flt-check { display: flex; align-items: center; gap: 10px; padding: 6px 0; color: #222; font-size: 14.5px; cursor: pointer; }
.codearo-flt-check input { width: 17px; height: 17px; flex-shrink: 0; margin: 0; accent-color: var(--codearo-primary); cursor: pointer; }
.codearo-flt-check span { flex: 1; }
.codearo-flt-check small { color: #8a8f98; font-size: 12.5px; }
.codearo-flt-check:hover span { color: var(--codearo-primary); }
.codearo-flt-actions { display: none; }

/* Phone chips row (hidden on desktop where the sidebar is visible). */
.codearo-chips { display: none; }

.codearo-results-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-bottom: 16px; }
.codearo-results-head p { margin: 0; color: #444; font-size: 15px; }
.codearo-results-head strong { color: #000; }
.codearo-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.codearo-pills a { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 16px; background: var(--codearo-primary-soft); color: var(--codearo-primary); font-size: 13.5px; font-weight: 500; text-decoration: none; }
.codearo-pills a:hover { background: #EAF1FC; }

.codearo-results-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 1199px) { .codearo-results-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Result card. */
.codearo-rcard { position: relative; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #e3e5ea; border-radius: 14px; background: #fff; transition: box-shadow .2s ease; }
.codearo-rcard:hover { box-shadow: var(--codearo-shadow-card); }
.codearo-rcard-media { position: relative; height: 200px; background: #F7F9FD; }
.codearo-rcard-media img { width: 100%; height: 100%; display: block; object-fit: cover; }
.codearo-rcard-media .codearo-card-placeholder { height: 100%; }
.codearo-rcard-tag { position: absolute; left: 10px; top: 10px; padding: 3px 10px; border-radius: 4px; background: #fff; color: var(--codearo-primary); font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.codearo-rcard-deal { position: absolute; right: 10px; bottom: 10px; padding: 3px 10px; border-radius: 4px; background: #1935A4; color: #fff; font-size: 12.5px; font-weight: 600; }
.codearo-rcard-body { flex: 1; display: flex; flex-direction: column; padding: 14px 16px 16px; }
.codearo-rcard-body h3 { margin: 0; color: #000; font-size: 19px; font-weight: 600; line-height: 1.25; }
.codearo-rcard-loc { margin: 6px 0 0; color: var(--codearo-primary); font-size: 13.5px; font-weight: 500; }
.codearo-rcard-amen { margin: 8px 0 0; color: #555; font-size: 13px; line-height: 1.5; }
.codearo-rcard-amen b { color: #222; font-weight: 600; }
.codearo-rcard-foot { margin-top: auto; padding-top: 14px; display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.codearo-rcard-foot s { color: #c0392b; font-size: 13px; }
.codearo-rcard-price { margin: 0; color: #000; font-size: 22px; font-weight: 600; line-height: 1.15; }
.codearo-rcard-price.is-small { font-size: 16px; }
.codearo-rcard-per { margin: 2px 0 0; color: #777; font-size: 12px; }
.codearo-rcard-foot .codearo-btn { position: relative; z-index: 2; pointer-events: none; padding: 7px 16px; font-size: 14px; }

.codearo-results-empty { padding: 48px 20px; border: 1px dashed #cfd3d8; border-radius: 14px; text-align: center; }
.codearo-results-empty h2 { margin: 0; font-size: 22px; font-weight: 500; }
.codearo-results-empty p { margin: 8px 0 18px; color: #666; }

.codearo-pager { margin-top: 28px; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.codearo-pager a, .codearo-pager span { min-width: 40px; height: 40px; display: inline-grid; place-items: center; padding: 0 12px; border: 1px solid #e3e5ea; border-radius: 20px; background: #fff; color: #333; font-size: 15px; text-decoration: none; }
.codearo-pager a:hover { border-color: var(--codearo-primary); color: var(--codearo-primary); }
.codearo-pager .is-current { border-color: var(--codearo-primary); background: var(--codearo-primary); color: #fff; }
.codearo-pager span[aria-hidden] { color: #c4c7cc; }

/* Tablet + phone: chips + bottom sheets. */
@media (max-width: 991px) {
    .codearo-results { grid-template-columns: minmax(0, 1fr); padding-top: 16px; }
    .codearo-chips { display: flex; gap: 8px; margin: 0 -16px 14px; padding: 2px 16px; overflow-x: auto; scrollbar-width: none; }
    .codearo-chips::-webkit-scrollbar { display: none; }
    .codearo-chip-tune { position: relative; flex-shrink: 0; width: 40px; height: 38px; display: grid; place-items: center; padding: 0; border: 0; background: none; color: var(--codearo-primary); cursor: pointer; }
    .codearo-chip-tune svg { width: 26px; height: 26px; }
    .codearo-chip-tune b { position: absolute; top: 0; right: 0; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; background: var(--codearo-primary); color: #fff; font-size: 11px; line-height: 17px; }
    .codearo-chip { flex-shrink: 0; display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; border: 1px solid #c9ccd1; border-radius: 8px; background: #fff; color: #333; font: inherit; font-size: 15px; cursor: pointer; }
    .codearo-chip::after { content: ""; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid #555; }
    .codearo-chip b { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--codearo-primary); color: #fff; font-size: 11px; line-height: 18px; }

    /* Filter sheet. */
    .codearo-flt { position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 1001; max-height: 88dvh; display: flex; flex-direction: column; overflow: hidden; border: 0; border-radius: 18px 18px 0 0; transform: translateY(105%); visibility: hidden; transition: transform .25s ease, visibility .25s; }
    .codearo-flt.is-open { transform: none; visibility: visible; }
    .codearo-flt form { display: flex; flex-direction: column; min-height: 0; max-height: 88dvh; }
    .codearo-flt-top { padding: 18px 16px 12px; border-bottom: 1px solid #eceef1; }
    .codearo-flt-top h2 { font-size: 24px; font-weight: 500; }
    .codearo-flt-top .codearo-flt-clear { display: none; }
    .codearo-flt-top .codearo-sheet-x { display: inline-grid; }
    .codearo-flt-scroll { flex: 1; overflow-y: auto; }
    .codearo-flt-section { padding: 0 16px; border-top: 0; border-bottom: 1px solid #eceef1; }
    .codearo-flt-head { padding: 16px 0; font-size: 16px; }
    .codearo-flt-body { padding-bottom: 12px; }
    .codearo-flt-check { padding: 8px 0; font-size: 15.5px; }
    .codearo-flt-check input { width: 19px; height: 19px; }
    .codearo-flt-actions { display: grid; grid-template-columns: 1fr 1.6fr; gap: 10px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid #eceef1; background: #fff; }
    .codearo-flt-reset { display: grid; place-items: center; height: 48px; border: 1px solid var(--codearo-primary); border-radius: var(--codearo-radius-pill); color: var(--codearo-primary); font-size: 16px; font-weight: 500; text-decoration: none; }
    .codearo-flt-actions .codearo-btn { height: 48px; font-size: 16px; }
}

@media (max-width: 767px) {
    /* Grey band: pinned search summary (pencil → search sheet), breadcrumb, title. */
    .codearo-results-band { padding: 145px 0 20px; }
    .codearo-results-summary { display: flex; }
    .codearo-results-searchwrap { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1001; max-height: 88vh; overflow-y: auto; padding: 18px 16px 22px; border-radius: 18px 18px 0 0; background: #fff; transform: translateY(105%); visibility: hidden; transition: transform .25s ease, visibility .25s; }
    .codearo-results-searchwrap.is-open { transform: none; visibility: visible; }
    .codearo-results-searchwrap .codearo-sheet-head { display: flex; }
    .codearo-results-searchwrap .codearo-searchbar { box-shadow: none; }
    .codearo-results-crumbs { margin: 0 0 10px; }
    .codearo-results-title { font-size: 24px; }

    .codearo-results-grid { grid-template-columns: minmax(0, 1fr); gap: 22px; }
    /* Phone card: borderless, image on top like the reference. */
    .codearo-rcard { border: 0; border-radius: 0; overflow: visible; }
    .codearo-rcard:hover { box-shadow: none; }
    .codearo-rcard-media { height: 190px; overflow: hidden; border-radius: 14px; }
    .codearo-rcard-body { padding: 12px 4px 0; }
    .codearo-rcard-body h3 { font-size: 20px; font-weight: 500; }
    .codearo-rcard-foot { padding-top: 10px; }
}

/* Meal plan code (EP / CP / MAP / AP) before the plan name. */
.codearo-plan-code { display: inline-block; margin-right: 6px; padding: 1px 6px; border-radius: 4px; background: var(--codearo-primary-soft); color: var(--codearo-primary); font-size: 11.5px; font-weight: 700; letter-spacing: .04em; text-decoration: none; vertical-align: 1px; cursor: help; }

/* Room amenities (admin icons) inside each room — desktop and phone. */
.codearo-room-amen { margin-top: 12px; }
.codearo-room-amen-title { margin: 0 0 6px; color: #111; font-size: 13px; font-weight: 600; }
.codearo-room-amen ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 14px; }
.codearo-room-amen li { display: flex; align-items: center; gap: 8px; min-width: 0; color: #333; font-size: 13.5px; }
.codearo-room-amen li[hidden] { display: none; }
.codearo-room-amen .codearo-ico, .codearo-room-amen svg { width: 17px; height: 17px; flex-shrink: 0; color: var(--codearo-primary); }
.codearo-room-amen-more { margin-top: 6px; padding: 0; border: 0; background: none; color: var(--codearo-primary); font: inherit; font-size: 13.5px; font-weight: 500; cursor: pointer; }
@media (max-width: 767px) {
    .codearo-room-chips { display: flex; margin-top: 8px; }
    .codearo-room-amen li { font-size: 14px; }
}

/* Result card price: "Starting From [old]" / "₹5,550 /night" (same reading order as the home cards). */
.codearo-rcard-per { margin: 0 0 2px; color: #000; font-size: 13.5px; }
.codearo-rcard-per s { margin-left: 4px; color: #c0392b; font-size: 13px; }
.codearo-rcard-price small { margin-left: 3px; color: var(--codearo-muted); font-size: 13px; font-weight: 400; }

/* Photo mosaic with few photos (common for camps): thumbs keep their size; one photo fills the width. */
.codearo-stay-mosaic.has-2 .codearo-stay-thumbs { grid-template-rows: repeat(2, minmax(0, 1fr)); }
.codearo-stay-mosaic.has-3 .codearo-stay-thumbs { grid-template-rows: repeat(3, minmax(0, 1fr)); }
.codearo-stay-mosaic.is-single { grid-template-columns: minmax(0, 1fr); }
.codearo-stay-allbtn { position: absolute; right: 14px; bottom: 14px; padding: 7px 14px; border-radius: var(--codearo-radius-pill); background: rgba(0, 0, 0, .6); color: #fff; font-size: 14px; }
@media (max-width: 767px) { .codearo-stay-thumbs { grid-template-rows: none; } }

/* Info card: buttons follow the details instead of sinking to the bottom when the card is short on content. */
@media (min-width: 1200px) { .codearo-stay-actions { margin-top: 0; padding-top: 28px; } .codearo-stay-info { justify-content: flex-start; } }

/* ---------- Editorial / Article / Content Pages (Blogs, About, etc.) ---------- */
.codearo-editorial-page {
    width: min(var(--codearo-container), calc(100% - 32px));
    max-width: 1240px;
    margin: 0 auto;
    padding-top: 108px;
    padding-bottom: 60px;
    color: var(--codearo-text);
    background: transparent;
    box-sizing: border-box;
}
.codearo-editorial-crumbs {
    margin: 0 0 20px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    color: var(--codearo-muted);
    font-size: 15px;
    line-height: 1.4;
}
.codearo-editorial-crumbs a {
    color: #111;
    text-decoration: none;
    transition: color .15s ease;
}
.codearo-editorial-crumbs a:hover {
    color: var(--codearo-primary);
}
.codearo-editorial-crumbs span[aria-current="page"] {
    color: #6b7280;
}

@media (max-width: 991px) {
    .codearo-editorial-page {
        padding-top: 100px;
        padding-bottom: 40px;
        width: calc(100% - 32px);
    }
    .codearo-editorial-crumbs {
        margin: 0 0 16px;
        font-size: 14px;
        gap: 6px;
    }
}

@media (max-width: 767px) {
    .codearo-editorial-page {
        padding-top: 96px;
        padding-bottom: 32px;
        width: calc(100% - 24px);
        background: transparent;
    }
    .codearo-editorial-crumbs {
        margin: 0 0 14px;
        font-size: 13.5px;
    }
}


/* Tour page: destination list links. */
.codearo-tour-dests a { color: inherit; text-decoration: underline; text-decoration-color: #1698C2; text-underline-offset: 3px; }
.codearo-tour-dests a:hover { color: var(--codearo-primary); }


/* Zain display face for public headings; Nunito carries body/UI text. */
h1, h2, h3, h4, h5, h6,
.codearo-headline, .codearo-home-heading, .codearo-banner-title, .codearo-results-title,
.codearo-stay-title, .codearo-page-banner h1, .codearo-section-title {
    font-family: var(--font-heading);
}

/* Footer attribution */
.codearo-footer-bottom a { color: #fff; text-decoration: none; }
.codearo-footer-bottom a:hover { color: var(--codearo-secondary); text-decoration: underline; }