/*
Theme Name: Helena Willow Child
Theme URI: https://helenawillow.com
Description: Child theme for Helena Willow brand using Astra Pro + Spectra Pro with theme.json design tokens.
Author: Influencentricity
Author URI: https://influencentricity.com
Template: astra
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: helena-willow-child
*/

/* ===========================================
   LOCAL FONT LOADING
   =========================================== */

@font-face {
    font-family: 'Tenor Sans';
    src: url('assets/fonts/TenorSans-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* ========================================
   HELENA WILLOW CUSTOM CSS
   Only effects that can't be done in theme.json
   ======================================== */

/* ===========================================
   KEYFRAME ANIMATIONS
   =========================================== */

@keyframes hw-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

@keyframes hw-rotateSlow {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes hw-shimmer {
    0%, 100% { opacity: 0.7; }
    50% { opacity: 1; }
}

/* Gold glow animations */
@keyframes hw-pulseGlowGold {
    0%, 100% { 
        filter: drop-shadow(0 0 12px rgba(201, 152, 42, 0.4));
    }
    50% { 
        filter: drop-shadow(0 0 22px rgba(232, 197, 90, 0.6));
    }
}

@keyframes hw-textGlowGold {
    0%, 100% { 
        text-shadow: 0 0 15px rgba(201, 152, 42, 0.5),
                     0 0 30px rgba(201, 152, 42, 0.3);
    }
    50% { 
        text-shadow: 0 0 25px rgba(232, 197, 90, 0.7),
                     0 0 45px rgba(232, 197, 90, 0.4);
    }
}

/* Moon glow animations */
@keyframes hw-pulseGlowMoon {
    0%, 100% { 
        filter: drop-shadow(0 0 10px rgba(197, 209, 220, 0.4));
    }
    50% { 
        filter: drop-shadow(0 0 20px rgba(232, 240, 245, 0.6));
    }
}

@keyframes hw-textGlowMoon {
    0%, 100% { 
        text-shadow: 0 0 12px rgba(197, 209, 220, 0.5),
                     0 0 25px rgba(197, 209, 220, 0.3);
    }
    50% { 
        text-shadow: 0 0 20px rgba(232, 240, 245, 0.7),
                     0 0 35px rgba(232, 240, 245, 0.4);
    }
}

/* Fire glow animations */
@keyframes hw-pulseGlowFire {
    0%, 100% { 
        filter: drop-shadow(0 0 12px rgba(212, 114, 42, 0.4));
    }
    50% { 
        filter: drop-shadow(0 0 22px rgba(232, 151, 63, 0.6));
    }
}

@keyframes hw-textGlowFire {
    0%, 100% { 
        text-shadow: 0 0 15px rgba(212, 114, 42, 0.5),
                     0 0 30px rgba(212, 114, 42, 0.3);
    }
    50% { 
        text-shadow: 0 0 25px rgba(232, 151, 63, 0.7),
                     0 0 45px rgba(232, 151, 63, 0.4);
    }
}

/* Magic glow animations */
@keyframes hw-pulseGlowMagic {
    0%, 100% { 
        filter: drop-shadow(0 0 12px rgba(126, 184, 232, 0.4));
    }
    50% { 
        filter: drop-shadow(0 0 22px rgba(165, 212, 247, 0.6));
    }
}

/* Number pulse for large decorative numbers */
@keyframes hw-numberPulse {
    0%, 100% { text-shadow: 0 0 20px rgba(201, 152, 42, 0.3); }
    50% { text-shadow: 0 0 35px rgba(232, 197, 90, 0.5); }
}

/* Gradient flow for backgrounds */
@keyframes hw-gradientFlow {
    0%, 100% { background-position: 0% center; }
    50% { background-position: 100% center; }
}

/* ===========================================
   ANIMATED ELEMENT CLASSES
   =========================================== */

/* Floating animation */
.hw-float {
    animation: hw-float 4s ease-in-out infinite;
}

/* Slow rotation */
.hw-rotate-slow {
    animation: hw-rotateSlow 60s linear infinite;
}

/* Glow pulse animations */
.hw-glow-pulse-gold {
    animation: hw-pulseGlowGold 3s ease-in-out infinite;
}

.hw-glow-pulse-moon {
    animation: hw-pulseGlowMoon 3s ease-in-out infinite;
}

.hw-glow-pulse-fire {
    animation: hw-pulseGlowFire 3s ease-in-out infinite;
}

.hw-glow-pulse-magic {
    animation: hw-pulseGlowMagic 3s ease-in-out infinite;
}

/* Text glow pulse */
.hw-text-glow-pulse-gold {
    animation: hw-textGlowGold 3s ease-in-out infinite;
}

.hw-text-glow-pulse-moon {
    animation: hw-textGlowMoon 3s ease-in-out infinite;
}

.hw-text-glow-pulse-fire {
    animation: hw-textGlowFire 3s ease-in-out infinite;
}

/* Shimmer animation */
.hw-shimmer {
    animation: hw-shimmer 3s ease-in-out infinite;
}

/* ===========================================
   STATIC GLOW EFFECTS (no animation)
   =========================================== */

.hw-glow-gold {
    box-shadow: 0 0 15px rgba(201, 152, 42, 0.35), 
                inset 0 0 15px rgba(201, 152, 42, 0.1);
}

.hw-glow-moon {
    box-shadow: 0 0 15px rgba(197, 209, 220, 0.35), 
                inset 0 0 15px rgba(197, 209, 220, 0.1);
}

.hw-glow-fire {
    box-shadow: 0 0 15px rgba(212, 114, 42, 0.35), 
                inset 0 0 15px rgba(212, 114, 42, 0.1);
}

.hw-glow-magic {
    box-shadow: 0 0 15px rgba(126, 184, 232, 0.35), 
                inset 0 0 15px rgba(126, 184, 232, 0.1);
}

/* Static text glow */
.hw-text-glow-gold {
    text-shadow: 0 0 20px rgba(201, 152, 42, 0.6);
}

.hw-text-glow-moon {
    text-shadow: 0 0 20px rgba(197, 209, 220, 0.6);
}

.hw-text-glow-fire {
    text-shadow: 0 0 20px rgba(212, 114, 42, 0.6);
}

/* ===========================================
   CARD HOVER EFFECTS
   =========================================== */

/* Base card transition */
.hw-card {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Gold-themed cards (default for The Priestess) */
.hw-card-gold {
    border: 1px solid rgba(201, 152, 42, 0.25);
    box-shadow: 0 0 20px rgba(201, 152, 42, 0.1), 
                inset 0 0 30px rgba(201, 152, 42, 0.05);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.hw-card-gold:hover {
    border-color: rgba(201, 152, 42, 0.5);
    box-shadow: 0 0 35px rgba(201, 152, 42, 0.2), 
                inset 0 0 40px rgba(201, 152, 42, 0.08);
    transform: translateY(-6px) scale(1.01);
}

/* Moon-themed cards */
.hw-card-moon {
    border: 1px solid rgba(197, 209, 220, 0.25);
    box-shadow: 0 0 20px rgba(197, 209, 220, 0.1), 
                inset 0 0 30px rgba(197, 209, 220, 0.05);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.hw-card-moon:hover {
    border-color: rgba(197, 209, 220, 0.5);
    box-shadow: 0 0 35px rgba(197, 209, 220, 0.2), 
                inset 0 0 40px rgba(197, 209, 220, 0.08);
    transform: translateY(-6px) scale(1.01);
}

/* Fire-themed cards */
.hw-card-fire {
    border: 1px solid rgba(212, 114, 42, 0.25);
    box-shadow: 0 0 20px rgba(212, 114, 42, 0.1), 
                inset 0 0 30px rgba(212, 114, 42, 0.05);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.hw-card-fire:hover {
    border-color: rgba(212, 114, 42, 0.5);
    box-shadow: 0 0 35px rgba(212, 114, 42, 0.2), 
                inset 0 0 40px rgba(212, 114, 42, 0.08);
    transform: translateY(-6px) scale(1.01);
}

/* Card title glow on hover */
.hw-card-gold:hover .hw-card-title {
    text-shadow: 0 0 18px rgba(201, 152, 42, 0.5);
}

.hw-card-moon:hover .hw-card-title {
    text-shadow: 0 0 18px rgba(197, 209, 220, 0.5);
}

.hw-card-fire:hover .hw-card-title {
    text-shadow: 0 0 18px rgba(212, 114, 42, 0.5);
}

/* ===========================================
   DIVIDER EFFECTS
   =========================================== */

.hw-divider-gold {
    height: 1px;
    background: linear-gradient(90deg, transparent, #E8C55A, transparent);
    box-shadow: 0 0 10px rgba(201, 152, 42, 0.5);
}

.hw-divider-gold.hw-shimmer {
    animation: hw-shimmer 3s ease-in-out infinite;
}

.hw-divider-moon {
    height: 1px;
    background: linear-gradient(90deg, transparent, #E8F0F5, transparent);
    box-shadow: 0 0 10px rgba(197, 209, 220, 0.5);
}

.hw-divider-fire {
    height: 1px;
    background: linear-gradient(90deg, transparent, #E8973F, transparent);
    box-shadow: 0 0 10px rgba(212, 114, 42, 0.5);
}

/* ===========================================
   SYMBOL STYLING
   =========================================== */

/* Symbol tinting via CSS filters */
.hw-symbol-gold {
    filter: sepia(100%) saturate(300%) brightness(90%) hue-rotate(5deg);
    opacity: 0.8;
    transition: filter 0.4s ease, opacity 0.4s ease;
}

.hw-symbol-sage {
    filter: sepia(30%) saturate(150%) brightness(85%) hue-rotate(60deg);
    opacity: 0.7;
    transition: filter 0.4s ease, opacity 0.4s ease;
}

.hw-symbol-moon {
    filter: brightness(1.1) saturate(0.8);
    opacity: 0.8;
    transition: filter 0.4s ease, opacity 0.4s ease;
}

/* ===========================================
   GRADIENT TEXT
   =========================================== */

.hw-text-gradient-gold {
    background: linear-gradient(135deg, #D4A94E 0%, #E8C55A 50%, #D4A94E 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hw-text-gradient-gold.hw-shimmer {
    background-size: 200% auto;
    animation: hw-gradientFlow 4s ease-in-out infinite;
}

/* ===========================================
   EYEBROW TEXT
   =========================================== */

.hw-eyebrow {
    font-family: var(--wp--preset--font-family--tenor-sans, 'Tenor Sans', sans-serif);
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-size: var(--wp--preset--font-size--xs, 0.75rem);
}

/* ===========================================
   SCROLL REVEAL (optional JS enhancement)
   =========================================== */

.hw-reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.hw-reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* Staggered reveal for children */
.hw-reveal-stagger > * {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.hw-reveal-stagger.active > *:nth-child(1) { transition-delay: 0.1s; }
.hw-reveal-stagger.active > *:nth-child(2) { transition-delay: 0.2s; }
.hw-reveal-stagger.active > *:nth-child(3) { transition-delay: 0.3s; }
.hw-reveal-stagger.active > *:nth-child(4) { transition-delay: 0.4s; }
.hw-reveal-stagger.active > *:nth-child(5) { transition-delay: 0.5s; }
.hw-reveal-stagger.active > *:nth-child(6) { transition-delay: 0.6s; }

.hw-reveal-stagger.active > * {
    opacity: 1;
    transform: translateY(0);
}

/* ===========================================
   ACCESSIBILITY: REDUCED MOTION
   =========================================== */

@media (prefers-reduced-motion: reduce) {
    .hw-float,
    .hw-rotate-slow,
    .hw-glow-pulse-gold,
    .hw-glow-pulse-moon,
    .hw-glow-pulse-fire,
    .hw-glow-pulse-magic,
    .hw-text-glow-pulse-gold,
    .hw-text-glow-pulse-moon,
    .hw-text-glow-pulse-fire,
    .hw-shimmer {
        animation: none;
    }
    
    .hw-card,
    .hw-card-gold,
    .hw-card-moon,
    .hw-card-fire,
    .hw-reveal,
    .hw-reveal-stagger > * {
        transition: none;
    }
    
    .hw-reveal {
        opacity: 1;
        transform: none;
    }
    
    .hw-reveal-stagger > * {
        opacity: 1;
        transform: none;
    }
}

/* ===========================================
/* ===========================================
   MAGIC BLUE CARD (for The Priestess)
   Matches gold/moon/fire card patterns
   =========================================== */

.hw-card-magic {
    border: 1px solid rgba(126, 184, 232, 0.25);
    box-shadow: 0 0 20px rgba(126, 184, 232, 0.1), 
                inset 0 0 30px rgba(126, 184, 232, 0.05);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.hw-card-magic:hover {
    border-color: rgba(126, 184, 232, 0.5);
    box-shadow: 0 0 35px rgba(126, 184, 232, 0.2), 
                inset 0 0 40px rgba(126, 184, 232, 0.08);
    transform: translateY(-6px) scale(1.01);
}

.hw-card-magic:hover .hw-card-title {
    text-shadow: 0 0 18px rgba(126, 184, 232, 0.5);
}

/* ===========================================
   SYMBOL DIVIDER (triskelion between lines)
   =========================================== */

.hw-symbol-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    margin: var(--wp--preset--spacing--lg, 2rem) auto;
    max-width: 400px;
}

.hw-symbol-divider__line {

    height: 2px;
    background: linear-gradient(90deg, 
        transparent 0%, 
        rgba(126, 184, 232, 0.6) 30%, 
        rgba(165, 212, 247, 0.9) 50%, 
        rgba(126, 184, 232, 0.6) 70%, 
        transparent 100%);
    box-shadow: 0 0 12px rgba(126, 184, 232, 0.5);
    animation: hw-shimmer 3s ease-in-out infinite;
}

.hw-symbol-divider__line--left {
    animation-delay: 0s;
}

.hw-symbol-divider__line--right {
    animation-delay: 0.5s;
}

.hw-symbol-divider__symbol {
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    animation: hw-pulseGlowMagic 3s ease-in-out infinite;
}

.hw-symbol-divider__symbol img, .hw-symbol-divider__symbol > img {
    max-width: 32px !important;
    max-height: 32px !important;
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(1.2) saturate(0.9);
    opacity: 0.85;
}

/* Gold variant for other sections */
.hw-symbol-divider--gold .hw-symbol-divider__line {
    background: linear-gradient(90deg, 
        transparent 0%, 
        rgba(201, 152, 42, 0.6) 30%, 
        rgba(232, 197, 90, 0.9) 50%, 
        rgba(201, 152, 42, 0.6) 70%, 
        transparent 100%);
    box-shadow: 0 0 12px rgba(201, 152, 42, 0.5);
}

.hw-symbol-divider--gold .hw-symbol-divider__symbol {
    animation: hw-pulseGlowGold 3s ease-in-out infinite;
}

/* ===========================================
   TEXT GLOW UTILITY CLASSES
   =========================================== */

.hw-text-magic {
    color: var(--wp--preset--color--glow-magic, #7EB8E8);
    text-shadow: 0 0 15px rgba(126, 184, 232, 0.6);
}

.hw-text-magic-bright {
    color: var(--wp--preset--color--glow-magic-bright, #A5D4F7);
    text-shadow: 0 0 18px rgba(165, 212, 247, 0.7);
}

.hw-text-gold-glow {
    color: var(--wp--preset--color--glow-gold-bright, #E8C55A);
    text-shadow: 0 0 18px rgba(232, 197, 90, 0.7);
}
/* ===========================================
   HERO SECTION STYLES
   =========================================== */

/* Eyebrow text - small uppercase label */
.hw-eyebrow {
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--wp--preset--color--text-on-dark-muted, #B0ACA4);
    margin-bottom: var(--wp--preset--spacing--sm, 1rem);
}

/* Hero display title - large centered */
.hw-hero-title {
    font-size: clamp(3rem, 8vw, 5rem);
    font-weight: 400;
    line-height: 1.1;
    margin-bottom: var(--wp--preset--spacing--md, 1.5rem);
}

/* Hero symbol - larger version for hero section */
.hw-hero-symbol {
    width: 64px;
    height: 64px;
    margin: var(--wp--preset--spacing--lg, 2rem) auto;
}

.hw-hero-symbol img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(1.2) saturate(0.9);
}

/* Hero subtitle with decorative separators */
.hw-hero-subtitle {
    font-size: 1.125rem;
    letter-spacing: 0.05em;
    color: var(--wp--preset--color--text-on-dark, #F5F4F0);
    margin-bottom: var(--wp--preset--spacing--sm, 1rem);
}

/* Hero tagline - smaller italic */
.hw-hero-tagline {
    font-size: 1rem;
    font-style: italic;
    color: var(--wp--preset--color--text-on-dark-muted, #B0ACA4);
    margin-bottom: var(--wp--preset--spacing--lg, 2rem);
}

/* Hero CTA button styling */
.hw-btn-gold {
    background: transparent;
    border: 2px solid var(--wp--preset--color--accent-gold, #D4A94E);
    color: var(--wp--preset--color--accent-gold, #D4A94E);
    padding: 1rem 2.5rem;
    font-size: 0.875rem;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none;
    transition: all 0.3s ease;
    display: inline-block;
}

.hw-btn-gold:hover {
    background: var(--wp--preset--color--accent-gold, #D4A94E);
    color: var(--wp--preset--color--dark-base, #0F1612);
    box-shadow: 0 0 20px rgba(212, 169, 78, 0.4);
}
/* ===========================================
   SYMBOL BULLET ALIGNMENT
   =========================================== */

.hw-symbol-bullet {
    margin-top: 0.25em;
    flex-shrink: 0;
}

/* ===========================================
   JOURNEY SECTION - WEEK NUMBERS
   =========================================== */

.hw-week-number {
    opacity: 0.5;
    min-width: 80px;
    flex-shrink: 0;
}

.hw-week-row {
    align-items: flex-start;
}

/* Responsive: stack on mobile */
@media (max-width: 600px) {
    .hw-week-row {
        flex-direction: column !important;
    }
    
    .hw-week-number {
        min-width: auto;
    }
}

/* ===========================================
   GLOW LINE SEPARATOR
   =========================================== */

/* Override WP core 100px max-width on separators so editor width works */
.wp-block-separator.hw-glow-line-gold,
.wp-block-separator.hw-glow-line-magic,
.wp-block-separator.hw-glow-line-moon,
.wp-block-separator.hw-glow-line-fire {
    max-width: none !important;
}

.wp-block-separator.hw-glow-line-gold {
    border: none !important;
    height: 1px !important;
    min-height: 1px;
    background: linear-gradient(90deg, transparent, var(--wp--preset--color--accent-gold, #D4A94E), transparent) !important;
    box-shadow: 0 0 12px rgba(212, 169, 78, 0.5);

}

.wp-block-separator.hw-glow-line-magic {
    border: none !important;
    height: 1px !important;
    min-height: 1px;
    background: linear-gradient(90deg, transparent, var(--wp--preset--color--glow-magic, #7EB8E8), transparent) !important;
    box-shadow: 0 0 12px rgba(126, 184, 232, 0.5);

}

.wp-block-separator.hw-glow-line-moon {
    border: none !important;
    height: 1px !important;
    min-height: 1px;
    background: linear-gradient(90deg, transparent, var(--wp--preset--color--glow-moon, #C5D1DC), transparent) !important;
    box-shadow: 0 0 12px rgba(197, 209, 220, 0.5);

}

.wp-block-separator.hw-glow-line-fire {
    border: none !important;
    height: 1px !important;
    min-height: 1px;
    background: linear-gradient(90deg, transparent, var(--wp--preset--color--glow-fire, #D4722A), transparent) !important;
    box-shadow: 0 0 12px rgba(212, 114, 42, 0.5);

}

/* ===========================================
   SYMBOL DIVIDER FLEX LAYOUT
   For separators inside flex containers
   =========================================== */

.wp-block-uagb-container .wp-block-separator.hw-glow-line-magic,
.wp-block-uagb-container .wp-block-separator.hw-glow-line-gold,
.wp-block-uagb-container .wp-block-separator.hw-glow-line-moon,
.wp-block-uagb-container .wp-block-separator.hw-glow-line-fire {
    flex: 1;
    max-width: 200px;
    width: auto;
}

/* Ensure the divider container centers properly */
.uagb-block-what-is-divider {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ===========================================
   SPECTRA SEPARATOR GLOW LINES
   For uagb/separator blocks (not Core separator)
   =========================================== */

.wp-block-uagb-separator.hw-glow-line-magic .wp-block-uagb-separator__inner {
    border-color: transparent !important;
    background: linear-gradient(90deg, transparent, var(--wp--preset--color--glow-magic, #7EB8E8), transparent) !important;
    height: 1px !important;
    border: none !important;
    box-shadow: 0 0 12px rgba(126, 184, 232, 0.5);
}

.wp-block-uagb-separator.hw-glow-line-gold .wp-block-uagb-separator__inner {
    border-color: transparent !important;
    background: linear-gradient(90deg, transparent, var(--wp--preset--color--accent-gold, #D4A94E), transparent) !important;
    height: 1px !important;
    border: none !important;
    box-shadow: 0 0 12px rgba(212, 169, 78, 0.5);
}

.wp-block-uagb-separator.hw-glow-line-moon .wp-block-uagb-separator__inner {
    border-color: transparent !important;
    background: linear-gradient(90deg, transparent, var(--wp--preset--color--glow-moon, #C5D1DC), transparent) !important;
    height: 1px !important;
    border: none !important;
    box-shadow: 0 0 12px rgba(197, 209, 220, 0.5);
}

.wp-block-uagb-separator.hw-glow-line-fire .wp-block-uagb-separator__inner {
    border-color: transparent !important;
    background: linear-gradient(90deg, transparent, var(--wp--preset--color--glow-fire, #E88B5E), transparent) !important;
    height: 1px !important;
    border: none !important;
    box-shadow: 0 0 12px rgba(232, 139, 94, 0.5);
}

/* ===========================================
   SPECTRA SEPARATOR GLOW LINES - High Specificity
   Override Spectra-generated styles for glow effect
   =========================================== */

.wp-block-uagb-separator.hw-glow-line-magic:not(.wp-block-uagb-separator--text):not(.wp-block-uagb-separator--icon) .wp-block-uagb-separator__inner {
    border-top-color: transparent !important;
    border-top-style: none !important;
    background: linear-gradient(90deg, transparent, var(--wp--preset--color--glow-magic, #7EB8E8), transparent) !important;
    height: 1px !important;
    box-shadow: 0 0 12px rgba(126, 184, 232, 0.5);
}

.wp-block-uagb-separator.hw-glow-line-gold:not(.wp-block-uagb-separator--text):not(.wp-block-uagb-separator--icon) .wp-block-uagb-separator__inner {
    border-top-color: transparent !important;
    border-top-style: none !important;
    background: linear-gradient(90deg, transparent, var(--wp--preset--color--accent-gold, #D4A94E), transparent) !important;
    height: 1px !important;
    box-shadow: 0 0 12px rgba(212, 169, 78, 0.5);
}

.wp-block-uagb-separator.hw-glow-line-moon:not(.wp-block-uagb-separator--text):not(.wp-block-uagb-separator--icon) .wp-block-uagb-separator__inner {
    border-top-color: transparent !important;
    border-top-style: none !important;
    background: linear-gradient(90deg, transparent, var(--wp--preset--color--glow-moon, #C5D1DC), transparent) !important;
    height: 1px !important;
    box-shadow: 0 0 12px rgba(197, 209, 220, 0.5);
}

.wp-block-uagb-separator.hw-glow-line-fire:not(.wp-block-uagb-separator--text):not(.wp-block-uagb-separator--icon) .wp-block-uagb-separator__inner {
    border-top-color: transparent !important;
    border-top-style: none !important;
    background: linear-gradient(90deg, transparent, var(--wp--preset--color--glow-fire, #E88B5E), transparent) !important;
    height: 1px !important;
    box-shadow: 0 0 12px rgba(232, 139, 94, 0.5);
}