/* ==========================================================
   CULTSKIN custom styles (Advertise1)
   Restored from orphaned Customizer CSS (mw-esho-clinic-upgrade, Dec 2025)
   + 3-tier treatments menu and category pages (Oct 2026)
   Loaded after styles.min.css via lib/enqueue.php
   ========================================================== */

:root {
    --cs-brown: #86705a;
    --cs-brown-light: #c9b59c;
    --cs-dark: #1e1e1e;
    --cs-cream: #ece7e2;
}

/* ---------- Treatments mega menu: desktop (above 1366px) ---------- */
@media (min-width: 1367px) {
    .m__nav__item .subnav--fullwidth {
        position: fixed;
        left: 0 !important;
        right: 0 !important;
        width: 100vw;
        max-width: 100vw;
        margin: 0;
        transform: none;
    }
    .subnav--fullwidth .subnav__columns {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 10px 20px;
        padding: 20px;
    }
    .subnav--fullwidth .m__nav__item-sub {
        padding: 8px 12px;
        white-space: nowrap;
    }
}

/* ---------- Menu: mobile / tablet (1366px and below) ---------- */
@media (max-width: 1366px) {
    .m__nav {
        display: flex;
        flex-direction: column;
        min-height: 100vh;
        max-height: 100vh;
        overflow: hidden;
    }
    .m__nav__wrap {
        flex: 1;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 20px;
    }
    .subnav--fullwidth {
        max-height: 60vh;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        position: relative;
        width: auto;
        left: auto;
        right: auto;
        margin: 0;
    }
    .subnav--fullwidth .subnav__columns {
        display: block;
        min-height: 0 !important;
    }
    .menu-checkbox:not(:checked) ~ .subnav {
        max-height: 0 !important;
        overflow: hidden;
        display: none;
    }
    .m__nav__actions {
        flex-shrink: 0;
        margin-top: auto;
        padding: 20px;
        border-top: 1px solid rgba(0,0,0,0.1);
    }
    .subnav--fullwidth::-webkit-scrollbar { width: 4px; }
    .subnav--fullwidth::-webkit-scrollbar-track { background: rgba(0,0,0,0.05); }
    .subnav--fullwidth::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.2); border-radius: 2px; }
    .subnav--fullwidth::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.3); }
}

/* ---------- Third-party widget tweaks (auto-generated class names - may change on plugin update) ---------- */
.go2402097865 {
    margin-left: 5% !important;
    margin-right: 5% !important;
}
.go4269172405 {
    display: none !important;
}

/* ==========================================================
   3-TIER TREATMENTS MENU (Treatments > Category > Treatment)
   ========================================================== */

.tcat-menu .tcat__toggle {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.tcat-menu a.tcat__link,
.tcat-menu a.tcat__all,
.tcat-menu a.tcat__item {
    text-decoration: none;
}

/* Desktop: categories on the left, hovered category's treatments on the right */
@media (min-width: 1367px) {
    .subnav--fullwidth .tcat-menu {
        position: relative;
        max-width: 1400px;
        min-height: 400px;
        margin: 0 auto;
        padding: 28px 40px;
        text-align: left;
    }
    .tcat-menu .tcat {
        width: 100%;
    }
    .tcat-menu .tcat__link {
        display: block;
        width: 30%;
        padding: 11px 18px;
        border-left: 3px solid transparent;
        text-transform: uppercase;
        letter-spacing: .03em;
        transition: color .15s, border-color .15s, background-color .15s;
    }
    .tcat-menu .tcat__expand {
        display: none;
    }
    .tcat-menu .tcat__items {
        display: none;
        position: absolute;
        z-index: 2;
        top: 28px;
        left: calc(30% + 80px);
        right: 40px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 2px 32px;
        align-content: start;
        padding-left: 32px;
        border-left: 1px solid rgba(255,255,255,.15);
    }
    .tcat-menu .tcat__items .tcat__item {
        padding: 9px 0;
        text-align: left;
        white-space: normal;
    }
    .tcat-menu .tcat__all {
        grid-column: 1 / -1;
        padding: 9px 0 14px;
        margin-bottom: 6px;
        border-bottom: 1px solid rgba(255,255,255,.15);
        color: var(--cs-brown-light);
        text-transform: uppercase;
        letter-spacing: .05em;
        font-size: .85em;
    }

    /* Show the hovered / focused category */
    .tcat-menu .tcat:hover .tcat__items,
    .tcat-menu .tcat:focus-within .tcat__items {
        display: grid;
    }
    .tcat-menu .tcat:hover .tcat__link,
    .tcat-menu .tcat:focus-within .tcat__link {
        border-left-color: var(--cs-brown);
        color: var(--cs-brown-light);
        background: rgba(255,255,255,.04);
    }

    /* Nothing hovered yet: show the first category */
    .tcat-menu:not(:hover):not(:focus-within) .tcat--default .tcat__items {
        display: grid;
    }
    .tcat-menu:not(:hover):not(:focus-within) .tcat--default .tcat__link {
        border-left-color: var(--cs-brown);
        color: var(--cs-brown-light);
    }
}

/* Mobile / tablet: tap a category's arrow to expand its treatments */
@media (max-width: 1366px) {
    .tcat-menu .tcat {
        position: relative;
        border-bottom: 1px solid rgba(255,255,255,.1);
    }
    .tcat-menu .tcat__link {
        display: block;
        padding: 12px 56px 12px 20px;
        text-align: left;
    }
    .tcat-menu .tcat__expand {
        position: absolute;
        top: 0;
        right: 0;
        width: 48px;
        height: 44px;
        cursor: pointer;
    }
    .tcat-menu .tcat__expand::after {
        content: "";
        position: absolute;
        top: 15px;
        right: 20px;
        width: 8px;
        height: 8px;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: rotate(45deg);
        transition: transform .2s;
    }
    .tcat-menu .tcat__toggle:checked ~ .tcat__expand::after {
        top: 19px;
        transform: rotate(-135deg);
    }
    .tcat-menu .tcat__items {
        display: none;
        padding: 0 20px 12px 32px;
    }
    .tcat-menu .tcat__toggle:checked ~ .tcat__items {
        display: block;
    }
    .tcat-menu .tcat__items a {
        display: block;
        padding: 8px 0;
        text-align: left;
    }
    .tcat-menu .tcat__all {
        color: var(--cs-brown-light);
        font-size: .85em;
        text-transform: uppercase;
    }
}

/* ==========================================================
   TREATMENT CATEGORY LANDING PAGES (/treatments/{category}/)
   ========================================================== */

.tcat-page__header {
    background: var(--cs-cream);
    padding: 150px 0 50px;
}
.tcat-page__header h1 {
    margin: 10px 0 0;
}
.tcat-page__intro {
    max-width: 760px;
    margin-top: 16px;
}
.tcat-page__body {
    padding-top: 50px;
    padding-bottom: 60px;
}
.tcat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
}
@media (max-width: 1024px) {
    .tcat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .tcat-grid { grid-template-columns: 1fr; }
    .tcat-page__header { padding-top: 110px; }
}
.tcat-card {
    display: flex;
    flex-direction: column;
    background: var(--cs-cream);
    border-bottom: 3px solid var(--cs-brown);
    color: inherit;
    text-decoration: none;
    transition: transform .2s, box-shadow .2s;
}
.tcat-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,0,0,.08);
}
.tcat-card__image {
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #ddd5cc;
}
.tcat-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.tcat-card__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 20px;
}
.tcat-card__title {
    font-size: 1.25em;
    margin: 0 0 10px;
}
.tcat-card__excerpt {
    flex: 1;
    margin: 0 0 18px;
}
.tcat-card__cta {
    align-self: flex-start;
}
.tcat-page__others {
    margin-top: 60px;
}
.tcat-page__others-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 32px;
    margin-top: 14px;
}
.tcat-page__cta {
    margin-top: 50px;
    padding: 36px;
    background: var(--cs-cream);
    text-align: center;
}
.tcat-page__cta p {
    margin: 0 0 18px;
}

