/* ===================================
   MELIORA - Modern Beauty Salon
   Beautifly-inspired Design
   =================================== */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,400&family=Lora:ital,wght@0,400;0,500;0,600;1,400;1,500&display=swap');

:root {
    --black: #1a1a1a;
    --dark: #2d2d2d;
    --gray: #666666;
    --gray-light: #999999;
    --gray-lighter: #e5e5e5;
    --beige: #f5f0eb;
    --beige-dark: #e8e0d8;
    --cream: #faf8f6;
    --white: #ffffff;
    --accent: #c4a77d;
    --accent-dark: #b39668;

    --font-heading: 'Lora', Georgia, serif;
    --font-body: 'DM Sans', -apple-system, sans-serif;

    /* type scale */
    --text-display: clamp(2.5rem, 6vw, 5rem);
    --text-h1: clamp(2.5rem, 5vw, 4rem);
    --text-h2: clamp(2.25rem, 4.5vw, 3.5rem);
    --text-h3: clamp(1.375rem, 2.5vw, 1.75rem);
    --text-h4: 1.25rem;
    --text-eyebrow: 0.8125rem;
    --text-lead: 1.125rem;
    --text-body: 1rem;
    --text-small: 0.875rem;
    --text-ui: 0.875rem;
    --text-nav: 1.0625rem;
    --text-decorative: clamp(2.5rem, 4vw, 3rem);
    --text-price: clamp(1.75rem, 3vw, 2.25rem);

    --leading-display: 1.12;
    --leading-heading: 1.2;
    --leading-snug: 1.35;
    --leading-body: 1.75;
    --leading-relaxed: 1.8;

    --tracking-eyebrow: 0.2em;
    --tracking-ui: 0.04em;

    --link-color: var(--accent-dark);
    --link-hover: var(--accent);
    --link-underline: rgba(179, 150, 104, 0.45);
    --link-transition: color 0.25s ease, text-decoration-color 0.25s ease, gap 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;

    --container: 1290px;
    --gap: 30px;
    --primary: var(--accent);
    --space-sm: 10px;
    --space-lg: 24px;
    --hero-enter-duration: 800ms;
    --hero-enter-delay: 80ms;
    --hero-enter-ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);

    /* grid system */
    --grid-columns: 12;
    --grid-gutter: 30px;

    /* vertical rhythm — one cadence for every top-level section */
    --section-y: clamp(64px, 9vw, 120px);

    /* elevation + radius (warm-tinted, multi-layer) */
    --radius-card: 20px;
    --shadow-card: 0 8px 32px rgba(60, 40, 20, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.72);
    --shadow-card-hover: 0 16px 48px rgba(60, 40, 20, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.85);

    /* liquid glass */
    --glass-blur: blur(22px) saturate(180%);
    --glass-blur-strong: blur(32px) saturate(200%);
    --glass-blur-soft: blur(14px) saturate(165%);
    --glass-bg: rgba(255, 255, 255, 0.58);
    --glass-bg-strong: rgba(255, 255, 255, 0.78);
    --glass-bg-subtle: rgba(255, 255, 255, 0.38);
    --glass-bg-beige: rgba(245, 240, 235, 0.72);
    --glass-bg-dark: rgba(26, 26, 26, 0.38);
    --glass-border: rgba(255, 255, 255, 0.62);
    --glass-border-subtle: rgba(255, 255, 255, 0.34);
    --glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.78);
    --glass-shadow: 0 8px 32px rgba(60, 40, 20, 0.09), var(--glass-highlight);
    --glass-shadow-hover: 0 16px 48px rgba(60, 40, 20, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.88);
    --glass-accent: rgba(196, 167, 125, 0.88);
    --glass-accent-border: rgba(255, 255, 255, 0.32);
    --glass-bg-input: rgba(255, 255, 255, 0.55);

    /* shared button interaction */
    --btn-press: 1px;
    --btn-transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.1s ease;

    /* measured by js/app.js from #header (and sticky bars) */
    --header-offset: 92px;
    --price-nav-height: 64px;
    --subnav-height: 54px;
}

/* ===== LIQUID GLASS — shared surfaces ===== */
:is(
    .video-card,
    .service-card,
    .reviews-summary,
    .reviews__card,
    .step-card,
    .product-line-card,
    .contact-map,
    .contact-form,
    .contact-info__tip,
    .booking-modal__content,
    .weekends-modal__content,
    .gift-section__icon,
    .gallery-grid--bento .gallery-item,
    .brand-intro__content,
    .feature-item
) {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
}

:is(
    .video-card,
    .step-card,
    .product-line-card,
    .contact-map,
    .contact-form,
    .booking-modal__content,
    .weekends-modal__content,
    .gallery-grid--bento .gallery-item,
    .brand-intro__content,
    .feature-item
) {
    border-radius: var(--radius-card);
}

.product-gallery__item,
.product-item {
    background: rgba(245, 240, 235, 0.55);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border: 1px solid var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
}

.product-item:hover {
    background: rgba(255, 255, 255, 0.72);
    border-color: var(--glass-border);
}

/* ===== PRELOADER (homepage; timing in js/app.js) ===== */
.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at center, #faf8f6 0%, #f0e8df 50%, #e5d9ca 100%);
    transition: opacity 0.35s ease;
}

.preloader.is-hiding {
    opacity: 0;
}

.preloader.is-hidden {
    display: none;
    opacity: 0;
    pointer-events: none;
}

.preloader__content {
    text-align: center;
    transition: opacity 0.22s ease, transform 0.22s ease;
    animation: preloader-in 0.55s ease both;
}

@keyframes preloader-in {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .preloader__content {
        animation: none;
    }
}

.preloader__content.is-hiding {
    opacity: 0;
    transform: translateY(-12px);
}

.preloader__logo {
    width: 280px;
    height: auto;
    display: block;
    margin: 0 auto;
}

.preloader__slogan {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-style: italic;
    font-weight: 400;
    color: var(--gray);
    margin-top: 20px;
}

/* Reset */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-body);
    font-size: var(--text-body);
    font-weight: 400;
    line-height: var(--leading-body);
    color: var(--gray);
    background:
        radial-gradient(ellipse 100% 80% at 50% -20%, rgba(196, 167, 125, 0.08), transparent 50%),
        linear-gradient(180deg, #ffffff 0%, #faf8f6 100%);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-wrap: pretty;
}

/* ===== TYPOGRAPHY & DETAIL POLISH ===== */
h1, h2, h3, h4 {
    font-family: var(--font-heading);
    color: var(--black);
    font-weight: 400;
}

h1 {
    font-size: var(--text-h1);
    line-height: var(--leading-display);
}

h2 {
    font-size: var(--text-h2);
    line-height: var(--leading-heading);
}

h3 {
    font-size: var(--text-h3);
    font-weight: 500;
    line-height: var(--leading-snug);
}

h4 {
    font-size: var(--text-h4);
    font-weight: 500;
    line-height: var(--leading-snug);
}

.eyebrow,
.hero__label,
.section__label,
.about__label,
.page-header__label {
    display: inline-block;
    font-family: var(--font-body);
    font-size: var(--text-eyebrow);
    font-weight: 500;
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--accent);
}

.lead,
.hero__text,
.section__subtitle,
.features-section__subtitle,
.about__text,
.feature-row__text,
.feature-item__content p,
.treatment-card-large__lead {
    font-size: var(--text-body);
    line-height: var(--leading-body);
}

.section__subtitle,
.features-section__subtitle,
.hero__text,
.treatment-card-large__lead {
    font-size: var(--text-lead);
    line-height: var(--leading-relaxed);
}

/* Balance short headings (body inherits text-wrap: pretty to avoid orphans). */
h1, h2, h3, h4,
.hero__title, .section__title, .feature-row__title, .about__title {
    text-wrap: balance;
}

/* Equal-width digits so prices and dates align and don't shift on update. */
.pricing-card__price,
.pricing-card__duration,
.weekends-modal__list {
    font-variant-numeric: tabular-nums;
}

/* Subtle 1px inner frame on imagery — crisps light photos against the cream bg.
   The ::after sits inside each wrapper's overflow:hidden, so it follows the
   visible (possibly rounded) edge automatically. */
.gallery-item,
.cosmetic-card__image,
.gender-card__image,
.service-card__image {
    position: relative;
}
.gallery-item::after,
.cosmetic-card__image::after,
.gender-card__image::after,
.service-card__image::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(60, 40, 20, 0.10);
    pointer-events: none;
    z-index: 2;
}

a {
    text-decoration: none;
    color: inherit;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

ul { list-style: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }

/* ===== ACCESSIBILITY ===== */
.skip-link {
    position: absolute;
    top: -100%;
    left: 16px;
    z-index: 100001;
    padding: 12px 20px;
    background: var(--black);
    color: var(--white);
    font-size: 14px;
    font-weight: 500;
    border-radius: 4px;
    transition: top 0.2s ease;
}

.skip-link:focus-visible {
    top: 16px;
}

:focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: 3px;
}

:focus:not(:focus-visible) {
    outline: none;
}

.btn:focus-visible,
.nav__link:focus-visible,
.header__cta:focus-visible {
    outline-color: var(--accent-dark);
}

/* ===== LINKS ===== */

/* 1. Inline text: underlined prose links */
:is(.section p, .section li, .about__text, .intro-block__text, .treatment-detail, .treatment-card-large, .contact-info__content, .cookie-consent__text) a:not(.btn):not([class*="__link"]):not(.nav__link):not(.subnav__link):not(.price-nav__link):not(.back-btn),
.footer__contact a,
.footer__link {
    color: var(--link-color);
    text-decoration: underline;
    text-underline-offset: 0.2em;
    text-decoration-color: var(--link-underline);
    transition: var(--link-transition);
}

:is(.section p, .section li, .about__text, .intro-block__text, .treatment-detail, .treatment-card-large, .contact-info__content, .cookie-consent__text) a:not(.btn):not([class*="__link"]):not(.nav__link):not(.subnav__link):not(.price-nav__link):not(.back-btn):hover,
.footer__contact a:hover,
.footer__link:hover {
    color: var(--link-hover);
    text-decoration-color: var(--link-hover);
}

/* 2. Card CTA: accent text, no underline, arrow gap */
.link-cta,
.service-card__link,
.gender-card__link,
.cosmetics-grid .cosmetic-card__link {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    font-size: var(--text-small);
    font-weight: 500;
    color: var(--link-color);
    text-decoration: none;
    transition: var(--link-transition);
}

.link-cta:hover,
.service-card__link:hover,
.gender-card__link:hover,
.gender-card:hover .gender-card__link,
.cosmetics-grid .cosmetic-card__link:hover {
    color: var(--link-hover);
    gap: 0.55em;
}

/* 3. List nav: footer link columns */
.link-list,
.footer__links a {
    display: block;
    padding: 8px 0;
    font-size: var(--text-body);
    color: var(--gray);
    text-decoration: none;
    transition: var(--link-transition);
}

a.link-list:hover,
.footer__links a:hover {
    color: var(--link-hover);
}

/* 4. Pill tabs: subnav + pricing anchors */
.link-pill,
.subnav__link,
.price-nav__link {
    display: inline-block;
    padding: 10px 20px;
    font-size: var(--text-small);
    font-weight: 500;
    color: var(--gray);
    white-space: nowrap;
    border-radius: 9999px;
    text-decoration: none;
    transition: var(--link-transition);
    background: var(--glass-bg-subtle);
    border: 1px solid var(--glass-border-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.link-pill:hover,
.subnav__link:hover,
.price-nav__link:hover {
    color: var(--black);
    background: rgba(255, 255, 255, 0.62);
    border-color: var(--glass-border);
}

.link-pill.active,
.subnav__link.active,
.price-nav__link.active {
    background: var(--glass-accent);
    color: var(--white);
    border-color: var(--glass-accent-border);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 4px 16px rgba(196, 167, 125, 0.22);
}

/* Secondary outline action (pairs with .btn) */
.link-outline,
.feature-row__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 26px;
    font-size: var(--text-small);
    font-weight: 500;
    letter-spacing: var(--tracking-ui);
    color: var(--accent-dark);
    border: 1px solid rgba(179, 150, 104, 0.45);
    border-radius: 9999px;
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
    text-decoration: none;
    transition: var(--btn-transition);
}

.link-outline:hover,
.feature-row__link:hover {
    background: var(--accent-dark);
    color: var(--white);
    border-color: var(--accent-dark);
}

.link-outline:active,
.feature-row__link:active {
    transform: translateY(var(--btn-press));
}

/* Subtle meta links */
.link-subtle,
.back-btn,
.footer__credit-link {
    color: var(--gray);
    text-decoration: none;
    transition: var(--link-transition);
}

.link-subtle:hover,
.back-btn:hover,
.footer__credit-link:hover {
    color: var(--link-hover);
}

@media (prefers-reduced-motion: reduce) {
    .link-outline:active,
    .feature-row__link:active {
        transform: none;
    }
}

.container {
    max-width: var(--container);
    margin: 0 auto;
    padding: 0 var(--gap);
}

/* ===== GRID SYSTEM =====
   12-column grid. Put `.grid` on a container and `.col-N` (1-12) on children.
   `.col-md-N` overrides at <=992px, `.col-sm-N` at <=768px; otherwise children
   stack full-width on mobile. The key page sections below are mapped onto these
   same 12 tracks so the whole site shares one column system. */
.grid {
    display: grid;
    grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
    gap: var(--grid-gutter);
}
.col-1  { grid-column: span 1; }
.col-2  { grid-column: span 2; }
.col-3  { grid-column: span 3; }
.col-4  { grid-column: span 4; }
.col-5  { grid-column: span 5; }
.col-6  { grid-column: span 6; }
.col-7  { grid-column: span 7; }
.col-8  { grid-column: span 8; }
.col-9  { grid-column: span 9; }
.col-10 { grid-column: span 10; }
.col-11 { grid-column: span 11; }
.col-12 { grid-column: span 12; }

@media (max-width: 992px) {
    .col-md-1  { grid-column: span 1; }
    .col-md-2  { grid-column: span 2; }
    .col-md-3  { grid-column: span 3; }
    .col-md-4  { grid-column: span 4; }
    .col-md-5  { grid-column: span 5; }
    .col-md-6  { grid-column: span 6; }
    .col-md-7  { grid-column: span 7; }
    .col-md-8  { grid-column: span 8; }
    .col-md-9  { grid-column: span 9; }
    .col-md-10 { grid-column: span 10; }
    .col-md-11 { grid-column: span 11; }
    .col-md-12 { grid-column: span 12; }
}

@media (max-width: 768px) {
    .grid > [class*="col-"]:not([class*="col-sm-"]) { grid-column: 1 / -1; }
    .col-sm-1  { grid-column: span 1; }
    .col-sm-2  { grid-column: span 2; }
    .col-sm-3  { grid-column: span 3; }
    .col-sm-4  { grid-column: span 4; }
    .col-sm-5  { grid-column: span 5; }
    .col-sm-6  { grid-column: span 6; }
    .col-sm-7  { grid-column: span 7; }
    .col-sm-8  { grid-column: span 8; }
    .col-sm-9  { grid-column: span 9; }
    .col-sm-10 { grid-column: span 10; }
    .col-sm-11 { grid-column: span 11; }
    .col-sm-12 { grid-column: span 12; }
}

/* ===== BUTTONS ===== */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 13px 30px;
    font-family: var(--font-body);
    font-size: var(--text-ui);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    border-radius: 9999px;
    border: 2px solid transparent;
    transition: var(--btn-transition);
    cursor: pointer;
}

