/* --- Custom Color Palette & Typography --- */
        :root {
            --soft-white: #F7F9FC; /* Base Background */
            --pastel-navy: #1E293B; /* Dark Text/Footer */
            --soft-teal: #20B2AA; /* Primary Accent */
            --aqua-blue: #40E0D0; /* Secondary Accent */
            --coral-accent: #FF7F50; /* Highlight/CTA */
            --gradient-start: #E0F7FA; 
            --gradient-end: #CCFBF1;
        }

        body {
            font-family: 'Inter', sans-serif;
            background-color: var(--soft-white);
            color: var(--pastel-navy);
        }

        /* Stylized Heading Font */
        h1, h2, .playfair {
            font-family: 'Playfair Display', serif;
        }

        /* Hero Background Gradient (Soft Teal to Aqua) */
        .bg-hero-gradient {
            background: linear-gradient(135deg, var(--gradient-start) 0%, var(--gradient-end) 100%);
        }

        /* CTA Button Gradient (Glamorous Sunset Orange) */
        .bg-cta-gradient {
            background: linear-gradient(90deg, var(--coral-accent) 0%, #FF6B6B 100%);
            transition: all 0.3s ease;
            box-shadow: 0 4px 15px rgba(255, 127, 80, 0.4);
        }
        .bg-cta-gradient:hover {
            box-shadow: 0 8px 25px rgba(255, 127, 80, 0.6);
            transform: translateY(-2px) scale(1.01);
            filter: brightness(1.1);
        }

        /* Glass Card Style */
        .glass-card {
            background: rgba(255, 255, 255, 0.6);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.8);
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
            border-radius: 20px;
            transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
        }
        .glass-card:hover {
            box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
            transform: translateY(-5px);
        }

        /* Floating Element Animation for Hero */
        @keyframes subtle-float {
            0% { transform: translate(0, 0); opacity: 0.8; }
            50% { transform: translate(10px, -5px); opacity: 0.9; }
            100% { transform: translate(0, 0); opacity: 0.8; }
        }

        .floating-element {
            animation: subtle-float 25s ease-in-out infinite;
        }

        /* Filter Active Button */
        .filter-active {
            background-color: var(--soft-teal) !important;
            color: white !important;
            box-shadow: 0 2px 8px rgba(32, 178, 170, 0.5);
        }
        
        /* Smooth Scroll Animation (Intersection Observer effect - applied in JS) */
        .fade-in-up {
            opacity: 0;
            transform: translateY(20px);
            transition: opacity 1s ease-out, transform 1s ease-out;
        }
        .is-visible {
            opacity: 1;
            transform: translateY(0);
        }