       *,
        *::before,
        *::after {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        :root {
            --color-bg: #FAFAF8;
            --color-white: #FFFFFF;
            --color-dark: #222222;
            --color-text: #43464B;
            --color-accent: #DDD4CD;
            --color-rose: #BE8A7B;
            --color-light-bg: #F8F7F5;
            --color-footer-bg: #222222;
            --color-topbar: #DCD5CD;
            --font-serif: 'Playfair Display', serif;
            --font-sans: 'Roboto', sans-serif;
            --font-mono: 'Montserrat', sans-serif;
            --max-w: 1340px;
            --pad-x: clamp(1rem, 5vw, 4rem);
            --pad-y: clamp(3rem, 6vw, 5rem);
        }

        body {
            font-family: var(--font-sans);
            font-size: 1rem;
            color: var(--color-text);
            background: var(--color-bg);
            line-height: 1.5;
        }

        a {
            text-decoration: none;
            color: inherit;
        }

        img {
            max-width: 100%;
            display: block;
        }

      

        /* ── FOOTER ── */
        footer {
            background: var(--color-footer-bg);
            color: var(--color-white);
            padding: var(--pad-y) 10px 2rem;
        }

        .footer-grid {
            display: grid;
            grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
            gap: 3rem;
            margin-bottom: 3rem;
        }

        .footer-brand p {
            color: rgba(255, 255, 255, 0.7);
            font-size: 1.5rem;
            line-height: 1.7;
            margin: 1rem 0 1.5rem;
        }

        .footer-logo-text {
            font-family: var(--font-serif);
            font-size: 1rem;
            color: var(--color-white);
            line-height: 1.3;
        }

        .footer-logo-text span {
            display: block;
            font-size: 0.6rem;
            font-family: var(--font-sans);
            letter-spacing: 0.15em;
            text-transform: uppercase;
            opacity: 0.7;
        }

        .footer-hours-title,
        .footer-col-title {
            font-family: var(--font-sans);
            font-size: 1.7rem;
            font-weight: 700;
            line-height: 1.2;
            color: var(--color-white);
            margin-bottom: 1rem;
        }

        .working-hours {
            font-size: 0.9rem;
            color: rgba(255, 255, 255, 0.7);
        }

        .working-hours tr td:first-child {
            font-size: 1.5rem;
            padding-right: 1.5rem;
            padding-bottom: 0.3rem;
        }

        .footer-links {
            list-style: none;
        }

        .footer-links li {
            margin-bottom: 0.5rem;
        }

        .footer-links a {
            color: rgba(255, 255, 255, 0.7);
            font-size: 1.5rem;
            transition: color 0.3s;
        }

        .footer-links a:hover {
            color: var(--color-rose);
        }

        .footer-contact-list {
            list-style: none;
        }

        .footer-contact-list li {
            color: rgba(255, 255, 255, 0.7);
            font-size: 1.5rem;
            margin-bottom: 0.75rem;
            line-height: 1.5;
        }

        .footer-contact-list a {
            color: rgba(255, 255, 255, 0.7);
            font-size: 1.5rem;
            transition: color 0.3s;
        }

        .footer-contact-list a:hover {
            color: var(--color-rose);
        }

        .footer-follow-title {
            font-family: var(--font-sans);
            font-size: 1.7rem;
            font-weight: 700;
            color: var(--color-white);
            margin: 1.5rem 0 0.75rem;
        }

        .footer-social a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 36px;
            height: 36px;
            border-radius: 4px;
            color: var(--color-white);
            transition: color 0.3s;
        }

        .footer-social a:hover {
            color: var(--color-rose);
        }

        .footer-social svg {
            width: 20px;
            height: 20px;
            fill: currentColor;
        }

        .footer-divider {
            border: none;
            border-top: 1px solid rgba(255, 255, 255, 0.15);
            margin-bottom: 1.5rem;
        }

        .footer-bottom {
            color: rgba(255, 255, 255, 0.5);
            font-size: 1.5rem;
        }

        .footer-bottom a {
            color: var(--color-rose);
        }

        /* ── Mobile menu overlay ── */
        .mobile-menu {
            display: none;
            position: fixed;
            inset: 0;
            background: rgba(0, 0, 0, 0.85);
            z-index: 200;
            overflow-y: auto;
        }

        .mobile-menu.open {
            display: flex;
            flex-direction: column;
        }

        .mobile-menu-inner {
            background: var(--color-bg);
            padding: 2rem var(--pad-x);
            max-width: 480px;
            min-height: 100%;
        }

        .mobile-menu-close {
            background: none;
            border: none;
            cursor: pointer;
            align-self: flex-end;
            font-size: 1.5rem;
            margin-bottom: 1.5rem;
            color: var(--color-dark);
        }

        .mobile-nav-links {
            list-style: none;
        }

        .mobile-nav-links li {
            border-bottom: 1px solid var(--color-accent);
        }

        .mobile-nav-links a {
            display: block;
            padding: 0.85rem 0;
            font-family: var(--font-sans);
            font-size: 1.5rem;
            color: var(--color-dark);
            transition: color 0.3s;
        }

        .mobile-nav-links a:hover {
            color: var(--color-rose);
        }

        .mobile-divider {
            border: none;
            border-top: 1px solid var(--color-accent);
            margin: 1.5rem 0;
        }

        .mobile-hours {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 2rem;
        }

        .mobile-hours-title,
        .mobile-follow-title {
            font-family: var(--font-sans);
            font-size: 1.125rem;
            font-weight: 700;
            margin-bottom: 0.75rem;
            color: var(--color-dark);
        }

        .mobile-hours-table {
            font-size: 0.9rem;
        }

        .mobile-hours-table tr td:first-child {
            padding-right: 1rem;
            padding-bottom: 0.25rem;
        }

        /* ── RESPONSIVE ── */
        @media (max-width: 1024px) {
            .footer-grid {
                grid-template-columns: 1fr 1fr;
            }

            .services-grid {
                grid-template-columns: repeat(2, 1fr);
            }

            .services-grid-row2 {
                grid-template-columns: 1fr 1fr;
            }
        }

        @media (max-width: 767px) {
            .hero-content {
                max-width: 100%;
            }
            
                .logo-wrap img {
                    height: 4.5rem !important;
                }
                .top-bar {
                   height: 4rem !important;
                }
                    .sidebar-nav li a {
                    font-size: 1.5rem !important;
                    }

                .main-nav {
                
                    height: 6.6rem !important;
                }

            .hero::after {
                display: none;
            }

            .about-grid {
                flex-direction: column;
            }

            .about-img {
                max-width: 100%;
            }

            .services-grid {
                grid-template-columns: 1fr;
            }

            .services-grid-row2 {
                grid-template-columns: 1fr;
            }

            .footer-grid {
                grid-template-columns: 1fr;
                gap: 2rem;
            }

            .logobar {
                gap: 1.5rem;
            }

            .navbar {
                padding: 1rem var(--pad-x);
            }

            .nav-book-btn {
                display: none;
            }

            .nav-hamburger {
                display: block;
            }

            .mobile-hours {
                grid-template-columns: 1fr;
            }
        }
        
        .footer-logo img{
    width: 220px;   /* apne according adjust kar sakte ho */
    height: auto;
    display: block;
}
    