/* Place explore — /paths/places|yoga|ayurveda|meditation|yttc/{place} (Figma: Journeys in …) */

body.ashrams-place-page {
    background: #ffffff;
}

body.ashrams-place-page .ashrams-header {
    position: relative;
    background: #ffffff;
}

body.ashrams-place-page .ashrams-footer {
    margin-top: 0;
    padding-top: 0;
    background: transparent;
}

/* Keep FAQ row color untouched; only add breathing space before footer */
body.ashrams-place-page .ashrams-journeys__faq {
    margin-bottom: clamp(1rem, 2.5vw, 1.75rem);
}

.ashrams-place-page-main {
    --paths-card-width: min(72rem, 100%);
    --paths-content-inset: clamp(1.25rem, 3vw, 3.25rem);
    padding-bottom: 0;
    background: #ffffff;
}

body.ashrams-place-page .ashrams-place__shell.container {
    max-width: var(--paths-card-width) !important;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 1000px) {
    body.ashrams-place-page .ashrams-place__shell.container {
        padding-inline: var(--paths-content-inset);
    }
}

@media (max-width: 999.98px) {
    body.ashrams-place-page .ashrams-place__shell.container {
        padding-inline: var(--ashrams-shell-pad);
    }
}

/* Guide block — slightly wider than practice listings */
body.ashrams-place-page .ashrams-journeys__guide > .container {
    max-width: min(calc(72rem + 3rem), 100%) !important;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 1000px) {
    body.ashrams-place-page .ashrams-journeys__guide > .container {
        padding-inline: var(--paths-content-inset);
    }
}

@media (max-width: 999.98px) {
    body.ashrams-place-page .ashrams-journeys__guide > .container {
        padding-inline: var(--ashrams-shell-pad);
    }
}

.ashrams-place__back-bar {
    background: #ffffff;
    margin-top: -0.65rem;
}

.ashrams-place__back-bar .container {
    max-width: var(--paths-card-width) !important;
}

.ashrams-place__back-row {
    margin: 0;
    padding: 0;
}

/* —— Hero stage (Figma: 1440×1050 bg, text + tabs on image) —— */
.ashrams-place__hero-stage {
    position: relative;
    width: 100%;
    min-height: clamp(32rem, 73vw, 65.625rem); /* ~1050px @ 1440 */
    display: flex;
    flex-direction: column;
    overflow: hidden;
    margin-bottom: clamp(2rem, 5vw, 3rem);
}

.ashrams-place__hero-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    background-size: cover;
    background-position: var(--hero-position, center 42%);
    background-repeat: no-repeat;
    pointer-events: none;
}

/* Full-bleed place hero — same frame crop as Rishikesh (homepage bg sizing + extended layer) */
.ashrams-place__hero-frame-bg:not(.ashrams-place__hero-frame-bg--himalayas) {
    inset: unset !important;
    top: -12% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 112% !important;
    background-size: 112% !important;
    background-position: 12% 56% !important;
}

.ashrams-place__hero-frame-bg--rishikesh {
    background-position: 12% 40% !important;
}

.ashrams-place__hero-frame-bg--goa {
    background-position: center 50% !important;
}

/* Himalayas — full width; +3% scale for HD; mountains both sides; bottom fade for tabs */
.ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) {
    --himalayas-ref: 1440;
    --himalayas-image-h: calc(100vw * 1050 / var(--himalayas-ref));
    --himalayas-bg-scale: 103%;
    --himalayas-bg-y: calc(-100vw * 6 / var(--himalayas-ref));
    /* Lock copy to sky band — scales with image, not rem/clamp */
    --himalayas-text-y: calc(100vw * 76 / var(--himalayas-ref));
    --himalayas-kicker-gap: calc(100vw * 24 / var(--himalayas-ref));
    --himalayas-title-intro-gap: calc(100vw * 24 / var(--himalayas-ref));
    --himalayas-kicker-size: calc(100vw * 13.2 / var(--himalayas-ref));
    --himalayas-title-size: calc(100vw * 52 / var(--himalayas-ref));
    --himalayas-title-ls: calc(100vw * -2.4 / var(--himalayas-ref));
    --himalayas-intro-size: calc(100vw * 21 / var(--himalayas-ref));
    --himalayas-intro-lh: calc(100vw * 32 / var(--himalayas-ref));
    --himalayas-intro-mobile-size: calc(100vw * 15 / var(--himalayas-ref));
    --himalayas-intro-mobile-lh: calc(100vw * 21 / var(--himalayas-ref));
    min-height: calc(var(--himalayas-image-h) + clamp(3.25rem, 7.5vw, 7rem));
    margin-bottom: clamp(2rem, 5vw, 3rem);
}

