/* =====================================================
   DARK MODE
===================================================== */

body.dark-mode {
    background: #15100f;
    color: #f7eeeb;
}


/* HEADER */

body.dark-mode .site-header.scrolled {
    background: rgba(15, 10, 9, 0.98);
}

body.dark-mode .mobile-menu {
    background: rgba(15, 10, 9, 0.99);
}


/* GENERAL */

body.dark-mode .welcome-section,
body.dark-mode .gallery-section,
body.dark-mode .seasonal-section {
    background: #15100f;
}

body.dark-mode .services-section,
body.dark-mode .pricing-section {
    background: #211817;
}


/* TEXT */

body.dark-mode .section-heading p,
body.dark-mode .section-intro p,
body.dark-mode .welcome-story > p,
body.dark-mode .seasonal-top p,
body.dark-mode .service-card-content p,
body.dark-mode .offer-info p {
    color: #d0c0bb;
}


/* WELCOME */

body.dark-mode .story-list div {
    border-color: #3b2b28;
}

body.dark-mode .story-list span {
    color: #f3e7e3;
}


/* SERVICES */

body.dark-mode .service-card {
    background: #211817;
    border-color: #493532;
    box-shadow: 0 18px 40px rgba(0,0,0,0.25);
}

body.dark-mode .service-card-content h3 {
    color: #ffffff;
}


/* OFFERS */

body.dark-mode .offer-card {
    background: #241a18;
}

body.dark-mode .featured-offer {
    background: #35231f;
}


/* PRICING */

body.dark-mode .price-card {
    background: #211817;
    border-color: #493532;
    color: #ffffff;
}

body.dark-mode .price-card ul li {
    color: #d3c2bd;
}

body.dark-mode .price-line {
    background: #463532;
}

body.dark-mode .price-card > a {
    color: #f0c5b5;
}


/* DROPDOWN */

body.dark-mode .dropdown-menu {
    background: #211817;
    border-color: #4b3732;
}

body.dark-mode .dropdown-menu a {
    color: #ffffff;
}

body.dark-mode .dropdown-menu a:hover {
    background: #382622;
}


/* CONTROLS */

body.dark-mode .round-control {
    background: rgba(255,255,255,0.1);
    color: #ffffff;
    border-color: rgba(255,255,255,0.35);
}


/* MOBILE */

body.dark-mode .mobile-submenu {
    background: #110d0c;
}


/* FOOTER */

body.dark-mode .site-footer {
    background: #0d0908;
}


/* BACK TO TOP */

body.dark-mode .back-to-top {
    background: #f1c4b3;
    color: #211817;
}
/* =========================================================
   HOME 2 DARK MODE ONLY
   ========================================================= */

body.home2-page.home2-dark {
    --h2-bg: #101010;
    --h2-white: #181818;
    --h2-dark: #f5f1eb;
    --h2-muted: #aaa39a;
    --h2-gold: #d0a36c;
    --h2-line: rgba(255,255,255,.12);
    --h2-soft: #1b1a18;
    background: #101010;
    color: #f5f1eb;
}

body.home2-page.home2-dark .home2-intro,
body.home2-page.home2-dark .home2-offers,
body.home2-page.home2-dark .home2-moments,
body.home2-page.home2-dark .home2-lookbook {
    background: #101010;
}

body.home2-page.home2-dark .home2-services {
    background: #181715;
}

body.home2-page.home2-dark .home2-service-card,
body.home2-page.home2-dark .home2-offer-card {
    background: #22211f;
    color: #f5f1eb;
    border-color: rgba(255,255,255,.1);
}

body.home2-page.home2-dark .home2-service-content p,
body.home2-page.home2-dark .home2-offer-body p,
body.home2-page.home2-dark .home2-intro-text > p,
body.home2-page.home2-dark .home2-moments-content > p,
body.home2-page.home2-dark .home2-section-heading p,
body.home2-page.home2-dark .home2-offer-intro p {
    color: #aaa39a;
}

body.home2-page.home2-dark .home2-service-content a,
body.home2-page.home2-dark .home2-lookbook-heading > a {
    color: #f5f1eb;
}

body.home2-page.home2-dark .home2-image-stamp {
    background: #22211f;
    color: #fff;
}

body.home2-page.home2-dark .home2-price-card {
    background: #22211f;
}

body.home2-page.home2-dark .home2-final {
    border-top: 1px solid rgba(255,255,255,.08);
}

body.home2-page.home2-dark .home2-nav {
    background: #171615;
}
/* =========================================
   ABOUT PAGE DARK MODE
========================================= */

body.dark-mode .about-hero::before {
    background: rgba(220, 160, 140, .08);
}

body.dark-mode .hero-floating-card,
body.dark-mode .image-badge,
body.dark-mode .cta-floating {
    background: rgba(30,30,30,.95);
    color: #fff;
}

body.dark-mode .hero-floating-card > span {
    background: #fff;
    color: #171717;
}

body.dark-mode .story-year {
    background: #fff;
    color: #171717;
}

body.dark-mode .mission-card {
    border-color: rgba(255,255,255,.12);
}

body.dark-mode .mission-card:hover {
    box-shadow: 0 25px 55px rgba(0,0,0,.4);
}

body.dark-mode .philosophy-points div {
    background: rgba(255,255,255,.06);
}

body.dark-mode .team-social a {
    background: #222;
    color: #fff;
}

body.dark-mode .cta-button {
    background: #fff;
    color: #171717;
}

body.dark-mode .timeline-item {
    border-color: rgba(255,255,255,.12);
}

body.dark-mode .eyebrow {
    color: #fff;
}