/* ---------- 3-tier menu tweaks (round 2) ---------- */
@media (min-width: 1367px) {
    /* tall enough for the biggest category (Laser, 13 treatments) plus breathing room */
    .subnav--fullwidth .tcat-menu {
        min-height: 560px;
        padding-bottom: 60px;
    }
    .tcat-menu .tcat__items {
        padding-bottom: 48px;
    }
    /* make non-hovered categories visible */
    .tcat-menu .tcat__link,
    .tcat-menu .tcat__link:visited {
        color: #fff;
        opacity: 1;
    }
}

/* ---------- 3-tier menu tweaks (round 3) ---------- */
@media (min-width: 1367px) {
    /* start the dropdown level with the bottom of the header buttons;
       a transparent border (not margin) keeps the hover area unbroken */
    .m__nav__item .subnav--fullwidth {
        border-top: 20px solid transparent;
        background-clip: padding-box;
    }
}
@media (max-width: 1366px) {
    /* mobile: categories, arrows and treatments in white on the dark menu */
    .tcat-menu .tcat__link,
    .tcat-menu .tcat__link:visited,
    .tcat-menu .tcat__expand,
    .tcat-menu .tcat__items a {
        color: #fff;
    }
    .tcat-menu .tcat__items a.tcat__all {
        color: var(--cs-brown-light);
    }
}

/* ---------- 3-tier menu tweaks (round 4): mobile expand arrow ---------- */
@media (max-width: 1366px) {
    .m__nav .tcat-menu .tcat {
        position: relative !important;
    }
    .m__nav .tcat-menu .tcat__expand {
        display: block !important;
        position: absolute !important;
        top: 0 !important;
        right: 0 !important;
        left: auto !important;
        bottom: auto !important;
        width: 56px !important;
        height: 46px !important;
        margin: 0 !important;
        padding: 0 !important;
        opacity: 1 !important;
        z-index: 3;
        cursor: pointer;
        background: none !important;
        transform: none !important;
    }
    .m__nav .tcat-menu .tcat__expand::before {
        display: none !important;
    }
    .m__nav .tcat-menu .tcat__expand::after {
        content: "" !important;
        display: block !important;
        position: absolute !important;
        top: 16px;
        right: 22px;
        width: 9px;
        height: 9px;
        border: 0 !important;
        border-right: 2px solid #fff !important;
        border-bottom: 2px solid #fff !important;
        background: none !important;
        transform: rotate(45deg);
    }
    .m__nav .tcat-menu .tcat__toggle:checked ~ .tcat__expand::after {
        top: 20px;
        transform: rotate(-135deg);
    }
    .m__nav .tcat-menu .tcat__toggle:checked ~ .tcat__items {
        display: block !important;
    }
}

/* ---------- 3-tier menu tweaks (round 5) ---------- */
@media (min-width: 1367px) {
    /* gap measured by the script in navigation.twig: 20px on the one-row header, 0 on the two-row header */
    .m__nav__item .subnav--fullwidth {
        border-top: var(--cs-tcat-gap, 0px) solid transparent;
    }
    /* keep the first category showing until another category is hovered */
    .tcat-menu:not(:has(.tcat:hover)) .tcat--default .tcat__items {
        display: grid;
    }
    .tcat-menu:not(:has(.tcat:hover)) .tcat--default .tcat__link {
        border-left-color: var(--cs-brown);
        color: var(--cs-brown-light);
    }
}

/* ---------- 3-tier menu tweaks (round 6): wrap long treatment names on mobile ---------- */
@media (max-width: 1366px) {
    .m__nav .tcat-menu .tcat__items a {
        white-space: normal !important;
        overflow-wrap: break-word;
        line-height: 1.35;
        padding-right: 16px;
    }
}

/* ==========================================================
   TREATMENT PAGES (Oct 2026): hero, Key Benefits, booking buttons, related treatments
   ========================================================== */

/* Hero intro: keep it to a comfortable reading width */
.c__hero--treatment__intro {
    max-width: 620px;
}

/* Key Benefits box */
.c__benefits {
    background: var(--cs-cream);
    border-left: 3px solid var(--cs-brown);
    padding: 26px 30px;
    margin: 0 0 8px;
}
.c__benefits h2 {
    font-size: 1.4em;
    margin: 0 0 16px;
}
.c__benefits ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 30px;
}
.c__benefits li {
    position: relative;
    margin: 0;
    padding-left: 28px;
    line-height: 1.45;
}
.c__benefits li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: .35em;
    width: 12px;
    height: 7px;
    border-left: 2px solid var(--cs-brown);
    border-bottom: 2px solid var(--cs-brown);
    transform: rotate(-45deg);
}
@media (max-width: 600px) {
    .c__benefits { padding: 22px 20px; }
    .c__benefits ul { grid-template-columns: 1fr; }
}

/* Booking buttons */
.c__treatmentCta {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 12px;
    margin: 24px 0 36px;
}
.c__treatmentCta .btn {
    margin: 0;
}
.c__treatmentCta__secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 24px;
    border: 1px solid var(--cs-brown);
    color: var(--cs-brown);
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .85em;
    transition: background-color .2s, color .2s;
}
.c__treatmentCta__secondary:hover,
.c__treatmentCta__secondary:focus {
    background: var(--cs-brown);
    color: #fff;
}
.c__treatmentCta--after-faq {
    margin-top: 8px;
}

/* Related treatments: a short, quieter list */
.c__treatmentList--related {
    margin-top: 40px;
}
.c__treatmentList--related h3 {
    font-size: 1.2em;
    margin-bottom: 10px;
}
.c__treatmentList--related ul {
    list-style: none;
    margin: 0 0 14px;
    padding: 0;
}
.c__treatmentList--related li {
    margin: 0;
    padding: 0;
}
.c__treatmentList--related li a {
    display: block;
    padding: 10px 0;
    border-bottom: 1px solid rgba(0,0,0,.08);
    color: inherit;
    text-decoration: none;
}
.c__treatmentList--related li a:hover {
    color: var(--cs-brown);
}
.c__treatmentList__all {
    display: inline-block;
    margin-top: 6px;
    color: var(--cs-brown);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: .85em;
}
/* ---------- 3-tier menu tweaks (round 7): hover always wins over a focused (right-clicked) link ---------- */
@media (min-width: 1367px) {
    /* a category is hovered: hide every other panel, including a focused one */
    .tcat-menu:has(.tcat:hover) .tcat:not(:hover) .tcat__items {
        display: none;
    }
    .tcat-menu:has(.tcat:hover) .tcat:not(:hover) .tcat__link {
        border-left-color: transparent;
        color: #fff;
        background: transparent;
    }
    /* nothing hovered but a link still has focus: show that category instead of the first */
    .tcat-menu:not(:has(.tcat:hover)):has(.tcat:focus-within) .tcat--default:not(:focus-within) .tcat__items {
        display: none;
    }
    .tcat-menu:not(:has(.tcat:hover)):has(.tcat:focus-within) .tcat--default:not(:focus-within) .tcat__link {
        border-left-color: transparent;
        color: #fff;
        background: transparent;
    }
}