.ashrams-place__hero-frame-bg--himalayas {
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    transform: none !important;
    background-image: url('../img/ashram/place-himalayas.png') !important;
    background-image: image-set(
        url('../img/ashram/place-himalayas.png') 1x,
        url('../img/ashram/place-himalayas@2x.png') 2x,
        url('../img/ashram/place-himalayas@3x.png') 3x
    ) !important;
    background-size: var(--himalayas-bg-scale) auto !important;
    background-repeat: no-repeat !important;
    background-position: center var(--himalayas-bg-y) !important;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

/* Beat homepage .ashrams-hero__bg { background-size: 135% } on place pages */
.ashrams-hero__bg.ashrams-place__hero-frame-bg--himalayas {
    background-size: var(--himalayas-bg-scale) auto !important;
    background-position: center var(--himalayas-bg-y) !important;
}

/* Kerala — show coconut palms; shift scene down so boat sits lower in frame */
.ashrams-place__hero-frame-bg--kerala {
    top: -1% !important;
    height: 106% !important;
    background-position: center 56% !important;
    background-size: 104% !important;
}

@media (min-aspect-ratio: 3/2) {
    .ashrams-place__hero-frame-bg:not(.ashrams-place__hero-frame-bg--rishikesh):not(.ashrams-place__hero-frame-bg--kerala):not(.ashrams-place__hero-frame-bg--himalayas) {
        top: -14% !important;
        height: 114% !important;
        background-size: 132% !important;
    }

    .ashrams-place__hero-frame-bg--goa {
        background-position: center 48% !important;
    }

    .ashrams-place__hero-frame-bg--himalayas {
        top: 0 !important;
        height: 100% !important;
        background-size: var(--himalayas-bg-scale) auto !important;
        background-position: center var(--himalayas-bg-y) !important;
    }

    .ashrams-place__hero-frame-bg--kerala {
        top: 1% !important;
        height: 104% !important;
        background-size: 106% !important;
        background-position: center 54% !important;
    }
}

.ashrams-place__hero-frame-bg::after {
    display: none;
}

.ashrams-place__hero-overlay {
    position: absolute;
    inset: 0;
    /* Figma: white only top (title) + bottom (tabs); clear middle for mountains */
    background:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.97) 0%,
            rgba(255, 255, 255, 0.82) 10%,
            rgba(255, 255, 255, 0.42) 20%,
            rgba(255, 255, 255, 0.08) 30%,
            transparent 42%
        ),
        linear-gradient(
            180deg,
            transparent 0%,
            transparent 68%,
            rgba(255, 255, 255, 0.45) 82%,
            rgba(255, 255, 255, 0.88) 92%,
            #ffffff 100%
        );
    pointer-events: none;
}

/* Himalayas — bottom fade for tabs only; no side white wash */
.ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__hero-overlay {
    inset: unset;
    top: auto;
    left: 0;
    right: 0;
    bottom: 0;
    height: 22%;
    z-index: 1;
    background: linear-gradient(
        180deg,
        transparent 0%,
        rgba(255, 255, 255, 0.08) 42%,
        rgba(255, 255, 255, 0.45) 78%,
        #ffffff 100%
    );
}

/* Kerala — lighter top fade so coconut palms stay visible */
.ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__hero-overlay {
    background:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.82) 0%,
            rgba(255, 255, 255, 0.48) 10%,
            rgba(255, 255, 255, 0.12) 22%,
            transparent 36%
        ),
        linear-gradient(
            180deg,
            transparent 0%,
            transparent 68%,
            rgba(255, 255, 255, 0.45) 82%,
            rgba(255, 255, 255, 0.88) 92%,
            #ffffff 100%
        );
}

.ashrams-place__hero-content {
    position: relative;
    z-index: 2;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: var(--paths-card-width);
    margin: 0 auto;
    padding: clamp(1.25rem, 3.5vw, 2.5rem) clamp(1rem, 4vw, 48px) clamp(1.5rem, 3vw, 2rem);
    text-align: center;
}

/* —— Hero copy —— */
.ashrams-place__hero {
    text-align: center;
    width: 100%;
    margin: 0;
}

.ashrams-place__kicker {
    font-family: var(--ashrams-sans);
    font-size: 0.805rem;
    font-weight: 500;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: #8a8a8a;
    margin: 0 0 1.25rem;
}

.ashrams-place__kicker-brand {
    color: var(--ashrams-terracotta);
}