body.dark-mode .experience-overlay {
    background: linear-gradient(
        transparent,
        rgba(0,0,0,.95)
    );
}
/* =====================================================
   STYLIST PAGE - DARK MODE
   Add at bottom of darkmode.css
   ===================================================== */

body.dark-mode .stylist-page .stylist-hero,
body.dark-mode .stylist-page .stylist-intro,
body.dark-mode .stylist-page .specialities-section,
body.dark-mode .stylist-page .stylist-testimonials {
    background: #151110;
    color: #fff;
}

body.dark-mode .stylist-page .team-section,
body.dark-mode .stylist-page .lookbook-section {
    background: #211a18;
    color: #fff;
}

body.dark-mode .stylist-page .stylist-card,
body.dark-mode .stylist-page .testimonial-card {
    background: #241c1a;
    color: #fff;
    border-color: rgba(255,255,255,.12);
}

body.dark-mode .stylist-page .featured-testimonial {
    background: #2c211e;
}

body.dark-mode .stylist-page .stylist-hero-content h1,
body.dark-mode .stylist-page .intro-title h2,
body.dark-mode .stylist-page .section-heading h2,
body.dark-mode .stylist-page .featured-content h2,
body.dark-mode .stylist-page .speciality-content h3,
body.dark-mode .stylist-page .lookbook-top h2,
body.dark-mode .stylist-page .testimonial-heading h2,
body.dark-mode .stylist-page .cta-content h2,
body.dark-mode .stylist-page .stylist-info h3 {
    color: #fff;
}

body.dark-mode .stylist-page .stylist-hero-content p,
body.dark-mode .stylist-page .intro-text p,
body.dark-mode .stylist-page .section-heading p,
body.dark-mode .stylist-page .speciality-content p,
body.dark-mode .stylist-page .lookbook-top p,
body.dark-mode .stylist-page .stylist-info p,
body.dark-mode .stylist-page .cta-content p {
    color: rgba(255,255,255,.78);
}

body.dark-mode .stylist-page .speciality-item {
    border-color: rgba(255,255,255,.12);
}

body.dark-mode .stylist-page .speciality-item:hover {
    background: #2a211f;
}

body.dark-mode .stylist-page .intro-side span {
    border-color: rgba(255,255,255,.3);
}

body.dark-mode .stylist-page .stylist-tag {
    background: rgba(20,15,13,.9);
    color: #fff;
}

body.dark-mode .stylist-page .stylist-btn,
body.dark-mode .stylist-page .primary-btn {
    background: #fff;
    color: #171211 !important;
}

body.dark-mode .stylist-page .outline-btn {
    color: #fff;
    border-color: rgba(255,255,255,.7);
}

body.dark-mode .stylist-page .outline-btn:hover {
    background: #fff;
    color: #171211;
}

body.dark-mode .stylist-page .cta-content {
    background: #2a211f;
    color: #fff;
}

@media (max-width:700px) {

    body.dark-mode .stylist-page .stylist-hero-content {
        background: #151110;
    }

    body.dark-mode .stylist-page .featured-content {
        background: #151110;
    }

}
/* =========================================================
   PRICING DARK MODE
========================================================= */

body.dark-mode.pricing-page,
html.dark-mode .pricing-page {
    --p-bg: #181415;
    --p-soft: #241c1e;
    --p-card: #211a1b;
    --p-text: #f8eeee;
    --p-muted: #c4b3b3;
    --p-accent: #df9da0;
    --p-accent-dark: #c47d82;
    --p-line: rgba(255,255,255,.13);
    --p-shadow: 0 20px 55px rgba(0,0,0,.35);
}

body.dark-mode.pricing-page .pricing-hero,
html.dark-mode .pricing-page .pricing-hero {
    background:
        radial-gradient(circle at 80% 20%, rgba(180,100,105,.16), transparent 30%),
        var(--p-bg);
}

body.dark-mode.pricing-page .primary-btn,
html.dark-mode .pricing-page .primary-btn {
    background: #f5e9e8;
    color: #241a1b;
}

body.dark-mode.pricing-page .outline-btn,
html.dark-mode .pricing-page .outline-btn {
    border-color: var(--p-text);
    color: var(--p-text);
}

body.dark-mode.pricing-page .outline-btn:hover,
html.dark-mode .pricing-page .outline-btn:hover {
    background: var(--p-text);
    color: #21191a;
}

body.dark-mode.pricing-page .package-btn,
html.dark-mode .pricing-page .package-btn {
    background: #302527;
    color: #f8eeee;
}

body.dark-mode.pricing-page .package-btn:hover,
html.dark-mode .pricing-page .package-btn:hover {
    background: var(--p-accent);
    color: #fff;
}

body.dark-mode.pricing-page .membership-section,
html.dark-mode .pricing-page .membership-section {
    background: #0f0c0d;
}

body.dark-mode.pricing-page .membership-copy .primary-btn,
html.dark-mode .pricing-page .membership-copy .primary-btn {
    background: #f5e9e8;
    color: #21191a;
}

body.dark-mode.pricing-page .pricing-cta,
html.dark-mode .pricing-page .pricing-cta {
    background: var(--p-bg);
}

body.dark-mode.pricing-page .floating-price-card,
html.dark-mode .pricing-page .floating-price-card,
body.dark-mode.pricing-page .image-note,
html.dark-mode .pricing-page .image-note {
    background: var(--p-card);
    color: var(--p-text);
}

body.dark-mode.pricing-page .offer-sticker,
html.dark-mode .pricing-page .offer-sticker {
    background: #f5e9e8;
    color: #21191a;
}
/* =========================================================
   GALLERY DARK MODE
========================================================= */