.btn:active {
    transform: translateY(var(--btn-press));
}

.btn--primary {
    background: var(--beige-dark);
    color: var(--white);
}

.btn--primary:hover {
    background: var(--accent);
    border-color: var(--accent);
}

.btn--outline {
    background: var(--glass-bg-subtle);
    color: var(--accent-dark);
    border-color: rgba(179, 150, 104, 0.45);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.btn--outline:hover {
    background: var(--accent-dark);
    color: var(--white);
    border-color: var(--accent-dark);
}

.btn--outline-light {
    background: var(--glass-bg-subtle);
    color: var(--white);
    border-color: rgba(255, 255, 255, 0.55);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.btn--outline-light:hover {
    background: var(--white);
    color: var(--black);
    border-color: var(--white);
}

.btn--white {
    background: var(--accent);
    color: var(--white);
    border-color: var(--accent);
}

.btn--white:hover {
    background: var(--white);
    color: var(--black);
    border-color: var(--white);
}

.btn--accent {
    background: var(--accent);
    color: var(--white);
    border-color: var(--accent);
}

.btn--accent:hover {
    background: var(--accent-dark);
    border-color: var(--accent-dark);
}

@media (prefers-reduced-motion: reduce) {
    .btn:active {
        transform: none;
    }
}

/* ===== NAVIGATION ===== */
.header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    padding: 16px 0;
    transition: background-color 0.35s ease, padding 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

/* lock background scroll while the mobile overlay menu is open */
body.nav-open {
    overflow: hidden;
}

.header.scrolled {
    background: var(--glass-bg-beige);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border-bottom: 1px solid var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
    padding: 12px 0;
}

body.nav-open .header {
    background: var(--glass-bg-beige);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border-bottom: 1px solid var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
}

.header__inner {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 28px;
    position: relative;
    z-index: 1;
}

.logo {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-self: start;
}

.logo__icon {
    flex-shrink: 0;
}

.logo__content {
    display: flex;
    flex-direction: column;
}

.logo__text {
    font-family: var(--font-heading);
    font-size: 46px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
}

.logo__slogan {
    font-family: var(--font-heading);
    font-size: 18px;
    font-style: italic;
    font-weight: 400;
    color: var(--white);
    opacity: 0.85;
}

.header.scrolled .logo__text {
    color: var(--black);
}

body.nav-open .header .logo__text {
    color: var(--black);
}

.header.scrolled .logo__slogan {
    color: var(--gray);
}

.logo__img {
    height: 60px;
    width: 150px;
    object-fit: cover;
    object-position: center;
    border-radius: 50%;
    transition: width 0.35s ease, height 0.35s ease;
}

.logo__img--dark {
    display: none;
}

.logo__img--light {
    display: block;
}

.header.scrolled .logo__img--dark,
body.nav-open .header .logo__img--dark {
    display: block;
}

.header.scrolled .logo__img--light,
body.nav-open .header .logo__img--light {
    display: none;
}

.header.scrolled .logo__img,
body.nav-open .header .logo__img {
    height: 50px;
    width: 125px;
}

.nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
    justify-self: center;
}

.nav__link {
    font-size: var(--text-nav);
    font-weight: 400;
    color: rgba(255, 255, 255, 0.9);
    position: relative;
    transition: color 0.2s ease;
}

.nav__link::after {
    content: '';
    position: absolute;
    bottom: -7px;
    left: 50%;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--accent);
    opacity: 0;
    transform: translateX(-50%) scale(0.5);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.nav__link:hover::after,
.nav__link:focus-visible::after {
    opacity: 1;
    transform: translateX(-50%) scale(1);
}

.nav__link:hover {
    color: var(--white);
}

.header.scrolled .nav__link {
    color: rgba(26, 26, 26, 0.78);
}

body.nav-open .header .nav__link {
    color: var(--black);
}

.header.scrolled .nav__link:hover,
body.nav-open .header .nav__link:hover {
    color: var(--black);
}

.nav__item--dropdown {
    position: relative;
}

.nav__menu-all {
    display: none;
}

.nav__mobile-cta {
    display: none;
}

.nav__drawer {
    display: contents;
}

.nav-backdrop {
    display: none;
}

.nav__link--has-menu {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.nav__chevron {
    flex-shrink: 0;
    margin-top: 1px;
    opacity: 0.6;
    transition: opacity 0.2s ease;
}

.nav__item--dropdown:hover .nav__chevron,
.nav__item--dropdown:focus-within .nav__chevron {
    opacity: 1;
}

.nav__menu {
    position: absolute;
    top: calc(100% + 12px);
    left: 50%;
    transform: translateX(-50%) translateY(4px);
    min-width: 184px;
    margin: 0;
    padding: 8px;
    list-style: none;
    background: var(--glass-bg-strong);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
    border-radius: 12px;
    box-shadow: var(--glass-shadow);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
    z-index: 10;
}

.nav__menu::before {
    content: '';
    position: absolute;
    top: -12px;
    left: 0;
    right: 0;
    height: 12px;
}

.nav__item--dropdown:hover .nav__menu,
.nav__item--dropdown:focus-within .nav__menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}

.nav__menu-link {
    display: block;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 400;
    color: rgba(26, 26, 26, 0.78);
    transition: color 0.15s ease, background 0.15s ease;
}

.nav__menu-link:hover,
.nav__menu-link:focus-visible {
    background: rgba(196, 167, 125, 0.12);
    color: var(--black);
}

.lang-switch {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    border-radius: 9999px;
    border: 1px solid rgba(255, 255, 255, 0.32);
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
}

.lang-switch__item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 6px;
    border-radius: 9999px;
    line-height: 0;
    transition: background 0.2s ease, opacity 0.2s ease;
}

.lang-switch__item--active {
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.lang-switch__item--alt {
    opacity: 0.55;
    text-decoration: none;
}

.lang-switch__item--alt:hover {
    opacity: 1;
    background: rgba(255, 255, 255, 0.14);
}

.lang-switch__item--alt:active {
    transform: translateY(var(--btn-press));
}

.lang-switch__flag {
    display: block;
    width: 21px;
    height: 14px;
    border-radius: 2px;
    object-fit: cover;
}

.header.scrolled .lang-switch,
body.nav-open .header .lang-switch {
    border-color: rgba(0, 0, 0, 0.1);
    background: rgba(255, 255, 255, 0.5);
}

.header.scrolled .lang-switch__item--active,
body.nav-open .header .lang-switch__item--active {
    background: var(--white);
}

.header.scrolled .lang-switch__item--alt:hover,
body.nav-open .header .lang-switch__item--alt:hover {
    background: rgba(255, 255, 255, 0.85);
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.header__cta {
    padding: 11px 24px;
    background: var(--glass-accent);
    color: var(--white);
    font-size: var(--text-ui);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-radius: 9999px;
    border: 1px solid var(--glass-accent-border);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28);
    transition: var(--btn-transition);
}

.header__cta:hover {
    background: var(--accent-dark);
    border-color: var(--accent-dark);
}

.header__cta:active {
    transform: translateY(var(--btn-press));
}

/* header right-side actions: language + booking CTA + mobile toggle */
.header__actions {
    display: flex;
    align-items: center;
    gap: 16px;
    justify-self: end;
}

/* Mobile Menu */
.nav-toggle {
    display: none;
    flex-direction: column;
    gap: 6px;
    padding: 10px;
    z-index: 1001;
}

.nav-toggle span {
    width: 28px;
    height: 2px;
    background: var(--white);
    transition: all 0.3s;
}

.header.scrolled .nav-toggle span {
    background: var(--black);
}

body.nav-open .header .nav-toggle span {
    background: var(--black);
}

@media (prefers-reduced-motion: reduce) {
    .nav,
    .nav-backdrop,
    .nav__menu,
    .nav__chevron,
    .nav-toggle span {
        transition: none;
    }
}

/* ===== HERO SLIDER ===== */
.hero {
    position: relative;
    height: 100vh;
    height: 100svh;
    min-height: 700px;
    overflow: hidden;
}

.hero__slides {
    position: relative;
    height: 100%;
}

.hero__slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 1s ease;
}

.hero__slide.active {
    opacity: 1;
    z-index: 1;
}

.hero__slide:not(.active) {
    pointer-events: none;
}

.hero__slide-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.hero__slide-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.1);
    animation: heroZoom 15s ease-out forwards;
}

@keyframes heroZoom {
    to { transform: scale(1); }
}

.hero__slide-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        135deg,
        rgba(0,0,0,0.5) 0%,
        rgba(0,0,0,0.3) 50%,
        rgba(0,0,0,0.4) 100%
    );
    pointer-events: none;
}

.hero__slide-content {
    position: relative;
    z-index: 10;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 120px 10% 0;
    color: var(--white);
}

.hero__label {
    margin-bottom: 20px;
}

.hero__title {
    font-family: var(--font-heading);
    font-size: var(--text-display);
    font-weight: 400;
    line-height: var(--leading-display);
    margin-bottom: 25px;
    max-width: 700px;
    text-wrap: balance;
}

.hero__title em {
    font-style: italic;
    color: var(--accent);
}

.hero__enter-word {
    display: inline-block;
}

.hero__text {
    max-width: 500px;
    margin-bottom: 40px;
    text-wrap: pretty;
}

.hero__text.hero-enter {
    --hero-enter-opacity: 0.92;
}

.hero__buttons {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

/* Trust signal + tap-to-call row */
.hero__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 28px;
    margin-top: 32px;
    color: var(--white);
}

.hero__rating {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.95rem;
    letter-spacing: 0.01em;
}

.hero__rating-star {
    color: var(--accent);
    flex-shrink: 0;
}

.hero__rating strong {
    font-weight: 600;
}

.hero__rating span {
    opacity: 0.85;
}

.hero__call {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.95rem;
    color: var(--white);
    text-decoration: none;
    position: relative;
    transition: opacity 0.3s;
}

.hero__call::before {
    content: '';
    width: 1px;
    height: 16px;
    background: rgba(255, 255, 255, 0.35);
    margin-right: 28px;
}

@media (hover: hover) {
    .hero__call:hover {
        opacity: 0.75;
    }
}

.hero__call:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 4px;
    border-radius: 2px;
}

/* Staggered enter — inspired by split/stagger pattern (jakub.kr) */
@keyframes hero-enter {
    from {
        opacity: 0;
        transform: translateY(8px);
        filter: blur(8px);
    }
    to {
        opacity: var(--hero-enter-opacity, 1);
        transform: translateY(0);
        filter: blur(0);
    }
}

.hero-enter {
    opacity: 0;
    transform: translateY(8px);
    filter: blur(8px);
}

.hero:not(.hero--ready) .hero-enter,
.hero__slide:not(.active) .hero-enter {
    animation: none;
}

.hero.hero--ready .hero__slide.active .hero-enter {
    animation: hero-enter var(--hero-enter-duration) var(--hero-enter-ease) both;
    animation-delay: calc(var(--hero-enter-delay) * var(--stagger, 0));
}

.hero-controls-wrapper.hero-enter {
    --hero-enter-opacity: 1;
}

/* Slider controls — reusable pagination + arrows */
.slider-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-lg);
    width: 100%;
}

.slider-pagination {
    display: flex;
    gap: var(--space-sm);
    align-items: center;
}

.slider-nav {
    display: flex;
    gap: var(--space-sm);
    align-items: center;
}

.slider-controls .chevron-btn {
    position: static;
    transform: none;
}

@media (prefers-reduced-motion: no-preference) {
    .slider-controls .chevron-btn:active {
        transform: scale(0.98, 0.95);
    }
}

.slider-dot {
    width: 8px;
    height: 8px;
    min-width: 8px;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, 0.28);
    cursor: pointer;
    padding: 0;
    transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.35s cubic-bezier(0.4, 0, 0.2, 1), transform 0.15s ease;
    position: relative;
    overflow: hidden;
}

.slider-dot::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 1);
    clip-path: inset(0 100% 0 0 round 4px);
}

.slider-dot.active {
    width: 28px;
}

.slider-dot.active::before {
    animation: slider-dot-fill var(--slider-duration, 5.5s) linear forwards;
}

.slider-paused .slider-dot.active::before {
    animation-play-state: paused;
}

@keyframes slider-dot-fill {
    from {
        clip-path: inset(0 100% 0 0 round 4px);
    }
    to {
        clip-path: inset(0 0 0 0 round 4px);
    }
}

.slider-dot:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 3px;
}

.slider-dot:active {
    transform: scale(0.98, 0.95);
}

@media (hover: hover) {
    .slider-dot:hover:not(.active) {
        background: rgba(255, 255, 255, 0.35);
    }
}

/* Light background variant */
.slider-controls--light .slider-dot {
    background: rgba(0, 0, 0, 0.15);
}

.slider-controls--light .slider-dot::before {
    background: var(--primary);
}

@media (hover: hover) {
    .slider-controls--light .slider-dot:hover:not(.active) {
        background: rgba(0, 0, 0, 0.25);
    }
}

.chevron-btn {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.42);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
    cursor: pointer;
    transition: background 0.3s, border-color 0.3s, color 0.3s, box-shadow 0.3s;
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
    padding: 0;
}

.chevron-btn--overlay:hover {
    background: var(--accent);
    border-color: var(--accent);
}

.chevron-btn--light {
    border-color: rgba(0, 0, 0, 0.2);
    color: var(--black);
}

.chevron-btn--light:hover {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--white);
}

/* Hero-only control positioning */
.hero-controls-wrapper {
    position: absolute;
    bottom: 50px;
    left: 10%;
    right: 10%;
    z-index: 30;
    pointer-events: none;
}

.hero-controls-wrapper .slider-controls {
    pointer-events: auto;
}

@media (prefers-reduced-motion: reduce) {
    .hero__slide-bg img {
        animation: none !important;
        transform: scale(1);
    }

    .hero__slide {
        transition: opacity 0.15s ease;
    }

    .slider-dot {
        transition: none;
    }

    .slider-dot.active::before {
        animation: none !important;
        clip-path: inset(0 0 0 0 round 4px);
    }

    .hero-enter {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
    }
}