/* ==========================================================
   BOOK ONLINE PAGE (Oct 2026): intro, reassurance strip, policy
   ========================================================== */
.cs-booking-intro {
    font-size: 1.15em;
    line-height: 1.6;
}
.cs-reassure {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 14px 40px;
    margin: 28px 0 0;
    padding: 22px 28px;
    background: var(--cs-cream);
    border-left: 3px solid var(--cs-brown);
}
.cs-reassure li {
    position: relative;
    margin: 0;
    padding-left: 28px;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-size: .9em;
}
.cs-reassure li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: .3em;
    width: 12px;
    height: 7px;
    border-left: 2px solid var(--cs-brown);
    border-bottom: 2px solid var(--cs-brown);
    transform: rotate(-45deg);
}
.cs-booking-policy {
    max-width: 820px;
    padding-top: 10px;
    border-top: 1px solid rgba(0,0,0,.1);
}
.cs-booking-policy h3 {
    margin: 20px 0 10px;
    font-size: 1.15em;
}
.cs-booking-policy a {
    color: var(--cs-brown);
    text-decoration: underline;
}
@media (max-width: 600px) {
    .cs-reassure {
        flex-direction: column;
        gap: 12px;
        padding: 20px;
    }
}

/* ---------- Book Online tweaks (round 2) ---------- */
.cs-reassure {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px 20px;
}
.cs-reassure li {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    padding-left: 0;
    text-align: center;
}
.cs-reassure li::before {
    position: static;
    flex-shrink: 0;
    margin-top: -4px;
}
.cs-booking-policy {
    max-width: 50%;
}
@media (max-width: 1024px) {
    .cs-reassure { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cs-booking-policy { max-width: 100%; }
}
@media (max-width: 600px) {
    .cs-reassure { grid-template-columns: 1fr; }
    .cs-reassure li { justify-content: flex-start; text-align: left; }
}

/* ==========================================================
   MEMBERSHIPS PAGE (Oct 2026): intro + tiered subscription cards
   ========================================================== */
.cs-membership-intro {
    font-size: 1.15em;
    line-height: 1.6;
    margin: 0 0 45px;
}
.cs-mcards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 30px;
}
@media (max-width: 1024px) {
    .cs-mcards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .cs-mcards { grid-template-columns: 1fr; }
}
.cs-mcard {
    display: flex;
    flex-direction: column;
    background: var(--cs-cream);
    border-bottom: 3px solid var(--cs-brown);
    color: inherit;
    text-decoration: none;
    transition: transform .2s, box-shadow .2s;
}
.cs-mcard:hover,
.cs-mcard:focus {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,0,0,.08);
}
.cs-mcard__img {
    position: relative;
    aspect-ratio: 4 / 3;
    background: #ddd5cc center / cover no-repeat;
}
.cs-mcard__tier {
    position: absolute;
    top: 14px;
    left: 14px;
    padding: 6px 12px;
    font-size: .72em;
    letter-spacing: .14em;
    text-transform: uppercase;
    box-shadow: 0 2px 8px rgba(0,0,0,.18);
}
.cs-mcard--black .cs-mcard__tier {
    background: #111;
    color: #fff;
    border: 1px solid #444;
}
.cs-mcard--platinum .cs-mcard__tier {
    background: linear-gradient(135deg, #f4f4f2 0%, #d9d9d6 50%, #f4f4f2 100%);
    color: #222;
}
.cs-mcard--gold .cs-mcard__tier {
    background: linear-gradient(135deg, #e7cf9a 0%, #c4a061 50%, #e7cf9a 100%);
    color: #2a2112;
}
.cs-mcard--black {
    border-bottom-color: #111;
}
.cs-mcard__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 22px 20px;
}
.cs-mcard__title {
    font-size: 1.3em;
    margin: 0 0 10px;
}
.cs-mcard__desc {
    margin: 0 0 14px;
}
.cs-mcard__list {
    list-style: none;
    margin: 0 0 16px;
    padding: 0;
}
.cs-mcard__list li {
    position: relative;
    margin: 0 0 6px;
    padding-left: 24px;
}
.cs-mcard__list li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: .35em;
    width: 11px;
    height: 6px;
    border-left: 2px solid var(--cs-brown);
    border-bottom: 2px solid var(--cs-brown);
    transform: rotate(-45deg);
}
.cs-mcard__cta {
    margin-top: auto;
    width: 100%;
    text-align: center;
}

/* ---------- Memberships cards (round 2): match the site's inset 5:3 card image ---------- */
.cs-mcards {
    padding-top: 20px;
}
.cs-mcard__img {
    aspect-ratio: 5 / 3;
    margin: -20px 20px 0;
}
.cs-mcard__body {
    padding: 22px 20px 26px;
}
/* CULTSTATUS image: subject sits on the right of a square photo */
.cs-mcard--black .cs-mcard__img {
    background-position: center;
}

/* ---------- Memberships cards (round 3): tier badge on the bottom edge of the image ---------- */
.cs-mcard__tier {
    top: auto;
    bottom: -14px;
    left: 20px;
    z-index: 2;
}
.cs-mcard__body {
    padding-top: 32px;
}

/* ==========================================================
   ROUND 2 (Oct 2026): treatment layout, related cards, membership press block
   ========================================================== */

/* Treatment page: wide main column, image + pricing on the side */
.cs-treatment__content {
    font-size: 1.05em;
    line-height: 1.7;
    max-width: 820px;
}
.cs-treatment__image {
    margin-bottom: 24px;
    background: var(--cs-cream);
}
.cs-treatment__image img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 5;
    object-fit: cover;
}
@media (min-width: 1025px) {
    .cs-treatment__side .l__col__evenpad {
        position: sticky;
        top: 230px;
    }
}
/* the hero already shows on mobile, so skip the side image there */
@media (max-width: 1024px) {
    .cs-treatment__image { display: none; }
}

/* Related treatments as image cards */
.cs-related {
    padding-top: 60px;
    padding-bottom: 60px;
}
.cs-related__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 28px;
}
.cs-related__head h2 {
    margin: 0;
}
.cs-related .tcat-card__title {
    font-size: 1.15em;
}

/* Memberships: Evening Standard press block */
.cs-press {
    display: grid;
    grid-template-columns: auto auto 1fr auto;
    align-items: center;
    gap: 14px 28px;
    margin: 0 0 50px;
    padding: 26px 32px;
    background: var(--cs-dark);
    color: #fff;
    text-decoration: none;
    border-left: 4px solid var(--cs-brown);
    transition: box-shadow .2s;
}
.cs-press:hover,
.cs-press:focus {
    box-shadow: 0 10px 24px rgba(0,0,0,.18);
}
.cs-press__source {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.35em;
    font-style: italic;
    letter-spacing: .01em;
}
.cs-press__stars {
    color: #d8b878;
    font-size: 1.3em;
    letter-spacing: .12em;
}
.cs-press__quote {
    font-size: 1.1em;
}
.cs-press__cta {
    margin: 0;
}
@media (max-width: 900px) {
    .cs-press {
        grid-template-columns: 1fr;
        text-align: center;
        padding: 26px 22px;
    }
    .cs-press__cta { justify-self: center; }
}