body.dark-mode .gallery-page,
body.dark .gallery-page,
[data-theme="dark"] .gallery-page {
    background: #11100f;
    color: #f4f1ee;
}

body.dark-mode .gallery-detail-section,
body.dark .gallery-detail-section,
[data-theme="dark"] .gallery-detail-section {
    background: #1c1a18;
}

body.dark-mode .client-gallery,
body.dark .client-gallery,
[data-theme="dark"] .client-gallery {
    background: #181615;
}

body.dark-mode .gallery-heading > span,
body.dark .gallery-heading > span,
[data-theme="dark"] .gallery-heading > span {
    color: #ddd5cf;
}

body.dark-mode .detail-numbers span,
body.dark .detail-numbers span,
[data-theme="dark"] .detail-numbers span {
    color: #cfc7c1;
}

body.dark-mode .gallery-button,
body.dark .gallery-button,
[data-theme="dark"] .gallery-button {
    background: #f5f2ef;
    color: #111;
}

body.dark-mode .gallery-lightbox,
body.dark .gallery-lightbox,
[data-theme="dark"] .gallery-lightbox {
    background: rgba(0,0,0,.97);
}
/* =========================================================
   CONTACT PAGE - DARK MODE
   Add at the END of dark-mode.css
   ========================================================= */

body.dark-mode .contact-page {
    --contact-dark: #f7f2eb;
    --contact-soft: #171412;
    --contact-cream: #211d19;
    --contact-gold: #d2ad69;
    --contact-brown: #c2b4a5;
    --contact-border: rgba(255, 255, 255, 0.12);

    background: #11100f;
    color: #f7f2eb;
}

/* ---------- COMMON TEXT ---------- */

body.dark-mode .contact-page .contact-section-heading p,
body.dark-mode .contact-page .contact-form-area > p,
body.dark-mode .contact-page .contact-visit-content > p {
    color: #bdb4aa;
}

/* ---------- HERO ---------- */

body.dark-mode .contact-page .contact-hero {
    background:
        radial-gradient(
            circle at 10% 20%,
            rgba(210, 173, 105, 0.12),
            transparent 30%
        ),
        linear-gradient(135deg, #171412, #211c17);
}

body.dark-mode .contact-page .contact-hero-content > p {
    color: #c4bbb1;
}

body.dark-mode .contact-page .contact-btn.primary {
    background: #f4eee5;
    color: #171412;
}

body.dark-mode .contact-page .contact-btn.secondary {
    border-color: #d2ad69;
    color: #f4eee5;
}

body.dark-mode .contact-page .contact-btn.secondary:hover {
    background: #d2ad69;
    color: #171412;
}

/* ---------- FLOATING NOTE ---------- */

body.dark-mode .contact-page .floating-contact-note {
    background: rgba(30, 27, 24, 0.95);
    color: #f7f2eb;
    border: 1px solid rgba(210, 173, 105, 0.18);
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.4);
}

body.dark-mode .contact-page .floating-contact-note small {
    color: #aaa198;
}

/* ---------- QUICK CONTACT ---------- */

body.dark-mode .contact-page .contact-quick-section {
    background: #11100f;
}

body.dark-mode .contact-page .contact-info-card {
    background: #1b1815;
    border-color: rgba(210, 173, 105, 0.16);
}

body.dark-mode .contact-page .contact-info-card h3 {
    color: #f7f2eb;
}

body.dark-mode .contact-page .contact-info-card p {
    color: #aaa198;
}

body.dark-mode .contact-page .contact-icon {
    background: #d2ad69;
    color: #171412;
}

/* ---------- ENQUIRY ---------- */

body.dark-mode .contact-page .contact-enquiry-section {
    background: #171412;
}

body.dark-mode .contact-page .contact-form-area h2 {
    color: #f7f2eb;
}

body.dark-mode .contact-page .contact-field label {
    color: #eee7df;
}

body.dark-mode .contact-page .contact-field input,
body.dark-mode .contact-page .contact-field select,
body.dark-mode .contact-page .contact-field textarea {
    background: #211d19;
    border-color: #40382f;
    color: #f7f2eb;
}

body.dark-mode .contact-page .contact-field input::placeholder,
body.dark-mode .contact-page .contact-field textarea::placeholder {
    color: #857c73;
}

body.dark-mode .contact-page .contact-field input:focus,
body.dark-mode .contact-page .contact-field select:focus,
body.dark-mode .contact-page .contact-field textarea:focus {
    border-color: #d2ad69;
    box-shadow: 0 0 0 3px rgba(210, 173, 105, 0.1);
}

body.dark-mode .contact-page .contact-submit-btn {
    background: #f4eee5;
    color: #171412;
}

/* ---------- IMAGE CAPTION ---------- */

body.dark-mode .contact-page .image-caption {
    background: rgba(17, 16, 15, 0.92);
    border: 1px solid rgba(210, 173, 105, 0.15);
}

/* ---------- VISIT SECTION ---------- */

body.dark-mode .contact-page .contact-visit-section {
    background: #11100f;
}

body.dark-mode .contact-page .visit-details > div {
    border-color: rgba(255, 255, 255, 0.12);
}

body.dark-mode .contact-page .visit-details strong {
    color: #eee7df;
}

body.dark-mode .contact-page .visit-badge {
    background: #211d19;
    color: #f7f2eb;
    border: 1px solid rgba(210, 173, 105, 0.15);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
}

/* ---------- MAP ---------- */

body.dark-mode .contact-page .contact-map-section {
    background: #171412;
}