.hero.is-reduced-motion .hero__slide-bg img {
    animation: none !important;
    transform: scale(1);
}

.hero.is-reduced-motion .slider-dot {
    transition: none;
}

.hero.is-reduced-motion .slider-dot.active::before {
    animation: none !important;
    clip-path: inset(0 0 0 0 round 4px);
}

.hero.is-reduced-motion .hero-enter {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
}

/* ===== VIDEO FEATURES SECTION ===== */
.video-features {
    padding: 120px 0;
    background:
        radial-gradient(ellipse 80% 50% at 50% 100%, rgba(196, 167, 125, 0.10), transparent 55%),
        var(--beige);
}

.video-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.video-card {
    border-radius: var(--radius-card);
    overflow: hidden;
    transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
}

.video-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--glass-shadow-hover);
    border-color: rgba(255, 255, 255, 0.78);
}

.video-card__media {
    position: relative;
    aspect-ratio: 4/5;
    overflow: hidden;
    cursor: pointer;
}

.video-card__media video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.video-card__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    height: 80px;
    background: var(--accent);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s;
    z-index: 2;
}

.video-card__play svg {
    width: 28px;
    height: 28px;
    color: white;
    margin-left: 5px;
}

.video-card__play:hover {
    transform: translate(-50%, -50%) scale(1.1);
    background: var(--black);
}

.video-card.playing .video-card__play {
    opacity: 0;
    visibility: hidden;
}

.video-card__media:hover .video-card__play {
    transform: translate(-50%, -50%) scale(1.1);
}

.video-card__content {
    padding: 25px 30px;
    text-align: center;
    background: rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.video-card__content h3 {
    font-family: var(--font-heading);
    font-size: var(--text-h3);
    font-weight: 500;
    color: var(--black);
    margin-bottom: 8px;
}

.video-card__content p {
    font-size: var(--text-body);
    color: var(--gray);
}

@media (max-width: 1024px) {
    .video-cards {
        grid-template-columns: repeat(2, 1fr);
    }

    .video-card:last-child {
        grid-column: span 2;
        max-width: 400px;
        margin: 0 auto;
    }
}

@media (max-width: 768px) {
    .video-cards {
        grid-template-columns: 1fr;
    }

    .video-card:last-child {
        grid-column: span 1;
        max-width: none;
    }

    .video-card__media {
        aspect-ratio: 16/9;
    }
}

/* ===== OLD FEATURES SECTION (deprecated) ===== */
.features-section {
    position: relative;
    padding: var(--section-y) 0;
    background: var(--white);
}

.features-section__img {
    position: absolute;
    border-radius: 50%;
    overflow: hidden;
}

.features-section__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.features-section__img--right {
    top: 50%;
    right: 3%;
    transform: translateY(-50%);
    width: 280px;
    height: 280px;
}

.features-section__img--left {
    top: 50%;
    left: 3%;
    transform: translateY(-50%);
    width: 240px;
    height: 240px;
}

.features-section__bg-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: var(--font-heading);
    font-size: clamp(120px, 18vw, 280px);
    font-weight: 400;
    font-style: italic;
    color: var(--beige);
    opacity: 0.4;
    pointer-events: none;
    white-space: nowrap;
    z-index: 0;
}

.features-section__header {
    text-align: center;
    margin-bottom: 80px;
    position: relative;
    z-index: 1;
}

.features-section__subtitle {
    color: var(--gray);
    max-width: 500px;
    margin: 20px auto 0;
}

.features-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    max-width: 1000px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.feature-item {
    display: flex;
    align-items: flex-start;
    gap: 25px;
    padding: 30px;
}

.feature-item__icon {
    width: 85px;
    height: 85px;
    min-width: 85px;
    border-radius: 50%;
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border: 1px solid var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent);
}

.feature-item__icon svg {
    width: 42px;
    height: 42px;
}

.feature-item__content h3 {
    font-family: var(--font-heading);
    font-size: var(--text-h3);
    font-weight: 500;
    color: var(--black);
    margin-bottom: 12px;
    line-height: var(--leading-snug);
}

.feature-item__content h3.feature-item__title--accent {
    color: var(--accent);
    font-style: italic;
}

.feature-item__content p {
    color: var(--gray);
}

/* Feature Row - Alternating layout */
.feature-row {
    position: relative;
    display: grid;
    grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
    gap: 60px;
    align-items: center;
    margin-bottom: 80px;
    overflow: visible;
}

.feature-row > .feature-row__media,
.feature-row > .feature-row__content {
    grid-column: span 6;
}

.feature-row__bg-text {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-heading);
    font-size: clamp(60px, 8vw, 120px);
    font-weight: 400;
    font-style: italic;
    color: #e8ddd0;
    opacity: 0.4;
    white-space: nowrap;
    pointer-events: none;
    z-index: 0;
    letter-spacing: 5px;
}

.feature-row__media {
    position: relative;
    z-index: 1;
}

.feature-row__content {
    position: relative;
    z-index: 1;
    overflow: visible;
}

.feature-row:last-child {
    margin-bottom: 0;
}

.feature-row--reverse {
    direction: rtl;
}

.feature-row--reverse > * {
    direction: ltr;
}

.feature-row__media {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0,0,0,0.15);
    transition: all 0.5s ease;
}

.feature-row__media::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(196,167,125,0) 0%, rgba(196,167,125,0.2) 100%);
    opacity: 0;
    transition: opacity 0.5s ease;
}

.feature-row:hover .feature-row__media {
    transform: translateY(-10px);
    box-shadow: 0 40px 80px rgba(0,0,0,0.25);
}

.feature-row:hover .feature-row__media::after {
    opacity: 1;
}

.feature-row__media img {
    width: 100%;
    height: 500px;
    object-fit: cover;
    display: block;
    transition: transform 0.6s ease;
}

.feature-row:hover .feature-row__media img {
    transform: scale(1.08);
}

.feature-row__content {
    padding: 20px 0;
}

.feature-row__label {
    display: inline-block;
    font-family: var(--font-heading);
    font-size: var(--text-decorative);
    font-weight: 400;
    color: var(--beige-dark);
    margin-bottom: 15px;
    line-height: 1;
}

.feature-row__title {
    font-family: var(--font-heading);
    font-size: var(--text-h3);
    font-weight: 500;
    color: var(--black);
    margin-bottom: 20px;
    line-height: var(--leading-snug);
}

.feature-row__text {
    color: var(--gray);
    margin-bottom: 25px;
    max-width: 450px;
}

.feature-row__cta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

.feature-row__list {
    list-style: none;
    padding: 0;
    margin: 0 0 25px 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 20px;
}

.feature-row__list li {
    position: relative;
    padding-left: 22px;
    font-size: 14px;
    color: var(--gray);
    line-height: 1.6;
}

.feature-row__list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 7px;
    width: 10px;
    height: 10px;
    background: linear-gradient(135deg, var(--beige) 0%, var(--beige-dark) 100%);
    border-radius: 50%;
}

@media (max-width: 1024px) {
    .feature-row {
        gap: 40px;
        margin-bottom: 60px;
    }

    .feature-row__media img {
        height: 420px;
    }
}

@media (max-width: 768px) {
    .feature-row {
        grid-template-columns: 1fr;
        gap: 30px;
        margin-bottom: 50px;
    }

    .feature-row--reverse {
        direction: ltr;
    }

    .feature-row__media img {
        height: 320px;
    }

    .feature-row__label {
        font-size: 36px;
    }

    .feature-row__text {
        max-width: none;
    }

    .feature-row:hover .feature-row__media {
        transform: translateY(-5px);
    }

    .feature-row__list {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .feature-row__cta {
        flex-direction: column;
        align-items: stretch;
    }

    .feature-row__cta .btn {
        display: block;
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 1400px) {
    .features-section__img--right {
        width: 220px;
        height: 220px;
    }

    .features-section__img--left {
        width: 180px;
        height: 180px;
    }
}

@media (max-width: 1200px) {
    .features-section__img--right {
        width: 180px;
        height: 180px;
    }

    .features-section__img--left {
        width: 150px;
        height: 150px;
    }

    .features-grid {
        gap: 40px 60px;
    }
}

@media (max-width: 1024px) {
    .features-section__img {
        display: none;
    }

    .feature-item {
        padding: 20px;
    }
}

@media (max-width: 768px) {
    .features-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .features-grid::before,
    .features-grid::after {
        display: none;
    }

    .feature-item {
        padding: 20px 0;
        border-bottom: 1px solid var(--gray-lighter);
    }

    .feature-item:last-child {
        border-bottom: none;
    }

    .feature-item__icon {
        width: 70px;
        height: 70px;
        min-width: 70px;
    }

    .feature-item__icon svg {
        width: 35px;
        height: 35px;
    }

    .feature-item__content h3 {
        font-size: var(--text-h4);
    }
}

/* ===== SECTION STYLES ===== */
.section {
    padding: var(--section-y) 0;
}

.section--beige {
    background:
        radial-gradient(ellipse 80% 50% at 85% 0%, rgba(255, 255, 255, 0.42), transparent 55%),
        radial-gradient(ellipse 60% 40% at 0% 100%, rgba(196, 167, 125, 0.12), transparent 50%),
        var(--beige);
}

.section--light {
    background:
        radial-gradient(ellipse 90% 60% at 10% -10%, rgba(196, 167, 125, 0.10), transparent 55%),
        radial-gradient(ellipse 70% 50% at 95% 110%, rgba(196, 167, 125, 0.08), transparent 50%),
        linear-gradient(180deg, #fefdfb 0%, #f9f6f2 100%);
}

.section--cream {
    background:
        radial-gradient(ellipse 70% 50% at 20% 0%, rgba(196, 167, 125, 0.08), transparent 55%),
        radial-gradient(ellipse 60% 40% at 100% 100%, rgba(255, 255, 255, 0.45), transparent 50%),
        var(--cream);
}

.section--dark {
    background: var(--black);
    color: var(--white);
}

.section__header {
    text-align: center;
    margin-bottom: 70px;
}

.section__label {
    margin-bottom: 15px;
}

.section__title {
    font-family: var(--font-heading);
    font-size: var(--text-h2);
    font-weight: 400;
    color: var(--black);
    line-height: var(--leading-heading);
}

.section--dark .section__title {
    color: var(--white);
}

.section__title em {
    font-style: italic;
}

/* ===== ABOUT / INTRO ===== */
.about {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

.about__images {
    position: relative;
}

.about__img-main {
    width: 85%;
    position: relative;
    z-index: 2;
}

.about__img-main img {
    width: 100%;
    height: 550px;
    object-fit: cover;
}

.about__img-secondary {
    position: absolute;
    right: 0;
    bottom: -50px;
    width: 55%;
    z-index: 3;
    box-shadow: 20px 20px 60px rgba(0,0,0,0.15);
}

.about__img-secondary img {
    width: 100%;
    height: 300px;
    object-fit: cover;
}

.about__shape {
    position: absolute;
    top: -30px;
    right: 30px;
    width: 200px;
    height: 200px;
    border: 2px solid var(--accent);
    border-radius: 50%;
    z-index: 1;
}

.about__content {
    padding-left: 20px;
}

.about__label {
    margin-bottom: 15px;
}

.about__title {
    font-family: var(--font-heading);
    font-size: var(--text-h2);
    font-weight: 400;
    color: var(--black);
    line-height: var(--leading-heading);
    margin-bottom: 25px;
}

.about__title em {
    font-style: italic;
}

.about__text {
    color: var(--gray);
    margin-bottom: 20px;
}

.about__features {
    display: flex;
    gap: 40px;
    margin: 35px 0;
    padding: 30px 0;
    border-top: 1px solid var(--gray-lighter);
    border-bottom: 1px solid var(--gray-lighter);
}

.about__feature {
    text-align: center;
}

.about__feature-number {
    font-family: var(--font-heading);
    font-size: var(--text-decorative);
    font-weight: 500;
    color: var(--accent);
    line-height: 1;
}

.about__feature-text {
    font-size: var(--text-small);
    color: var(--gray);
    margin-top: 5px;
}

/* ===== COSMETICS ===== */
.section__subtitle {
    color: var(--gray);
    max-width: 600px;
    margin: 20px auto 0;
}

.cosmetics-grid {
    display: grid !important;
    grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr)) !important;
    gap: 40px !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
}

.cosmetics-grid > .cosmetic-card {
    grid-column: span 6;
}

.cosmetics-grid .cosmetic-card {
    display: block;
    text-decoration: none;
    color: inherit;
    background: var(--glass-bg) !important;
    backdrop-filter: var(--glass-blur) !important;
    -webkit-backdrop-filter: var(--glass-blur) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--radius-card) !important;
    overflow: hidden !important;
    box-shadow: var(--glass-shadow) !important;
    transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease !important;
    cursor: pointer;
}

.cosmetics-grid .cosmetic-card:hover {
    transform: translateY(-8px) !important;
    box-shadow: var(--glass-shadow-hover) !important;
    border-color: rgba(255, 255, 255, 0.78) !important;
}

.cosmetics-grid .cosmetic-card__image {
    width: 100% !important;
    height: 280px !important;
    overflow: hidden !important;
}

.cosmetics-grid .cosmetic-card__image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: top !important;
    transition: transform 0.5s ease !important;
}

.cosmetics-grid .cosmetic-card:hover .cosmetic-card__image img {
    transform: scale(1.05) !important;
}

.cosmetics-grid .cosmetic-card__content {
    padding: 30px !important;
    text-align: center !important;
    background: rgba(255, 255, 255, 0.22) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

.cosmetics-grid .cosmetic-card__brand {
    font-family: var(--font-heading) !important;
    font-size: var(--text-h3) !important;
    font-weight: 500 !important;
    color: #1a1a1a !important;
    letter-spacing: 1px !important;
    margin-bottom: 8px !important;
}

.cosmetics-grid .cosmetic-card__brand sup {
    font-size: 12px !important;
}

.cosmetics-grid .cosmetic-card__pronunciation {
    font-size: var(--text-eyebrow) !important;
    font-style: italic !important;
    color: #999999 !important;
    margin-bottom: 15px !important;
}

.cosmetics-grid .cosmetic-card__text {
    font-size: var(--text-body) !important;
    color: #666666 !important;
    line-height: var(--leading-body) !important;
    margin-bottom: 20px !important;
}

@media (max-width: 768px) {
    .cosmetics-grid {
        grid-template-columns: 1fr !important;
        gap: 25px !important;
    }

    .cosmetics-grid .cosmetic-card__image {
        height: 220px !important;
    }

    .cosmetics-grid .cosmetic-card__content {
        padding: 25px !important;
    }
}

/* ===== BRAND DETAIL PAGE ===== */
.brand-intro {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.brand-intro__content {
    padding: 48px 40px;
    border-radius: calc(var(--radius-card) + 4px);
}

.brand-intro__pronunciation {
    font-size: var(--text-body);
    color: var(--accent);
    margin-bottom: 25px;
    font-style: italic;
}

.brand-intro__tagline {
    font-size: var(--text-lead);
    color: var(--accent);
    margin-bottom: 25px;
    font-style: italic;
    font-family: var(--font-heading);
}

.brand-intro__text {
    font-size: var(--text-body);
    color: var(--gray);
    line-height: var(--leading-body);
    margin-bottom: 20px;
}

.steps-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width: 1000px;
    margin: 0 auto;
}

.step-card {
    padding: 40px 30px;
    text-align: center;
    transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
}

.step-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--glass-shadow-hover);
    border-color: rgba(255, 255, 255, 0.78);
}

