/* Modern Hero Text Styles - Final Override */
/* Modern Hero Text Styles - Final Override */
.hero-section .hero-text h1.hero-title {
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 700 !important;
    font-size: 4rem !important; /* Larger base font size */
    margin-bottom: 1rem !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    color: transparent !important;
    animation: none !important;
    -webkit-animation: none !important;
    transition: none !important;
    -webkit-transition: none !important;
    text-rendering: optimizeLegibility !important; /* Crisper text */
    -webkit-font-smoothing: antialiased !important; /* Smoother font rendering */
    -moz-osx-font-smoothing: grayscale !important; /* Smoother font rendering */
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.4), 0 0 15px rgba(255, 215, 0, 0.3) !important; /* Enhanced shadow with subtle glow */
}

.hero-section .hero-text h2.hero-subtitle {
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 600 !important;
    font-size: 6rem !important; /* Much larger base font size */
    color: transparent !important;
    animation: none !important;
    -webkit-animation: none !important;
    transition: none !important;
    -webkit-transition: none !important;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.3), 0 0 10px rgba(255, 215, 0, 0.2) !important;
}

/* Gold Gradient Text with Shimmer */
.hero-section .shimmer-text {
    background: linear-gradient(135deg,
        #f7d794 0%,
        #d4af37 50%,
        #f7d794 100%
    ) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    position: relative !important;
    overflow: hidden !important; /* Changed to hidden for proper background-clip behavior */
    background-size: 300% auto !important; /* Increased size for smoother shimmer */
    animation: shimmerGradient 4s ease-in-out infinite !important; /* Adjusted timing and easing */
    -webkit-animation: shimmerGradient 4s ease-in-out infinite !important;
}

/* Shimmer Animation for gradient movement */
@keyframes shimmerGradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

@-webkit-keyframes shimmerGradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

/* Light sweep effect */
.hero-section .shimmer-text::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: -150% !important; /* Adjusted start position */
    width: 70% !important; /* Wider sweep for more prominent effect */
    height: 100% !important;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.8) 50%, /* Brighter sweep for more glossy effect */
        transparent 100%
    ) !important;
    animation: shimmerLight 4s ease-in-out infinite !important; /* Adjusted timing and easing */
    -webkit-animation: shimmerLight 4s ease-in-out infinite !important;
    display: block !important;
    z-index: 1 !important;
    transform: skewX(-20deg) !important; /* Angled sweep for elegance */
    pointer-events: none; /* Ensure it doesn't interfere with text selection */
}

@keyframes shimmerLight {
    0% {
        left: -150%;
    }
    100% {
        left: 150%;
    }
}

@-webkit-keyframes shimmerLight {
    0% {
        left: -150%;
    }
    100% {
        left: 150%;
    }
}

/* Remove any conflicting pseudo-elements */
.hero-section .hero-text h1.hero-title::before,
.hero-section .hero-text h1.hero-title::after,
.hero-section .hero-text h2.hero-subtitle::before,
.hero-section .hero-text h2.hero-subtitle::after {
    display: none !important;
    content: none !important;
}

/* Ensure sup element inherits gradient and shimmer */
.hero-section .hero-text h2.hero-subtitle sup {
    /* Inherit shimmer-text properties */
    background: linear-gradient(135deg,
        #f7d794 0%,
        #d4af37 50%,
        #f7d794 100%
    ) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important; /* Fallback */
    
    font-size: 0.5em !important; /* Relative to parent h2 font-size */
    vertical-align: super !important;
    position: relative !important;
    top: -0.5em !important; /* Adjust vertical position */
    
    /* Inherit shimmer animation */
    animation: shimmerGradient 4s ease-in-out infinite !important;
    -webkit-animation: shimmerGradient 4s ease-in-out infinite !important;
}


/* Floating animation for hero text */
@keyframes floatEffect {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
}

@-webkit-keyframes floatEffect {
    0%, 100% {
        -webkit-transform: translateY(0px);
    }
    50% {
        -webkit-transform: translateY(-10px);
    }
}

.hero-section .hero-text {
    animation: floatEffect 4s ease-in-out infinite;
    -webkit-animation: floatEffect 4s ease-in-out infinite;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .hero-section .hero-text h1.hero-title {
        font-size: 3.5rem !important; /* Smaller for mobile */
    }
    .hero-section .hero-text h2.hero-subtitle {
        font-size: 4.5rem !important; /* Smaller for mobile */
    }
    .hero-section .hero-text h2.hero-subtitle sup {
        font-size: 0.5em !important; /* Relative to parent h2 font-size */
    }
    
}

@media (max-width: 480px) {
    .hero-section .hero-text h1.hero-title {
        font-size: 2rem !important; /* Smaller for mobile */
        letter-spacing: 1px !important;
    }
    .hero-section .hero-text h2.hero-subtitle {
        font-size: 2.5rem !important; /* Smaller for mobile */
    }
    .hero-section .hero-text h2.hero-subtitle sup {
        font-size: 0.5em !important; /* Relative to parent h2 font-size */
    }
}