body.dark-mode .contact-page .map-placeholder {
    background:
        linear-gradient(
            25deg,
            transparent 48%,
            rgba(255,255,255,0.08) 49%,
            transparent 51%
        ),
        linear-gradient(
            145deg,
            transparent 45%,
            rgba(255,255,255,0.08) 46%,
            transparent 48%
        ),
        #29241f;
}

body.dark-mode .contact-page .map-grid {
    opacity: 0.35;
    background-image:
        linear-gradient(
            rgba(210,173,105,0.12) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(210,173,105,0.12) 1px,
            transparent 1px
        );
}

body.dark-mode .contact-page .map-pin {
    background: #d2ad69;
}

body.dark-mode .contact-page .map-pin span {
    color: #171412;
}

body.dark-mode .contact-page .map-location-card {
    background: rgba(30, 27, 24, 0.96);
    color: #f7f2eb;
    border: 1px solid rgba(210, 173, 105, 0.18);
}

body.dark-mode .contact-page .map-location-card span {
    color: #aaa198;
}

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

body.dark-mode .contact-page .contact-faq-section {
    background: #11100f;
}

body.dark-mode .contact-page .contact-faq-list details {
    border-color: rgba(255,255,255,0.12);
}

body.dark-mode .contact-page .contact-faq-list summary {
    color: #f7f2eb;
}

body.dark-mode .contact-page .contact-faq-list summary span {
    border-color: #51483e;
    color: #d2ad69;
}

body.dark-mode .contact-page .contact-faq-list details[open] summary span {
    background: #d2ad69;
    color: #171412;
}

body.dark-mode .contact-page .contact-faq-list details p {
    color: #aaa198;
}

/* ---------- FINAL CTA ---------- */

body.dark-mode .contact-page .contact-final-section {
    background:
        radial-gradient(
            circle at 20% 50%,
            rgba(210,173,105,0.16),
            transparent 28%
        ),
        radial-gradient(
            circle at 80% 40%,
            rgba(210,173,105,0.11),
            transparent 28%
        ),
        #090908;
}

body.dark-mode .contact-page .contact-final-content h2 {
    color: #f7f2eb;
}

body.dark-mode .contact-page .contact-final-content p {
    color: #aaa198;
}

body.dark-mode .contact-page .contact-final-btn {
    background: #f4eee5;
    color: #171412;
}

/* ---------- MOBILE DARK MODE ---------- */

@media (max-width: 700px) {

    body.dark-mode .contact-page .floating-contact-note {
        background: rgba(30, 27, 24, 0.97);
    }

    body.dark-mode .contact-page .contact-info-card {
        background: #1b1815;
    }

    body.dark-mode .contact-page .contact-field input,
    body.dark-mode .contact-page .contact-field select,
    body.dark-mode .contact-page .contact-field textarea {
        background: #211d19;
    }

    body.dark-mode .contact-page .map-location-card {
        background: rgba(30, 27, 24, 0.97);
    }
}
/* =========================================================
   LOGIN PAGE - DARK MODE
   ========================================================= */

body.dark-mode .login-page {
    background:
        radial-gradient(
            circle at 10% 20%,
            rgba(210,173,105,0.10),
            transparent 28%
        ),
        radial-gradient(
            circle at 90% 80%,
            rgba(210,173,105,0.08),
            transparent 30%
        ),
        #0f0e0d;

    color: #f5eee6;
}

body.dark-mode .login-controls button {
    background: #211d19;
    border-color: #4a4035;
    color: #f5eee6;
}

body.dark-mode .login-controls button:hover {
    background: #d2ad69;
    color: #171412;
}

body.dark-mode .login-box {
    background: rgba(29,26,23,0.96);
    border-color: rgba(210,173,105,0.2);

    box-shadow:
        0 30px 80px rgba(0,0,0,0.5);
}

body.dark-mode .login-brand strong {
    color: #f5eee6;
}

body.dark-mode .login-heading h1 {
    color: #f5eee6;
}

body.dark-mode .login-heading p {
    color: #aaa198;
}

body.dark-mode .login-field label {
    color: #eee7df;
}

body.dark-mode .login-field input {
    background: #211d19;
    border-color: #40382f;
    color: #f5eee6;
}

body.dark-mode .login-field input::placeholder {
    color: #81786f;
}

body.dark-mode .login-field input:focus {
    border-color: #d2ad69;
}

body.dark-mode .remember-option {
    color: #aaa198;
}

body.dark-mode .login-submit {
    background: #f4eee5;
    color: #171412;
}

body.dark-mode .login-submit:hover {
    background: #d2ad69;
}

body.dark-mode .login-switch {
    border-color: #3d352d;
    color: #aaa198;
}

body.dark-mode .login-decoration {
    color: rgba(210,173,105,0.35);
}
body.dark-mode .back-home {
    color: #d2ad69;
}

body.dark-mode .back-home:hover {
    color: #f5eee6;
}
/* =========================================================
   SKIN PAGE - DARK MODE
   ========================================================= */

body.dark-mode .skin-page {

    --skin-dark: #f4eee7;
    --skin-cream: #11100f;
    --skin-soft: #211d19;
    --skin-gold: #d2ad69;
    --skin-text: #f5eee7;
    --skin-muted: #b4aaa1;

    background: #11100f;
    color: #f5eee7;
}


body.dark-mode .skin-hero {
    background: #1c1815;
}

body.dark-mode .skin-hero-content p,
body.dark-mode .skin-section-head > p,
body.dark-mode .skin-intro > p,
body.dark-mode .skin-concern-content > p,
body.dark-mode .skin-experience-content p {
    color: #aaa198;
}