/* Figma: full title — Cormorant Infant 500, 60px / 45px, -2.4px (same as Paths page) */
body.ashrams-place-page .ashrams-place__title {
    font-family: 'Cormorant Infant', var(--ashrams-serif);
    font-size: 3.25rem;
    font-weight: 220;
    font-style: normal;
    font-synthesis: none;
    line-height: 1.2;
    letter-spacing: -2.4px;
    margin: 0 0 1.25rem;
}

body.ashrams-place-page .ashrams-place__title-accent,
body.ashrams-place-page .ashrams-place__title-rest {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    font-style: normal;
    line-height: inherit;
    letter-spacing: inherit;
}

.ashrams-place__title-accent {
    color: var(--ashrams-terracotta);
}

.ashrams-place__title-rest {
    color: var(--ashrams-text);
}

/* Figma: Plus Jakarta Sans 20 / 28 intro */
body.ashrams-place-page .ashrams-place__intro {
    font-family: var(--paths-body-font, 'Plus Jakarta Sans', var(--ashrams-sans));
    font-size: 19px;
    font-weight: 220;
    font-style: normal;
    line-height: 28px;
    letter-spacing: 0;
    color: #55433d;
    margin: 0 auto;
    max-width: 36rem;
}

/* Himalayas desktop intro — Figma: Manrope 400, 21/32, #5E5E5F, 2 lines */
body.ashrams-place-page .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__intro--desktop,
body.ashrams-place-page .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__intro:not(.ashrams-place__intro--mobile) {
    font-family: var(--ashrams-manrope, 'Manrope', system-ui, sans-serif);
    font-size: clamp(calc(100vw * 14 / var(--himalayas-ref)), var(--himalayas-intro-size), 21px);
    font-weight: 400;
    line-height: clamp(calc(100vw * 22 / var(--himalayas-ref)), var(--himalayas-intro-lh), 32px);
    letter-spacing: 0;
    color: #5E5E5F;
    max-width: 58rem;
    text-align: center;
}

/* Himalayas — sky-locked copy block (scales with hero image) */
.ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__hero-content {
    padding-top: var(--himalayas-text-y);
}

.ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    padding-top: 0;
}

.ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__kicker {
    font-size: clamp(calc(100vw * 9 / var(--himalayas-ref)), var(--himalayas-kicker-size), 0.825rem);
    margin-bottom: var(--himalayas-kicker-gap);
}

body.ashrams-place-page .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__title {
    font-size: clamp(calc(100vw * 22 / var(--himalayas-ref)), var(--himalayas-title-size), 3.25rem);
    letter-spacing: clamp(-0.03em, var(--himalayas-title-ls), -2.4px);
    margin-bottom: var(--himalayas-title-intro-gap);
}

.ashrams-place__intro--mobile {
    display: none;
}

@media (max-width: 899.98px) {
    .ashrams-place__intro--desktop {
        display: none;
    }

    body.ashrams-place-page .ashrams-place__intro--mobile {
        display: block;
        font-size: 15px;
        line-height: 28px;
    }
}

/* —— Practice tabs (bottom of hero, on image) —— */
.ashrams-place__tabs-wrap {
    width: 100%;
    max-width: var(--paths-card-width);
    margin-top: auto;
    padding-top: clamp(1.5rem, 4vw, 2.5rem);
    border-bottom: 1px solid rgba(232, 228, 223, 0.85);
}

.ashrams-place__tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem clamp(1.25rem, 3.5vw, 2.25rem);
    list-style: none;
    margin: 0;
    padding: 0 0 0.65rem;
    justify-content: center;
}

.ashrams-place__tabs li {
    display: flex;
    align-items: flex-end;
}

.ashrams-place__tabs a {
    font-family: var(--ashrams-sans);
    font-size: 0.875rem;
    font-weight: 400;
    color: #8a8a8a;
    text-decoration: none;
    padding-bottom: 0.35rem;
    border-bottom: 2px solid transparent;
    transition: color 0.2s ease, border-color 0.2s ease;
    white-space: nowrap;
}

.ashrams-place__tabs a:hover,
.ashrams-place__tabs a.is-active {
    color: var(--ashrams-terracotta);
    border-bottom-color: var(--ashrams-terracotta);
}

/* —— Section bridge —— */
.ashrams-place__bridge {
    position: relative;
    text-align: center;
    margin: clamp(2.5rem, 6vw, 4rem) auto clamp(2rem, 5vw, 3rem);
    max-width: var(--paths-card-width);
}

.ashrams-place__bridge::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    background: #ebe9e6;
    z-index: 0;
}

.ashrams-place__bridge span {
    position: relative;
    z-index: 1;
    display: inline-block;
    padding: 0 1rem;
    background: #ffffff;
    font-family: var(--ashrams-sans);
    font-size: clamp(0.55rem, 1.1vw, 0.62rem);
    font-weight: 500;
    letter-spacing: 0.12em;
    color: #b0b0b0;
}