.step-card__number {
    display: block;
    font-family: var(--font-heading);
    font-size: 48px;
    font-weight: 400;
    color: var(--beige-dark);
    margin-bottom: 15px;
}

.step-card__title {
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 500;
    color: var(--black);
    margin-bottom: 15px;
}

.step-card__text {
    font-size: 15px;
    color: var(--gray);
    line-height: 1.8;
}

.product-gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width: 900px;
    margin: 0 auto 50px;
}

.product-gallery__item {
    text-align: center;
    padding: 30px;
    border-radius: var(--radius-card);
    transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
}

.product-gallery__item:hover {
    transform: translateY(-8px);
    box-shadow: var(--glass-shadow-hover);
    border-color: var(--glass-border);
}

.product-gallery__item img {
    max-width: 100%;
    height: 200px;
    object-fit: contain;
    margin-bottom: 20px;
}

.product-gallery__item h4 {
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 500;
    color: var(--black);
    margin-bottom: 5px;
}

.product-gallery__item p {
    font-size: 14px;
    color: var(--gray);
}

.products-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    max-width: 800px;
    margin: 0 auto;
}

.product-item {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 20px 25px;
    border-radius: 12px;
    transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.product-item__icon {
    color: var(--accent);
    font-size: 14px;
}

.product-item__text {
    font-size: 15px;
    color: var(--black);
}

@media (max-width: 768px) {
    .steps-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .product-gallery {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .products-list {
        grid-template-columns: 1fr;
    }

    .step-card {
        padding: 30px 25px;
    }
}

/* ===== PRODUCT LINES GRID ===== */
.product-lines-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.product-line-card {
    border-radius: var(--radius-card);
    overflow: hidden;
    transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
}

.product-line-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--glass-shadow-hover);
    border-color: rgba(255, 255, 255, 0.78);
}

.product-line-card__image {
    height: 220px;
    overflow: hidden;
}

.product-line-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.5s ease;
}

.product-line-card:hover .product-line-card__image img {
    transform: scale(1.05);
}

.product-line-card__content {
    padding: 25px;
}

.product-line-card__content--full {
    padding: 30px;
    background: rgba(245, 240, 235, 0.55);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.product-line-card__title {
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 500;
    color: var(--black);
    margin-bottom: 5px;
}

.product-line-card__subtitle {
    font-size: 13px;
    color: var(--accent);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 12px;
}

.product-line-card__text {
    font-size: 14px;
    line-height: 1.7;
    color: var(--gray);
}

@media (max-width: 992px) {
    .product-lines-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .product-lines-grid {
        grid-template-columns: 1fr;
    }

    .product-line-card__image {
        height: 150px;
    }
}

/* ===== SERVICES ===== */
.services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.service-card {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-card);
    transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
}

.service-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--glass-shadow-hover);
    border-color: rgba(255, 255, 255, 0.78);
}

.service-card__image {
    position: relative;
    height: 350px;
    overflow: hidden;
}

.service-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.service-card:hover .service-card__image img {
    transform: scale(1.1);
}

.service-card__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(0,0,0,0.6) 0%,
        rgba(0,0,0,0) 60%
    );
    opacity: 0;
    transition: opacity 0.4s;
}

.service-card:hover .service-card__overlay {
    opacity: 1;
}

.service-card__content {
    padding: 30px;
    text-align: center;
    background: rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.service-card__icon {
    width: 70px;
    height: 70px;
    margin: -65px auto 20px;
    background: var(--accent);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 2;
    transition: all 0.4s;
}

.service-card:hover .service-card__icon {
    background: var(--black);
}

.service-card__icon svg {
    width: 30px;
    height: 30px;
    color: var(--white);
}

.service-card__title {
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 500;
    color: var(--black);
    margin-bottom: 12px;
}

.service-card__text {
    font-size: 15px;
    color: var(--gray);
    margin-bottom: 20px;
}

/* ===== REVIEWS ===== */
.reviews__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 32px 48px;
    margin-bottom: 40px;
    text-align: left;
}

.reviews__intro {
    max-width: 540px;
}

.reviews__intro .section__label {
    margin-bottom: 15px;
}

.reviews__subtitle {
    margin: 16px 0 0;
    max-width: 42ch;
}

.reviews__summary {
    justify-self: end;
    width: 100%;
    max-width: 340px;
}

.reviews-summary {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 22px 24px;
    border-radius: var(--radius-card);
}

.reviews-summary__main {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 18px 20px;
}

.reviews-summary__score {
    margin: 0;
    font-family: var(--font-heading);
    font-size: clamp(2.5rem, 4vw, 3rem);
    font-weight: 400;
    line-height: 1;
    color: var(--black);
    letter-spacing: -0.02em;
}

.reviews-summary__details {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.reviews-summary__stars {
    display: inline-flex;
    gap: 3px;
    color: var(--gray-lighter);
}

.reviews-summary__star--on {
    color: #fbbc04;
}

.reviews-summary__meta {
    margin: 0;
    font-size: var(--text-small);
    color: var(--gray);
    letter-spacing: var(--tracking-ui);
}

.reviews-summary__brand {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    align-self: start;
    margin-top: 2px;
    font-size: 13px;
    font-weight: 500;
    color: var(--gray);
    letter-spacing: 0.01em;
    text-decoration: none;
    transition: color 0.2s ease;
}

.reviews-summary__write {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    font-size: 13px;
    font-weight: 500;
    color: var(--accent-dark);
    letter-spacing: var(--tracking-ui);
    text-decoration: none;
    transition: color 0.2s ease, gap 0.2s ease;
}

@media (hover: hover) {
    .reviews-summary__brand:hover {
        color: var(--black);
    }

    .reviews-summary__write:hover {
        color: var(--black);
        gap: 10px;
    }
}

.reviews__stars {
    display: inline-flex;
    gap: 2px;
    color: var(--gray-lighter);
}

.reviews__star--on {
    color: #fbbc04;
}

.reviews__showcase {
    width: 100%;
}

.reviews__marquee {
    width: 100%;
    margin: 0;
    --reviews-marquee-duration: 42s;
}

.reviews__marquee-viewport {
    width: 100%;
    min-height: 180px;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(
        90deg,
        transparent 0%,
        #000 6%,
        #000 94%,
        transparent 100%
    );
    mask-image: linear-gradient(
        90deg,
        transparent 0%,
        #000 6%,
        #000 94%,
        transparent 100%
    );
}

.reviews__marquee-inner {
    display: flex;
    width: max-content;
    animation: reviews-marquee-scroll var(--reviews-marquee-duration) linear infinite;
}

.reviews__marquee:hover .reviews__marquee-inner,
.reviews__marquee:focus-within .reviews__marquee-inner {
    animation-play-state: paused;
}

.reviews__marquee-group {
    display: flex;
    align-items: stretch;
    gap: var(--gap);
    padding: 8px 15px;
}

.reviews__marquee--static .reviews__marquee-viewport {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: var(--accent) var(--beige-dark);
    -webkit-mask-image: none;
    mask-image: none;
}

.reviews__marquee--static .reviews__marquee-inner {
    animation: none;
    width: auto;
    max-width: none;
    margin: 0 auto;
    padding: 0 max(15px, calc((100vw - var(--container)) / 2 + 15px));
}

.reviews__marquee--static .reviews__marquee-group[aria-hidden="true"] {
    display: none;
}

.reviews__card {
    flex: 0 0 clamp(300px, 38vw, 420px);
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px 26px;
    border-radius: var(--radius-card);
    background: var(--white);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 6px 20px rgba(0, 0, 0, 0.04);
}

@keyframes reviews-marquee-scroll {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

.reviews__card-top {
    display: flex;
    align-items: center;
    gap: 12px;
}

.reviews__avatar {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    color: #fff;
}

.reviews__card-meta {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.reviews__google {
    flex: 0 0 auto;
    align-self: flex-start;
}

.reviews__rating-row {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.reviews__verified {
    flex: 0 0 auto;
}

.reviews__quote {
    margin: 0;
    flex: 1;
}

.reviews__quote p {
    margin: 0;
    font-size: 15px;
    line-height: 1.7;
    color: var(--dark);
    /* uniform card height — clamp long reviews like the Google widget */
    display: -webkit-box;
    -webkit-line-clamp: 6;
    line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.reviews__author {
    margin: 0;
    font-size: 15px;
    font-weight: 500;
    color: var(--black);
}

.reviews__empty {
    text-align: center;
    color: var(--gray);
    font-size: 15px;
    margin: 0 0 24px;
}

.reviews__more {
    display: none;
    align-self: flex-start;
    margin-top: -6px;
    font-size: 14px;
    font-weight: 500;
    color: var(--accent-dark);
}

.reviews__card--clamped .reviews__more {
    display: inline-block;
}

@media (hover: hover) {
    .reviews__more:hover {
        text-decoration: underline;
    }
}

.reviews__foot {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    margin-top: 40px;
}

.reviews__actions {
    text-align: center;
    margin-top: 0;
}

.reviews__cta {
    border-color: var(--accent-dark);
    color: var(--accent-dark);
}

@media (max-width: 640px) {
    .reviews__head {
        grid-template-columns: 1fr;
        align-items: stretch;
        gap: 28px;
        margin-bottom: 32px;
    }

    .reviews__summary {
        justify-self: stretch;
        max-width: none;
    }

    .reviews__foot {
        margin-top: 32px;
    }

    .reviews__card {
        flex-basis: min(88vw, 340px);
        padding: 24px 22px;
    }

    .reviews-summary {
        width: 100%;
        padding: 20px;
    }

    .reviews-summary__main {
        gap: 14px 16px;
    }
}

/* ===== QUOTE / BANNER ===== */
.quote-banner {
    position: relative;
    padding: var(--section-y) 0;
    background: var(--black);
    overflow: hidden;
}

.quote-banner__bg {
    position: absolute;
    inset: 0;
    opacity: 0.3;
}

.quote-banner__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.quote-banner__content {
    position: relative;
    z-index: 2;
    text-align: center;
    color: var(--white);
    max-width: 800px;
    margin: 0 auto;
}

.quote-banner__text {
    font-family: var(--font-heading);
    font-size: var(--text-h2);
    font-weight: 400;
    font-style: italic;
    line-height: var(--leading-heading);
    margin-bottom: 30px;
}

.quote-banner__text em {
    font-family: var(--font-heading);
    font-style: italic;
    color: var(--accent);
}

.quote-banner__author {
    font-family: var(--font-body);
    font-size: var(--text-small);
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--accent);
}

/* ===== GALLERY ===== */
.gallery-grid {
    display: grid;
    grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
    gap: 20px;
}

.gallery-grid:not(.gallery-grid--bento) > .gallery-item {
    grid-column: span 3;
}

.gallery-item {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1;
    cursor: pointer;
}

.gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.gallery-item:hover img {
    transform: scale(1.15);
}

.gallery-item__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.4s;
}

.gallery-item:hover .gallery-item__overlay {
    opacity: 1;
}

.gallery-item__icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: var(--accent);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
    transform: scale(0.5);
    transition: transform 0.4s;
}

.gallery-item:hover .gallery-item__icon {
    transform: scale(1);
}

/* Bento Gallery (for certificates) */
.gallery-grid--bento {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 280px;
    grid-auto-flow: dense;
    gap: 16px;
}

.gallery-grid--bento .gallery-item {
    aspect-ratio: unset;
    overflow: hidden;
}

.gallery-grid--bento .gallery-item--portrait {
    grid-row: span 2;
}

.gallery-grid--bento .gallery-item--landscape {
    grid-column: span 2;
}

.gallery-grid--bento .gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.gallery-grid--bento .gallery-item:hover img {
    transform: scale(1.05);
}

@media (max-width: 992px) {
    .gallery-grid--bento {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 220px;
        grid-auto-flow: dense;
    }

    .gallery-grid--bento .gallery-item--portrait {
        grid-row: span 2;
    }

    .gallery-grid--bento .gallery-item--landscape {
        grid-column: span 2;
    }
}

@media (max-width: 576px) {
    .gallery-grid--bento {
        grid-template-columns: 1fr;
        grid-auto-rows: auto;
    }

    .gallery-grid--bento .gallery-item,
    .gallery-grid--bento .gallery-item--portrait,
    .gallery-grid--bento .gallery-item--landscape {
        grid-column: span 1;
        grid-row: span 1;
        aspect-ratio: auto;
    }

    .gallery-grid--bento .gallery-item img {
        height: auto;
        object-fit: contain;
    }
}

/* ===== PRICING ===== */
.pricing-intro {
    padding: 28px 0 4px;
    background: var(--cream);
}

.pricing-intro__text {
    max-width: 520px;
    margin: 0 auto;
    text-align: center;
    color: var(--gray);
    font-size: var(--text-lead);
    line-height: var(--leading-snug);
}

.section--pricing {
    padding-top: clamp(48px, 6vw, 72px);
    padding-bottom: clamp(48px, 6vw, 72px);
}

.section--pricing + .section--pricing {
    border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.pricing-section__title {
    font-family: var(--font-heading);
    font-size: clamp(1.75rem, 3.5vw, 2.25rem);
    font-weight: 400;
    color: var(--black);
    line-height: var(--leading-heading);
    margin-bottom: 36px;
    text-align: left;
}

.pricing-section__title em {
    font-style: italic;
}

.pricing-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 30px;
}

.pricing-grid--2cols {
    grid-template-columns: repeat(2, 1fr);
}

.pricing-card {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    padding: 50px 40px;
    text-align: center;
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-card);
    position: relative;
    overflow: hidden;
    box-shadow: var(--glass-shadow);
    display: flex;
    flex-direction: column;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

.pricing-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--glass-shadow-hover);
    border-color: rgba(255, 255, 255, 0.78);
}

.pricing-card__list {
    flex: 1;
    margin-bottom: 30px;
}

.pricing-card__title {
    font-family: var(--font-heading);
    font-size: var(--text-h3);
    font-weight: 500;
    color: var(--black);
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.45);
    position: relative;
}

.pricing-card__item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 15px 0;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.42);
}

