/* ═══════════════════════════════════════════════════════════════
       DESIGN TOKENS — Typography Scale
       All new sections use these variables for consistency.
    ═══════════════════════════════════════════════════════════════ */
    :root {
        /* Font sizes */
        --fs-2xs : 11px;                          /* micro labels, stat-bot */
        --fs-xs  : 12px;                          /* eyebrow pills, badges */
        --fs-sm  : 13px;                          /* marquee, fine print */
        --fs-base: 15px;                          /* body paragraphs */
        --fs-md  : 17px;                          /* card titles, step titles */
        --fs-lg  : clamp(20px, 2.4vw, 24px);     /* h3 / sub-headings */
        --fs-xl  : clamp(26px, 3.5vw, 38px);     /* section h2 */
        --fs-2xl : clamp(30px, 5vw, 52px);       /* hero / banner h1 */
        --fs-stat: 15px;                          /* banner stats top row */

        /* Line heights */
        --lh-tight  : 1.15;
        --lh-snug   : 1.3;
        --lh-base   : 1.65;
        --lh-relaxed: 1.75;

        /* Spacing */
        --section-py: 70px;

        /* Brand colours */
        --gold      : #e8a83a;
        --gold-dark : #c7851a;
        --dark-bg   : #0d0d0d;
        --card-bg   : #181818;
        --text-muted: rgba(255,255,255,.62);
        --text-sub  : rgba(255,255,255,.45);
    }

    /* --- Shared typography normalisation for all new sections --- */

    /* Eyebrow pills (small uppercased labels above headings) */
    .bym-eyebrow,
    .steps-eyebrow,
    .why-eyebrow,
    .hb-eyebrow,
    .reviews-eyebrow,
    .visit-spa-eyebrow,
    .about-why-eyebrow {
        font-size: var(--fs-xs) !important;
        line-height: 1;
    }

    /* Section headings h2 */
    .bym-heading,
    .steps-heading,
    .why-heading,
    .hb-heading,
    .reviews-heading,
    .visit-spa-heading,
    .about-why-heading {
        font-size: var(--fs-xl) !important;
        line-height: var(--lh-tight) !important;
    }

    /* Card / step titles h3 */
    .step-title,
    .why-title,
    .about-feat-title,
    .hb-cta-title {
        font-size: var(--fs-md) !important;
        line-height: var(--lh-snug) !important;
    }

    /* Body paragraphs inside new sections */
    .bym-sub,
    .steps-sub,
    .hb-text,
    .step-desc,
    .why-desc,
    .about-feat-desc,
    .about-why-intro,
    .rev-text,
    .visit-spa-intro,
    .hb-cta-sub {
        font-size: var(--fs-base) !important;
        line-height: var(--lh-base) !important;
    }

    /* Banner stats */
    .bb-stat-top { font-size: var(--fs-stat) !important; }
    .bb-stat-bot { font-size: var(--fs-2xs) !important; }

    /* Review cards — reviewer name / meta */
    .rev-name { font-size: var(--fs-base) !important; }
    .rev-info,
    .rev-time,
    .rev-google-badge { font-size: var(--fs-sm) !important; }
    .rev-text { font-size: var(--fs-sm) !important; }

    /* Marquee */
    .marquee-item { font-size: var(--fs-sm) !important; }

    /* ── FAQ Section ──────────────────────────────────────────── */
    .faq-section {
        background: #0d0d0d;
        padding: var(--section-py) 0;
    }
    .faq-sidebar {
        background: linear-gradient(160deg, #2a0a04 0%, #1a0800 100%);
        border-radius: 16px;
        padding: 36px 28px;
        height: 100%;
        display: flex;
        flex-direction: column;
        gap: 0;
    }
    .faq-sidebar-heading {
        font-size: clamp(28px, 4vw, 40px);
        font-weight: 900;
        color: #fff;
        line-height: 1.1;
        margin-bottom: 20px;
        letter-spacing: -.5px;
    }
    .faq-sidebar-sub {
        font-size: var(--fs-base);
        color: rgba(255,255,255,.62);
        line-height: var(--lh-base);
        margin-bottom: 28px;
    }
    .faq-contact-link {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: var(--fs-base);
        font-weight: 500;
        color: #fff;
        text-decoration: underline;
        margin-bottom: 14px;
        transition: color .2s ease;
    }
    .faq-contact-link:hover { color: #e8a83a; text-decoration: underline; }
    .faq-contact-icon { font-size: 18px; flex-shrink: 0; }
    .faq-more-btn {
        display: block;
        width: 100%;
        margin-top: auto;
        padding-top: 28px;
        text-align: center;
        border-top: 1px solid rgba(255,255,255,.1);
    }
    .faq-more-btn a {
        display: inline-block;
        padding: 12px 30px;
        border: 1px solid rgba(255,255,255,.3);
        border-radius: 6px;
        color: #fff;
        font-size: var(--fs-base);
        font-weight: 500;
        text-decoration: underline;
        transition: border-color .2s ease, color .2s ease;
    }
    .faq-more-btn a:hover {
        border-color: #e8a83a;
        color: #e8a83a;
    }
    /* FAQ list (right column) */
    .faq-list {
        list-style: none;
        padding: 0;
        margin: 0;
    }
    .faq-list li {
        border-bottom: 1px solid rgba(255,255,255,.07);
        padding: 18px 0;
        font-size: var(--fs-base);
        color: rgba(255,255,255,.7);
        line-height: var(--lh-base);
    }
    .faq-list li:first-child { padding-top: 0; }
    .faq-list li b {
        display: block;
        font-size: var(--fs-base);
        font-weight: 500;
        color: #fff;
        margin-bottom: 6px;
    }

    /* Section padding uniformity */
    .about-why-section,
    .visit-spa-section,
    .reviews-section,
    .hb-section,
    .steps-section,
    .why-section,
    .book-massage-section {
        padding: var(--section-py) 0;
    }

    /* Responsive overrides for the token scale */
    @media (max-width: 767px) {
        :root {
            --fs-xl      : clamp(22px, 6vw, 30px);
            --fs-2xl     : clamp(26px, 7vw, 38px);
            --section-py : 48px;
        }
    }
    @media (max-width: 480px) {
        :root {
            --fs-xl      : clamp(20px, 7vw, 26px);
            --fs-md      : 16px;
            --section-py : 36px;
        }
    }

    .header .caption h1,
    .section-title {
        text-transform: capitalize;
    }

    .section-title {
        text-transform: capitalize;
        font-size: 43px;
    }

    .SmBanner p {
        text-align: center;
    }

    .service-card {
        position: relative;
        display: block;
        padding: 24px;
        border: 1px solid #e9ecef;
        border-radius: 14px;
        background: #fff;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
        transition: transform .2s ease, box-shadow .2s ease;
        text-decoration: none;
        color: inherit;
        height: 100%;
    }

    .service-card:hover {
        transform: translateY(-4px);
        width: 100%;
        box-shadow: 0 16px 28px rgba(0, 0, 0, 0.10);
    }

    .service-tag {
        position: absolute;
        top: 12px;
        left: 12px;
        padding: 5px 12px;
        font-size: 12px;
        line-height: 1;
        border-radius: 999px;
        background: #ff6b6b;
        color: #fff;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
    }

    .service-card-title {
        margin: 8px 0 0;
        font-size: 20px;
        font-weight: 500;
        color: inherit;
    }

    .service-card--featured {
        background: linear-gradient(135deg, #c7d400 0%, #9eaf00 100%);
        color: #0a0a0a;
        border-color: transparent;
        box-shadow: 0 12px 28px rgba(199, 212, 0, 0.25);
    }

    .service-card--featured .service-card-title {
        color: #0a0a0a;
        text-align: center;
    }

    .service-card--featured .service-tag {
        background: #0a0a0a;
        color: #c7d400;
    }

    .FaqChan li {
        padding-top: 15px;
    }

    /* ── Banner Bottom Bar ──────────────────────────────────────── */
    .banner-bar {
        width: 100%;
        background: rgba(0,0,0,.55);
        border-top: 1px solid rgba(255,255,255,.08);
        padding: 14px 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 12px;
        margin-top: 24px;
    }
    .banner-bar-btns {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
        align-items: center;
    }
    .bb-btn {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        padding: 10px 22px;
        border-radius: 4px;
        font-size: 14px;
        font-weight: 500;
        text-decoration: none;
        white-space: nowrap;
        transition: opacity .2s ease;
    }
    .bb-btn:hover { opacity: .85; text-decoration: none; }
    .bb-btn-wa  { background: #a8d400; color: #000; border: 2px solid #a8d400; }
    .bb-btn-call { background: #1565c0; color: #fff; border: 2px solid #1565c0; }
    .banner-bar-stats {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 0;
    }
    .bb-stat {
        text-align: center;
        padding: 0 18px;
        position: relative;
    }
    .bb-stat + .bb-stat::before {
        content: '|';
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        color: rgba(255,255,255,.3);
        font-size: 20px;
    }
    .bb-stat-top {
        font-size: 15px;
        font-weight: 800;
        color: #fff;
        line-height: 1.1;
        display: block;
    }
    .bb-stat-bot {
        font-size: 11px;
        color: rgba(255,255,255,.55);
        letter-spacing: .5px;
        display: block;
        margin-top: 2px;
    }
    @media (max-width: 767px) {
        .banner-bar { justify-content: center; }
        .banner-bar-btns { justify-content: center; }
        .banner-bar-stats { justify-content: center; }
        .bb-stat { padding: 6px 12px; }
    }
    @media (max-width: 480px) {
        .bb-btn { padding: 9px 16px; font-size: 13px; }
        .bb-stat-top { font-size: 13px; }
    }

    /* ── About / Why Chandrima Section ─────────────────────────── */
    .about-why-section {
        background: #0d0d0d;
        padding: 70px 0;
    }
    .about-img-wrap {
        position: relative;
        display: inline-block;
        width: 100%;
    }
    .about-img-wrap img {
        width: 100%;
        border-radius: 14px;
        display: block;
        object-fit: cover;
        max-height: 520px;
    }
    .about-price-badge {
        position: absolute;
        bottom: 0;
        left: 0;
        background: rgba(0,0,0,.82);
        color: #fff;
        padding: 14px 24px;
        border-bottom-left-radius: 14px;
        border-top-right-radius: 14px;
    }
    .about-price-badge .badge-price {
        font-size: 32px;
        font-weight: 900;
        line-height: 1;
        display: block;
        color: #fff;
    }
    .about-price-badge .badge-label {
        font-size: 12px;
        font-weight: 500;
        letter-spacing: 1px;
        text-transform: uppercase;
        color: rgba(255,255,255,.7);
    }
    .about-why-eyebrow {
        font-size: 13px;
        color: #e8a83a;
        font-weight: 500;
        letter-spacing: 2px;
        margin-bottom: 14px;
        display: block;
    }
    .about-why-heading {
        font-size: clamp(22px, 3.5vw, 36px);
        font-weight: 800;
        color: #fff;
        line-height: 1.2;
        margin-bottom: 18px;
    }
    .about-why-heading a {
        color: #e8a83a;
        text-decoration: underline;
    }
    .about-why-intro {
        font-size: 15px;
        color: rgba(255,255,255,.65);
        line-height: 1.75;
        margin-bottom: 28px;
    }
    .about-feat-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }
    .about-feat-card {
        border: 1px solid rgba(255,255,255,.15);
        border-radius: 10px;
        padding: 20px 18px;
        background: transparent;
        transition: border-color .2s ease;
    }
    .about-feat-card:hover {
        border-color: rgba(232,168,58,.4);
    }
    .about-feat-title {
        font-size: 16px;
        font-weight: 500;
        color: #fff;
        margin-bottom: 8px;
    }
    .about-feat-desc {
        font-size: 13px;
        color: rgba(255,255,255,.6);
        line-height: 1.6;
        margin: 0;
        text-align: center;
    }
    @media (max-width: 575px) {
        .about-feat-grid { grid-template-columns: 1fr; }
    }

    /* ── Visit Chandrima Spa Section ────────────────────────────── */
    .visit-spa-section {
        background: #0d0d0d;
        padding: 70px 0;
    }
    .visit-spa-eyebrow {
        display: inline-block;
        font-size: 12px;
        font-weight: 500;
        letter-spacing: 3px;
        text-transform: uppercase;
        color: #e8a83a;
        background: rgba(232,168,58,.12);
        border: 1px solid rgba(232,168,58,.3);
        border-radius: 999px;
        padding: 5px 18px;
        margin-bottom: 16px;
    }
    .visit-spa-heading {
        font-size: clamp(26px, 4vw, 44px);
        font-weight: 800;
        color: #fff;
        line-height: 1.15;
        margin-bottom: 14px;
    }
    .visit-spa-heading span {
        color: #e8a83a;
    }
    .visit-spa-intro {
        font-size: 16px;
        color: rgba(255,255,255,.65);
        line-height: 1.7;
        margin-bottom: 28px;
        max-width: 460px;
    }
    .visit-info-item {
        display: flex;
        gap: 14px;
        align-items: flex-start;
        margin-bottom: 22px;
    }
    .visit-info-icon {
        font-size: 22px;
        line-height: 1;
        flex-shrink: 0;
        margin-top: 2px;
    }
    .visit-info-label {
        font-size: 11px;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 2px;
        color: #e8a83a;
        margin-bottom: 4px;
    }
    .visit-info-text {
        font-size: 15px;
        color: rgba(255,255,255,.72);
        line-height: 1.6;
        margin: 0;
    }
    .visit-info-text a {
        color: #e8a83a;
        font-weight: 500;
        text-decoration: none;
    }
    .visit-info-text a:hover {
        text-decoration: underline;
        color: #fff;
    }
    .visit-directions-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        margin-top: 6px;
        padding: 11px 26px;
        border-radius: 50px;
        background: linear-gradient(135deg, #c7851a, #e8a83a);
        color: #0d0d0d;
        font-size: 14px;
        font-weight: 500;
        text-decoration: none;
        transition: transform .2s ease, box-shadow .2s ease;
    }
    .visit-directions-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 24px rgba(232,168,58,.4);
        color: #0d0d0d;
        text-decoration: none;
    }
    .visit-map-wrap {
        border-radius: 16px;
        overflow: hidden;
        box-shadow: 0 16px 48px rgba(0,0,0,.5);
        height: 100%;
        min-height: 420px;
    }
    .visit-map-wrap iframe {
        display: block;
        width: 100%;
        height: 100%;
        min-height: 420px;
        border: 0;
    }

    /* ── Google Reviews Section ──────────────────────────────────── */
    .reviews-section {
        background: #111;
        padding: 70px 0 60px;
    }
    .reviews-eyebrow {
        display: inline-block;
        font-size: 12px;
        font-weight: 500;
        letter-spacing: 3px;
        text-transform: uppercase;
        color: #e8a83a;
        background: rgba(232,168,58,.12);
        border: 1px solid rgba(232,168,58,.3);
        border-radius: 999px;
        padding: 5px 18px;
        margin-bottom: 14px;
    }
    .reviews-heading {
        font-size: clamp(24px, 4vw, 40px);
        font-weight: 800;
        color: #fff;
        margin-bottom: 6px;
    }
    .reviews-heading span { color: #e8a83a; }
    .reviews-meta {
        font-size: 15px;
        color: rgba(255,255,255,.55);
        margin-bottom: 40px;
    }
    .reviews-meta .rev-stars {
        color: #f5a623;
        font-size: 18px;
        vertical-align: middle;
        margin-right: 4px;
    }
    .rev-card {
        background: #1a1a1a;
        border: 1px solid rgba(255,255,255,.08);
        border-radius: 14px;
        padding: 22px 20px;
        box-shadow: 0 4px 20px rgba(0,0,0,.4);
        transition: transform .2s ease, box-shadow .2s ease;
        height: 100%;
        display: flex;
        flex-direction: column;
    }
    .rev-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 14px 32px rgba(0,0,0,.55);
        border-color: rgba(232,168,58,.25);
    }
    .rev-top {
        display: flex;
        align-items: center;
        gap: 12px;
        margin-bottom: 12px;
    }
    .rev-avatar {
        width: 42px;
        height: 42px;
        border-radius: 50%;
        background: linear-gradient(135deg, #c7851a, #e8a83a);
        color: #fff;
        font-weight: 800;
        font-size: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
    .rev-name {
        font-weight: 500;
        font-size: 15px;
        color: #fff;
        margin: 0 0 2px;
    }
    .rev-info {
        font-size: 12px;
        color: rgba(255,255,255,.45);
        margin: 0;
    }
    .rev-stars-row {
        color: #f5a623;
        font-size: 15px;
        letter-spacing: 1px;
        margin-bottom: 10px;
    }
    .rev-time {
        font-size: 12px;
        color: rgba(255,255,255,.35);
        margin-left: 8px;
    }
    .rev-text {
        font-size: 14px;
        color: rgba(255,255,255,.68);
        line-height: 1.65;
        flex-grow: 1;
        margin: 0;
    }
    .rev-google-badge {
        display: flex;
        align-items: center;
        gap: 6px;
        margin-top: 14px;
        padding-top: 12px;
        border-top: 1px solid rgba(255,255,255,.08);
        font-size: 12px;
        color: rgba(255,255,255,.4);
    }
    .rev-google-badge svg { flex-shrink: 0; }
    .rev-summary-box {
        display: inline-flex;
        align-items: center;
        gap: 18px;
        flex-wrap: wrap;
        justify-content: center;
        background: rgba(255,255,255,.05);
        border: 1px solid rgba(232,168,58,.25);
        border-radius: 14px;
        padding: 16px 28px;
        margin-bottom: 28px;
    }
    .rev-big-score {
        font-size: 52px;
        font-weight: 900;
        color: #fff;
        line-height: 1;
    }
    .rev-score-detail {
        text-align: left;
    }
    .rev-score-detail .rev-stars-lg {
        color: #f5a623;
        font-size: 22px;
        letter-spacing: 2px;
        display: block;
        margin-bottom: 2px;
    }
    .rev-score-detail .rev-count {
        font-size: 13px;
        color: rgba(255,255,255,.55);
    }
    .rev-divider {
        width: 1px;
        height: 44px;
        background: rgba(255,255,255,.15);
    }
    .rev-write-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 12px 26px;
        border-radius: 50px;
        background: linear-gradient(135deg, #c7851a, #e8a83a);
        color: #0d0d0d;
        font-size: 14px;
        font-weight: 500;
        text-decoration: none;
        transition: transform .2s ease, box-shadow .2s ease;
        white-space: nowrap;
    }
    .rev-write-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 22px rgba(232,168,58,.4);
        color: #0d0d0d;
        text-decoration: none;
    }

    /* ── Health Benefits Section ─────────────────────────────────── */
    .hb-section {
        background: #0a0a0a;
        padding: 70px 0;
    }
    .hb-eyebrow {
        display: inline-block;
        font-size: 12px;
        font-weight: 500;
        letter-spacing: 3px;
        text-transform: uppercase;
        color: #e8a83a;
        background: rgba(232,168,58,.1);
        border: 1px solid rgba(232,168,58,.25);
        border-radius: 999px;
        padding: 5px 18px;
        margin-bottom: 14px;
    }
    .hb-heading {
        font-size: clamp(26px, 4vw, 42px);
        font-weight: 800;
        color: #fff;
        line-height: 1.15;
        margin-bottom: 32px;
    }
    .hb-heading span { color: #e8a83a; }
    .hb-item {
        display: flex;
        gap: 16px;
        align-items: flex-start;
        margin-bottom: 24px;
    }
    .hb-icon {
        font-size: 26px;
        line-height: 1;
        flex-shrink: 0;
        margin-top: 1px;
    }
    .hb-text {
        font-size: 15px;
        color: rgba(255,255,255,.68);
        line-height: 1.7;
        margin: 0;
    }
    /* Right CTA card */
    .hb-cta-card {
        background: linear-gradient(145deg, #1a0a00 0%, #2d1500 100%);
        border-radius: 20px;
        padding: 36px 30px;
        color: #fff;
        position: sticky;
        top: 80px;
    }
    .hb-cta-title {
        font-size: 24px;
        font-weight: 800;
        color: #fff;
        margin-bottom: 10px;
    }
    .hb-cta-sub {
        font-size: 15px;
        color: rgba(255,255,255,.72);
        line-height: 1.6;
        margin-bottom: 28px;
    }
    .hb-cta-btn {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 13px 22px;
        border-radius: 50px;
        font-size: 14px;
        font-weight: 500;
        text-decoration: none;
        margin-bottom: 12px;
        transition: transform .2s ease, box-shadow .2s ease;
    }
    .hb-cta-btn:last-of-type { margin-bottom: 0; }
    .hb-cta-btn:hover {
        /* transform: translateY(-2px); */
        box-shadow: 0 8px 20px rgba(0,0,0,.3);
        text-decoration: none;
        display: block;
    }
    .hb-btn-wa  { background: #25d366; color: #fff; }
    .hb-btn-call { background: #1565c0; color: #fff; }
    .hb-btn-addr {
        background: rgba(255,255,255,.08);
        color: rgba(255,255,255,.85);
        border: 1px solid rgba(255,255,255,.15);
        font-size: 13px;
        align-items: flex-start;
    }
    .hb-btn-addr:hover { color: #fff; }
    .hb-cta-price {
        margin-top: 22px;
        padding-top: 18px;
        border-top: 1px solid rgba(255,255,255,.12);
        font-size: 13px;
        color: rgba(255,255,255,.6);
        text-align: center;
    }
    .hb-cta-price strong { color: #e8a83a; font-size: 18px; }

    /* ── Why Choose Chandrima Section ───────────────────────────── */
    .why-section {
        background: #0d0d0d;
        padding: 70px 0;
    }
    .why-eyebrow {
        display: inline-block;
        font-size: 12px;
        font-weight: 500;
        letter-spacing: 3px;
        text-transform: uppercase;
        color: #e8a83a;
        background: rgba(232,168,58,.1);
        border: 1px solid rgba(232,168,58,.28);
        border-radius: 999px;
        padding: 5px 18px;
        margin-bottom: 14px;
    }
    .why-heading {
        font-size: clamp(26px, 4vw, 44px);
        font-weight: 800;
        color: #fff;
        line-height: 1.2;
        margin-bottom: 50px;
    }
    .why-heading span { color: #e8a83a; }
    .why-card {
        background: #181818;
        border: 1px solid rgba(255,255,255,.07);
        border-radius: 16px;
        padding: 30px 26px;
        height: 100%;
        transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
        position: relative;
        overflow: hidden;
    }
    .why-card::before {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(135deg, rgba(232,168,58,.04) 0%, transparent 60%);
        pointer-events: none;
    }
    .why-card:hover {
        border-color: rgba(232,168,58,.35);
        box-shadow: 0 12px 32px rgba(0,0,0,.5);
        transform: translateY(-4px);
    }
    .why-num {
        font-size: 48px;
        font-weight: 900;
        line-height: 1;
        color: transparent;
        -webkit-text-stroke: 2px rgba(232,168,58,.4);
        margin-bottom: 16px;
        display: block;
    }
    .why-title {
        font-size: 17px;
        font-weight: 500;
        color: #fff;
        margin-bottom: 10px;
    }
    .why-desc {
        font-size: 14px;
        color: rgba(255,255,255,.6);
        line-height: 1.7;
        margin: 0;
    }

    /* ── Book in 3 Steps Section ──────────────────────────────── */
    .steps-section {
        background: #141414;
        padding: 70px 0 60px;
    }
    .steps-eyebrow {
        display: inline-block;
        font-size: 12px;
        font-weight: 500;
        letter-spacing: 3px;
        text-transform: uppercase;
        color: #e8a83a;
        background: rgba(232,168,58,.1);
        border: 1px solid rgba(232,168,58,.28);
        border-radius: 999px;
        padding: 5px 18px;
        margin-bottom: 14px;
    }
    .steps-heading {
        font-size: clamp(26px, 4vw, 44px);
        font-weight: 800;
        color: #fff;
        line-height: 1.2;
        margin-bottom: 10px;
    }
    .steps-heading span { color: #e8a83a; }
    .steps-sub {
        font-size: 16px;
        color: rgba(255,255,255,.55);
        max-width: 520px;
        margin: 0 auto 50px;
        line-height: 1.6;
    }
    .steps-grid {
        list-style: none;
        padding: 0;
        margin: 0;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 0;
        position: relative;
    }
    .steps-grid::before {
        content: '';
        position: absolute;
        top: 38px;
        left: calc(16.67% + 10px);
        right: calc(16.67% + 10px);
        height: 2px;
        background: linear-gradient(90deg, #e8a83a 0%, rgba(232,168,58,.3) 100%);
        z-index: 0;
    }
    .step-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 0 20px;
        position: relative;
        z-index: 1;
    }
    .step-num {
        width: 76px;
        height: 76px;
        border-radius: 50%;
        background: linear-gradient(135deg, #c7851a 0%, #e8a83a 100%);
        color: #0d0d0d;
        font-size: 28px;
        font-weight: 900;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 20px;
        box-shadow: 0 8px 24px rgba(232,168,58,.35);
        flex-shrink: 0;
    }
    .step-icon {
        font-size: 28px;
        margin-bottom: 8px;
        line-height: 1;
    }
    .step-title {
        font-size: 18px;
        font-weight: 500;
        color: #fff;
        margin-bottom: 10px;
    }
    .step-desc {
        font-size: 14px;
        color: rgba(255,255,255,.62);
        line-height: 1.7;
        margin: 0;
    }
    .steps-cta-strip {
        display: flex;
        flex-wrap: wrap;
        gap: 14px;
        justify-content: center;
        align-items: center;
        margin-top: 50px;
        padding-top: 40px;
        border-top: 1px solid rgba(255,255,255,.08);
    }
    .steps-cta-label {
        font-size: 15px;
        color: rgba(255,255,255,.6);
        margin: 0;
    }
    .steps-btn {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        padding: 13px 30px;
        border-radius: 50px;
        font-size: 15px;
        font-weight: 500;
        text-decoration: none;
        transition: transform .2s ease, box-shadow .2s ease;
        white-space: nowrap;
    }
    .steps-btn:hover { transform: translateY(-3px); text-decoration: none; }
    .steps-btn-wa  { background: #25d366; color: #fff; }
    .steps-btn-wa:hover  { box-shadow: 0 10px 24px rgba(37,211,102,.35); color: #fff; }
    .steps-btn-call { background: #1565c0; color: #fff; }
    .steps-btn-call:hover { box-shadow: 0 10px 24px rgba(21,101,192,.4); color: #fff; }

    /* ── Responsive ───────────────────────────────────────────── */
    @media (max-width: 991px) {
        .visit-map-wrap { min-height: 320px; }
        .visit-map-wrap iframe { min-height: 320px; }
        .hb-cta-card { position: static; }
        .rev-summary-box { flex-direction: column; gap: 12px; padding: 18px 16px; }
        .rev-divider { width: 80%; height: 1px; }
        .steps-grid { grid-template-columns: 1fr; gap: 36px; }
        .steps-grid::before { display: none; }
    }
    @media (max-width: 767px) {
        .visit-spa-section, .reviews-section, .hb-section,
        .steps-section, .book-massage-section { padding: 48px 0; }
        .visit-spa-intro { max-width: 100%; }
        .visit-directions-btn, .rev-write-btn, .steps-btn,
        .hb-cta-btn, .bym-btn { width: 100%; justify-content: center; }
        .rev-big-score { font-size: 40px; }
        .hb-cta-card { padding: 28px 20px; border-radius: 16px; }
        .bym-trust-bar li { font-size: 12px; padding: 6px 14px; }
        .step-item { padding: 0 10px; }
        .Servicess h3 {
            padding-top:30px;
        }
    }
    @media (max-width: 480px) {
        .visit-spa-section, .reviews-section, .hb-section,
        .steps-section, .book-massage-section { padding: 36px 0; }
        .bym-heading, .visit-spa-heading, .hb-heading,
        .reviews-heading, .steps-heading { font-size: clamp(22px, 6vw, 32px); }
        .rev-summary-box { padding: 14px 12px; }
        .rev-card, .hb-cta-card { padding: 18px 16px; }
        .step-num { width: 62px; height: 62px; font-size: 22px; }
        .Servicess h3 {
            padding-top:30px;
        }
    }

    /* ── Book Your Massage Section ───────────────────────────────── */
    .book-massage-section {
        background: linear-gradient(135deg, #1a0a00 0%, #2d1200 50%, #1a0a00 100%);
        padding: 70px 0;
        position: relative;
        overflow: hidden;
    }
    .book-massage-section::before {
        content: '';
        position: absolute;
        inset: 0;
        background:
            radial-gradient(ellipse 60% 80% at 20% 50%, rgba(199,130,0,.18) 0%, transparent 70%),
            radial-gradient(ellipse 40% 60% at 80% 50%, rgba(180,80,0,.12) 0%, transparent 70%);
        pointer-events: none;
    }
    .bym-eyebrow {
        display: inline-block;
        font-size: 13px;
        font-weight: 500;
        letter-spacing: 3px;
        text-transform: uppercase;
        color: #c7a24a;
        background: rgba(199,162,74,.12);
        border: 1px solid rgba(199,162,74,.35);
        border-radius: 999px;
        padding: 6px 20px;
        margin-bottom: 20px;
    }
    .bym-heading {
        font-size: clamp(28px, 5vw, 52px);
        font-weight: 800;
        color: #fff;
        line-height: 1.15;
        margin-bottom: 22px;
    }
    .bym-heading span {
        color: #c7a24a;
    }
    .bym-subtext {
        font-size: 17px;
        color: rgba(255,255,255,.75);
        max-width: 620px;
        margin: 0 auto 36px;
        line-height: 1.7;
    }
    .bym-btn-group {
        display: flex;
        flex-wrap: wrap;
        gap: 14px;
        justify-content: center;
        margin-bottom: 38px;
    }
    .bym-btn {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        padding: 15px 34px;
        border-radius: 50px;
        font-size: 16px;
        font-weight: 500;
        text-decoration: none;
        transition: transform .2s ease, box-shadow .2s ease;
        white-space: nowrap;
    }
    .bym-btn:hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 28px rgba(0,0,0,.35);
        text-decoration: none;
    }
    .bym-btn-call {
        background: #1565c0;
        color: #fff;
    }
    .bym-btn-whatsapp {
        background: #25d366;
        color: #fff;
    }
    .bym-trust-bar {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        justify-content: center;
        list-style: none;
        padding: 0;
        margin: 0;
    }
    .bym-trust-bar li {
        font-size: 13px;
        font-weight: 500;
        color: rgba(255,255,255,.85);
        background: rgba(255,255,255,.07);
        border: 1px solid rgba(255,255,255,.14);
        border-radius: 999px;
        padding: 7px 18px;
        white-space: nowrap;
    }

    /* ── Banner Marquee Strip ─────────────────────────────────── */
    .marquee-wrap {
        width: 100%;
        background: rgba(0,0,0,.7);
        border-top: 1px solid rgba(232,168,58,.2);
        overflow: hidden;
        padding: 10px 0;
        margin-top: 0;
    }
    .marquee-track {
        display: flex;
        width: max-content;
        animation: marquee-scroll 22s linear infinite;
    }
    .marquee-wrap:hover .marquee-track {
        animation-play-state: paused;
    }
    @keyframes marquee-scroll {
        0%   { transform: translateX(0); }
        100% { transform: translateX(-50%); }
    }
    .marquee-item {
        display: inline-flex;
        align-items: center;
        gap: 14px;
        padding: 0 28px;
        font-size: 13px;
        font-weight: 500;
        color: rgba(255,255,255,.82);
        white-space: nowrap;
        letter-spacing: .4px;
    }
    .marquee-sep {
        color: #e8a83a;
        font-size: 10px;
        flex-shrink: 0;
    }

    /* ── Our Massage Services Cards ───────────────────────────── */
    .ms-section {
        background: linear-gradient(160deg, #0d0d0d 0%, #1a1208 50%, #0d0d0d 100%);
        padding: 80px 0 90px;
        position: relative;
        overflow: hidden;
    }
    .ms-section::before {
        content: '';
        position: absolute;
        top: -120px; left: 50%;
        transform: translateX(-50%);
        width: 700px; height: 700px;
        background: radial-gradient(circle, rgba(232,168,58,.10) 0%, transparent 70%);
        pointer-events: none;
    }
    .ms-eyebrow {
        display: inline-block;
        font-size: 12px;
        font-weight: 500;
        letter-spacing: 3px;
        text-transform: uppercase;
        color: #e8a83a;
        margin-bottom: 12px;
    }
    .ms-heading {
        font-size: clamp(26px, 4vw, 38px);
        font-weight: 800;
        color: #fff;
        margin-bottom: 10px;
        line-height: 1.2;
    }
    .ms-heading span { color: #e8a83a; }
    .ms-subtext {
        font-size: 15px;
        color: rgba(255,255,255,.6);
        max-width: 580px;
        margin: 0 auto 50px;
        line-height: 1.7;
    }
    /* Card grid */
    .ms-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }
    @media (max-width: 991px) { .ms-grid { grid-template-columns: repeat(2,1fr); } }
    @media (max-width: 575px)  { .ms-grid { grid-template-columns: 1fr; } }

    .ms-card {
        background: linear-gradient(145deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,.02) 100%);
        border: 1px solid rgba(232,168,58,.18);
        border-radius: 18px;
        padding: 34px 28px 30px;
        position: relative;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        gap: 14px;
        transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
        backdrop-filter: blur(6px);
    }
    .ms-card::before {
        content: '';
        position: absolute;
        top: 0; left: 0; right: 0;
        height: 3px;
        background: linear-gradient(90deg, #e8a83a, #c9841a);
        border-radius: 18px 18px 0 0;
        opacity: 0;
        transition: opacity .3s ease;
    }
    .ms-card:hover {
        transform: translateY(-6px);
        border-color: rgba(232,168,58,.5);
        box-shadow: 0 20px 50px rgba(0,0,0,.5), 0 0 0 1px rgba(232,168,58,.12);
    }
    .ms-card:hover::before { opacity: 1; }

    /* CTA / booking card */
    .ms-card-book {
       background: linear-gradient(135deg, #9f6916 0%, #896528 50%, #794f0f 100%); 
        border-color: #e8a83a;
    }
    .ms-card-book::before { opacity: 1; background: rgba(255,255,255,.25); }
    .ms-card-book .ms-card-icon { color: #fff; background: rgba(255,255,255,.2); }
    .ms-card-book .ms-card-name { color: #fff; }
    .ms-card-book .ms-card-desc { color: rgba(255,255,255,.9); }
    .ms-card-book .ms-card-price { background: rgba(0,0,0,.2); color: #fff; }
    .ms-card-book .ms-card-btn {
        background: #fff;
        color: #c9841a;
        border-color: transparent;
    }
    .ms-card-book .ms-card-btn:hover { background: rgba(255,255,255,.85); }

    .ms-card-icon {
        width: 52px; height: 52px;
        border-radius: 14px;
        background: rgba(232,168,58,.12);
        display: flex; align-items: center; justify-content: center;
        font-size: 24px;
        flex-shrink: 0;
    }
    .ms-card-name {
        font-size: 19px;
        font-weight: 400;
        color: #ffffffff;
        line-height: 1.3;
        margin: 0;
    }
    .ms-card-desc { 
        color: rgba(255,255,255,.65); 
        flex-grow: 1;
        margin: 0;
    }
    /* Price + Button same row */
    .ms-card-footer {
        display: flex;
        align-items: center;
        gap: 12px;
        flex-wrap: wrap;
        margin-top: auto;
    }
    .ms-card-price {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        background: rgba(232,168,58,.12);
        border: 1px solid rgba(232,168,58,.25);
        border-radius: 30px;
        padding: 5px 14px;
        font-size: 12.5px;
        font-weight: 500;
        color: #e8a83a;
        white-space: nowrap;
    }
    .ms-card-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        padding: 9px 20px;
        border-radius: 30px;
        border: 1.5px solid rgba(232,168,58,.5);
        background: transparent;
        color: #e8a83a;
        font-size: 13px;
        font-weight: 500;
        text-decoration: none;
        white-space: nowrap;
        transition: background .25s, color .25s, border-color .25s;
    }
    .ms-card-btn:hover {
        background: #e8a83a;
        color: #0d0d0d;
        border-color: #e8a83a;
    }
    .ms-card-book .ms-card-footer .ms-card-price { background: rgba(0,0,0,.2); color: #fff; border-color: rgba(255,255,255,.3); }