.ashrams-place__bridge--final {
    margin-top: clamp(1rem, 3vw, 2rem);
    margin-bottom: clamp(1.25rem, 3vw, 2rem);
}

/* —— Practice block —— */
.ashrams-place__practice {
    margin: 0 auto clamp(4rem, 8vw, 5.5rem);
    scroll-margin-top: 5.5rem;
}

.ashrams-place__practice-head {
    text-align: center;
    margin: 0 auto clamp(3rem, 5vw, 3.75rem);
}

.ashrams-place__practice-eyebrow {
    font-family: var(--ashrams-sans);
    font-size: clamp(0.55rem, 1.2vw, 0.65rem);
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #7a7a7a;
    margin: 0 0 0.75rem;
}

.ashrams-place__practice-eyebrow-brand {
    color: var(--ashrams-terracotta);
}

.ashrams-place__practice-title {
    font-family: 'Cormorant Infant', var(--ashrams-serif);
    font-size: clamp(2rem, 5vw, 2.75rem);
    font-weight: 500;
    font-style: normal;
    color: var(--ashrams-terracotta);
    margin: 0 0 0.85rem;
    line-height: 1.15;
}

.ashrams-place__practice-intro {
    font-family: var(--paths-body-font, 'Plus Jakarta Sans', var(--ashrams-sans));
    font-size: clamp(0.875rem, 1.8vw, 1rem);
    font-weight: 400;
    line-height: 1.65;
    color: #7a7a7a;
    margin: 0 auto;
    max-width: 40rem;
}

.ashrams-place__listing {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(1.5rem, 4vw, 2.75rem);
    align-items: start;
    margin-bottom: clamp(2.5rem, 5vw, 3.5rem);
}

@media (min-width: 1000px) {
    .ashrams-place__listing {
        /* Figma ~72px gutter between image + copy @ 1280px main */
        gap: 4.5rem;
    }
}

.ashrams-place__listing-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    text-align: left;
}

.ashrams-place__listing--reverse .ashrams-place__listing-media {
    order: 2;
}

.ashrams-place__listing--reverse .ashrams-place__listing-copy {
    order: 1;
}

.ashrams-place__listing-media {
    border-radius: 40px;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: #e5e0da;
    position: relative;
}

/* Explore location — image col 1.03fr; same shell width as journeys */
@media (min-width: 851px) {
    body.ashrams-place-page .ashrams-explore-place-page .ashrams-place__listing,
    body.ashrams-place-page .ashrams-explore-place-page .ashrams-place__listing--reverse {
        align-items: stretch;
        gap: 2.25rem;
        margin-bottom: clamp(3rem, 5vw, 4rem);
    }

    body.ashrams-place-page .ashrams-explore-place-page .ashrams-place__listing {
        grid-template-columns: minmax(0, 1.03fr) minmax(0, 0.97fr);
    }

    body.ashrams-place-page .ashrams-explore-place-page .ashrams-place__listing--reverse {
        grid-template-columns: minmax(0, 0.97fr) minmax(0, 1.03fr);
    }

    body.ashrams-place-page .ashrams-explore-place-page .ashrams-place__practice .ashrams-place__listing:last-child {
        margin-bottom: 0;
    }

    body.ashrams-place-page .ashrams-explore-place-page .ashrams-place__listing-media {
        width: 100%;
        max-width: none;
        align-self: start;
        justify-self: stretch;
        height: auto;
        aspect-ratio: 592 / 400;
    }

    body.ashrams-place-page .ashrams-explore-place-page .ashrams-place__listing-copy {
        align-self: stretch;
        min-height: 100%;
        justify-content: space-between;
        gap: 0;
    }

    /* Flatten foot so price + CTA get even gaps like Figma (4 stack items) */
    body.ashrams-place-page .ashrams-explore-place-page .ashrams-place__listing-foot {
        display: contents;
    }

    body.ashrams-place-page .ashrams-explore-place-page .ashrams-place__listing-title,
    body.ashrams-place-page .ashrams-explore-place-page .ashrams-place__listing-desc,
    body.ashrams-place-page .ashrams-explore-place-page .ashrams-place__listing-price,
    body.ashrams-place-page .ashrams-explore-place-page .ashrams-place__listing-cta {
        margin: 0;
    }
}

body.ashrams-place-page .ashrams-explore-place-page .ashrams-place__listing-media {
    aspect-ratio: 592 / 400;
    height: auto;
}

.ashrams-place__listing-media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ashrams-place__listing-dots {
    position: absolute;
    bottom: 1rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 0.35rem;
    z-index: 1;
}