body.dark-mode .skin-btn-dark {
    background: #f4eee7;
    color: #171412;
}

body.dark-mode .skin-btn-dark:hover {
    background: #d2ad69;
    color: #171412;
}


body.dark-mode .skin-btn-line {
    border-color: #66594b;
    color: #f4eee7;
}

body.dark-mode .skin-btn-line:hover {
    background: #d2ad69;
    border-color: #d2ad69;
    color: #171412;
}


body.dark-mode .skin-intro,
body.dark-mode .skin-treatments,
body.dark-mode .skin-ritual {
    background: #11100f;
}


body.dark-mode .skin-intro {
    border-color: #302a25;
}


body.dark-mode .skin-treatment-card {
    background: #1b1815;
    border-color: #39322b;
}

body.dark-mode .skin-treatment-bottom {
    border-color: #39322b;
}


body.dark-mode .skin-concerns {
    background: #211d19;
}


body.dark-mode .skin-concern-list div {
    background: #29231e;
}

body.dark-mode .skin-concern-list div:hover {
    background: #322b24;
}


body.dark-mode .skin-ritual-track {
    border-color: #39322b;
}

body.dark-mode .skin-ritual-step {
    border-color: #39322b;
}

body.dark-mode .skin-ritual-step:hover {
    background: #211d19;
}


body.dark-mode .skin-testimonials {
    background: #1a1714;
}

body.dark-mode .skin-testimonial-card {
    background: #211d19;
    border-color: #39322b;
}

body.dark-mode .skin-testimonial-dark {
    background: #090908;
}


body.dark-mode .skin-consultation {
    background:
        linear-gradient(
            115deg,
            #705735,
            #4c3b25
        );
}


body.dark-mode .skin-consultation-mini {
    border-color: rgba(255,255,255,0.2);
}


@media (max-width: 700px) {

    body.dark-mode .skin-hero {
        background: #1c1815;
    }

    body.dark-mode .skin-floating-label {
        background: #090908;
    }
}
/* =========================================================
   HAIR PAGE - DARK MODE
   ========================================================= */

body.dark-mode .hair-page .hair-service-card,
body.dark-mode .hair-page .pick-card {
    background: #181818;
    color: #fff;
    border-color: rgba(255,255,255,.12);
}

body.dark-mode .hair-page .service-content p,
body.dark-mode .hair-page .pick-info p,
body.dark-mode .hair-page .hair-section-heading p,
body.dark-mode .hair-page .colour-heading p,
body.dark-mode .hair-page .treatment-content > p,
body.dark-mode .hair-page .care-content > p {
    color: rgba(255,255,255,.72);
}

body.dark-mode .hair-page .service-content span,
body.dark-mode .hair-page .hair-section-heading > span,
body.dark-mode .hair-page .colour-heading > span,
body.dark-mode .hair-page .treatment-content > span,
body.dark-mode .hair-page .care-content > span,
body.dark-mode .hair-page .pick-info span {
    color: #fff;
}

body.dark-mode .hair-page .service-number {
    background: #181818;
    color: #fff;
}

body.dark-mode .hair-page .treatment-list div,
body.dark-mode .hair-page .care-points div,
body.dark-mode .hair-page .pick-card {
    border-color: rgba(255,255,255,.14);
}

body.dark-mode .hair-page .hair-outline-btn {
    color: #fff;
}

body.dark-mode .hair-page .hair-outline-btn:hover {
    background: #fff;
    color: #111;
}

body.dark-mode .hair-page .hair-btn,
body.dark-mode .hair-page .hair-book-btn {
    background: #fff;
    color: #111;
}

body.dark-mode .hair-page .hair-link {
    color: #fff;
}

body.dark-mode .hair-page .hair-link::after {
    background: #fff;
}
/* =========================================================
   NAILS PAGE - DARK MODE
   ========================================================= */

body.dark-mode .nails-page .nail-service-feature {
    background: #181818;
    color: #fff;
}

body.dark-mode .nails-page .nail-mini-card,
body.dark-mode .nails-page .nail-colour-card,
body.dark-mode .nails-page .nail-style-card,
body.dark-mode .nails-page .nail-experience-section {
    background: #181818;
    color: #fff;
    border-color: rgba(255,255,255,.12);
}

body.dark-mode .nails-page .nail-heading p,
body.dark-mode .nails-page .nail-feature-content p,
body.dark-mode .nails-page .nail-mini-card p,
body.dark-mode .nails-page .nail-colour-card p,
body.dark-mode .nails-page .nail-care-content > p,
body.dark-mode .nails-page .nail-style-card p,
body.dark-mode .nails-page .experience-content p {
    color: rgba(255,255,255,.72);
}

body.dark-mode .nails-page .nail-care-list div {
    border-color: rgba(255,255,255,.14);
}

body.dark-mode .nails-page .nail-primary-btn,
body.dark-mode .nails-page .nails-primary-btn,
body.dark-mode .nails-page .nail-book-btn {
    background: #fff;
    color: #111;
}

body.dark-mode .nails-page .nail-mini-card:hover,
body.dark-mode .nails-page .nail-colour-card:hover,
body.dark-mode .nails-page .nail-style-card:hover {
    box-shadow: 0 20px 40px rgba(0,0,0,.4);
}
/* =========================================================
   COMING SOON - DARK MODE
   ========================================================= */

body.dark-mode .coming-page .cs-countdown-section {
    border-color: rgba(255,255,255,.12);
}

body.dark-mode .coming-page .cs-service {
    border-color: rgba(255,255,255,.12);
    background: #181818;
}

body.dark-mode .coming-page .cs-service:hover {
    box-shadow: 0 20px 40px rgba(0,0,0,.4);
}