.pricing-card__item:last-child {
    border-bottom: none;
}

.pricing-card__name {
    color: var(--gray);
    font-size: var(--text-body);
    flex: 1;
    text-align: left;
}

.pricing-card__price {
    font-family: var(--font-heading);
    font-size: var(--text-lead);
    font-weight: 500;
    color: var(--accent);
    white-space: nowrap;
}

.pricing-card__desc {
    color: var(--gray);
    font-size: var(--text-body);
    line-height: var(--leading-body);
    margin-bottom: 25px;
    text-align: left;
}

.pricing-card__note {
    color: var(--accent);
    font-size: 13px;
    font-style: italic;
    margin-bottom: 25px;
    padding: 12px 15px;
    background: rgba(180, 140, 80, 0.12);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border: 1px solid rgba(196, 167, 125, 0.22);
    border-left: 3px solid var(--accent);
    border-radius: 0 12px 12px 0;
    text-align: left;
}

.pricing-card__meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 25px 20px;
    margin: 25px -40px;
    background: rgba(255, 255, 255, 0.35);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border-top: 1px solid var(--glass-border-subtle);
    border-bottom: 1px solid var(--glass-border-subtle);
}

.pricing-card__item .pricing-card__duration {
    font-size: 13px;
    color: var(--gray);
    opacity: 0.7;
    white-space: nowrap;
}

.pricing-card__meta .pricing-card__duration {
    color: var(--gray);
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.pricing-card__meta .pricing-card__duration::before {
    content: '';
    width: 18px;
    height: 18px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23888'%3E%3Ccircle cx='12' cy='12' r='10' stroke-width='1.5'/%3E%3Cpath stroke-width='1.5' d='M12 6v6l4 2'/%3E%3C/svg%3E");
    background-size: contain;
}

.pricing-card__meta .pricing-card__price {
    font-size: 28px;
    font-weight: 600;
    background: linear-gradient(135deg, var(--accent), #d4a853);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===== PRICING LIST ===== */
.pricing-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pricing-list__item {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px 20px;
    background: var(--white);
    border-radius: 8px;
    border: 1px solid var(--gray-lighter);
}

.pricing-list__name {
    flex: 1;
    font-weight: 500;
    color: var(--black);
}

.pricing-list__duration {
    font-size: 14px;
    color: var(--gray);
    min-width: 60px;
    text-align: center;
}

.pricing-list__price {
    font-size: 18px;
    font-weight: 600;
    color: var(--accent);
    min-width: 60px;
    text-align: right;
}

/* ===== PRICING TABLE ===== */
.pricing-tables {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 30px;
}

.pricing-table {
    background: var(--white);
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
}

.pricing-table__title {
    font-family: var(--font-heading);
    font-size: var(--text-h4);
    font-weight: 500;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--gray-lighter);
}

.pricing-table__items {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pricing-table__item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
}

.pricing-table__name {
    font-weight: 500;
    color: var(--black);
}

.pricing-table__dots {
    flex: 1;
    border-bottom: 1px dotted var(--gray-lighter);
    min-width: 20px;
}

.pricing-table__duration {
    font-size: 14px;
    color: var(--gray);
    min-width: 55px;
    text-align: center;
}

.pricing-table__price {
    font-size: 16px;
    font-weight: 600;
    color: var(--accent);
    min-width: 50px;
    text-align: right;
}

.pricing-note {
    text-align: center;
    margin-top: 40px;
    font-size: 14px;
    color: var(--gray);
    font-style: italic;
}

/* ===== SERVICE CARD META ===== */
.service-card__meta {
    display: flex;
    justify-content: space-between;
    padding: 12px 0;
    margin: 15px 0;
    border-top: 1px solid var(--gray-lighter);
    border-bottom: 1px solid var(--gray-lighter);
    font-size: 14px;
    color: var(--gray);
}

.service-card__meta span:last-child {
    font-weight: 600;
    color: var(--accent);
}

/* ===== TESTIMONIALS ===== */
.testimonials-slider {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.testimonial {
    padding: 0 20px;
}

.testimonial__stars {
    display: flex;
    justify-content: center;
    gap: 5px;
    margin-bottom: 30px;
    color: var(--accent);
}

.testimonial__text {
    font-family: var(--font-heading);
    font-size: clamp(22px, 3vw, 32px);
    font-weight: 400;
    font-style: italic;
    color: var(--black);
    line-height: 1.6;
    margin-bottom: 30px;
}

.testimonial__author {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.testimonial__avatar {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    overflow: hidden;
}

.testimonial__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.testimonial__info h4 {
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 500;
    color: var(--black);
}

.testimonial__info span {
    font-size: 14px;
    color: var(--gray);
}

/* ===== CONTACT ===== */
.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
}

.contact-info__title {
    font-family: var(--font-heading);
    font-size: 36px;
    font-weight: 400;
    color: var(--black);
    margin-bottom: 30px;
}

.contact-info__item {
    display: flex;
    gap: 20px;
    margin-bottom: 30px;
}

.contact-info__icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border: 1px solid var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent);
    flex-shrink: 0;
}

.contact-info__content h4 {
    font-size: 18px;
    font-weight: 600;
    color: var(--black);
    margin-bottom: 5px;
}

.contact-info__content p {
    font-size: 16px;
    color: var(--gray);
}

.contact-info__content a {
    font-size: 16px;
}

.contact-info__content small {
    display: block;
    font-size: 13px;
    color: var(--gray);
    opacity: 0.8;
    margin-top: 5px;
    font-style: italic;
}

.contact-info__tip {
    margin-top: 30px;
    padding: 20px;
    border-left: 3px solid var(--accent);
    font-size: 14px;
    color: var(--gray);
    line-height: 1.6;
    font-style: italic;
    border-radius: 0 var(--radius-card) var(--radius-card) 0;
}

/* Contact Map */
.contact-map {
    padding: 30px;
}

.contact-map__title {
    font-family: var(--font-heading);
    font-size: 28px;
    font-weight: 500;
    color: var(--black);
    margin-bottom: 25px;
}

.contact-map__wrapper {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
}

.contact-map__wrapper iframe {
    display: block;
    width: 100%;
    height: 450px;
}

.contact-map__buttons {
    display: flex;
    gap: 15px;
    margin-top: 20px;
}

.contact-map__buttons .btn {
    flex: 1;
    text-align: center;
}

.contact-map-hero {
    width: 100%;
    height: clamp(340px, 48vh, 540px);
    margin-top: 116px;
    background: var(--beige-dark);
}

.contact-map-hero iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}

.contact-page__breadcrumb {
    text-align: center;
    font-size: var(--text-body);
    color: var(--gray);
    margin-bottom: 8px;
}

.contact-page__breadcrumb a {
    color: var(--gray);
    text-decoration: underline;
    text-underline-offset: 0.2em;
    text-decoration-color: rgba(0, 0, 0, 0.18);
    transition: var(--link-transition);
}

.contact-page__breadcrumb a:hover {
    color: var(--accent-dark);
}

.contact-page__breadcrumb span {
    color: var(--accent-dark);
}

.contact-page-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(48px, 8vw, 100px);
    max-width: 920px;
    margin: 0 auto;
}

.contact-page-col .footer__title:first-child {
    margin-top: 0;
}

.contact-page-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.section--beige .contact-info__tip {
    max-width: 920px;
    margin: 48px auto 0;
}

/* Contact Form */
.contact-form {
    padding: 50px;
}

.contact-form__title {
    font-family: var(--font-heading);
    font-size: 28px;
    font-weight: 400;
    color: var(--black);
    margin-bottom: 30px;
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.form-group {
    margin-bottom: 25px;
}

.form-group label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: var(--black);
    margin-bottom: 10px;
}

.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 16px 20px;
    font-family: var(--font-body);
    font-size: 15px;
    color: var(--black);
    background: var(--glass-bg-input);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border: 1px solid var(--glass-border-subtle);
    border-radius: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
    transition: border-color 0.3s, background 0.3s, box-shadow 0.3s;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    outline: none;
    border-color: var(--accent);
    background: rgba(255, 255, 255, 0.82);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 0 0 3px rgba(196, 167, 125, 0.15);
}

.form-group textarea {
    min-height: 150px;
    resize: vertical;
}

/* ===== CTA SECTION ===== */
.cta-section {
    padding: var(--section-y) 0;
    text-align: center;
    background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 50%, #1a1a1a 100%);
}

.cta-section__title {
    font-family: var(--font-heading);
    font-size: var(--text-h2);
    font-weight: 400;
    line-height: var(--leading-heading);
    color: var(--white);
    margin-bottom: 20px;
}

.cta-section__text {
    font-size: var(--text-lead);
    line-height: var(--leading-relaxed);
    color: rgba(255,255,255,0.85);
    margin-bottom: 35px;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

/* Photo-backed variant */
.cta-section--image {
    position: relative;
    background: var(--black);
    overflow: hidden;
}

.cta-section--image .cta-section__bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.cta-section--image .cta-section__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cta-section--image .cta-section__bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(0,0,0,0.78) 0%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0.78) 100%);
}

.cta-section--image .container {
    position: relative;
    z-index: 1;
}

/* Google rating trust signal */
.cta-section__rating {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
    font-size: 0.95rem;
    letter-spacing: 0.01em;
    color: var(--white);
}

.cta-section__rating svg {
    color: var(--accent);
    flex-shrink: 0;
}

.cta-section__rating strong {
    font-weight: 600;
}

.cta-section__rating span {
    opacity: 0.85;
}

/* Action row */
.cta-section__buttons {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}

/* Reassurance microcopy */
.cta-section__note {
    margin-top: 20px;
    font-size: 0.875rem;
    letter-spacing: 0.02em;
    color: rgba(255,255,255,0.7);
}

/* ===== BOOKING MODAL ===== */
.booking-modal {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.booking-modal.active {
    opacity: 1;
    visibility: visible;
}

.booking-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(5px);
}

.booking-modal__content {
    position: relative;
    width: 95%;
    max-width: 900px;
    height: 90vh;
    max-height: 800px;
    overflow: hidden;
    transform: scale(0.9) translateY(20px);
    transition: transform 0.3s ease;
}

.booking-modal.active .booking-modal__content {
    transform: scale(1) translateY(0);
}

.booking-modal__close {
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 10;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--glass-bg-strong);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.booking-modal__close:hover {
    background: rgba(255, 255, 255, 0.92);
    transform: rotate(90deg);
}

.booking-modal iframe {
    width: 100%;
    height: 100%;
    border: none;
}

/* Booking Modal - Mobile */
@media (max-width: 768px) {
    .booking-modal__content {
        width: 100%;
        height: 100%;
        max-height: 100%;
        border-radius: 0;
    }

    .booking-modal__close {
        top: 10px;
        right: 10px;
        width: 44px;
        height: 44px;
        background: var(--dark);
        color: var(--white);
    }

    .booking-modal__close svg {
        stroke: var(--white);
    }

    .booking-modal__close:hover {
        background: var(--dark);
        transform: none;
    }
}

/* ===== WEEKENDS MODAL ===== */
.weekends-modal {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.weekends-modal.active {
    opacity: 1;
    visibility: visible;
}

.weekends-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(5px);
}

.weekends-modal__content {
    position: relative;
    width: 95%;
    max-width: 450px;
    max-height: 90vh;
    padding: 40px;
    overflow-y: auto;
    transform: scale(0.9) translateY(20px);
    transition: transform 0.3s ease;
}

.weekends-modal.active .weekends-modal__content {
    transform: scale(1) translateY(0);
}

.weekends-modal__close {
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 10;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border: 1px solid var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.weekends-modal__close:hover {
    background: rgba(255, 255, 255, 0.72);
    transform: rotate(90deg);
}

.weekends-modal__title {
    font-family: var(--font-heading);
    font-size: 28px;
    font-weight: 500;
    margin-bottom: 8px;
    color: var(--black);
}

.weekends-modal__subtitle {
    color: var(--gray);
    font-size: 15px;
    margin-bottom: 25px;
}

.weekends-modal__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.weekends-modal__list li {
    padding: 12px 0;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    font-size: 15px;
    color: var(--black);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.weekends-modal__list li:last-child {
    border-bottom: none;
}

.weekends-modal__list li span {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background: var(--accent);
    color: var(--white);
    padding: 4px 10px;
    border-radius: 20px;
}

.weekends-modal__past {
    opacity: 0.4;
    text-decoration: line-through;
}

.weekends-modal__nearest {
    font-weight: 600;
}

@media (max-width: 768px) {
    .weekends-modal__content {
        width: 100%;
        max-width: 100%;
        height: 100%;
        max-height: 100%;
        border-radius: 0;
        padding: 60px 25px 25px;
    }

    .weekends-modal__close {
        top: 10px;
        right: 10px;
        width: 44px;
        height: 44px;
        background: var(--dark);
    }

    .weekends-modal__close svg {
        stroke: var(--white);
    }

    .weekends-modal__close:hover {
        background: var(--dark);
        transform: none;
    }
}

/* ===== FOOTER ===== */
.footer {
    background: var(--glass-bg-beige);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border-top: 1px solid var(--glass-border-subtle);
    padding: 80px 0 30px;
}

.footer__grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 60px;
    padding-bottom: 60px;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

.footer__grid--4cols {
    grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
}

.footer__grid--4cols > .footer__col {
    grid-column: span 3;
}

/* footer columns: four equal 3-track columns */
.footer__grid--4cols > .footer__col--brand,
.footer__grid--4cols > .footer__col--nav { grid-column: span 3; }

/* brand column */
.footer__logo { display: inline-block; margin-bottom: 22px; }
.footer__logo-img { height: 42px; width: auto; display: block; }
.footer__col--brand .footer__text { margin-bottom: 22px; max-width: 32ch; }
.footer__cta {
    display: inline-flex;
    margin-bottom: 26px;
    padding: 14px 32px;
    font-size: 13px;
}

/* directions button + transport note (location column) */
.footer__directions {
    display: inline-flex;
    margin: 16px 0 14px;
    padding: 11px 26px;
    font-size: 12px;
}
.footer__transport-note {
    color: var(--gray);
    font-size: 13px;
    line-height: 1.7;
    margin: 0;
}

.footer__brand .logo {
    margin-bottom: 25px;
    display: inline-flex;
}

.footer__brand .logo__text {
    color: var(--black);
}

.footer__text {
    color: var(--gray);
    font-size: 15px;
    line-height: 1.8;
    margin-bottom: 25px;
}

.footer__social {
    display: flex;
    gap: 15px;
}

.footer__social a {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: 1px solid var(--glass-border-subtle);
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--black);
    transition: all 0.3s;
}

.footer__social a:hover {
    background: var(--accent);
    border-color: var(--accent);
}

/* Google rating trust link (brand column) */
.footer__google {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
    font-size: 14px;
    color: var(--gray);
    transition: color 0.3s;
}

.footer__google:hover {
    color: var(--black);
}

.footer__google strong {
    color: var(--black);
    font-weight: 600;
}

.footer__google-stars {
    color: #fbbc04;
    letter-spacing: 1px;
}

/* Legal links (footer bottom bar) */
.footer__legal {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
}

.footer__legal a {
    color: var(--gray);
    font-size: var(--text-small);
    letter-spacing: var(--tracking-ui);
    transition: color 0.3s;
}

.footer__legal a:hover {
    color: var(--accent-dark);
}

/* Legal / policy pages */
.legal {
    max-width: 760px;
    margin: 0 auto;
}

.legal__updated {
    font-size: 14px;
    color: var(--gray-light);
    margin: 0 0 32px;
}

.legal h2 {
    font-family: var(--font-heading);
    font-size: var(--text-h3);
    font-weight: 500;
    color: var(--black);
    margin: 40px 0 14px;
}

.legal h2:first-of-type {
    margin-top: 0;
}

.legal p,
.legal li {
    color: var(--gray);
    font-size: 16px;
    line-height: 1.8;
}

.legal ul {
    margin: 0 0 18px;
    padding-left: 20px;
}

.legal li {
    margin-bottom: 8px;
}

.legal a {
    color: var(--accent-dark);
    text-decoration: underline;
}

.footer__title {
    font-family: var(--font-body);
    font-size: var(--text-eyebrow);
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--black);
    margin-bottom: 20px;
}

