:root {
            --primary-gradient: radial-gradient(circle at center, #7B886B 0%, #667459 46%, #566041 100%);
            --primary-gradient-soft: radial-gradient(circle at center, rgba(123, 136, 107, 0.96) 0%, rgba(102, 116, 89, 0.98) 46%, rgba(86, 96, 65, 1) 100%);
            --mindara-sans: 'Inter', sans-serif;
            --mindara-serif: 'Tinos', serif;
            --editorial-olive: #566041;
        }

        body {
            font-family: var(--mindara-sans);
            font-size: 16px;
            line-height: 1.55;
            letter-spacing: -0.02em;
        }

        html {
            scrollbar-gutter: stable;
        }

        blockquote,
        .font-headline,
        .font-display,
        .script-accent,
        .script-alt-accent {
            font-family: var(--mindara-serif);
            font-weight: 400;
            letter-spacing: -0.04em;
        }

        p,
        a,
        button,
        input,
        textarea,
        select,
        label,
        li,
        .font-body,
        .font-label {
            font-family: var(--mindara-sans);
            letter-spacing: -0.02em;
        }

        .font-label {
            font-size: 14px;
        }

        .script-accent,
        .script-alt-accent {
            font-style: normal;
            line-height: 0.85;
        }

        .bg-primary {
            background-color: #566041 !important;
            background-image: var(--primary-gradient) !important;
        }

        .quote-text {
            font-family: var(--mindara-serif);
            font-size: 40px;
            line-height: 1.35;
            letter-spacing: -0.04em;
        }

        /* Mindara mobile-first type scale for this page only */
        h1,
        #hero-title,
        #hero-title .script-accent {
            font-family: var(--mindara-serif);
            font-size: 48px !important;
            line-height: 1.1 !important;
            letter-spacing: -0.04em !important;
            font-weight: 400 !important;
        }

        h2,
        main h2.font-headline,
        main h2.font-display,
        .counsel-headline {
            font-family: var(--mindara-serif);
            font-size: 42px !important;
            line-height: 1.12 !important;
            letter-spacing: -0.04em !important;
            font-weight: 400 !important;
        }

        h3,
        main h3.font-headline {
            font-family: var(--mindara-serif);
            font-size: 24px !important;
            line-height: 1.18 !important;
            letter-spacing: -0.03em !important;
            font-weight: 400 !important;
        }

        .font-body,
        main p:not(.font-label):not(.quote-text) {
            font-size: 16px !important;
            line-height: 1.55 !important;
            letter-spacing: -0.02em !important;
            font-weight: 500 !important;
        }

        .counsel-body .font-body,
        #specialty-desc,
        .font-body.text-lg,
        .font-body.text-xl {
            font-size: 18px !important;
            line-height: 1.5 !important;
        }

        .font-label,
        main .font-label,
        main span[class*="uppercase"],
        main p[class*="uppercase"] {
            font-size: 14px !important;
            line-height: 1.35 !important;
            letter-spacing: -0.02em !important;
            font-weight: 500 !important;
        }

        a.inline-flex.font-label,
        button.font-label,
        main a[class*="bg-primary"].font-label,
        main a[class*="bg-secondary"].font-label,
        main a[class*="bg-white"].font-label {
            font-size: 16px !important;
            line-height: 1.4 !important;
        }

        .quote-text,
        blockquote,
        .testimonial-quote,
        .transition-quote {
            font-family: var(--mindara-serif);
            font-size: 32px !important;
            line-height: 1.35 !important;
            letter-spacing: -0.04em !important;
            font-weight: 400 !important;
        }

        .inline-emphasis {
            font-family: var(--mindara-serif) !important;
            font-size: 1em !important;
            line-height: inherit !important;
            letter-spacing: -0.03em !important;
            font-weight: 400 !important;
            font-style: normal !important;
            vertical-align: baseline;
        }

        body main h1:not(.text-white),
        body main h2:not(.text-white),
        body main h3:not(.text-white),
        body main .font-headline:not(.text-white):not(.text-secondary),
        body main .font-display:not(.text-white),
        body main .quote-text,
        body main blockquote {
            color: var(--editorial-olive) !important;
        }

        body main p:not(.font-label):not(.quote-text):not([class*="text-white"]),
        body main .font-body:not(.font-label):not([class*="text-white"]) {
            color: rgba(29, 27, 25, 0.6) !important;
        }

        .transition-quote .script-accent,
        .transition-quote .quote-highlight {
            font-family: var(--mindara-serif) !important;
            font-size: 1em !important;
            line-height: inherit !important;
            letter-spacing: -0.04em !important;
            font-weight: 400 !important;
            position: static !important;
            top: auto !important;
            padding: 0 !important;
        }

        @media (min-width: 1024px) {
            h1,
            #hero-title,
            #hero-title .script-accent {
                font-size: 64px !important;
            }

            h2,
            main h2.font-headline,
            main h2.font-display,
            .counsel-headline {
                font-size: 56px !important;
            }

            h3,
            main h3.font-headline {
                font-size: 26px !important;
            }

            .quote-text,
            blockquote,
            .testimonial-quote,
            .transition-quote {
                font-size: 40px !important;
            }
        }

        .material-symbols-outlined {
            font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
        }

        /* Shared page rail tokens (hero align helper) */
        :root {
            --page-gutter: 1rem;
            --page-max: 72rem;
            --nav-inset: 1.5rem;
        }
        @media (min-width: 768px) {
            :root { --page-gutter: 1.5rem; }
        }

        /* Mobile homepage: solid nav while overlapping hero */
        @media (max-width: 1023px) {
            #site-nav.nav-over-hero .site-nav-panel {
                background-color: #F8F3EF !important;
            }
            #site-nav.nav-over-hero .site-nav-menu-label {
                color: #566041 !important;
                opacity: 1;
            }

            #home-hero .hero-mobile-wash {
                display: block;
                background: linear-gradient(
                    90deg,
                    rgba(254, 248, 244, 0.94) 0%,
                    rgba(254, 248, 244, 0.75) 42%,
                    rgba(254, 248, 244, 0.18) 68%,
                    rgba(254, 248, 244, 0) 100%
                );
            }

            #home-hero .hero-explore-label {
                color: rgba(86, 96, 65, 0.7);
            }
        }

        @media (min-width: 1024px) {
            #home-hero .hero-mobile-wash {
                display: none;
            }
        }

        .script-accent {
            font-family: var(--mindara-serif);
            line-height: 0.85;
        }
        .script-alt-accent {
            font-family: var(--mindara-serif);
        }
        /* No-Line Rule: Replacing borders with backgrounds */
        .card-accent-peach { background-color: rgba(230, 155, 151, 0.08); }
        .card-accent-sage { background-color: rgba(168, 181, 164, 0.08); }
        .card-accent-olive { background-color: rgba(195, 185, 155, 0.08); }
        .card-accent-gray { background-color: rgba(181, 184, 188, 0.08); }
        .floral-mask {
            mask-image: radial-gradient(circle at bottom left, black 30%, transparent 80%);
            -webkit-mask-image: radial-gradient(circle at bottom left, black 30%, transparent 80%);
        }
        .soft-pillow {
            border-radius: 45% 55% 45% 55% / 55% 45% 55% 45%;
            transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.5s ease;
        }
        
        @keyframes bubbleWobble {
            0% { border-radius: 60% 40% 40% 60% / 50% 60% 40% 50%; }
            33% { border-radius: 50% 50% 60% 40% / 40% 50% 50% 60%; }
            66% { border-radius: 40% 60% 50% 50% / 60% 40% 60% 40%; }
            100% { border-radius: 60% 40% 40% 60% / 50% 60% 40% 50%; }
        }

        @keyframes echoMove {
            0% { transform: translate(0, 0); }
            25% { transform: translate(4px, 4px); }
            50% { transform: translate(0, 8px); }
            75% { transform: translate(-4px, 4px); }
            100% { transform: translate(0, 0); }
        }

        .bubble-step {
            transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .bubble-step:hover {
            animation: echoMove 4s infinite linear, bubbleWobble 6s infinite ease-in-out;
            box-shadow: 0 20px 40px -15px rgba(0,0,0,0.1);
        }

        .soft-pillow:hover {
            transform: scale(1.08);
            animation: bubbleWobble 3s ease-in-out infinite alternate;
            box-shadow: 0 15px 35px -5px rgba(0,0,0,0.05); /* Slight shadow to enhance hover */
        }

        /* Services Hub Styles */
        .service-list:hover .service-item {
            opacity: 0.4;
            filter: blur(3px);
        }
        .service-list .service-item:hover {
            opacity: 1;
            filter: blur(0);
        }
        .service-description {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.7s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.5s ease;
            opacity: 0;
        }
        .service-item:hover .service-description {
            max-height: 400px;
            opacity: 1;
            margin-top: 1rem;
        }
        .image-stack img {
            transition: opacity 1.2s cubic-bezier(0.4, 0, 0.2, 1), transform 1.2s cubic-bezier(0.4, 0, 0.2, 1);
            transform: scale(1.1);
        }
        .service-item-1:hover ~ .left-display .img-1 { opacity: 1; transform: scale(1); }
        .service-item-2:hover ~ .left-display .img-2 { opacity: 1; transform: scale(1); }
        .service-item-3:hover ~ .left-display .img-3 { opacity: 1; transform: scale(1); }
        
        .left-display .img-1 { opacity: 1; transform: scale(1); }
        .service-list:hover ~ .left-display .img-1 { opacity: 0; transform: scale(1.1); }
        
        .service-item-1:hover ~ .left-display .img-1 { opacity: 1 !important; transform: scale(1) !important; }
        .service-item-2:hover ~ .left-display .img-2 { opacity: 1 !important; transform: scale(1) !important; }
        .service-item-3:hover ~ .left-display .img-3 { opacity: 1 !important; transform: scale(1) !important; }

        /* Testimonial Animations */
        @keyframes subtleMove {
            0% { transform: translate(-50%, -50%) translateX(0); }
            50% { transform: translate(-50%, -50%) translateX(-2%); }
            100% { transform: translate(-50%, -50%) translateX(0); }
        }
        .parallax-text {
            white-space: nowrap;
            overflow: hidden;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-size: 15vw;
            font-weight: 700;
            color: rgba(230, 155, 151, 0.05);
            pointer-events: none;
            z-index: 0;
            user-select: none;
            animation: subtleMove 20s ease-in-out infinite;
        }

        @keyframes scroll {
            0% { transform: translateX(0); }
            100% { transform: translateX(-50%); }
        }
        .animate-scroll {
            display: inline-flex;
            animation: scroll 120s linear infinite;
        }

        /* Specialty section additions */
        .editorial-shadow {
            text-shadow: 0 4px 12px rgba(92, 89, 76, 0.05);
        }
        .specialty-pill:hover {
            transform: translateY(-2px);
            transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
        }

        /* Loading & Reveal Animations */
        /* Premium Ghosting / Shimmer for headlines */
        .text-shimmer {
            background: linear-gradient(90deg, rgba(86, 96, 65, 1) 0%, rgba(230, 155, 151, 1) 50%, rgba(86, 96, 65, 1) 100%);
            background-size: 200% auto;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            animation: shimmer 8s linear infinite;
        }

        /* Hero CTA — frosted glass over light hero image */
        .hero-cta-glass {
            position: relative;
            isolation: isolate;
            overflow: hidden;
            color: #566041;
            border: 1px solid rgba(86, 96, 65, 0.18);
            background:
                linear-gradient(135deg, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.22)),
                rgba(255, 255, 255, 0.28);
            backdrop-filter: blur(16px) saturate(140%);
            -webkit-backdrop-filter: blur(16px) saturate(140%);
            box-shadow:
                inset 0 1px 0 rgba(255, 255, 255, 0.7),
                inset 0 -1px 0 rgba(86, 96, 65, 0.06),
                0 8px 24px rgba(86, 96, 65, 0.1);
            transition:
                transform 220ms cubic-bezier(0.23, 1, 0.32, 1),
                box-shadow 220ms cubic-bezier(0.23, 1, 0.32, 1),
                border-color 220ms ease,
                background 220ms ease;
        }
        .hero-cta-glass::before {
            content: "";
            position: absolute;
            inset: 0;
            z-index: -1;
            border-radius: inherit;
            background:
                radial-gradient(circle at 18% 0%, rgba(255, 255, 255, 0.45), transparent 42%),
                linear-gradient(90deg, rgba(255, 255, 255, 0.2), transparent 52%, rgba(255, 255, 255, 0.12));
            pointer-events: none;
        }
        .hero-cta-glass::after {
            content: "";
            position: absolute;
            inset: 1px;
            border-radius: inherit;
            border: 1px solid rgba(255, 255, 255, 0.35);
            pointer-events: none;
        }
        .hero-cta-glass:hover {
            transform: translateY(-3px);
            border-color: rgba(86, 96, 65, 0.28);
            background:
                linear-gradient(135deg, rgba(255, 255, 255, 0.65), rgba(255, 255, 255, 0.3)),
                rgba(255, 255, 255, 0.36);
            box-shadow:
                inset 0 1px 0 rgba(255, 255, 255, 0.8),
                inset 0 -1px 0 rgba(86, 96, 65, 0.08),
                0 12px 30px rgba(86, 96, 65, 0.14);
        }
        .hero-cta-glass:active {
            transform: translateY(-1px) scale(0.98);
        }
        @media (prefers-reduced-transparency: reduce) {
            .hero-cta-glass {
                background: rgba(255, 255, 255, 0.96);
                color: #566041;
                border-color: rgba(86, 96, 65, 0.16);
                backdrop-filter: none;
                -webkit-backdrop-filter: none;
                box-shadow: 0 10px 28px rgba(86, 96, 65, 0.1);
            }
            .hero-cta-glass::before,
            .hero-cta-glass::after {
                display: none;
            }
        }
        @keyframes shimmer {
            to { background-position: 200% center; }
        }

        /* Initial hidden state for GSAP reveals */
        .gsap-reveal {
            opacity: 0;
            visibility: hidden;
            will-change: transform, opacity;
        }

        @keyframes preloaderFadeOut {
            0% { opacity: 1; visibility: visible; }
            100% { opacity: 0; visibility: hidden; }
        }
        @keyframes breatheText {
            0% { opacity: 0; transform: scale(0.95); letter-spacing: -2px; }
            40% { opacity: 1; transform: scale(1); letter-spacing: 2px; }
            100% { opacity: 0; transform: scale(1.05); letter-spacing: 6px; }
        }