body.dark-mode .coming-page .cs-feature-list div {
    border-color: rgba(255,255,255,.13);
}

body.dark-mode .coming-page .cs-form input {
    border-color: rgba(255,255,255,.2);
}

body.dark-mode .coming-page .cs-form button {
    background: #fff;
    color: #111;
}

body.dark-mode .coming-page .cs-intro-number {
    opacity: .1;
}
/* =========================================================
   404 DARK MODE
   ========================================================= */

body.dark-mode .error-page .error-primary {
    background: #fff;
    color: #111;
}

body.dark-mode .error-page .error-secondary {
    color: #fff;
    border-color: rgba(255,255,255,.35);
}

body.dark-mode .error-page .error-image {
    box-shadow: 0 25px 60px rgba(0,0,0,.5);
}
/* =====================================================
   ABOUT PAGE - DARK MODE FIX
===================================================== */

/* Main About sections */
body.dark-mode .about-story,
body.dark-mode .mission-section,
body.dark-mode .beauty-philosophy,
body.dark-mode .experience-section,
body.dark-mode .team-section,
body.dark-mode .testimonial-section,
body.dark-mode .about-cta {
    background: #171312;
    color: #f8f3ef;
}

/* Story / section headings */
body.dark-mode .about-story .section-heading,
body.dark-mode .experience-section .section-heading,
body.dark-mode .team-section .section-heading,
body.dark-mode .mission-intro,
body.dark-mode .philosophy-content,
body.dark-mode .cta-content {
    color: #f8f3ef;
}

body.dark-mode .about-story .section-heading h2,
body.dark-mode .experience-section .section-heading h2,
body.dark-mode .team-section .section-heading h2,
body.dark-mode .mission-intro h2,
body.dark-mode .philosophy-content h2,
body.dark-mode .cta-content h2 {
    color: #ffffff;
}

body.dark-mode .about-story .section-heading p,
body.dark-mode .experience-section .section-heading p,
body.dark-mode .team-section .section-heading p,
body.dark-mode .mission-intro p,
body.dark-mode .philosophy-content p,
body.dark-mode .cta-content p {
    color: rgba(255,255,255,.72);
}

/* "Our Story" timeline */
body.dark-mode .timeline-item {
    color: #f8f3ef;
    border-color: rgba(255,255,255,.12);
}

body.dark-mode .timeline-item h3 {
    color: #ffffff;
}

body.dark-mode .timeline-item p {
    color: rgba(255,255,255,.68);
}

body.dark-mode .timeline-item > span {
    color: #e6b8a5;
}

/* Mission cards */
body.dark-mode .mission-card {
    background: #211b19;
    color: #ffffff;
    border-color: rgba(255,255,255,.12);
}

body.dark-mode .mission-card h3 {
    color: #ffffff;
}

body.dark-mode .mission-card p {
    color: rgba(255,255,255,.68);
}

body.dark-mode .mission-number {
    color: #ffffff;
}

body.dark-mode .mission-icon {
    color: #e6b8a5;
}

/* Philosophy points */
body.dark-mode .philosophy-points div {
    color: #ffffff;
    border-color: rgba(255,255,255,.12);
}

body.dark-mode .philosophy-points strong {
    color: #ffffff;
}

body.dark-mode .philosophy-points span {
    color: #e6b8a5;
}

/* Experience heading */
body.dark-mode .experience-overlay {
    color: #ffffff;
}

/* Team section */
body.dark-mode .team-section {
    background: #211b19;
}

body.dark-mode .team-info {
    color: #ffffff;
}

body.dark-mode .team-info h3 {
    color: #ffffff;
}

body.dark-mode .team-info p {
    color: rgba(255,255,255,.65);
}

body.dark-mode .team-info span {
    color: rgba(255,255,255,.55);
}

/* Testimonial */
body.dark-mode .testimonial-inner {
    color: #ffffff;
}

body.dark-mode .testimonial-inner blockquote {
    color: #ffffff;
}

body.dark-mode .testimonial-person strong {
    color: #ffffff;
}

body.dark-mode .testimonial-person span {
    color: rgba(255,255,255,.62);
}

body.dark-mode .quote-mark {
    color: #ffffff;
}

/* About CTA */
body.dark-mode .about-cta {
    background: #171312;
}

body.dark-mode .cta-content h2,
body.dark-mode .cta-content p,
body.dark-mode .cta-content .eyebrow {
    color: #ffffff;
}

/* Eyebrows */
body.dark-mode .about-story .eyebrow,
body.dark-mode .mission-section .eyebrow,
body.dark-mode .beauty-philosophy .eyebrow,
body.dark-mode .experience-section .eyebrow,
body.dark-mode .team-section .eyebrow,
body.dark-mode .testimonial-section .eyebrow,
body.dark-mode .about-cta .eyebrow {
    color: #e6b8a5;
}

/* Story year badge */
body.dark-mode .story-year {
    background: #211b19;
    color: #ffffff;
}

/* Image badge */
body.dark-mode .image-badge {
    background: rgba(33,27,25,.94);
    color: #ffffff;
}

/* Floating card */
body.dark-mode .hero-floating-card {
    background: rgba(33,27,25,.95);
    color: #ffffff;
}

body.dark-mode .hero-floating-card small {
    color: rgba(255,255,255,.65);
}
/* =====================================================
   STYLIST PAGE - DARK MODE FIX
===================================================== */

/* Main stylist page sections */
body.dark-mode .stylist-page {
    background: #171312;
    color: #f8f3ef;
}