.footer__contact p {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: var(--gray);
    font-size: var(--text-body);
    line-height: 1.5;
    margin-bottom: 15px;
}

.footer__contact svg {
    color: var(--accent);
    flex-shrink: 0;
    margin-top: 3px;  /* optically align icon with the first line of text */
}

.footer__bottom {
    padding-top: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.footer__colophon,
.footer__credit {
    margin: 0;
    color: var(--gray);
    font-size: var(--text-small);
    letter-spacing: var(--tracking-ui);
}

/* Footer Hours */
.footer__hours {
    display: flex;
    flex-direction: column;
    gap: 8px;
    overflow: visible;
}

.footer__hour-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
}

.footer__day {
    color: var(--gray);
    font-size: var(--text-body);
    line-height: 1.5;
}

.footer__status {
    font-size: var(--text-body);
    font-weight: 500;
    line-height: 1.5;
}

.footer__status--open {
    color: #4a9d5b;
}

.footer__note {
    color: var(--gray);
    font-size: 13px;
    line-height: 1.5;
    margin-top: 10px;
}

/* Brand column: even vertical rhythm */
.footer__col--brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
}
.footer__col--brand .footer__logo,
.footer__col--brand .footer__text,
.footer__col--brand .footer__cta,
.footer__col--brand .footer__social { margin: 0; }
.footer__col--brand .footer__google { margin-top: 0; }

/* Live open/closed badge */
.footer__open-badge {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 4px;
    padding: 5px 12px;
    border-radius: 9999px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.01em;
}
.footer__open-badge::before {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
}
.footer__open-badge--open { color: #2e9e54; background: rgba(46, 158, 84, 0.12); }
.footer__open-badge--closed { color: var(--gray); background: rgba(0, 0, 0, 0.06); }

.footer__day:has(.footer__weekends-info) {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.footer__weekends-info {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    padding: 0;
    border: 1px solid rgba(196, 167, 125, 0.28);
    border-radius: 50%;
    background: rgba(196, 167, 125, 0.14);
    color: inherit;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
    transition: background 0.22s ease, border-color 0.22s ease, transform 0.22s ease;
}

.footer__weekends-info:hover,
.footer__weekends-info:focus-visible {
    background: rgba(196, 167, 125, 0.24);
    border-color: rgba(196, 167, 125, 0.45);
    transform: scale(1.06);
    outline: none;
}

.footer__weekends-tooltip {
    position: absolute;
    bottom: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%) translateY(6px);
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.01em;
    line-height: 1.35;
    white-space: nowrap;
    border-radius: 8px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
    z-index: 2;
    background: rgba(24, 19, 16, 0.96);
    color: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.footer__weekends-tooltip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: rgba(24, 19, 16, 0.96);
}

.section--beige .footer__weekends-tooltip {
    background: rgba(255, 255, 255, 0.92);
    color: rgba(24, 19, 16, 0.88);
    border-color: rgba(196, 167, 125, 0.25);
    box-shadow: var(--glass-shadow);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
}

.section--beige .footer__weekends-tooltip::after {
    border-top-color: rgba(255, 255, 255, 0.92);
}

.footer__weekends-info:hover .footer__weekends-tooltip,
.footer__weekends-info:focus-visible .footer__weekends-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

@media (hover: hover) {
    .footer__weekends-tooltip {
        transition-delay: 0.1s;
    }

    .footer__weekends-info:not(:hover):not(:focus-visible) .footer__weekends-tooltip {
        transition-delay: 0s;
    }
}

/* Static map thumbnail (location column) */
.footer__map {
    display: block;
    position: relative;
    margin: 16px 0 14px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--glass-border-subtle);
    line-height: 0;
}
.footer__map-img {
    width: 100%;
    height: 116px;
    display: block;
}
.footer__map-label {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px 12px 9px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.3;
    color: #fff;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0));
}
@media (hover: hover) {
    .footer__map:hover .footer__map-label { text-decoration: underline; }
}

/* Footer Certifikáty */
.footer__col > .footer__title:not(:first-child) {
    margin-top: 30px;
    margin-bottom: 10px;
}

.footer__link {
    font-size: var(--text-body);
}

/* Footer Social */
.footer__social {
    display: flex;
    gap: 12px;
    margin-top: 15px;
}

.footer__social-link {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--black);
    transition: all 0.3s ease;
}

.footer__social-link:hover {
    background: var(--accent);
    color: var(--white);
    transform: translateY(-3px);
}

/* ===== Dark & elegant footer theme ===== */
.footer {
    background: #181310;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.72);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.footer__grid {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

.footer__bottom {
    border-top-color: rgba(255, 255, 255, 0.1);
}

.footer__title {
    color: #fff;
}

.footer__text,
.footer__day,
.footer__status,
.footer__note,
.footer__contact p,
.footer__transport-note {
    color: rgba(255, 255, 255, 0.58);
}

.footer__contact a,
.footer__link,
.footer__links a {
    color: rgba(255, 255, 255, 0.8);
}

.footer__contact a:hover,
.footer__link:hover,
.footer__links a:hover,
.footer__legal a:hover {
    color: var(--accent);
}

.footer__contact svg {
    color: var(--accent);
}

.footer__status--open {
    color: #6fcf8b;
}

.footer__colophon,
.footer__credit,
.footer__legal a {
    color: rgba(255, 255, 255, 0.45);
}

.footer__credit-link {
    color: var(--accent);
}

.footer__google {
    color: rgba(255, 255, 255, 0.68);
}

.footer__google strong {
    color: #fff;
}

.footer__open-badge--open {
    color: #6fcf8b;
    background: rgba(111, 207, 139, 0.16);
}

.footer__open-badge--closed {
    color: rgba(255, 255, 255, 0.7);
    background: rgba(255, 255, 255, 0.1);
}

.footer__social-link {
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.16);
    color: #fff;
    box-shadow: none;
}

.footer__map {
    border-color: rgba(255, 255, 255, 0.14);
}

/* Footer Tip */
.footer__tip {
    color: var(--gray);
    font-size: 13px;
    line-height: 1.6;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid rgba(0,0,0,0.1);
    font-style: italic;
}

/* Footer Address */
.footer__address p {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: var(--gray);
    font-size: 15px;
    line-height: 1.6;
}

.footer__address svg {
    color: var(--accent);
    flex-shrink: 0;
    margin-top: 3px;
}

.footer__address-note {
    color: var(--gray);
    font-size: 13px;
    font-style: italic;
    margin-top: 10px;
    padding-left: 30px;
}

/* Footer Transport */
.footer__transport {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.footer__transport-item strong {
    display: block;
    color: var(--black);
    font-size: 14px;
    margin-bottom: 8px;
}

.footer__transport-item p {
    color: var(--gray);
    font-size: 13px;
    line-height: 1.6;
    margin: 0;
}

/* Footer Contact Links — see in-content link styles above */
.footer__contact a {
    transition: color 0.3s;
}

/* ===== PAGE HEADER ===== */
.page-header {
    position: relative;
    min-height: clamp(340px, 44vh, 520px);
    padding-top: 116px;            /* reserve space for the fixed header */
    display: flex;
    align-items: flex-end;
    text-align: left;
    background: var(--black);
    overflow: hidden;
}

/* soft gradient so bottom-left text stays legible on a crisp (un-muddied) photo */
.page-header::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(to top, rgba(20, 12, 6, 0.72) 0%, rgba(20, 12, 6, 0.40) 38%, rgba(20, 12, 6, 0.12) 68%, rgba(20, 12, 6, 0) 100%);
    pointer-events: none;
}

.page-header__bg {
    position: absolute;
    inset: 0;
}

.page-header__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.06);
    animation: pageHeaderZoom 16s ease-out forwards;
}

@keyframes pageHeaderZoom {
    to { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    .page-header__bg img {
        animation: none;
        transform: none;
    }
}

.page-header__bg--grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 4px;
}

.page-header__bg--grid img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.page-header__content {
    position: relative;
    z-index: 2;
    color: var(--white);
    width: 100%;
    max-width: var(--container);
    margin: 0 auto;
    padding: 0 var(--gap) clamp(38px, 6vh, 64px);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.38), 0 1px 24px rgba(0, 0, 0, 0.40);
}

/* breadcrumb / label sit as an eyebrow above the title */
.page-header__breadcrumb,
.page-header__label {
    order: -1;
    margin-bottom: 14px;
}

.page-header__title {
    font-family: var(--font-heading);
    font-size: var(--text-h1);
    font-weight: 400;
    line-height: var(--leading-display);
    margin-bottom: 15px;
}

.page-header__breadcrumb {
    font-size: var(--text-body);
    color: rgba(255,255,255,0.7);
}

.page-header__breadcrumb a {
    color: rgba(255, 255, 255, 0.85);
    text-decoration: underline;
    text-underline-offset: 0.2em;
    text-decoration-color: rgba(255, 255, 255, 0.35);
    transition: var(--link-transition);
}

.page-header__breadcrumb a:hover {
    color: var(--link-hover);
    text-decoration-color: var(--link-hover);
}

.page-header__breadcrumb span {
    color: var(--accent);
}

/* ===== ANIMATIONS ===== */
.fade-up {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.8s ease;
}