.ashrams-place__listing-dots span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.85);
}

.ashrams-place__listing-dots span:first-child {
    background: #ffffff;
}

.ashrams-place__listing-title {
    font-family: 'Cormorant Infant', var(--ashrams-serif);
    font-size: clamp(1.5625rem, 3.3vw, 1.95rem);
    font-weight: 500;
    line-height: 1.2;
    color: var(--ashrams-text);
    margin: 0 0 0.75rem;
}

.ashrams-place__listing-desc {
    font-family: var(--paths-body-font, 'Plus Jakarta Sans', var(--ashrams-sans));
    font-size: 0.9375rem;
    font-weight: 300;
    line-height: 1.8;
    color: #55433d;
    margin: 0 0 1rem;
}

.ashrams-place__listing-price {
    font-family: var(--ashrams-sans);
    font-size: 0.875rem;
    color: var(--ashrams-text);
    margin: 0;
}

.ashrams-place__listing-foot {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.15rem;
    width: 100%;
    margin-top: 0.15rem;
}

.ashrams-place__listing-cta-text--short {
    display: none;
}

.ashrams-place__listing-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.65rem 1.35rem;
    border: 1px solid var(--ashrams-terracotta);
    border-radius: 9999px;
    font-family: var(--ashrams-sans);
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--ashrams-terracotta);
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
}

.ashrams-place__listing-cta:hover {
    background: var(--ashrams-terracotta);
    color: #fff;
}

.ashrams-place__listing-price strong {
    font-weight: 600;
}

.ashrams-place__back {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-family: var(--ashrams-sans);
    font-size: 0.6rem;
    font-weight: 400;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #9a9a9a;
    text-decoration: none;
}

.ashrams-place__back:hover {
    color: var(--ashrams-terracotta);
}

@media (max-width: 767.98px) {
    .ashrams-place__hero-stage:not(:has(.ashrams-place__hero-frame-bg--kerala)):not(:has(.ashrams-place__hero-frame-bg--goa)):not(:has(.ashrams-place__hero-frame-bg--himalayas)) {
        min-height: clamp(28rem, 128vw, 38rem);
    }

    .ashrams-place__hero-content {
        gap: clamp(0.75rem, 2.5vw, 1.25rem);
    }

    .ashrams-place__tabs-wrap {
        padding-top: clamp(1rem, 3vw, 1.75rem);
    }

    .ashrams-place__hero-bg {
        width: 130%;
        height: 115%;
    }

    body.ashrams-place-page .ashrams-place__title {
        font-size: clamp(2.375rem, 9vw, 3.75rem);
        line-height: 1.12;
        letter-spacing: -0.04em;
    }

    body.ashrams-place-page .ashrams-place__intro--desktop {
        font-size: clamp(1rem, 4.2vw, 20px);
        line-height: 1.4;
        max-width: 22rem;
    }
}

@media (max-width: 999.98px) {
    .ashrams-place__listing,
    .ashrams-place__listing--reverse {
        grid-template-columns: 1fr;
    }

    .ashrams-place__listing--reverse .ashrams-place__listing-media,
    .ashrams-place__listing--reverse .ashrams-place__listing-copy {
        order: unset;
    }
}

/* Listing card — price left, short CTA right (Figma mobile / tablet copy column) */
@media (max-width: 999.98px) {
    .ashrams-place__listing-foot {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
    }

    .ashrams-place__listing-cta-text--long {
        display: none;
    }

    .ashrams-place__listing-cta-text--short {
        display: inline;
    }

    .ashrams-place__listing-cta {
        flex-shrink: 0;
        margin-left: auto;
    }
}

/* Tablet / portrait hero — keep tabs centered (matches journeys page) */
@media (max-width: 999.98px) {
    .ashrams-place__tabs {
        justify-content: center;
        flex-wrap: wrap;
        overflow-x: visible;
        gap: 0.5rem clamp(0.85rem, 3vw, 1.5rem);
    }
}

@media (max-width: 480px) {
    .ashrams-place__tabs {
        gap: 0.45rem 0.85rem;
    }

    .ashrams-place__tabs a {
        font-size: 0.75rem;
    }
}

