/* --- Dark Theme Palette --- */
    :root {
        --color-primary: #1a1a1a;
        /* Main Dark Background */
        --color-secondary: #ff0062;
        /* Vibrant Pink Accent */
        --color-dark: #e0e0e0;
        /* Main Light Text */
        --color-card-bg: #242424;
        /* Background for cards/sections */
        --color-subtle-text: #a0a0a0;
        /* For less important text */
    }

    body {
        font-family: 'Inter', sans-serif;
        background-color: var(--color-primary);
        color: var(--color-dark);
        overflow-x: hidden;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-family: 'Playfair Display', serif;
        color: var(--color-secondary);
    }

    /* --- Section & Component Styling --- */
    .hero-section {
        background-image: url('https://plus.unsplash.com/premium_photo-1682092544868-6e57d9867744?q=80&w=870&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
        background-size: cover;
        background-attachment: fixed;
        background-position: center;
    }

    /* Update light sections to dark */
    #about,
    #gallery,
    #contact {
        background-color: var(--color-card-bg);
    }

    /* Update text colors for paragraphs */
    .text-gray-600 {
        color: var(--color-subtle-text);
    }

    .text-gray-700 {
        color: #c0c0c0;
    }

    .text-gray-800 {
        color: var(--color-dark);
    }

    .text-gray-400 {
        color: #888;
    }

    .text-gray-500 {
        color: #a0a0a0;
    }


    /* --- Navigation Bar --- */
    .nav-scrolled {
        background-color: rgba(26, 26, 26, 0.9);
        /* Dark, semi-transparent */
        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
        border-bottom: 1px solid rgba(255, 0, 98, 0.2);
    }

    .nav-cta {
        /* JS will handle color swaps, which work fine for dark mode */
    }


    /* --- Price List Styling --- */
    .price-item {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        margin-bottom: 1rem;
        font-size: 1.1rem;
    }

    .price-item .service {
        padding-right: 0.5rem;
        color: var(--color-dark);
    }

    .price-item .dots {
        flex-grow: 1;
        border-bottom: 1px dotted var(--color-secondary);
        margin: 0 0.5rem;
        transform: translateY(-4px);
    }

    .price-item .price {
        white-space: nowrap;
        padding-left: 0.5rem;
        color: var(--color-secondary);
        font-weight: 600;
    }

    .price-item .price .line-through {
        color: var(--color-subtle-text);
    }

    /* --- Form Inputs --- */
    input[type="text"],
    input[type="email"],
    textarea {
        background-color: #333 !important;
        border-color: #555 !important;
        color: var(--color-dark) !important;
    }

    input[type="text"]::placeholder,
    input[type="email"]::placeholder,
    textarea::placeholder {
        color: #888;
    }

    input:focus,
    textarea:focus {
        --tw-ring-color: var(--color-secondary) !important;
    }

    /* --- General Overrides & Helpers --- */
    .gallery-item .overlay {
        opacity: 0;
        transition: opacity 0.4s ease-in-out;
    }

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

    .scroll-reveal {
        opacity: 0;
        transform: translateY(30px);
        transition: opacity 0.8s ease-out, transform 0.8s ease-out;
    }

    .scroll-reveal.visible {
        opacity: 1;
        transform: translateY(0);
    }

    .testimonial-slide {
        display: none;
        min-width: 100%;
        transition: transform 0.5s ease-in-out;
    }

    .testimonial-slide.active {
        display: block;
    }




    /* Custom styles for the slider and animations */
    .hero-slider {
        height: 100vh;
        width: 100%;
    }

    .swiper-slide {
        position: relative;
        overflow: hidden;
        color: white;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .slide-bg {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        transition: transform 8s ease-out;
    }

    /* Ken Burns effect for the active slide's background */
    .swiper-slide-active .slide-bg {
        transform: scale(1.1);
    }

    /* Styling for Swiper navigation arrows */
    .swiper-button-next,
    .swiper-button-prev {
        color: #ffffff;
        --swiper-navigation-size: 32px;
        background-color: #1c1c1c15;
        width: 50px;
        height: 50px;
        border-radius: 9999px;
        transition: background-color 0.3s ease;
    }

    .swiper-button-next:hover,
    .swiper-button-prev:hover {
        background-color: #1c1c1c15;
    }

    /* Styling for Swiper pagination bullets */
    .swiper-pagination-bullet {
        background: rgba(255, 255, 255, 0.7);
        width: 12px;
        height: 12px;
        opacity: 1;
        transition: background-color 0.3s ease, transform 0.3s ease;
        --swiper-pagination-bullet-inactive-color: rgba(255, 255, 255, 0.7);
    }

    .swiper-pagination-bullet-active {
        background-color: #ffffff;
        transform: scale(1.2);
    }