/* Book Online: consultation options list */
.cs-consult-list {
    margin: 0 0 14px;
    padding-left: 20px;
}
.cs-consult-list li {
    margin: 0 0 8px;
    line-height: 1.55;
}
.cs-booking-policy h3 + .cs-consult-list {
    margin-top: 6px;
}

@media (min-width: 1025px) {
    .cs-reassure li { white-space: nowrap; font-size: .82em; }
}

/* ==========================================================
   ROUND 3 (Oct 2026): price list with courses
   (round 3 section styles replaced by round 5 below)
   ========================================================== */

/* Simple price list with courses */
.cs-prices__group {
    margin: 18px 0 6px;
    font-size: .8em;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--cs-brown);
}
.cs-prices__group:first-of-type { margin-top: 4px; }
table.cs-prices { width: 100%; margin-bottom: 8px; }
table.cs-prices td { vertical-align: top; padding: 9px 8px 9px 0; border-bottom: 1px solid #e4ddd5; }
table.cs-prices td.cs-prices__price { text-align: right; white-space: nowrap; font-weight: 600; padding-right: 0; }
.cs-prices__note { display: block; font-size: .82em; opacity: .75; margin-top: 2px; }

/* ==========================================================
   ROUND 4 (Oct 2026): membership sections + prices on cards
   ========================================================== */
.cs-mgroup__title {
    font-size: 1.5em;
    margin: 50px 0 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e4ddd5;
}
.cs-press + .cs-mgroup__title,
.cs-membership-intro + .cs-mgroup__title { margin-top: 30px; }
.cs-mcard__price {
    font-weight: 600;
    color: var(--cs-brown);
    margin: -4px 0 10px;
    font-size: .95em;
}
.cs-mcard--plain .cs-mcard__body { padding-top: 22px; }

/* ==========================================================
   ROUND 5 (Oct 2026): treatment page built to the LTF Figma layout
   ========================================================== */

.cs-tp h2 {
    text-transform: uppercase;
    font-weight: 400;
    font-size: 2.2em;
    line-height: 1.15;
    margin: 0 0 22px;
}
.cs-tp .cs-btn { margin-top: 8px; }
.cs-center { text-align: center; justify-content: center; }
.cs-narrow { max-width: 900px; }
@media (max-width: 768px) {
    .cs-tp h2 { font-size: 1.55em; }
}

/* ---- Hero: Best for + At a Glance strip ---- */
.cs-hero__bestfor {
    max-width: 620px;
    font-size: 18px;
    line-height: 1.5;
    opacity: .9;
    margin: -4px 0 20px;
}
.cs-hero__bestfor span {
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .8em;
    margin-right: 6px;
    color: var(--cs-brown-light);
}
.cs-hero-glance {
    position: relative;
    z-index: 1;
    margin-top: 40px;
}
.cs-hero-glance__list {
    display: grid;
    grid-template-columns: repeat(var(--cs-glance-n, 4), minmax(0, 1fr));
    margin: 0 auto;
    max-width: 1184px;
    background: rgba(30, 30, 30, .78);
    border: 1px solid rgba(255, 255, 255, .14);
    border-bottom: 0;
}
.cs-hero-glance__item {
    text-align: center;
    color: #fff;
    padding: 22px 18px 24px;
    border-left: 1px solid rgba(255, 255, 255, .14);
}
.cs-hero-glance__item:first-child { border-left: 0; }
.cs-hero-glance__item dt {
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .78em;
    margin: 10px 0 6px;
}
.cs-hero-glance__item dd {
    margin: 0;
    font-size: .95em;
    line-height: 1.4;
}
.cs-hero-glance .cs-slider__btn { display: none; }

/* white line icons */
.cs-icon {
    display: inline-block;
    width: 34px;
    height: 34px;
    background: currentColor;
    -webkit-mask: var(--cs-i) center / contain no-repeat;
    mask: var(--cs-i) center / contain no-repeat;
}
.cs-icon--clock    { --cs-i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
.cs-icon--drop     { --cs-i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'%3E%3Cpath d='M12 3s6 6.6 6 11a6 6 0 0 1-12 0c0-4.4 6-11 6-11z'/%3E%3C/svg%3E"); }
.cs-icon--calendar { --cs-i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Crect x='3.5' y='5' width='17' height='15' rx='1.5'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E"); }
.cs-icon--repeat   { --cs-i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 12a8 8 0 0 1-13.7 5.7M4 12a8 8 0 0 1 13.7-5.7'/%3E%3Cpath d='M18 2.5v4h-4M6 21.5v-4h4'/%3E%3C/svg%3E"); }
.cs-icon--spark    { --cs-i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'%3E%3Cpath d='M12 3l2.2 6.8L21 12l-6.8 2.2L12 21l-2.2-6.8L3 12l6.8-2.2z'/%3E%3C/svg%3E"); }

@media (max-width: 768px) {
    .cs-hero-glance { padding: 0 16px; margin-top: 28px; }
    .cs-hero-glance__list {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
        border-bottom: 1px solid rgba(255, 255, 255, .14);
    }
    .cs-hero-glance__list::-webkit-scrollbar { display: none; }
    .cs-hero-glance__item {
        flex: 0 0 100%;
        scroll-snap-align: start;
        border-left: 0;
        padding: 18px 56px 20px;
    }
    .cs-hero-glance .cs-slider__btn {
        display: block;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 2;
    }
    .cs-hero-glance .cs-slider__btn--prev { left: 30px; }
    .cs-hero-glance .cs-slider__btn--next { right: 30px; }
    .cs-hero-glance.is-static .cs-slider__btn { display: none; }
}

/* ---- Slider buttons + dots (shared) ---- */
.cs-slider__btn {
    width: 48px;
    height: 48px;
    border: 0;
    padding: 0;
    cursor: pointer;
    background: var(--cs-dark);
    position: relative;
}
.cs-slider__btn::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 10px;
    border-left: 2px solid var(--cs-brown-light);
    border-bottom: 2px solid var(--cs-brown-light);
    transform: translate(-30%, -50%) rotate(45deg);
}
.cs-slider__btn--next::after { transform: translate(-70%, -50%) rotate(-135deg); }
.cs-dots { display: flex; justify-content: center; gap: 4px; margin-top: 30px; }
.cs-dots button {
    width: 14px;
    height: 14px;
    border: 0;
    padding: 0;
    background: #8f8a86;
    cursor: pointer;
}
.cs-dots button.is-active { background: var(--cs-brown); }

/* ---- What is / How it works: 50/50 image + text ---- */
.cs-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
}
.cs-split--img { grid-template-columns: minmax(0, 41%) minmax(0, 1fr); }
.cs-split--reverse.cs-split--img { grid-template-columns: minmax(0, 1fr) minmax(0, 41%); }
.cs-split--reverse .cs-split__media { order: 2; }
.cs-split__media img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}
.cs-split__body {
    align-self: center;
    padding: 70px 64px;
    max-width: 760px;
    font-size: 1.02em;
    line-height: 1.7;
}
.cs-split:not(.cs-split--img) .cs-split__body { margin: 0 auto; max-width: 900px; }
.cs-split__text ul { padding-left: 1.2em; margin: 0 0 1em; }
.cs-split__text li { margin-bottom: 4px; }
@media (max-width: 1024px) {
    .cs-split--img,
    .cs-split--reverse.cs-split--img { grid-template-columns: minmax(0, 1fr); }
    .cs-split--reverse .cs-split__media { order: 0; }
    .cs-split__media img { aspect-ratio: 1 / 1; max-height: 520px; }
    .cs-split__body { padding: 44px 24px 50px; max-width: none; }
}

/* ---- Bands ---- */
.cs-band { padding: 80px 0; }
.cs-band__title { text-align: center; }
.cs-band__title--soft { text-transform: none !important; font-size: 1.9em !important; }
.cs-cream { background: #e9e5e2; }
.cs-cream .cs-band + .cs-band { padding-top: 10px; }
@media (max-width: 768px) {
    .cs-band { padding: 54px 0; }
}

/* checklist (Key Benefits + Where) */
.cs-checks,
.cs-where__list ul {
    list-style: none;
    margin: 0 0 26px;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 34px;
}
.cs-checks { max-width: 900px; margin: 0 auto 30px; }
.cs-checks li,
.cs-where__list li {
    position: relative;
    padding-left: 34px;
    margin: 0;
    line-height: 1.45;
}
.cs-checks li::before,
.cs-where__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: -1px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--cs-brown) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center / 13px no-repeat;
}
.cs-where__list p { margin: 0 0 14px; }
@media (max-width: 600px) {
    .cs-checks, .cs-where__list ul { grid-template-columns: 1fr; }
}
.cs-benefits .c__treatmentCta { justify-content: center; }

/* ---- Results carousel ---- */
.cs-carousel { position: relative; padding: 0 48px; margin-top: 40px; }
.cs-carousel__track {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}
.cs-carousel__track::-webkit-scrollbar { display: none; }
.cs-carousel__item {
    flex: 0 0 calc((100% - 40px) / 3);
    margin: 0;
    scroll-snap-align: start;
    background: #d6cfca;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
}
.cs-carousel__item img { display: block; width: 100%; height: 100%; object-fit: contain; }
.cs-carousel .cs-slider__btn { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; }
.cs-carousel .cs-slider__btn--prev { left: 0; }
.cs-carousel .cs-slider__btn--next { right: 0; }
.cs-carousel.is-static .cs-slider__btn,
.cs-carousel.is-static .cs-dots { display: none; }
.cs-results__note { text-align: center; font-size: .82em; opacity: .7; margin: 16px 0 0; }
@media (max-width: 768px) {
    .cs-carousel { padding: 0; }
    .cs-carousel__item { flex-basis: 100%; }
    .cs-carousel .cs-slider__btn { display: none; }
}

/* ---- What to expect: 3 cards ---- */
.cs-steps__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin: 36px 0 30px;
}
.cs-step {
    background: #fff;
    border: 1px solid var(--cs-brown);
    border-top: 0;
    display: flex;
    flex-direction: column;
}
.cs-step__img img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.cs-step__body { padding: 28px 30px 26px; font-size: .95em; line-height: 1.6; }
.cs-step__body h3 { font-size: 1.15em; font-weight: 400; line-height: 1.35; margin: 0 0 12px; }
.cs-step__body h3 span { display: block; font-size: 1.25em; margin-bottom: 4px; }
.cs-step__body p:last-child { margin-bottom: 0; }
@media (max-width: 1024px) {
    .cs-steps__grid { grid-template-columns: minmax(0, 1fr); max-width: 560px; margin-left: auto; margin-right: auto; }
}

/* ---- Where can this be applied ---- */
.cs-where {
    background: #b08c68 center / cover no-repeat;
    padding: 120px 0;
}
.cs-where__mobileimg { display: none; }
.cs-where__box {
    background: #e9e5e2;
    border-top: 4px solid var(--cs-brown);
    max-width: 730px;
    padding: 28px 24px 26px;
}
.cs-where__box h2 { margin-bottom: 26px; }
@media (max-width: 768px) {
    .cs-where { background-image: none !important; background-color: #e9e5e2; padding: 0 0 40px; }
    .cs-where__mobileimg { display: block; height: 260px; background: center / cover no-repeat; }
    .cs-where__box { border-top: 0; padding: 30px 0 0; }
}

/* ---- Prices: the theme's own slide-out drawer, untouched ---- */
.cs-table-scroll { overflow-x: auto; }
.cs-pricing__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin-top: 22px; }
.cs-pricing__info p { margin: 0; }

/* ---- FAQs ---- */
.cs-faqs { padding-top: 60px; }
.cs-faqs .cs-center { margin-top: 30px; }

/* ---- Testimonials (dark, slanted top) ---- */
.cs-quotes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 560px;
    margin-top: 40px;
    clip-path: polygon(0 5%, 100% 0, 100% 100%, 0 100%);
    background: var(--cs-dark);
}
.cs-quotes__img { background: #333 center / cover no-repeat; }
.cs-quotes__body {
    position: relative;
    display: flex;
    align-items: center;
    padding: 90px 120px 70px 66px;
    color: #fff;
}
.cs-quotes__track {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    width: 100%;
}
.cs-quotes__track::-webkit-scrollbar { display: none; }
.cs-quote { flex: 0 0 100%; scroll-snap-align: start; margin: 0; padding: 0; border: 0; }
.cs-quote p { font-style: italic; font-size: 1.45em; line-height: 1.5; margin: 0 0 30px; color: #fff; }
.cs-quote cite {
    display: inline-block;
    font-style: normal;
    text-transform: uppercase;
    font-size: 1.6em;
    padding-top: 18px;
    border-top: 1px solid var(--cs-brown);
    min-width: 120px;
}
.cs-quotes__nav { position: absolute; right: 60px; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; gap: 6px; }
.cs-quotes__nav .cs-slider__btn { background: transparent; border: 1px solid #fff; }
@media (max-width: 1024px) {
    .cs-quotes { grid-template-columns: 1fr; min-height: 0; clip-path: polygon(0 3%, 100% 0, 100% 100%, 0 100%); }
    .cs-quotes__img { height: 300px; }
    .cs-quotes__body { padding: 50px 24px 90px; text-align: center; }
    .cs-quote p { font-size: 1.15em; }
    .cs-quotes__nav { top: auto; bottom: 26px; right: 50%; transform: translateX(50%); flex-direction: row; }
}

/* ---- Related treatments ---- */
.cs-related2__head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 26px;
}
.cs-related2__head h2 { font-size: 1.5em; margin: 0; }
.cs-btn--outline {
    background: transparent;
    border: 1px solid var(--cs-dark);
    color: var(--cs-dark);
}
.cs-btn--outline:hover { background: var(--cs-dark); color: #fff; }
.cs-related2__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.cs-rcard { display: flex; flex-direction: column; background: #e9e5e2; color: inherit; text-decoration: none; }
.cs-rcard__img { background: #d6cfca; }
.cs-rcard__img img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.cs-rcard__body { padding: 22px 22px 24px; display: flex; flex-direction: column; align-items: flex-start; flex: 1; }
.cs-rcard__body h3 { text-transform: uppercase; font-weight: 400; font-size: 1.05em; margin: 0 0 8px; }
.cs-rcard__body p { font-size: .92em; line-height: 1.5; margin: 0 0 18px; flex: 1; }
.cs-rcard:hover .cs-btn { background: var(--cs-dark); }
@media (max-width: 1024px) {
    .cs-related2__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .cs-related2__grid { grid-template-columns: 1fr; }
}

/* keep page sections below the sticky header */
.cs-tp { position: relative; z-index: 0; isolation: isolate; }
.c__hero--treatment { isolation: isolate; }
.cs-faqs { padding-top: 70px; }
.cs-hero__bestfor span { font-size: 14px; }

/* pricing drawer keeps the theme's original wrappers, but takes no space in the page */
.l__contain.m__text-block.cs-pricing { padding-top: 0; padding-bottom: 0; margin-top: 0; margin-bottom: 0; min-height: 0; }

/* Pricing drawer: something on the new layout resets it to position: static.
   Re-assert the theme's live values (styles.min.css) so it slides in from the right. */
.cs-pricing .c__treatmentForm,
.cs-pricing .c__treatmentTable {
    position: fixed !important;
    top: 50%;
    transform: translateY(-50%);
    transition: .6s ease-in;
    z-index: 9999;
    width: 100vw !important;
    right: -100vw;
    left: auto !important;
}
@media (min-width: 769px) {
    .cs-pricing .c__treatmentForm,
    .cs-pricing .c__treatmentTable {
        width: 768px !important;
        right: -768px;
    }
}
.cs-pricing .c__treatmentForm.open,
.cs-pricing .c__treatmentTable.open { right: 0; }


/* hero: "Best for" line at a fixed size (theme hero paragraphs are large) */
.c__hero .c__hero__content p.cs-hero__bestfor { font-size: 18px; line-height: 1.5; }
.c__hero .c__hero__content p.cs-hero__bestfor span { font-size: 13px; }

/* ROUND 7: membership card buttons all the same height (room for two lines) */
.cs-mcard__cta {
    display: flex !important;
    align-items: center;
    justify-content: center;
    min-height: 68px;
    line-height: 1.35;
    padding-top: 10px;
    padding-bottom: 10px;
    box-sizing: border-box;
}

/* ROUND 7b: press banner - site font (Avenir) and no colour change on hover */
.cs-press__source {
    font-family: inherit;
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 1.15em;
}
.cs-press,
.cs-press:hover,
.cs-press:focus,
.cs-press:visited,
.cs-press:hover .cs-press__source,
.cs-press:hover .cs-press__quote {
    color: #fff;
    opacity: 1;
}
.cs-press:hover .cs-press__stars { color: #d8b878; }
.cs-press:hover .cs-press__cta { background: #fff; color: var(--cs-dark); }

/* ROUND 7d: related treatment cards use the same text sizes as the
   membership and treatment-category cards (title 1.3em, text at body size) */
.cs-rcard__body { padding: 24px 24px 26px; }
.cs-rcard__body h3,
.cs-related2 .cs-rcard__body h3 { font-size: 1.3em; line-height: 1.3; margin: 0 0 10px; }
.cs-rcard__body p,
.cs-related2 .cs-rcard__body p { font-size: 1em; line-height: inherit; margin: 0 0 18px; }
@media (max-width: 768px) {
    .cs-related2__head h2 { font-size: 1.35em; }
    .cs-btn--outline { width: 100%; text-align: center; }
}

/* ROUND 7e: "Other treatment categories" as site-style buttons */
.tcat-page__others-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.tcat-page__others-list a,
.tcat-page__others-list a.arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 22px;
    margin: 0;
    border: 1px solid var(--cs-brown);
    background: transparent none;
    color: var(--cs-brown);
    text-transform: uppercase;
    letter-spacing: .1em;
    font-size: .85em;
    line-height: 1.3;
    text-decoration: none;
    text-align: center;
    transition: background .2s, color .2s;
}
.tcat-page__others-list a.arrow::before,
.tcat-page__others-list a.arrow::after { display: none; }
.tcat-page__others-list a:hover,
.tcat-page__others-list a:focus {
    background: var(--cs-brown);
    color: #fff;
}
@media (max-width: 600px) {
    .tcat-page__others-list a { flex: 1 1 100%; }
}

/* ROUND 7f: category page consultation band - full width */
.tcat-page__cta {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding: 60px 24px;
    box-sizing: border-box;
    border-radius: 0;
}
.tcat-page__cta p { font-size: 1.15em; margin: 0 auto 22px; max-width: 760px; }
@media (max-width: 768px) {
    .tcat-page__cta { padding: 44px 20px; }
}
.tcat-page__cta p { max-width: none; }
.tcat-page__cta-q { display: inline-block; font-size: 1.2em; margin-bottom: 4px; }

/* ROUND 7i: treatment hero text column narrower on desktop (was 50%),
   so the white text stays on the darker side of the header image */
@media (min-width: 1025px) {
    .c__hero.c__hero--treatment .c__hero__content {
        width: 42%;
        max-width: 42%;
    }
    .c__hero--treatment .c__hero--treatment__intro,
    .c__hero.c__hero--treatment .c__hero__content p.cs-hero__bestfor {
        max-width: 100%;
    }
}

/* ==========================================================
   ROUND 8 (Oct 2026): membership pages - LTF Figma layout
   ========================================================== */
.cs-mp h1, .cs-mp h2 { text-transform: uppercase; font-weight: 400; }
.cs-mp-h2 { font-size: 2.2em; line-height: 1.15; }
@media (max-width: 768px) { .cs-mp-h2 { font-size: 1.55em; } }

/* Header */
.cs-mp-hero {
    position: relative;
    background: #1e1e1e center / cover no-repeat;
    color: #fff;
    padding: 90px 0;
    isolation: isolate;
}
.cs-mp-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,.45) 55%, rgba(0,0,0,.25) 100%);
    z-index: -1;
}
.cs-mp-hero__mobile { display: none; }
.cs-mp-hero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 612px);
    gap: 40px;
    align-items: center;
}
.cs-mp-hero__text h1 { color: #fff; font-size: 3.2em; line-height: 1.1; margin: 18px 0 26px; }
.cs-mp-hero__text, .cs-mp-hero__text a { color: #fff; }
.cs-mp-hero__intro { font-size: 1.55em; line-height: 1.45; margin: 0; }
@media (max-width: 1024px) {
    .cs-mp-hero { padding: 50px 0 0; }
    .cs-mp-hero__inner { grid-template-columns: minmax(0, 1fr); }
    .cs-mp-hero__text h1 { font-size: 2.2em; }
    .cs-mp-hero__intro { font-size: 1.15em; }
    .cs-mp-hero .cs-pbox--hero { margin-bottom: 0; }
}

/* Price box */
.cs-pbox {
    background: #1e1e1e;
    color: #fff;
    border-top: 4px solid var(--cs-brown);
    padding: 30px 32px 32px;
}
.cs-pbox--hero { background: rgba(26, 24, 22, .94); }
.cs-pbox--close { background: #000; }
.cs-pbox__top { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; }
.cs-pbox__name h2 { color: #fff; font-size: 1.55em; margin: 0 0 12px; text-transform: uppercase; }
.cs-pbox__name p { margin: 0; line-height: 1.5; max-width: 300px; }
.cs-pbox__price { text-align: right; flex-shrink: 0; }
.cs-pbox__amount { display: block; font-size: 3.6em; line-height: 1; color: #fff; }
.cs-pbox__amount small { font-size: .5em; text-transform: uppercase; }
.cs-pbox__note {
    display: inline-block;
    margin-top: 8px;
    border: 1px solid var(--cs-brown-light);
    border-radius: 999px;
    padding: 3px 9px;
    font-size: .85em;
    white-space: nowrap;
}
.cs-pbox__includes { border-top: 1px solid rgba(255,255,255,.15); border-bottom: 1px solid rgba(255,255,255,.15); margin: 26px 0 26px; padding: 22px 0 14px; }
.cs-pbox--hero .cs-pbox__includes { border: 0; padding-top: 6px; margin-top: 14px; }
.cs-pbox__label { margin: 0 0 14px; }
.cs-pbox__includes ul { list-style: none; margin: 0; padding: 0; }
.cs-pbox__includes li { position: relative; padding-left: 34px; margin: 0 0 14px; line-height: 1.45; color: #fff; }
.cs-pbox__includes li::before {
    content: "";
    position: absolute;
    left: 4px;
    top: .3em;
    width: 13px;
    height: 7px;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(-45deg);
}
.cs-pbox .cs-btn { margin-top: 0; }
@media (max-width: 600px) {
    .cs-pbox { padding: 24px 20px; }
    .cs-pbox__top { flex-direction: column; }
    .cs-pbox__price { text-align: left; }
    .cs-pbox__amount { font-size: 3em; }
}

/* Treatments available */
.cs-mp-treats__track { gap: 20px; }
.cs-mp-treat {
    flex: 0 0 calc((100% - 60px) / 4);
    scroll-snap-align: start;
    display: flex;
    min-height: 90px;
    background: #e9e5e2;
    color: inherit;
    text-decoration: none;
}
.cs-mp-treat__img { flex: 0 0 90px; background: #d6cfca center / cover no-repeat; }
.cs-mp-treat__body { padding: 14px 18px; display: flex; flex-direction: column; justify-content: center; gap: 6px; line-height: 1.35; }
.cs-mp-treat__body strong { text-transform: uppercase; font-weight: 500; }
.cs-mp-treat__body span { font-size: .9em; }
.cs-mp-treat:hover { background: #ddd5cc; }
.cs-mp-treats__carousel { padding: 0; margin-top: 30px; }
.cs-mp-treats__nav { display: flex; justify-content: space-between; align-items: center; margin-top: 30px; }
.cs-mp-treats__nav .cs-slider__btn { position: relative; transform: none; }
.cs-mp-treats__nav .cs-dots { margin: 0; }
.cs-mp-treats__carousel.is-static .cs-mp-treats__nav { display: none; }
@media (max-width: 1024px) { .cs-mp-treat { flex-basis: calc((100% - 20px) / 2); } }
@media (max-width: 600px) {
    .cs-mp-treats__track { flex-direction: column; overflow: visible; gap: 12px; }
    .cs-mp-treat { flex-basis: auto; }
    .cs-mp-treats__nav { display: none; }
}

/* Steps on membership pages: title only */
.cs-mp .cs-step__body h3 span { font-size: 1.35em; margin: 0; }

/* Dark block: testimonial + closing price box */
.cs-mp-dark { background: var(--cs-dark); color: #fff; margin-top: 0; padding-bottom: 70px; }
.cs-quotes--mp { margin-top: 0; }
.cs-mp-close { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 612px); gap: 40px; align-items: center; padding-top: 60px; }
.cs-mp-close__text h2 { color: #fff; font-size: 3em; line-height: 1.15; margin: 0 0 20px; }
.cs-mp-close__text p { font-size: 1.55em; line-height: 1.4; margin: 0; }
@media (max-width: 1024px) {
    .cs-mp-close { grid-template-columns: minmax(0, 1fr); padding-top: 40px; }
    .cs-mp-close__text h2 { font-size: 1.9em; }
    .cs-mp-close__text p { font-size: 1.15em; }
}

/* Explore other memberships */
.cs-mp-others__title { font-size: 1.6em; margin: 0 0 24px; }
.cs-mcards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1024px) { .cs-mcards--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .cs-mcards--3 { grid-template-columns: 1fr; } }

/* ROUND 8b: slider arrows in the site's button colours (brown, white chevron) */
.cs-mp-treats__nav .cs-slider__btn,
.cs-carousel .cs-slider__btn,
.cs-hero-glance .cs-slider__btn {
    background: var(--cs-brown);
    border: 0;
    transition: background .2s;
}
.cs-mp-treats__nav .cs-slider__btn:hover,
.cs-mp-treats__nav .cs-slider__btn:focus-visible,
.cs-carousel .cs-slider__btn:hover,
.cs-carousel .cs-slider__btn:focus-visible {
    background: var(--cs-dark);
}
.cs-slider__btn::after {
    display: block !important;
    content: "" !important;
    border-color: #fff !important;
    border-top: 0 !important;
    border-right: 0 !important;
    border-style: solid !important;
    border-width: 0 0 2px 2px !important;
}
.cs-quotes__nav .cs-slider__btn:hover { background: var(--cs-brown); border-color: var(--cs-brown); }

/* ROUND 8d: tighter gap above "Treatments available" on mobile */
@media (max-width: 768px) {
    .cs-mp .cs-split__body { padding-bottom: 24px; }
    .cs-mp .cs-mp-treats { padding-top: 20px; }
    .cs-mp .cs-mp-treats .cs-band__title { margin-bottom: 0; }
    .cs-mp .cs-mp-treats__carousel { margin-top: 18px; }
}

/* ROUND 9: membership plans, benefits and application form (CULTSTATUS) */
.cs-mp-plans__group { text-align: center; text-transform: uppercase; font-weight: 400; font-size: 1.25em; letter-spacing: .06em; margin: 40px 0 18px; }
.cs-mp-plans__grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; }
.cs-plan {
    flex: 0 1 calc((100% - 40px) / 3);
    background: #e9e5e2;
    border-top: 3px solid var(--cs-brown);
    padding: 26px 24px;
    text-align: center;
    box-sizing: border-box;
}
.cs-plan h4 { text-transform: uppercase; font-weight: 400; font-size: 1.1em; margin: 0 0 10px; }
.cs-plan__detail { margin: 0 0 16px; line-height: 1.5; }
.cs-plan__price { font-size: 2.4em; line-height: 1; margin: 0 0 6px; color: var(--cs-dark); }
.cs-plan__price small { font-size: .4em; text-transform: uppercase; margin-left: 2px; }
.cs-plan__annual { margin: 0; font-size: .9em; opacity: .8; }
.cs-mp-plans .cs-center { margin-top: 36px; }
.cs-mp-priv { padding-top: 20px; }
.cs-mp-form { padding: 70px 0; scroll-margin-top: 120px; }
.cs-mp-form__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 40px; }
.cs-mp-form__text h2 { font-size: 2em; margin: 0 0 18px; }
@media (max-width: 1024px) {
    .cs-plan { flex-basis: calc((100% - 20px) / 2); }
    .cs-mp-form__inner { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
    .cs-plan { flex-basis: 100%; }
    .cs-mp-form { padding: 46px 0; }
}

/* ROUND 10: related-treatments note, general review label */
.cs-mp-treats__note { text-align: center; max-width: 760px; margin: -6px auto 0; font-size: .95em; opacity: .8; }
.cs-quote__label { display: block; margin-top: 12px; font-size: .78em; letter-spacing: .1em; text-transform: uppercase; opacity: .65; }

/* ---- Round 11 (Advertise1, Oct 2026): reduced price, purchase link + enquiry link ---- */
.cs-pbox__sale { display: block; margin-bottom: 6px; font-size: .8em; letter-spacing: .08em; text-transform: uppercase; color: var(--cs-brown-light, #c9b49a); }
.cs-pbox__was { font-size: .45em; opacity: .7; margin-right: 6px; vertical-align: middle; text-decoration-thickness: 2px; }
.cs-pbox__upcoming { display: block; width: max-content; margin-left: auto; }
.cs-pbox__enquire { display: block; margin-top: 12px; text-align: left; font-size: .9em; color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.cs-pbox__enquire:hover { opacity: .8; }
.cs-mcard__price s { opacity: .6; margin-right: 4px; }
@media (max-width: 767px) { .cs-pbox__upcoming { margin-left: 0; } }

/* Round 11b (Advertise1): testimonials tuck 30px under the section above, keeping the slanted top,
   on treatment pages (with or without FAQs) and membership pages */
.cs-quotes { margin-top: -30px; position: relative; }
.cs-quotes--mp { margin-top: -30px; clip-path: polygon(0 5%, 100% 0, 100% 100%, 0 100%); }
/* membership: no black band above the testimonial image - the dark background starts below the slant */
.cs-mp-dark { background: linear-gradient(to bottom, transparent 0, transparent 120px, var(--cs-dark) 120px); }
@media (max-width: 1024px) {
    .cs-quotes--mp { clip-path: polygon(0 3%, 100% 0, 100% 100%, 0 100%); }
}

/* Round 11d: medicine information pages */
.cs-source { margin-top: 18px; font-size: .82em; line-height: 1.5; opacity: .8; }
.cs-source a, .cs-medinfo a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }


/* ---- Shop (Advertise1, Oct 2026): recommended skincare, product details, shop navigation ---- */
.cs-skincare { padding: 70px 0; }
.cs-skincare__intro { max-width: 760px; margin: 0 auto 34px; text-align: center; }
.cs-skincare__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 240px)); justify-content: center; gap: 24px; }
.cs-skincare__card { display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: inherit; background: #fff; padding: 0 0 18px; border: 1px solid #e9e5e2; transition: border-color .2s; }
.cs-skincare__card:hover { border-color: var(--cs-brown, #86705a); }
.cs-skincare__img { display: block; aspect-ratio: 1 / 1; background: #f4f1ee; overflow: hidden; }
.cs-skincare__img img { width: 100%; height: 100%; object-fit: contain; }
.cs-skincare__brand { padding: 12px 16px 0; font-size: .72em; letter-spacing: .12em; text-transform: uppercase; color: var(--cs-brown, #86705a); }
.cs-skincare__name { padding: 0 16px; font-size: .95em; line-height: 1.35; }
.cs-skincare__price { padding: 0 16px; font-size: .9em; opacity: .8; }
.cs-pdetail { clear: both; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 30px 50px; padding: 50px 0 20px; border-top: 1px solid #e9e5e2; margin-top: 40px; }
.cs-pdetail h2 { font-size: 1.3em; margin: 0 0 14px; text-transform: uppercase; letter-spacing: .04em; }
.cs-pdetail h3 { font-size: .8em; margin: 14px 0 6px; letter-spacing: .1em; text-transform: uppercase; color: var(--cs-brown, #86705a); }
.cs-pdetail__treats ul { list-style: none; margin: 0; padding: 0; }
.cs-pdetail__treats li { margin: 0 0 6px; }
.cs-pdetail__treats a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.cs-consult-box { margin: 20px 0; padding: 20px; background: #f4f1ee; border-left: 3px solid var(--cs-brown, #86705a); }
.cs-consult-box p { margin: 0 0 14px; font-size: .92em; }
.cs-consult-price { font-size: .85em; letter-spacing: .08em; text-transform: uppercase; }
.cs-shopnav { margin: 0 0 34px; display: flex; flex-direction: column; gap: 14px; }
.cs-shopnav__row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.cs-shopnav__label { font-size: .78em; letter-spacing: .12em; text-transform: uppercase; min-width: 170px; }
.cs-shopnav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.cs-shopnav a { display: inline-block; padding: 7px 14px; border: 1px solid #d6cfc8; border-radius: 999px; font-size: .85em; text-decoration: none; color: inherit; }
.cs-shopnav a:hover, .cs-shopnav a.is-current { background: var(--cs-brown, #86705a); border-color: var(--cs-brown, #86705a); color: #fff; }
@media (max-width: 767px) {
    .cs-skincare__grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .cs-shopnav__label { min-width: 0; width: 100%; }
}

/* Shop hero (shop, product category and brand pages): dark, readable text over a light overlay, image kept */
body.post-type-archive-product .c__hero .c__hero__img.full::after,
body.tax-product_cat .c__hero .c__hero__img.full::after,
body.tax-product_brand .c__hero .c__hero__img.full::after {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(90deg, rgba(255,255,255,.82) 0%, rgba(255,255,255,.65) 40%, rgba(255,255,255,0) 72%);
}
body.post-type-archive-product .c__hero .c__hero__img.full,
body.tax-product_cat .c__hero .c__hero__img.full,
body.tax-product_brand .c__hero .c__hero__img.full { position: absolute; }
body.post-type-archive-product .c__hero__content, body.post-type-archive-product .c__hero__content *,
body.tax-product_cat .c__hero__content, body.tax-product_cat .c__hero__content *,
body.tax-product_brand .c__hero__content, body.tax-product_brand .c__hero__content * { color: #1e1e1e !important; text-shadow: none !important; }
body.post-type-archive-product .c__hero__content a:not(.btn), body.tax-product_cat .c__hero__content a:not(.btn), body.tax-product_brand .c__hero__content a:not(.btn) { color: var(--cs-brown, #86705a) !important; }
body.post-type-archive-product .c__hero__content .btn, body.tax-product_cat .c__hero__content .btn, body.tax-product_brand .c__hero__content .btn {
    color: #1e1e1e !important; border-color: #1e1e1e !important; background: rgba(255,255,255,.6) !important;
}
body.post-type-archive-product .c__hero__content .btn:hover, body.tax-product_cat .c__hero__content .btn:hover, body.tax-product_brand .c__hero__content .btn:hover {
    color: #fff !important; background: var(--cs-brown, #86705a) !important; border-color: var(--cs-brown, #86705a) !important;
}
@media (max-width: 767px) {
    body.post-type-archive-product .c__hero .c__hero__img.full::after,
    body.tax-product_cat .c__hero .c__hero__img.full::after,
    body.tax-product_brand .c__hero .c__hero__img.full::after { background: rgba(255,255,255,.7); }
}

/* Membership cards: photos in greyscale (CARD labels keep their colour) - Advertise1, 22 Oct 2026 */
.cs-mcard__img { background-color: #fff; background-blend-mode: luminosity; }

/* iPhone Safari: keep membership cards inside the screen (Advertise1, 26 Oct 2026) */
.cs-mcards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1024px) { .cs-mcards, .cs-mcards--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .cs-mcards, .cs-mcards--3 { grid-template-columns: minmax(0, 1fr); } }
.cs-mcard, .cs-mcard__body, .cs-mcard__img { min-width: 0; max-width: 100%; }
.cs-mcard__cta { white-space: normal; max-width: 100%; }