/* Rishikesh ≤999px — place page portrait hero (not homepage .ashrams-hero--home) */
@media (max-width: 999.98px) {
    .ashrams-place__hero-stage .ashrams-place__hero-frame-bg--rishikesh {
        inset: unset !important;
        top: clamp(5.75rem, 4.5rem + 2.5vw, 7.25rem) !important;
        left: 0 !important;
        right: 0 !important;
        bottom: auto !important;
        width: 100% !important;
        height: calc(100vw * 1894 / 1200) !important;
        transform: none !important;
        background-image: url('../img/ashram/hero-temple-mobile.jpg') !important;
        background-size: 100% auto !important;
        background-repeat: no-repeat !important;
        background-position: center top !important;
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--rishikesh) {
        min-height: calc(100vw * 1894 / 1200 + clamp(5.5rem, 4rem + 2vw, 7rem));
        margin-bottom: clamp(2.5rem, 6vw, 3.5rem);
        background: #ffffff;
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--rishikesh) .ashrams-place__hero-content {
        min-height: inherit;
        padding-top: clamp(1rem, 3.5vw, 1.75rem);
        padding-bottom: clamp(1rem, 2.5vw, 1.5rem);
        justify-content: space-between;
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--rishikesh) .ashrams-place__hero {
        flex-shrink: 0;
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--rishikesh) .ashrams-place__tabs-wrap {
        margin-top: auto;
        padding-top: clamp(2.5rem, 8vw, 4rem);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--rishikesh) .ashrams-place__hero-overlay {
        inset: unset;
        top: clamp(5.75rem, 4.5rem + 2.5vw, 7.25rem);
        left: 0;
        right: 0;
        bottom: auto;
        height: calc(100vw * 1894 / 1200);
        background: linear-gradient(
            180deg,
            transparent 0%,
            transparent 88%,
            rgba(255, 255, 255, 0.12) 93%,
            rgba(255, 255, 255, 0.45) 97%,
            rgba(255, 255, 255, 0.85) 100%
        ) !important;
    }
}

/* Desktop — hero bg full viewport width (no right-side gap) */
@media (min-width: 1000px) {
    .ashrams-place__hero-frame-bg:not(.ashrams-place__hero-frame-bg--himalayas) {
        inset: unset !important;
        top: -12% !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        height: 112% !important;
        transform: none !important;
        background-size: 135% !important;
        background-repeat: no-repeat !important;
    }

    .ashrams-hero__bg.ashrams-place__hero-frame-bg--himalayas,
    .ashrams-place__hero-frame-bg--himalayas {
        inset: 0 !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        height: 100% !important;
        transform: none !important;
        background-size: var(--himalayas-bg-scale) auto !important;
        background-position: center var(--himalayas-bg-y) !important;
    }

    .ashrams-place__hero-frame-bg--rishikesh {
        top: -4% !important;
        background-position: 0% 10% !important;
    }

    .ashrams-place__hero-frame-bg--goa {
        background-position: center 46% !important;
    }

    .ashrams-place__hero-frame-bg--kerala {
        top: 1% !important;
        height: 104% !important;
        background-size: 108% !important;
        background-position: center 54% !important;
    }
}

/* Tablet landscape — full width (non-Rishikesh portrait hero; Goa/Himalayas use cover below) */
@media (min-width: 481px) and (max-width: 999.98px) {
    .ashrams-place__hero-frame-bg:not(.ashrams-place__hero-frame-bg--rishikesh):not(.ashrams-place__hero-frame-bg--kerala):not(.ashrams-place__hero-frame-bg--goa):not(.ashrams-place__hero-frame-bg--himalayas) {
        inset: unset !important;
        top: -14% !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        height: 114% !important;
        transform: none !important;
        background-size: 132% !important;
        background-repeat: no-repeat !important;
    }
}