.fade-up.visible {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    .fade-up {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* ===== STAGGERED REVEALS =====
   For card grids, reveal children one-by-one (cascade) instead of fading the
   whole block at once. The container stops fading and each child animates with
   an incremental delay once the container scrolls into view (.visible). */
.cosmetics-grid.fade-up,
.gender-cards.fade-up,
.specialties-list.fade-up,
.gallery-grid.fade-up:not(.gallery-grid--bento),
.reviews__head.fade-up,
.reviews__marquee.fade-up {
    opacity: 1;
    transform: none;
    transition: none;
}
.cosmetics-grid > .cosmetic-card,
.gender-cards > .gender-card,
.specialties-list > .specialty-item,
.gallery-grid:not(.gallery-grid--bento) > .gallery-item {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}
.cosmetics-grid.visible > .cosmetic-card,
.gender-cards.visible > .gender-card,
.specialties-list.visible > .specialty-item,
.gallery-grid.visible:not(.gallery-grid--bento) > .gallery-item {
    opacity: 1;
    transform: none;
}
.cosmetics-grid.visible > :nth-child(2),
.gender-cards.visible > :nth-child(2),
.specialties-list.visible > :nth-child(2),
.gallery-grid.visible:not(.gallery-grid--bento) > :nth-child(2) { transition-delay: 0.08s; }
.cosmetics-grid.visible > :nth-child(3),
.gender-cards.visible > :nth-child(3),
.specialties-list.visible > :nth-child(3),
.gallery-grid.visible:not(.gallery-grid--bento) > :nth-child(3) { transition-delay: 0.16s; }
.cosmetics-grid.visible > :nth-child(4),
.gender-cards.visible > :nth-child(4),
.specialties-list.visible > :nth-child(4),
.gallery-grid.visible:not(.gallery-grid--bento) > :nth-child(4) { transition-delay: 0.24s; }
.cosmetics-grid.visible > :nth-child(5),
.gender-cards.visible > :nth-child(5),
.specialties-list.visible > :nth-child(5),
.gallery-grid.visible:not(.gallery-grid--bento) > :nth-child(5) { transition-delay: 0.32s; }
.cosmetics-grid.visible > :nth-child(6),
.gender-cards.visible > :nth-child(6),
.specialties-list.visible > :nth-child(6),
.gallery-grid.visible:not(.gallery-grid--bento) > :nth-child(6) { transition-delay: 0.40s; }
.gallery-grid.visible:not(.gallery-grid--bento) > :nth-child(7) { transition-delay: 0.48s; }
.gallery-grid.visible:not(.gallery-grid--bento) > :nth-child(8) { transition-delay: 0.56s; }

@media (prefers-reduced-motion: reduce) {
    .cosmetics-grid > .cosmetic-card,
    .gender-cards > .gender-card,
    .specialties-list > .specialty-item,
    .gallery-grid:not(.gallery-grid--bento) > .gallery-item {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1200px) {
    .footer__grid {
        grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
        gap: 40px;
    }

    .footer__grid--4cols > .footer__col {
        grid-column: span 6;
    }
}

@media (max-width: 1024px) {
    .about {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .about__images {
        max-width: 500px;
        margin: 0 auto;
    }

    .services-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .pricing-grid,
    .pricing-grid--2cols {
        grid-template-columns: 1fr;
        max-width: 500px;
        margin: 0 auto;
    }

    .pricing-card__meta {
        margin: 25px -20px;
        padding: 20px 15px;
    }

    .gallery-grid:not(.gallery-grid--bento) {
        grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
    }

    .gallery-grid:not(.gallery-grid--bento) > .gallery-item {
        grid-column: span 4;
    }

    .contact-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .contact-page-grid {
        grid-template-columns: 1fr;
        gap: 48px;
    }
}

@media (max-width: 768px) {
    .header {
        padding: 14px 0;
    }

    .header.scrolled {
        padding: 10px 0;
    }

    .header__inner {
        display: flex;
        padding: 0 20px;
        min-height: 52px;
        justify-content: space-between;
        gap: 12px;
    }

    .logo__text {
        display: none;
    }

    .logo {
        position: static;
        transform: none;
    }

    .logo__img {
        height: 52px;
        width: 52px;
    }

    .header.scrolled .logo__img {
        height: 46px;
        width: 46px;
    }

    .logo__img--dark {
        display: none;
    }

    .logo__img--light {
        display: block;
    }

    .header.scrolled .logo__img--dark {
        display: block;
    }

    .header.scrolled .logo__img--light {
        display: none;
    }

    .nav-toggle {
        position: relative;
        right: auto;
    }

    .header__actions {
        gap: 10px;
    }

    .header__cta {
        padding: 9px 18px;
        font-size: 13px;
    }

    /* hamburger morphs into an X while the menu is open */
    .nav.active ~ .header__actions .nav-toggle span:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }
    .nav.active ~ .header__actions .nav-toggle span:nth-child(2) {
        opacity: 0;
    }
    .nav.active ~ .header__actions .nav-toggle span:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }

    .nav-backdrop {
        display: block;
        position: fixed;
        top: var(--header-offset, 72px);
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 998;
        border: none;
        padding: 0;
        background: rgba(26, 26, 26, 0.28);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 0.28s ease, visibility 0.28s ease;
    }

    body.nav-open .nav-backdrop {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    .nav {
        position: fixed;
        top: var(--header-offset, 72px);
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 999;
        display: flex;
        flex-direction: column;
        justify-content: safe center;
        overflow-y: auto;
        overscroll-behavior: contain;
        background: rgb(250, 248, 246);
        padding: 40px 20px;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 0.3s ease, visibility 0.3s ease;
    }

    .nav.active {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    .nav__drawer {
        display: flex;
        flex-direction: column;
        width: 100%;
        max-width: 420px;
        margin: 0 auto;
        gap: 0;
    }

    .nav.active .nav__drawer {
        transform: none;
        opacity: 1;
    }

    .nav__link {
        display: block;
        width: 100%;
        font-family: var(--font-heading);
        font-size: 1.5rem;
        font-weight: 400;
        color: var(--black);
        padding: 18px 4px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.07);
        text-align: left;
    }

    .nav__link::after {
        display: none;
    }

    .nav__item--dropdown {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        margin-bottom: 16px;
        padding: 18px;
        background: var(--glass-bg);
        backdrop-filter: var(--glass-blur);
        -webkit-backdrop-filter: var(--glass-blur);
        border: 1px solid var(--glass-border);
        border-radius: var(--radius-card);
        box-shadow: var(--glass-shadow);
    }

    .nav__item--dropdown .nav__link {
        font-family: var(--font-body);
        font-size: var(--text-eyebrow);
        font-weight: 500;
        letter-spacing: var(--tracking-eyebrow);
        text-transform: uppercase;
        color: var(--gray);
        padding: 0 0 14px;
        margin-bottom: 6px;
        border-bottom: 1px solid var(--glass-border-subtle);
    }

    .nav__link--has-menu .nav__chevron {
        display: none;
    }

    .nav__menu {
        position: static;
        transform: none;
        width: 100%;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        min-width: 0;
        padding: 0;
        margin: 0;
        background: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border: none;
        box-shadow: none;
        border-radius: 0;
    }

    .nav__menu::before {
        display: none;
    }

    .nav__menu li + li {
        border-top: 1px solid rgba(0, 0, 0, 0.05);
    }

    .nav__menu-link {
        display: block;
        font-size: 1.0625rem;
        font-weight: 400;
        color: var(--black);
        padding: 14px 2px;
        border-radius: 0;
        text-align: left;
    }

    .nav__menu-link:hover,
    .nav__menu-link:focus-visible {
        background: transparent;
        color: var(--accent-dark);
    }

    .nav__menu-all {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        margin-top: 12px;
        padding-top: 14px;
        border-top: 1px solid var(--glass-border-subtle);
        font-size: var(--text-small);
        font-weight: 500;
        color: var(--accent-dark);
        text-decoration: none;
    }

    .nav__menu-all::after {
        content: '→';
        transition: transform 0.2s ease;
    }

    .nav__menu-all:hover::after {
        transform: translateX(3px);
    }

    .nav__mobile-cta {
        display: inline-flex;
        width: 100%;
        justify-content: center;
        margin-top: 8px;
        padding-top: 16px;
    }

    .nav-toggle {
        display: flex;
    }

    .hero__slide-content {
        padding: 0 20px;
        align-items: center;
        text-align: center;
    }

    .hero__title {
        max-width: 100%;
    }

    .hero__text {
        max-width: 100%;
    }

    .hero__buttons {
        flex-direction: column;
        width: 100%;
        max-width: 300px;
    }

    .hero__meta {
        justify-content: center;
        gap: 10px 20px;
    }

    .hero__call::before {
        display: none;
    }

    .hero-controls-wrapper {
        bottom: 30px;
        left: 5%;
        right: 5%;
    }

    .chevron-btn {
        width: 48px;
        height: 48px;
    }

    .services-grid {
        grid-template-columns: 1fr;
    }

    .gallery-grid:not(.gallery-grid--bento) {
        grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
        gap: 10px;
    }

    .gallery-grid:not(.gallery-grid--bento) > .gallery-item {
        grid-column: span 6;
    }

    .form-row {
        grid-template-columns: 1fr;
    }

    .footer__grid {
        grid-template-columns: 1fr;
        gap: 40px;
        text-align: center;
    }

    .footer__social {
        justify-content: center;
    }

    .footer__bottom {
        flex-direction: column;
        gap: 16px;
        text-align: center;
    }

    .footer__credit {
        text-align: center;
    }

    .footer__hour-item {
        justify-content: center;
    }

    .footer__address p {
        justify-content: center;
    }

    .footer__address-note {
        padding-left: 0;
    }

    .footer__contact p {
        justify-content: center;
    }
}

/* ===== PAGE HEADER SUBTITLE ===== */
.page-header__subtitle {
    font-size: 18px;
    color: rgba(255,255,255,0.8);
    margin-top: 10px;
    font-style: italic;
}

.page-header__content .btn {
    margin-top: 25px;
}

/* ===== SUBNAV ===== */
.subnav {
    display: block;
    background: var(--glass-bg-beige);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    padding: 0;
    border-bottom: 1px solid var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
    position: sticky;
    top: var(--header-offset, 92px);
    z-index: 100;
}

.subnav .container {
    padding-top: 0;
    padding-bottom: 0;
}

.subnav__links {
    display: flex;
    gap: 5px;
    overflow-x: auto;
    padding: 15px 0;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -webkit-mask-image: linear-gradient(
        90deg,
        transparent 0%,
        #000 6%,
        #000 94%,
        transparent 100%
    );
    mask-image: linear-gradient(
        90deg,
        transparent 0%,
        #000 6%,
        #000 94%,
        transparent 100%
    );
}

.subnav__links::-webkit-scrollbar {
    display: none;
}

.subnav__link--back {
    background: var(--glass-bg-strong);
    color: var(--black);
    font-weight: 600;
    border-right: 1px solid var(--glass-border-subtle);
    margin-right: 10px;
    padding-right: 25px;
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
}

.subnav__link--back:hover {
    background: rgba(255, 255, 255, 0.88);
}

/* ===== BACK BUTTON ===== */
.back-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: var(--text-small);
    font-weight: 500;
    margin-bottom: 30px;
}

@media (max-width: 768px) {
    .back-btn {
        margin-top: 20px;
    }
}

/* ===== TREATMENT DETAIL ===== */
.treatment-detail {
    display: grid;
    grid-template-columns: 1fr 350px;
    gap: 40px;
    align-items: start;
}

.treatment-detail__main {
    min-width: 0;
}

.treatment-detail__sidebar {
    position: sticky;
    top: calc(var(--header-offset, 92px) + var(--subnav-height, 54px) + 16px);
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* ===== TREATMENT CARD LARGE ===== */
.treatment-card-large {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-card);
    box-shadow: var(--glass-shadow);
    overflow: hidden;
}

.treatment-card-large__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px 35px;
    background: rgba(245, 240, 235, 0.55);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border-bottom: 1px solid var(--glass-border-subtle);
    flex-wrap: wrap;
    gap: 20px;
}

.treatment-card-large__title {
    font-family: var(--font-heading);
    font-size: var(--text-h3);
    font-weight: 500;
    color: var(--black);
    margin: 0;
}

.treatment-card-large__price {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.treatment-card-large__price .price {
    font-family: var(--font-heading);
    font-size: var(--text-price);
    font-weight: 500;
    color: var(--accent);
}

.treatment-card-large__price .duration {
    font-size: var(--text-body);
    color: var(--gray);
}

.treatment-card-large__body {
    padding: 35px;
}

.treatment-card-large__lead {
    color: var(--gray);
    margin-bottom: 30px;
}

.treatment-card-large__body h3 {
    font-family: var(--font-heading);
    font-size: var(--text-h4);
    font-weight: 500;
    color: var(--black);
    margin-bottom: 15px;
}

.treatment-card-large__list {
    list-style: none;
    padding: 0;
    margin: 0 0 30px 0;
}

.treatment-card-large__list li {
    position: relative;
    padding: 10px 0 10px 30px;
    font-size: 15px;
    color: var(--gray);
    border-bottom: 1px solid var(--gray-lighter);
}

.treatment-card-large__list li:last-child {
    border-bottom: none;
}

.treatment-card-large__list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    background: var(--accent);
    border-radius: 50%;
}

/* ===== BENEFITS ===== */
.treatment-card-large__benefits {
    display: none; /* Replaced by treatment-tags */
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
    margin-bottom: 30px;
    padding: 25px 0;
    border-top: 1px solid var(--gray-lighter);
    border-bottom: 1px solid var(--gray-lighter);
}

.treatment-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 30px;
    padding: 20px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.38);
}

.treatment-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 18px;
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border: 1px solid var(--glass-border-subtle);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
    border-radius: 30px;
    font-size: 14px;
    font-weight: 500;
    color: var(--dark);
}

.treatment-tag::before {
    content: "✓";
    color: var(--accent);
    font-weight: 600;
}

.benefit {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
}

.benefit__icon {
    width: 70px;
    height: 70px;
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border: 1px solid var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent);
}

.benefit__icon svg {
    width: 32px;
    height: 32px;
}

.benefit__icon img {
    width: 48px;
    height: 48px;
    object-fit: contain;
}

.benefit span {
    font-size: 13px;
    color: var(--gray);
}

/* ===== ADDON BOX ===== */
.addon-box {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-card);
    box-shadow: var(--glass-shadow);
    overflow: hidden;
}

.addon-box__title {
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 500;
    color: var(--black);
    padding: 20px 25px;
    background: rgba(245, 240, 235, 0.55);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    margin: 0;
    border-bottom: 1px solid var(--glass-border-subtle);
}

.addon-box__items {
    padding: 15px 25px;
}

.addon-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.38);
}

.addon-item:last-child {
    border-bottom: none;
}