body.dark-mode .stylist-page .stylist-hero,
body.dark-mode .stylist-page .stylist-intro,
body.dark-mode .stylist-page .specialities-section,
body.dark-mode .stylist-page .stylist-testimonials,
body.dark-mode .stylist-page .stylist-cta {
    background: #171312;
    color: #f8f3ef;
}

/* Hero */
body.dark-mode .stylist-page .stylist-hero-content,
body.dark-mode .stylist-page .stylist-hero-content h1,
body.dark-mode .stylist-page .stylist-hero-content p {
    color: #ffffff;
}

body.dark-mode .stylist-page .hero-mini-stats strong,
body.dark-mode .stylist-page .hero-mini-stats span {
    color: #ffffff;
}

/* Intro section */
body.dark-mode .stylist-page .stylist-intro {
    color: #ffffff;
}

body.dark-mode .stylist-page .intro-side,
body.dark-mode .stylist-page .intro-title,
body.dark-mode .stylist-page .intro-title h2,
body.dark-mode .stylist-page .intro-title p {
    color: #ffffff;
}

body.dark-mode .stylist-page .intro-title p {
    opacity: .72;
}

/* Section headings */
body.dark-mode .stylist-page .section-heading,
body.dark-mode .stylist-page .section-heading h2,
body.dark-mode .stylist-page .section-heading p,
body.dark-mode .stylist-page .lookbook-top,
body.dark-mode .stylist-page .lookbook-top h2,
body.dark-mode .stylist-page .lookbook-top p {
    color: #ffffff;
}

body.dark-mode .stylist-page .section-heading p,
body.dark-mode .stylist-page .lookbook-top p {
    opacity: .7;
}

/* Stylist cards */
body.dark-mode .stylist-page .stylist-card {
    background: #211b19;
    color: #ffffff;
    box-shadow: 0 8px 25px rgba(0,0,0,.25);
}

body.dark-mode .stylist-page .stylist-info {
    background: #211b19;
    color: #ffffff;
}

body.dark-mode .stylist-page .stylist-info > span {
    color: rgba(255,255,255,.58);
}

body.dark-mode .stylist-page .stylist-info h3 {
    color: #ffffff;
}

body.dark-mode .stylist-page .stylist-info p {
    color: rgba(255,255,255,.68);
}

body.dark-mode .stylist-page .stylist-info a {
    color: #e6b8a5;
}

/* Image tags */
body.dark-mode .stylist-page .stylist-tag {
    background: rgba(30,24,22,.92);
    color: #ffffff;
}

/* Featured stylist */
body.dark-mode .stylist-page .featured-stylist {
    background: #211b19;
    color: #ffffff;
}

body.dark-mode .stylist-page .featured-content,
body.dark-mode .stylist-page .featured-content h2,
body.dark-mode .stylist-page .featured-content p {
    color: #ffffff;
}

body.dark-mode .stylist-page .featured-content p {
    opacity: .78;
}

body.dark-mode .stylist-page .experience-row strong {
    color: #ffffff;
}

body.dark-mode .stylist-page .experience-row span {
    color: rgba(255,255,255,.55);
}

/* Specialities */
body.dark-mode .stylist-page .specialities-section {
    background: #171312;
    color: #ffffff;
}

body.dark-mode .stylist-page .speciality-item {
    color: #ffffff;
    border-color: rgba(255,255,255,.14);
}

body.dark-mode .stylist-page .speciality-content h3 {
    color: #ffffff;
}

body.dark-mode .stylist-page .speciality-content p {
    color: rgba(255,255,255,.68);
}

body.dark-mode .stylist-page .speciality-number {
    color: #e6b8a5;
}

/* Lookbook */
body.dark-mode .stylist-page .lookbook-section,
body.dark-mode .stylist-page .lookbook-top {
    background: #171312;
    color: #ffffff;
}

body.dark-mode .stylist-page .lookbook-top h2 {
    color: #ffffff;
}

body.dark-mode .stylist-page .lookbook-top p {
    color: rgba(255,255,255,.68);
}

/* Testimonials */
body.dark-mode .stylist-page .stylist-testimonials {
    background: #171312;
    color: #ffffff;
}

body.dark-mode .stylist-page .testimonial-heading h2 {
    color: #ffffff;
}

body.dark-mode .stylist-page .testimonial-card {
    background: #211b19;
    color: #ffffff;
    border-color: rgba(255,255,255,.12);
}

body.dark-mode .stylist-page .testimonial-card p {
    color: #ffffff;
}

body.dark-mode .stylist-page .featured-testimonial {
    background: #2a211e;
}

body.dark-mode .stylist-page .client-info strong {
    color: #ffffff;
}

body.dark-mode .stylist-page .client-info span {
    color: rgba(255,255,255,.6);
}

/* CTA */
body.dark-mode .stylist-page .stylist-cta {
    background: #211b19;
    color: #ffffff;
}

body.dark-mode .stylist-page .cta-content,
body.dark-mode .stylist-page .cta-content h2,
body.dark-mode .stylist-page .cta-content p {
    color: #ffffff;
}

body.dark-mode .stylist-page .cta-content p {
    opacity: .75;
}

body.dark-mode .stylist-page .cta-content .eyebrow {
    color: #e6b8a5;
}
/* =====================================================
   STYLIST CARDS - FINAL DARK MODE FIX
===================================================== */

body.dark-mode .stylist-page .stylist-card {
    background: #241b19 !important;
    color: #ffffff !important;
}

body.dark-mode .stylist-page .stylist-info {
    background: #241b19 !important;
    color: #ffffff !important;
}