/* Goa ≤999px — Figma mobile: text on sky, ocean cover crop */
@media (max-width: 999.98px) {
    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--goa) {
        min-height: calc(100vw * 590 / 393);
        margin-bottom: clamp(2rem, 5vw, 3rem);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--goa) .ashrams-place__hero-content {
        min-height: inherit;
        justify-content: space-between;
        /* Scales up from compact 254px floor — no jump at 255px */
        padding-top: min(
            calc(100vw * 590 / 393 * 0.085),
            max(0.65rem, calc(0.65rem + max(0px, 100vw - 254px) * 0.065))
        );
        padding-bottom: clamp(0.75rem, 2vw, 1.25rem);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--goa) .ashrams-place__hero {
        flex-shrink: 0;
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--goa) .ashrams-place__kicker {
        font-size: clamp(0.48rem, 2.15vw, 0.75rem);
        letter-spacing: clamp(0.2em, 0.24em + 0.04vw, 0.28em);
        /* Breathing room between kicker and title — capped at 480px scale for tablet lock */
        margin-bottom: clamp(
            0.75rem,
            min(4.25vw, calc(480px * 4.25 / 100)),
            1.15rem
        );
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--goa) .ashrams-place__title {
        font-size: clamp(1.375rem, 7vw, 2.65rem);
        line-height: clamp(1.05, 1.02 + 0.06vw, 1.08);
        letter-spacing: -0.03em;
        margin-bottom: clamp(0.25rem, 1.6vw, 0.75rem);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--goa) .ashrams-place__intro--mobile {
        font-size: clamp(10px, 3.45vw, 15px);
        line-height: clamp(14px, calc(3.45vw + 5px), 21px);
        max-width: min(20rem, 90vw);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--goa) .ashrams-place__tabs-wrap {
        margin-top: auto;
        padding-top: clamp(0.85rem, 4vw, 2rem);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--goa) .ashrams-place__tabs {
        justify-content: center;
        width: 100%;
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--goa) .ashrams-place__tabs a {
        font-size: clamp(0.6875rem, 2.1vw, 0.75rem);
    }

    .ashrams-hero__bg.ashrams-place__hero-frame-bg--goa,
    .ashrams-place__hero-frame-bg--goa {
        inset: 0 !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        height: 100% !important;
        transform: none !important;
        background-size: cover !important;
        background-repeat: no-repeat !important;
        background-position: center 48% !important;
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--goa) .ashrams-place__hero-overlay {
        background:
            linear-gradient(
                180deg,
                rgba(255, 255, 255, 0.12) 0%,
                rgba(255, 255, 255, 0.05) 8%,
                transparent 18%
            ),
            linear-gradient(
                180deg,
                transparent 0%,
                transparent 68%,
                rgba(255, 255, 255, 0.45) 82%,
                rgba(255, 255, 255, 0.88) 92%,
                #ffffff 100%
            ) !important;
    }
}

/* Goa 481–999px — lock to 480px composition (text on blue sky, same crop) */
@media (min-width: 481px) and (max-width: 999.98px) {
    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--goa) {
        min-height: calc(480px * 590 / 393);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--goa) .ashrams-place__hero-content {
        padding-top: clamp(2.75rem, calc(480px * 590 / 393 * 0.085), 9.5rem);
    }

    .ashrams-hero__bg.ashrams-place__hero-frame-bg--goa,
    .ashrams-place__hero-frame-bg--goa {
        background-position: center 48% !important;
    }
}

/* Goa ≤320px — nudge bg crop for narrow sky band */
@media (max-width: 320px) {
    .ashrams-hero__bg.ashrams-place__hero-frame-bg--goa,
    .ashrams-place__hero-frame-bg--goa {
        background-position: center 44% !important;
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--goa) .ashrams-place__intro--mobile {
        max-width: 13.5rem;
    }
}