.addon-item__info {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.addon-item__name {
    font-size: 15px;
    font-weight: 500;
    color: var(--black);
}

.addon-item__duration {
    font-size: 13px;
    color: var(--gray);
}

.addon-item__price {
    font-size: 16px;
    font-weight: 600;
    color: var(--accent);
}

/* ===== INFO BOX ===== */
.info-box {
    background: rgba(245, 240, 235, 0.55);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border-radius: var(--radius-card);
    padding: 20px 25px;
    border: 1px solid var(--glass-border-subtle);
    border-left: 4px solid var(--accent);
    box-shadow: var(--glass-shadow);
}

.info-box p {
    font-size: 14px;
    line-height: 1.7;
    color: var(--gray);
    margin: 0;
}

.info-box strong {
    color: var(--black);
}

/* ===== BUTTON LARGE ===== */
.btn--large {
    padding: 15px 40px;
    font-size: 15px;
}

/* ===== PRICING GRID 3 COLS ===== */
.pricing-grid--3cols {
    grid-template-columns: repeat(3, 1fr);
}

@media (max-width: 1024px) {
    .pricing-grid--3cols {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .pricing-grid--3cols {
        grid-template-columns: 1fr;
    }
}

/* ===== TREATMENT DETAIL RESPONSIVE ===== */
@media (max-width: 1024px) {
    .treatment-detail {
        grid-template-columns: 1fr;
    }

    .treatment-detail__sidebar {
        position: static;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .treatment-card-large__benefits {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .subnav__links {
        gap: 3px;
    }

    .subnav__link {
        padding: 8px 15px;
        font-size: 13px;
    }

    .treatment-detail__sidebar {
        grid-template-columns: 1fr;
    }

    .treatment-card-large__header {
        padding: 20px 25px;
        flex-direction: column;
        align-items: flex-start;
    }

    .treatment-card-large__title {
        font-size: 24px;
    }

    .treatment-card-large__price .price {
        font-size: 28px;
    }

    .treatment-card-large__body {
        padding: 25px;
    }

    .treatment-card-large__benefits {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}

/* ===== PAGE HEADER TALL ===== */
.page-header--tall {
    min-height: clamp(520px, 70vh, 760px);
}

.page-header__label {
    display: inline-block;
    font-size: 12px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.8);
    margin-bottom: 20px;
}

/* ===== INTRO BLOCK ===== */
.intro-block {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
    padding: 48px 40px;
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
    border-radius: calc(var(--radius-card) + 4px);
    box-shadow: var(--glass-shadow);
}

.intro-block__label {
    display: inline-block;
    font-size: 12px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--accent);
    margin-bottom: 20px;
}

.intro-block__title {
    font-family: var(--font-heading);
    font-size: clamp(32px, 4vw, 48px);
    font-weight: 400;
    line-height: 1.2;
    margin-bottom: 30px;
}

.intro-block__title em {
    font-style: italic;
}

.intro-block__text {
    font-size: 18px;
    line-height: 1.8;
    color: var(--gray);
}

/* ===== STATS GRID ===== */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    text-align: center;
}

.stat-item__number {
    display: block;
    font-family: var(--font-heading);
    font-size: clamp(40px, 5vw, 60px);
    font-weight: 400;
    color: var(--black);
    line-height: 1;
    margin-bottom: 10px;
}

.stat-item__label {
    font-size: 14px;
    color: var(--gray);
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* ===== SERVICES QUICK LINKS ===== */
.services-quick {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
}

.service-quick {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 25px 30px;
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border: 1px solid var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
    border-radius: var(--radius-card);
    text-decoration: none;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease, border-color 0.3s ease;
}

.service-quick:hover {
    background: rgba(26, 26, 26, 0.88);
    border-color: rgba(255, 255, 255, 0.15);
    box-shadow: 0 12px 32px rgba(26, 26, 26, 0.18);
}

.service-quick__title {
    font-family: var(--font-heading);
    font-size: 16px;
    color: var(--black);
    transition: color 0.3s ease;
}

.service-quick:hover .service-quick__title {
    color: white;
}

.service-quick__arrow {
    font-size: 20px;
    color: var(--accent);
    transition: transform 0.3s ease, color 0.3s ease;
}

.service-quick:hover .service-quick__arrow {
    transform: translateX(5px);
    color: white;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }

    .services-quick {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .page-header--tall {
        min-height: 64vh;
    }

    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .stat-item__number {
        font-size: 36px;
    }

    .services-quick {
        grid-template-columns: 1fr;
    }

    .intro-block__text {
        font-size: 16px;
    }
}

/* ===== 10 SPECIALTIES SECTION ===== */
.specialties-section {
    padding: var(--section-y) 0;
    background:
        radial-gradient(ellipse 70% 50% at 80% 0%, rgba(196, 167, 125, 0.08), transparent 55%),
        var(--cream);
}

.specialties-section__header {
    text-align: center;
    margin-bottom: 70px;
}

.specialties-list {
    display: grid;
    grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
    gap: 0;
}

.specialties-list > .specialty-item {
    grid-column: span 6;
}

.specialty-item {
    display: flex;
    align-items: flex-start;
    gap: 25px;
    padding: 35px 40px;
    border-bottom: 1px solid var(--gray-lighter);
    transition: background 0.3s ease;
}

.specialty-item:nth-child(odd) {
    border-right: 1px solid var(--gray-lighter);
}

.specialty-item:nth-child(9),
.specialty-item:nth-child(10) {
    border-bottom: none;
}

.specialty-item:hover {
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
}

.specialty-item__number {
    font-family: var(--font-heading);
    font-size: var(--text-decorative);
    font-weight: 400;
    color: var(--accent);
    line-height: 1;
    min-width: 70px;
    opacity: 0.7;
}

.specialty-item__content {
    flex: 1;
    padding-top: 8px;
}

.specialty-item__title {
    font-family: var(--font-heading);
    font-size: var(--text-h4);
    font-weight: 500;
    color: var(--black);
    margin-bottom: 8px;
}

.specialty-item__text {
    font-size: var(--text-body);
    color: var(--gray);
    line-height: var(--leading-body);
}

@media (max-width: 992px) {
    .specialties-list {
        grid-template-columns: 1fr;
    }

    .specialty-item {
        padding: 30px;
    }

    .specialty-item:nth-child(odd) {
        border-right: none;
    }

    .specialty-item:nth-child(9) {
        border-bottom: 1px solid var(--gray-lighter);
    }
}

@media (max-width: 768px) {
    .specialty-item {
        padding: 25px 20px;
        gap: 20px;
    }

    .specialty-item__number {
        font-size: 36px;
        min-width: 50px;
    }

    .specialty-item__title {
        font-size: 18px;
    }

    .specialty-item__text {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .specialty-item {
        flex-direction: column;
        gap: 10px;
        text-align: center;
    }

    .specialty-item__number {
        min-width: auto;
    }

    .specialty-item__content {
        padding-top: 0;
    }
}

/* ===== GIFT VOUCHER SECTION ===== */
.gift-section {
    padding: 100px 0;
    background:
        radial-gradient(ellipse 80% 50% at 50% 0%, rgba(255, 255, 255, 0.45), transparent 55%),
        radial-gradient(ellipse 60% 40% at 0% 100%, rgba(196, 167, 125, 0.10), transparent 50%),
        var(--beige);
    text-align: center;
}

.gift-section__icon {
    width: 100px;
    height: 100px;
    margin: 0 auto 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.gift-section__icon svg {
    width: 50px;
    height: 50px;
    stroke: var(--accent-dark);
}

.gift-section__title {
    font-family: var(--font-heading);
    font-size: var(--text-h2);
    font-weight: 500;
    line-height: var(--leading-heading);
    color: var(--black);
    margin-bottom: 20px;
}

.gift-section__title em {
    font-style: italic;
    color: var(--accent-dark);
}

.gift-section__text {
    font-size: 18px;
    color: var(--gray);
    line-height: 1.7;
    max-width: 600px;
    margin: 0 auto 35px;
}

.gift-section__cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

@media (max-width: 768px) {
    .gift-section {
        padding: 60px 0;
    }

    .gift-section__icon {
        width: 80px;
        height: 80px;
    }

    .gift-section__icon svg {
        width: 40px;
        height: 40px;
    }

    .gift-section__text {
        font-size: var(--text-body);
        padding: 0 20px;
    }
}

/* ===== SERVICE CARDS GRID ===== */
.services-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
}

.service-card-link {
    display: block;
    text-decoration: none;
    color: inherit;
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-card);
    overflow: hidden;
    box-shadow: var(--glass-shadow);
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

.service-card-link:hover {
    transform: translateY(-8px);
    box-shadow: var(--glass-shadow-hover);
    border-color: rgba(255, 255, 255, 0.78);
}

.service-card-link__image {
    position: relative;
    aspect-ratio: 4/3;
    overflow: hidden;
}

.service-card-link__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.service-card-link:hover .service-card-link__image img {
    transform: scale(1.05);
}

.service-card-link__content {
    padding: 25px;
    background: rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.service-card-link__title {
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 500;
    color: var(--black);
    margin-bottom: 10px;
}

.service-card-link__text {
    font-size: 14px;
    color: var(--gray);
    line-height: 1.6;
    margin-bottom: 15px;
}

.service-card-link__arrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: var(--accent-dark);
    transition: gap 0.3s ease;
}

.service-card-link:hover .service-card-link__arrow {
    gap: 12px;
}

@media (max-width: 1200px) {
    .services-cards {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 992px) {
    .services-cards {
        grid-template-columns: repeat(2, 1fr);
    }
}

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

    .service-card-link__content {
        padding: 20px;
    }

    .service-card-link__title {
        font-size: 18px;
    }
}

/* ===== GENDER CARDS (Services Landing) ===== */
.gender-cards {
    display: grid;
    grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
    gap: var(--grid-gutter);
}

.gender-cards > .gender-card {
    grid-column: span 4;
}

.gender-card {
    display: block;
    text-decoration: none;
    color: inherit;
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-card);
    overflow: hidden;
    box-shadow: var(--glass-shadow);
    transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
}

.gender-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--glass-shadow-hover);
    border-color: rgba(255, 255, 255, 0.78);
}

.gender-card__image {
    position: relative;
    aspect-ratio: 4/3;
    overflow: hidden;
}

.gender-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.gender-card:hover .gender-card__image img {
    transform: scale(1.05);
}

.gender-card__content {
    padding: 35px;
    text-align: center;
    background: rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.gender-card__title {
    font-family: var(--font-heading);
    font-size: 28px;
    font-weight: 500;
    color: var(--black);
    margin-bottom: 15px;
}

.gender-card__text {
    font-size: 15px;
    color: var(--gray);
    line-height: 1.7;
    margin-bottom: 20px;
}

@media (max-width: 992px) {
    .gender-cards {
        grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
    }

    .gender-cards > .gender-card {
        grid-column: span 6;
    }
}

@media (max-width: 576px) {
    .gender-cards {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .gender-card__content {
        padding: 25px;
    }

    .gender-card__title {
        font-size: 22px;
    }
}

/* ===== TEEN SERVICES ===== */
.teen-services {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.teen-service {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-card);
    padding: 40px;
    box-shadow: var(--glass-shadow);
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

.teen-service:hover {
    transform: translateY(-5px);
    box-shadow: var(--glass-shadow-hover);
    border-color: rgba(255, 255, 255, 0.78);
}

.teen-service__title {
    font-family: var(--font-heading);
    font-size: 22px;
    font-weight: 500;
    color: var(--black);
    margin-bottom: 15px;
}

.teen-service__text {
    font-size: 15px;
    color: var(--gray);
    line-height: 1.7;
    margin-bottom: 25px;
}

.teen-service__meta {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.teen-service__duration {
    font-size: 14px;
    color: var(--gray);
}

.teen-service__price {
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 500;
    color: var(--accent-dark);
}

@media (max-width: 992px) {
    .teen-services {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .teen-services {
        grid-template-columns: 1fr;
    }

    .teen-service {
        padding: 30px;
    }
}

/* ===== PRICE NAVIGATION ===== */
.price-nav {
    background: var(--glass-bg-strong);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    padding: 20px 0;
    position: sticky;
    top: var(--header-offset, 92px);
    z-index: 50;
    border-bottom: 1px solid var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
}

#zeny,
#muzi,
#teenageri,
#women,
#men,
#teens {
    scroll-margin-top: calc(var(--header-offset, 92px) + var(--price-nav-height, 64px) + 16px);
}

.price-nav__links {
    display: flex;
    justify-content: center;
    gap: 30px;
}

.pricing-note {
    text-align: center;
    margin-top: 30px;
    padding: 20px;
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border: 1px solid var(--glass-border-subtle);
    border-radius: var(--radius-card);
    box-shadow: var(--glass-shadow);
}

.pricing-note p {
    color: var(--gray);
    font-size: 14px;
    font-style: italic;
}

@media (max-width: 576px) {
    .price-nav__links {
        flex-wrap: wrap;
        gap: 10px;
    }

    .price-nav__link {
        padding: 8px 18px;
        font-size: 14px;
    }
}

/* ===== BACK TO TOP BUTTON ===== */
.back-to-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--accent);
    color: white;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    z-index: 999;
}

.back-to-top.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.back-to-top:hover {
    background: var(--black);
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.25);
}

@media (max-width: 768px) {
    .back-to-top {
        bottom: 20px;
        right: 20px;
        width: 45px;
        height: 45px;
    }
}

/* ===== LIGHTBOX ===== */
.lightbox {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: var(--glass-blur-strong);
    -webkit-backdrop-filter: var(--glass-blur-strong);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.lightbox.active {
    opacity: 1;
    visibility: visible;
}

.lightbox__img {
    max-width: 90%;
    max-height: 90vh;
    object-fit: contain;
    border-radius: 4px;
    transform: scale(0.9);
    transition: transform 0.3s ease;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.3), 0 10px 30px rgba(0, 0, 0, 0.2);
}

.lightbox.active .lightbox__img {
    transform: scale(1);
}

.lightbox__close {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border: 1px solid var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
    color: var(--black);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.lightbox__close:hover {
    background: rgba(255, 255, 255, 0.72);
    transform: rotate(90deg);
}

.lightbox__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
    border: 1px solid var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
    color: var(--black);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.lightbox__nav:hover {
    background: rgba(255, 255, 255, 0.72);
}

.lightbox__nav--prev {
    left: 20px;
}

.lightbox__nav--next {
    right: 20px;
}

@media (max-width: 768px) {
    .lightbox__close {
        top: 15px;
        right: 15px;
        width: 40px;
        height: 40px;
    }

    .lightbox__nav {
        width: 40px;
        height: 40px;
    }

    .lightbox__nav--prev {
        left: 10px;
    }

    .lightbox__nav--next {
        right: 10px;
    }
}

/* ===== WHATSAPP BUTTON ===== */
.whatsapp-btn {
    position: fixed;
    bottom: 100px;
    right: 30px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #25D366;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px rgba(37, 211, 102, 0.4);
    transition: all 0.3s ease;
    z-index: 999;
    text-decoration: none;
}

.whatsapp-btn:hover {
    background: #20bd5a;
}

.whatsapp-btn:active {
    transform: translateY(var(--btn-press));
}

.whatsapp-btn svg {
    width: 28px;
    height: 28px;
}

@media (max-width: 768px) {
    .whatsapp-btn {
        bottom: 80px;
        right: 20px;
        width: 50px;
        height: 50px;
    }

    .whatsapp-btn svg {
        width: 24px;
        height: 24px;
    }
}

/* ===== COOKIE CONSENT (corner toast) ===== */
.cookie-consent {
    position: fixed;
    bottom: 24px;
    left: 24px;
    z-index: 998;
    width: min(340px, calc(100vw - 100px));
    background: var(--glass-bg-strong);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    color: var(--gray);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-card);
    box-shadow: var(--glass-shadow);
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: opacity 0.35s ease, transform 0.35s ease, visibility 0.35s;
    pointer-events: none;
}

.cookie-consent.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.cookie-consent__inner {
    position: relative;
    padding: 18px 18px 16px;
}

.cookie-consent__close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 20px;
    line-height: 1;
    color: var(--gray-light);
    background: transparent;
    transition: color 0.2s ease, background 0.2s ease;
}

.cookie-consent__close:hover {
    color: var(--black);
    background: var(--beige);
}

.cookie-consent__text {
    font-size: 13px;
    line-height: 1.55;
    color: var(--gray);
    padding-right: 24px;
    margin-bottom: 14px;
}

.cookie-consent__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.cookie-consent__btn {
    padding: 9px 18px;
    border-radius: 9999px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    border: 2px solid transparent;
    font-family: var(--font-body);
    transition: var(--btn-transition);
}

.cookie-consent__btn:active {
    transform: translateY(var(--btn-press));
}

.cookie-consent__btn--accept {
    background: var(--accent);
    color: var(--white);
    border-color: var(--accent);
}

.cookie-consent__btn--accept:hover {
    background: var(--accent-dark);
    border-color: var(--accent-dark);
}

.cookie-consent__btn--decline {
    background: var(--glass-bg-subtle);
    color: var(--gray);
    border-color: var(--glass-border-subtle);
    backdrop-filter: var(--glass-blur-soft);
    -webkit-backdrop-filter: var(--glass-blur-soft);
}

.cookie-consent__btn--decline:hover {
    border-color: var(--accent-dark);
    color: var(--accent-dark);
    background: rgba(255, 255, 255, 0.55);
}

@media (prefers-reduced-motion: reduce) {
    .header__cta:active,
    .cookie-consent__btn:active,
    .whatsapp-btn:active {
        transform: none;
    }
}

@media (max-width: 768px) {
    .cookie-consent {
        bottom: 16px;
        left: 16px;
        width: min(300px, calc(100vw - 88px));
    }
}

/* Fallback when backdrop-filter is unavailable */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    :is(
        .header.scrolled,
        .subnav,
        .price-nav,
        .pricing-card,
        .service-card-link,
        .gender-card,
        .treatment-card-large,
        .addon-box,
        .info-box,
        .intro-block,
        .teen-service,
        .cookie-consent,
        .nav.active,
        .video-card,
        .service-card,
        .reviews-summary,
        .reviews__card,
        .step-card,
        .product-line-card,
        .contact-map,
        .contact-form,
        .contact-info__tip,
        .booking-modal__content,
        .weekends-modal__content,
        .gift-section__icon,
        .gallery-grid--bento .gallery-item,
        .brand-intro__content,
        .feature-item,
        .footer,
        .lightbox
    ) {
        background: rgba(255, 255, 255, 0.94);
    }

    :is(.header.scrolled, .subnav, .price-nav, .footer) {
        background: var(--beige);
    }

    :is(.treatment-card-large__header, .addon-box__title, .product-line-card__content--full) {
        background: var(--beige);
    }

    :is(.product-gallery__item, .product-item) {
        background: var(--beige);
    }
}