body.dark-mode .stylist-page .stylist-info > span {
    color: #d8c7c0 !important;
    opacity: 1 !important;
}

body.dark-mode .stylist-page .stylist-info h3 {
    color: #ffffff !important;
}

body.dark-mode .stylist-page .stylist-info p {
    color: #ddd1cb !important;
    opacity: 1 !important;
}

body.dark-mode .stylist-page .stylist-info a {
    color: #e6b8a5 !important;
}

body.dark-mode .stylist-page .stylist-tag {
    background: #241b19 !important;
    color: #ffffff !important;
    border: 1px solid rgba(255,255,255,.18);
}

/* Section around the cards */
body.dark-mode .stylist-page .team-section {
    background: #171312 !important;
    color: #ffffff !important;
}

body.dark-mode .stylist-page .section-heading h2,
body.dark-mode .stylist-page .section-heading p {
    color: #ffffff !important;
}

body.dark-mode .stylist-page .section-heading p {
    opacity: .72 !important;
}
/* =====================================================
   STYLIST PAGE - FINAL DARK MODE FIX
===================================================== */

/* ---------- WHOLE PAGE ---------- */

body.dark-mode .stylist-page {
    background: #171312 !important;
    color: #ffffff !important;
}

/* ---------- HERO / INTRO ---------- */

body.dark-mode .stylist-hero,
body.dark-mode .stylist-intro {
    background: #171312 !important;
    color: #ffffff !important;
}

body.dark-mode .stylist-hero-content,
body.dark-mode .stylist-hero-content h1,
body.dark-mode .stylist-hero-content p,
body.dark-mode .stylist-intro,
body.dark-mode .intro-title h2,
body.dark-mode .intro-text p,
body.dark-mode .intro-side small {
    color: #ffffff !important;
}

body.dark-mode .intro-side span {
    color: #ffffff !important;
    border-color: rgba(255,255,255,.25) !important;
}

/* ---------- SECTION HEADINGS ---------- */

body.dark-mode .stylist-page .section-heading h2,
body.dark-mode .stylist-page .section-heading > p,
body.dark-mode .lookbook-top h2,
body.dark-mode .lookbook-top p,
body.dark-mode .testimonial-heading h2 {
    color: #ffffff !important;
}

body.dark-mode .stylist-page .eyebrow {
    color: #e6b8a5 !important;
}

/* ---------- STYLIST CARDS ---------- */

body.dark-mode .stylist-card {
    background: #241b19 !important;
    color: #ffffff !important;
}

body.dark-mode .stylist-info {
    background: #241b19 !important;
    color: #ffffff !important;
}

body.dark-mode .stylist-info > span {
    color: #d8c7c0 !important;
    opacity: 1 !important;
}

body.dark-mode .stylist-info h3 {
    color: #ffffff !important;
}

body.dark-mode .stylist-info p {
    color: #ddd1cb !important;
    opacity: 1 !important;
}

body.dark-mode .stylist-info a {
    color: #e6b8a5 !important;
}

body.dark-mode .stylist-tag {
    background: #241b19 !important;
    color: #ffffff !important;
}

/* ---------- TEAM SECTION ---------- */

body.dark-mode .team-section {
    background: #171312 !important;
    color: #ffffff !important;
}

/* ---------- FEATURED STYLIST ---------- */

body.dark-mode .featured-stylist {
    background: #241b19 !important;
    color: #ffffff !important;
}

body.dark-mode .featured-content h2,
body.dark-mode .featured-content p,
body.dark-mode .experience-row strong,
body.dark-mode .experience-row span {
    color: #ffffff !important;
}

body.dark-mode .featured-content p,
body.dark-mode .experience-row span {
    opacity: .75 !important;
}

/* ---------- SPECIALITIES ---------- */

body.dark-mode .specialities-section {
    background: #171312 !important;
    color: #ffffff !important;
}

body.dark-mode .speciality-item {
    color: #ffffff !important;
    border-color: rgba(255,255,255,.15) !important;
}

body.dark-mode .speciality-content h3 {
    color: #ffffff !important;
}

body.dark-mode .speciality-content p {
    color: #d8cfca !important;
    opacity: 1 !important;
}

body.dark-mode .speciality-item > span,
body.dark-mode .speciality-item .speciality-number {
    color: #e6b8a5 !important;
}

/* ---------- LOOKBOOK ---------- */

body.dark-mode .lookbook-section {
    background: #171312 !important;
    color: #ffffff !important;
}

body.dark-mode .lookbook-top {
    color: #ffffff !important;
}

/* ---------- TESTIMONIALS ---------- */

body.dark-mode .stylist-testimonials {
    background: #171312 !important;
    color: #ffffff !important;
}

body.dark-mode .testimonial-card {
    background: #241b19 !important;
    color: #ffffff !important;
    border-color: rgba(255,255,255,.13) !important;
}

body.dark-mode .testimonial-card p {
    color: #ffffff !important;
}

body.dark-mode .featured-testimonial {
    background: #2c2220 !important;
}

body.dark-mode .client-info strong {
    color: #ffffff !important;
}

body.dark-mode .client-info span {
    color: #cfc4be !important;
    opacity: 1 !important;
}

/* ---------- CTA ---------- */

body.dark-mode .stylist-cta {
    background: #241b19 !important;
    color: #ffffff !important;
}

body.dark-mode .cta-content,
body.dark-mode .cta-content h2,
body.dark-mode .cta-content p {
    color: #ffffff !important;
}

body.dark-mode .cta-content p {
    opacity: .75 !important;
}

/* ---------- LINKS / BUTTONS ---------- */

body.dark-mode .stylist-page a {
    color: #e6b8a5;
}