/* Himalayas ≤999px — Figma mobile: text on sky, full lake/reflection visible */
@media (max-width: 999.98px) {
    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) {
        min-height: calc(var(--himalayas-image-h) + clamp(3.25rem, 7.5vw, 7rem));
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__hero-content {
        min-height: inherit;
        justify-content: space-between;
        padding-bottom: clamp(0.75rem, 2vw, 1.25rem);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__hero {
        flex-shrink: 0;
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__kicker {
        letter-spacing: clamp(0.2em, 0.24em + 0.04vw, 0.28em);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__title {
        line-height: clamp(1.05, 1.02 + 0.06vw, 1.08);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__intro--mobile {
        font-size: clamp(10px, var(--himalayas-intro-mobile-size), 15px);
        line-height: clamp(14px, var(--himalayas-intro-mobile-lh), 21px);
        max-width: min(20rem, 90vw);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__tabs-wrap {
        margin-top: auto;
        padding-top: clamp(0.85rem, 4vw, 2rem);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__tabs {
        justify-content: center;
        width: 100%;
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__tabs a {
        font-size: clamp(0.6875rem, 2.1vw, 0.75rem);
    }

    .ashrams-hero__bg.ashrams-place__hero-frame-bg--himalayas,
    .ashrams-place__hero-frame-bg--himalayas {
        inset: 0 !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        height: 100% !important;
        transform: none !important;
        background-size: var(--himalayas-bg-scale) auto !important;
        background-repeat: no-repeat !important;
        background-position: center var(--himalayas-bg-y) !important;
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__hero-overlay {
        inset: unset !important;
        top: auto !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        height: 24% !important;
        background: linear-gradient(
            180deg,
            transparent 0%,
            rgba(255, 255, 255, 0.06) 40%,
            rgba(255, 255, 255, 0.42) 75%,
            #ffffff 100%
        ) !important;
    }
}

/* Himalayas ≤480px — keep copy in sky on narrow phones */
@media (max-width: 480px) {
    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) {
        --himalayas-kicker-gap: calc(100vw * 18 / var(--himalayas-ref));
        --himalayas-title-intro-gap: calc(100vw * 14 / var(--himalayas-ref));
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__intro--mobile {
        font-size: clamp(9px, var(--himalayas-intro-mobile-size), 15px);
        line-height: clamp(13px, var(--himalayas-intro-mobile-lh), 21px);
    }
}

/* Himalayas ≤320px — narrow intro */
@media (max-width: 320px) {

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--himalayas) .ashrams-place__intro--mobile {
        max-width: 13.5rem;
    }
}

/* Kerala <1284px — scale 1284px hero text position (sky band, clear of palms) */
@media (max-width: 1283.98px) {
    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__hero-content {
        justify-content: space-between;
        padding-top: clamp(1rem, calc(100vw * 40 / 1284), 2.5rem);
        padding-bottom: clamp(0.75rem, calc(100vw * 24 / 1284), 2rem);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__hero {
        flex-shrink: 0;
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__kicker {
        font-size: clamp(0.58rem, calc(100vw * 13.2 / 1284), 0.825rem);
        letter-spacing: clamp(0.22em, 0.28em, 0.32em);
        margin-bottom: clamp(0.45rem, calc(100vw * 20 / 1284), 1.25rem);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__title {
        font-size: clamp(1.625rem, calc(100vw * 52 / 1284), 3.25rem);
        line-height: 1.12;
        letter-spacing: clamp(-2.4px, calc(100vw * -2.4 / 1284), -0.5px);
        margin-bottom: clamp(0.35rem, calc(100vw * 20 / 1284), 1.25rem);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__intro--desktop,
    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__intro--mobile {
        font-size: clamp(11px, calc(100vw * 19 / 1284), 19px);
        line-height: clamp(16px, calc(100vw * 28 / 1284), 28px);
        max-width: min(36rem, calc(100vw * 520 / 1284));
    }
}

/* Kerala 481px+ — same desktop frame crop (continuous through 1000px, no jump) */
@media (min-width: 481px) {
    .ashrams-hero__bg.ashrams-place__hero-frame-bg--kerala,
    .ashrams-place__hero-frame-bg--kerala {
        inset: unset !important;
        top: 1% !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        height: 104% !important;
        transform: none !important;
        background-size: 108% !important;
        background-repeat: no-repeat !important;
        background-position: center 54% !important;
    }
}

/* Kerala 481–999px — lock 1000px hero frame (no cover-crop / Figma-ratio jump) */
@media (min-width: 481px) and (max-width: 999.98px) {
    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) {
        min-height: max(32rem, 730px);
    }
}

/* Kerala ≤999px — tabs only (bg/text match desktop frame crop above 480px) */
@media (max-width: 999.98px) {
    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__tabs-wrap {
        margin-top: auto;
        padding-top: clamp(1.25rem, 4vw, 2rem);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__tabs {
        justify-content: center;
        width: 100%;
    }
}

/* Kerala ≤480px — mobile cover crop (boat visible; stacks below tablet/desktop frame band) */
@media (max-width: 480.98px) {
    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) {
        min-height: calc(100vw * 590 / 393);
        margin-bottom: clamp(2rem, 5vw, 3rem);
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__hero-content {
        min-height: inherit;
        justify-content: space-between;
        padding-bottom: clamp(0.75rem, 2vw, 1.25rem);
    }

    .ashrams-hero__bg.ashrams-place__hero-frame-bg--kerala,
    .ashrams-place__hero-frame-bg--kerala {
        inset: 0 !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        height: 100% !important;
        transform: none !important;
        background-size: cover !important;
        background-repeat: no-repeat !important;
        background-position: center calc(34% + max(0px, 420px - 100vw) * 0.065 + max(0px, 360px - 100vw) * 0.045) !important;
    }

    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__hero-overlay {
        background:
            linear-gradient(
                180deg,
                rgba(255, 255, 255, 0.45) 0%,
                rgba(255, 255, 255, 0.2) 7%,
                rgba(255, 255, 255, 0.05) 14%,
                transparent 24%
            ),
            linear-gradient(
                180deg,
                transparent 0%,
                transparent 68%,
                rgba(255, 255, 255, 0.45) 82%,
                rgba(255, 255, 255, 0.88) 92%,
                #ffffff 100%
            ) !important;
    }
}

@media (max-width: 420px) {
    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__intro--mobile {
        max-width: min(16rem, calc(100vw * 420 / 1284));
    }
}

@media (max-width: 360px) {
    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__intro--mobile {
        max-width: min(14.75rem, calc(100vw * 380 / 1284));
    }
}

@media (max-width: 320px) {
    .ashrams-place__hero-stage:has(.ashrams-place__hero-frame-bg--kerala) .ashrams-place__intro--mobile {
        max-width: min(14rem, calc(100vw * 340 / 1284));
    }
}
