/* -----------------------------------------------------------------------------
   INSPIRE TRAVELS & TOURS - PAGE SECTION BACKGROUNDS
   -----------------------------------------------------------------------------

   Author: Zig Zag AI
   Description: Decorative page section backgrounds: footer, canopy sections, hero, and ambient particles
   Purpose: Groups every large background and atmosphere effect used behind page sections
   Loaded directly by each page with the shared component styles

   Table of Contents:
    1. GoWilds Footer
    2. Tour Light Canopy
    3. Gallery Transition Canopy
    4. Cinematic Hero Background
    5. Section Specific Ambient Particles
    6. Responsive Adjustments

   -----------------------------------------------------------------------------
*/

/* GoWilds Footer Styling — Tropical Dusk Canopy */
.gowilds-footer {
    /* Multi-layer background stack (bottom → top):
       1. Base gradient: deep jungle → teal → near-black
       2. Golden accent glow: warm radial spotlight upper-left
       3. Organic grain texture: fine radial dot pattern
       4. Film grain noise texture: overall tactile feel */
    background-color: #1D231F;
    background-image:
        /* Subtle Film Grain Noise Texture */
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.015'/%3E%3C/svg%3E"),
        /* Layer 3 — Organic grain / spore texture */
        radial-gradient(circle at 20% 50%, rgba(255, 255, 255, 0.035) 1.2px, transparent 1.2px),
        radial-gradient(circle at 80% 30%, rgba(255, 255, 255, 0.025) 1.2px, transparent 1.2px),
        radial-gradient(circle at 50% 70%, rgba(255, 255, 255, 0.02) 1.2px, transparent 1.2px),
        /* Layer 2 — Golden accent glow (warm light filtering through canopy) */
        radial-gradient(ellipse at 15% 10%, rgba(247, 146, 30, 0.12) 0%, transparent 55%),
        radial-gradient(ellipse at 85% 90%, rgba(247, 146, 30, 0.08) 0%, transparent 45%),
        /* Layer 1 — Base gradient */
        linear-gradient(175deg, #2a3a2e 0%, #1D231F 30%, #181e1a 60%, #131916 100%);
    background-size:
        180px 180px,
        30px 30px,
        25px 25px,
        20px 20px,
        100% 100%,
        100% 100%,
        100% 100%;
    background-position:
        0 0,
        0 0,
        13px 13px,
        7px 7px,
        center,
        center,
        center;
    background-repeat:
        repeat,
        repeat,
        repeat,
        repeat,
        no-repeat,
        no-repeat,
        no-repeat;
    color: #FFFFFF;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    /* Scroll-driven parallax offsets (set by JS, with safe defaults) */
    --leaf-tx: 0px;
    --leaf-ty: 0px;
    --fly-tx: 0px;
    --fly-ty: 0px;
}

/* Animated tropical leaf overlay — gentle sway with depth (positioned in left/right margins) */
.gowilds-footer::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        /* Left Margin — Premium Detailed Monstera Silhouette (dark bg cutouts) */
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 600'%3E%3Cpath d='M-50 120 Q100 130 140 220 C180 310 130 420 180 500 L-50 560 Z' fill='%2390c98a' opacity='0.05'/%3E%3Cpath d='M-50 160 C20 170 80 200 90 230 C50 250 10 260 -50 280 Z' fill='%2390c98a' opacity='0.07'/%3E%3Cpath d='M-50 240 C30 250 100 290 110 330 C60 350 20 360 -50 370 Z' fill='%2390c98a' opacity='0.07'/%3E%3Cpath d='M-50 320 C40 330 110 380 120 420 C70 440 30 450 -50 460 Z' fill='%2390c98a' opacity='0.07'/%3E%3Cpath d='M-50 400 C50 410 100 470 110 510 C60 520 20 530 -50 540 Z' fill='%2390c98a' opacity='0.07'/%3E%3Ccircle cx='30' cy='280' r='14' fill='%231D231F'/%3E%3Ccircle cx='10' cy='360' r='12' fill='%231D231F'/%3E%3Ccircle cx='50' cy='430' r='10' fill='%231D231F'/%3E%3C/svg%3E"),
        /* Right Margin — Premium Detailed Palm Frond Silhouette */
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 600'%3E%3Cpath d='M350 80 Q160 200 200 420 Q220 510 170 600' fill='none' stroke='%2390c98a' stroke-width='4' opacity='0.12'/%3E%3Cpath d='M200 180 Q80 160 40 150 Q120 190 200 200' fill='%2390c98a' opacity='0.08'/%3E%3Cpath d='M195 230 Q70 215 20 200 Q115 240 195 250' fill='%2390c98a' opacity='0.08'/%3E%3Cpath d='M190 280 Q60 265 0 250 Q110 295 190 300' fill='%2390c98a' opacity='0.08'/%3E%3Cpath d='M188 330 Q50 315 -20 300 Q105 345 188 350' fill='%2390c98a' opacity='0.08'/%3E%3Cpath d='M190 380 Q65 370 -10 360 Q115 395 190 400' fill='%2390c98a' opacity='0.08'/%3E%3Cpath d='M195 435 Q80 430 10 420 Q120 450 195 455' fill='%2390c98a' opacity='0.08'/%3E%3Cpath d='M202 180 Q290 190 340 200 Q260 175 202 170' fill='%2390c98a' opacity='0.08'/%3E%3Cpath d='M205 230 Q300 245 350 260 Q270 225 205 220' fill='%2390c98a' opacity='0.08'/%3E%3Cpath d='M208 280 Q310 300 360 320 Q280 275 208 270' fill='%2390c98a' opacity='0.08'/%3E%3Cpath d='M210 330 Q320 355 370 380 Q290 325 210 320' fill='%2390c98a' opacity='0.08'/%3E%3C/svg%3E");
    background-repeat: no-repeat, no-repeat;
    pointer-events: none;
    z-index: 0;
    animation: footer-sway 20s ease-in-out infinite;
    will-change: transform;
}

/* Firefly particles — depth float effect (distributed in left/right margins) */
.gowilds-footer::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        /* Left side fireflies */
        radial-gradient(circle 4px at 6% 20%, rgba(247, 200, 80, 0.95) 0%, rgba(247, 200, 80, 0.3) 45%, transparent 100%),
        radial-gradient(circle 3.5px at 10% 60%, rgba(247, 200, 80, 0.9) 0%, rgba(247, 200, 80, 0.2) 50%, transparent 100%),
        radial-gradient(circle 3px at 12% 85%, rgba(180, 220, 160, 0.8) 0%, rgba(180, 220, 160, 0.2) 50%, transparent 100%),
        /* Right side fireflies */
        radial-gradient(circle 3.5px at 94% 35%, rgba(180, 220, 160, 0.85) 0%, rgba(180, 220, 160, 0.25) 45%, transparent 100%),
        radial-gradient(circle 4px at 90% 75%, rgba(247, 146, 30, 0.85) 0%, rgba(247, 146, 30, 0.2) 45%, transparent 100%),
        radial-gradient(circle 2.5px at 88% 15%, rgba(247, 200, 80, 0.7) 0%, rgba(247, 200, 80, 0.1) 50%, transparent 100%),
        radial-gradient(circle 3px at 95% 85%, rgba(180, 220, 160, 0.7) 0%, transparent 100%);
    background-size: 100% 100%;
    pointer-events: none;
    z-index: 0;
    animation: footer-fireflies 12s ease-in-out infinite;
    will-change: transform, opacity;
}
/* Ensure footer content stays above decorative layers */
/* Ensure footer content stays above decorative layers */
.gowilds-footer>* {
    position: relative;
    z-index: 1;
}

.gowilds-footer .widget-title {
    color: #FFFFFF;
}

.gowilds-footer .footer-widget-nav {
    display: grid !important;
    gap: 0.28rem !important;
    margin: 0;
    padding: 0;
}

.gowilds-footer .footer-widget-nav.space-y-2 {
    gap: 0.28rem !important;
}

.gowilds-footer .footer-widget-nav li {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.25 !important;
}

.gowilds-footer .footer-widget-nav a {
    display: inline-block;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.88rem;
    line-height: 1.35;
    padding-block: 0.15rem;
    transition: color 160ms ease, transform 160ms ease;
}

.gowilds-footer .footer-widget-nav a:hover {
    color: #F7921E;
    transform: translateX(2px);
}
.gowilds-footer p {
    color: rgba(255, 255, 255, 0.8);
}

.gowilds-footer .info .title {
    color: #FFFFFF;
}

.footer-contact-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
    align-items: center;
}

.footer-contact-grid > *,
.footer-contact-grid .info {
    min-width: 0;
}

.footer-contact-grid .info a {
    overflow-wrap: anywhere;
}

.footer-contact-icon {
    position: relative;
    z-index: 3;
    display: flex;
    flex-shrink: 0;
    margin-top: 0.25rem;
    border-radius: 0.75rem;
    color: #ffffff;
    transition: transform 150ms cubic-bezier(0.23, 1, 0.32, 1);
}

.footer-contact-icon:hover,
.footer-contact-icon:focus-visible {
    transform: translateY(-0.18rem);
}

.footer-contact-icon:hover .liquid-glass,
.footer-contact-icon:focus-visible .liquid-glass {
    border-color: rgba(214, 164, 95, 0.62) !important;
    color: #ffffff;
    background: rgba(214, 164, 95, 0.18) !important;
}

.footer-contact-icon:focus-visible {
    outline: 2px solid #d6a45f;
    outline-offset: 4px;
}

.footer-contact-icon:active {
    transform: scale(0.97);
}

.single-info-item:has(.footer-contact-icon:hover) .info .title,
.single-info-item:has(.footer-contact-icon:focus-visible) .info .title {
    color: #d6a45f;
}

@media (min-width: 768px) {
    .footer-contact-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1280px) {
    .footer-contact-grid {
        grid-template-columns:
            minmax(14rem, 1.05fr)
            minmax(18rem, 1.35fr)
            minmax(13rem, 0.9fr)
            minmax(12rem, auto);
        column-gap: clamp(2rem, 3vw, 4rem);
    }

    .footer-contact-grid .social-box {
        justify-self: end;
        text-align: right;
    }

    .footer-contact-grid .social-box > div {
        justify-content: flex-end;
    }
}

/* Light Background Section — Tropical Canopy */
.tour-light-canopy {
    background-color: #fbf9f4;
    /* Soft transitional vertical gradient + grain + noise texture */
    background-image:
        /* Subtle Film Grain Noise Texture */
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.015'/%3E%3C/svg%3E"),
        radial-gradient(circle at 10% 30%, rgba(23, 53, 40, 0.035) 1.2px, transparent 1.2px),
        radial-gradient(circle at 90% 70%, rgba(23, 53, 40, 0.03) 1.2px, transparent 1.2px),
        radial-gradient(circle at 50% 50%, rgba(23, 53, 40, 0.025) 1.2px, transparent 1.2px),
        /* Subtle champagne & whisper sage ambient radiance */
        radial-gradient(ellipse at 85% 15%, rgba(234, 192, 120, 0.10) 0%, transparent 60%),
        radial-gradient(ellipse at 15% 85%, rgba(100, 145, 125, 0.07) 0%, transparent 50%),
        /* Base luxury warm alabaster parchment */
        linear-gradient(180deg, #fdfcf9 0%, #faf8f2 50%, #f5f2e9 100%);
    background-size:
        180px 180px,
        40px 40px,
        35px 35px,
        30px 30px,
        100% 100%,
        100% 100%,
        100% 100%;
    background-position:
        0 0,
        0 0,
        17px 17px,
        9px 9px,
        center,
        center,
        center;
    background-repeat:
        repeat,
        repeat,
        repeat,
        repeat,
        no-repeat,
        no-repeat,
        no-repeat;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    /* Scroll-driven parallax offsets (set by JS, with safe defaults) */
    --leaf-tx: 0px;
    --leaf-ty: 0px;
    --fly-tx: 0px;
    --fly-ty: 0px;
}

/* Light canopy animated overlays (positioned in left/right margins) */
.tour-light-canopy::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        /* Left Margin — Premium Detailed Monstera Silhouette (cream bg cutouts) */
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 600'%3E%3Cpath d='M-50 120 Q100 130 140 220 C180 310 130 420 180 500 L-50 560 Z' fill='%232b3d26' opacity='0.05'/%3E%3Cpath d='M-50 160 C20 170 80 200 90 230 C50 250 10 260 -50 280 Z' fill='%232b3d26' opacity='0.07'/%3E%3Cpath d='M-50 240 C30 250 100 290 110 330 C60 350 20 360 -50 370 Z' fill='%232b3d26' opacity='0.07'/%3E%3Cpath d='M-50 320 C40 330 110 380 120 420 C70 440 30 450 -50 460 Z' fill='%232b3d26' opacity='0.07'/%3E%3Cpath d='M-50 400 C50 410 100 470 110 510 C60 520 20 530 -50 540 Z' fill='%232b3d26' opacity='0.07'/%3E%3Ccircle cx='30' cy='280' r='14' fill='%23FBFAE0'/%3E%3Ccircle cx='10' cy='360' r='12' fill='%23FBFAE0'/%3E%3Ccircle cx='50' cy='430' r='10' fill='%23FBFAE0'/%3E%3C/svg%3E"),
        /* Right Margin — Premium Detailed Palm Frond Silhouette */
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 600'%3E%3Cpath d='M350 80 Q160 200 200 420 Q220 510 170 600' fill='none' stroke='%232b3d26' stroke-width='4' opacity='0.06'/%3E%3Cpath d='M200 180 Q80 160 40 150 Q120 190 200 200' fill='%232b3d26' opacity='0.04'/%3E%3Cpath d='M195 230 Q70 215 20 200 Q115 240 195 250' fill='%232b3d26' opacity='0.04'/%3E%3Cpath d='M190 280 Q60 265 0 250 Q110 295 190 300' fill='%232b3d26' opacity='0.04'/%3E%3Cpath d='M188 330 Q50 315 -20 300 Q105 345 188 350' fill='%232b3d26' opacity='0.04'/%3E%3Cpath d='M190 380 Q65 370 -10 360 Q115 395 190 400' fill='%232b3d26' opacity='0.04'/%3E%3Cpath d='M195 435 Q80 430 10 420 Q120 450 195 455' fill='%232b3d26' opacity='0.04'/%3E%3Cpath d='M202 180 Q290 190 340 200 Q260 175 202 170' fill='%232b3d26' opacity='0.04'/%3E%3Cpath d='M205 230 Q300 245 350 260 Q270 225 205 220' fill='%232b3d26' opacity='0.04'/%3E%3Cpath d='M208 280 Q310 300 360 320 Q280 275 208 270' fill='%232b3d26' opacity='0.04'/%3E%3Cpath d='M210 330 Q320 355 370 380 Q290 325 210 320' fill='%232b3d26' opacity='0.04'/%3E%3C/svg%3E");
    background-repeat: no-repeat, no-repeat;
    pointer-events: none;
    z-index: 0;
    animation: footer-sway 22s ease-in-out infinite;
    will-change: transform;
}

.tour-light-canopy::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        /* Left side pollen spores */
        radial-gradient(circle 4px at 6% 25%, rgba(218, 165, 32, 0.95) 0%, rgba(218, 165, 32, 0.3) 50%, transparent 100%),
        radial-gradient(circle 3.5px at 12% 75%, rgba(245, 124, 0, 0.95) 0%, rgba(245, 124, 0, 0.3) 50%, transparent 100%),
        /* Right side pollen spores */
        radial-gradient(circle 4.5px at 94% 45%, rgba(46, 125, 50, 0.9) 0%, rgba(46, 125, 50, 0.3) 50%, transparent 100%),
        radial-gradient(circle 5px at 88% 85%, rgba(46, 125, 50, 0.85) 0%, rgba(46, 125, 50, 0.2) 50%, transparent 100%),
        radial-gradient(circle 3px at 92% 15%, rgba(218, 165, 32, 0.8) 0%, transparent 100%);
    background-size: 100% 100%;
    pointer-events: none;
    z-index: 0;
    animation: footer-fireflies 14s ease-in-out infinite;
    will-change: transform, opacity;
}

/* Ensure content stays above overlays */
.tour-light-canopy>* {
    position: relative;
    z-index: 1;
}

/* Cinematic Hero Background Transitions (Ken Burns Effect) */
.hero-bg-layer {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: opacity 2.8s cubic-bezier(0.22, 1, 0.36, 1), transform 18s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.hero-bg-inactive {
    opacity: 0;
    transform: scale(1.075);
    z-index: 0;
}

.hero-bg-active {
    opacity: 1;
    transform: scale(1.015);
    z-index: 1;
}

@media (prefers-reduced-motion: reduce) {
    .hero-bg-layer {
        transition-duration: 0.01ms;
        transform: none;
    }
}

.gowilds-footer .tech-metadata {
    color: #90c98a;
    border-color: rgba(144, 201, 138, 0.3);
    background: rgba(29, 35, 31, 0.8);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3);
}

.gowilds-footer .grid-guide-line {
    background: linear-gradient(to bottom, transparent, rgba(144, 201, 138, 0.06) 15%, rgba(144, 201, 138, 0.06) 85%, transparent);
}

.gowilds-footer .tech-metadata-inline {
    color: #90c98a;
    background: rgba(144, 201, 138, 0.08);
    border-color: rgba(144, 201, 138, 0.2);
}

/* Ensure content stays above overlays for dark sections */
.gowilds-footer>* {
    position: relative;
    z-index: 2;
    /* Ensure it stays above the leaf and firefly layers */
}
/* Dynamic Section-Specific Ambient Spores and Particle Patterns */
/* 1. Tours (Sigiriya - Golden & Emerald Spores - 10 Glow Particles) */
#tours::after {
    background-image:
        radial-gradient(circle 10px at 8% 25%, rgba(247, 146, 30, 0.9) 0%, rgba(247, 146, 30, 0.35) 45%, transparent 75%),
        radial-gradient(circle 8px at 14% 60%, rgba(99, 171, 69, 0.95) 0%, rgba(99, 171, 69, 0.3) 50%, transparent 80%),
        radial-gradient(circle 7px at 6% 80%, rgba(247, 146, 30, 1) 0%, rgba(247, 146, 30, 0.4) 40%, transparent 70%),
        radial-gradient(circle 12px at 92% 30%, rgba(99, 171, 69, 0.9) 0%, rgba(99, 171, 69, 0.35) 45%, transparent 75%),
        radial-gradient(circle 9px at 86% 70%, rgba(247, 146, 30, 0.9) 0%, rgba(247, 146, 30, 0.3) 50%, transparent 80%),
        radial-gradient(circle 6px at 94% 85%, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.4) 40%, transparent 70%),
        radial-gradient(circle 9px at 18% 28%, rgba(247, 146, 30, 0.85) 0%, rgba(247, 146, 30, 0.2) 45%, transparent 75%),
        radial-gradient(circle 11px at 88% 40%, rgba(99, 171, 69, 0.9) 0%, rgba(99, 171, 69, 0.3) 50%, transparent 80%),
        radial-gradient(circle 8px at 11% 90%, rgba(255, 255, 255, 0.9) 0%, transparent 75%),
        radial-gradient(circle 9px at 91% 95%, rgba(247, 146, 30, 0.85) 0%, transparent 75%);
    animation: fireflies-path-b 16s ease-in-out infinite !important;
}

/* Offers (Emerald & Amber Fireflies Spores) */
#offers::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    background-image:
        radial-gradient(circle 10px at 7% 20%, rgba(16, 185, 129, 0.9) 0%, rgba(16, 185, 129, 0.35) 45%, transparent 75%),
        radial-gradient(circle 8px at 14% 65%, rgba(245, 158, 11, 0.95) 0%, rgba(245, 158, 11, 0.3) 50%, transparent 80%),
        radial-gradient(circle 11px at 93% 30%, rgba(16, 185, 129, 0.9) 0%, rgba(16, 185, 129, 0.35) 40%, transparent 75%),
        radial-gradient(circle 9px at 87% 75%, rgba(245, 158, 11, 0.95) 0%, rgba(245, 158, 11, 0.3) 50%, transparent 80%),
        radial-gradient(circle 8px at 18% 85%, rgba(255, 255, 255, 0.9) 0%, transparent 75%),
        radial-gradient(circle 9px at 91% 90%, rgba(16, 185, 129, 0.85) 0%, transparent 75%);
    background-size: 100% 100%;
    animation: fireflies-path-a 17s ease-in-out infinite !important;
}

/* Destinations (Teal & Golden Fireflies Spores) */
#destinations::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    background-image:
        radial-gradient(circle 11px at 8% 30%, rgba(14, 165, 233, 0.9) 0%, rgba(14, 165, 233, 0.35) 45%, transparent 75%),
        radial-gradient(circle 9px at 15% 70%, rgba(245, 158, 11, 0.95) 0%, rgba(245, 158, 11, 0.3) 50%, transparent 80%),
        radial-gradient(circle 10px at 91% 25%, rgba(14, 165, 233, 0.9) 0%, rgba(14, 165, 233, 0.35) 40%, transparent 75%),
        radial-gradient(circle 8px at 86% 80%, rgba(245, 158, 11, 0.95) 0%, rgba(245, 158, 11, 0.3) 50%, transparent 80%),
        radial-gradient(circle 7px at 12% 85%, rgba(255, 255, 255, 0.9) 0%, transparent 75%),
        radial-gradient(circle 9px at 94% 85%, rgba(14, 165, 233, 0.85) 0%, transparent 75%);
    background-size: 100% 100%;
    animation: fireflies-path-c 19s ease-in-out infinite !important;
}

/* 2. About (Colombo - White & Light-Green Fireflies with leaf silhouettes) */
#about::after {
    background-image:
        radial-gradient(circle 11px at 7% 30%, rgba(144, 201, 138, 0.95) 0%, rgba(144, 201, 138, 0.4) 45%, transparent 75%),
        radial-gradient(circle 9px at 15% 75%, rgba(251, 191, 36, 0.95) 0%, rgba(251, 191, 36, 0.35) 50%, transparent 80%),
        radial-gradient(circle 10px at 91% 20%, rgba(251, 191, 36, 0.9) 0%, rgba(251, 191, 36, 0.35) 45%, transparent 75%),
        radial-gradient(circle 8px at 85% 65%, rgba(144, 201, 138, 0.95) 0%, rgba(144, 201, 138, 0.3) 50%, transparent 80%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 40 40'%3E%3Cpath d='M10 20 Q20 15 20 5 Q20 25 30 20 Z' fill='%2390c98a' opacity='0.16'/%3E%3C/svg%3E");
    background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100px 100px;
    background-position: center, center, center, center, 10% 55%;
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
    animation: fireflies-path-c 18s ease-in-out infinite !important;
}

/* 4. Adventure (Ella - Amber Embers & Jungle Leaf Shapes) */
#adventure::after {
    background-image:
        radial-gradient(circle 11px at 8% 20%, rgba(249, 115, 22, 0.95) 0%, rgba(249, 115, 22, 0.35) 40%, transparent 75%),
        radial-gradient(circle 9px at 15% 70%, rgba(250, 204, 21, 0.95) 0%, rgba(250, 204, 21, 0.3) 50%, transparent 80%),
        radial-gradient(circle 10px at 91% 40%, rgba(250, 204, 21, 0.9) 0%, rgba(250, 204, 21, 0.35) 40%, transparent 75%),
        radial-gradient(circle 8px at 86% 75%, rgba(249, 115, 22, 0.95) 0%, rgba(249, 115, 22, 0.3) 50%, transparent 80%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 40 40'%3E%3Cpath d='M20 10 C10 10 5 20 20 35 C35 20 30 10 20 10' fill='%23f97316' opacity='0.18'/%3E%3C/svg%3E");
    background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 90px 90px;
    background-position: center, center, center, center, 8% 50%;
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
    animation: fireflies-path-a 20s ease-in-out infinite !important;
}

/* Mobile Screen Sizes (< 768px) */
@media (max-width: 767px) {

    .gowilds-footer::before,
    .tour-light-canopy::before {
        background-size: 110px 220px, 110px 220px !important;
        background-position: left -30px top 20%, right -30px top 65% !important;
    }

    .gowilds-footer::after,
    .tour-light-canopy::after,
    #home::after {
        opacity: 0.55 !important;
    }

}

/* Tablet Screen Sizes (768px - 1023px) */
@media (min-width: 768px) and (max-width: 1023px) {

    .gowilds-footer::before,
    .tour-light-canopy::before {
        background-size: 180px 360px, 180px 360px !important;
        background-position: left -40px top 20%, right -40px top 65% !important;
    }

    .gowilds-footer::after,
    .tour-light-canopy::after,
    #home::after {
        opacity: 0.75 !important;
    }
}

/* Desktop Screen Sizes (>= 1024px) */
@media (min-width: 1024px) {

    .gowilds-footer::before,
    .tour-light-canopy::before {
        background-size: 320px 640px, 320px 640px !important;
        background-position: left -50px top 15%, right -50px top 55% !important;
    }
}

#home::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(circle 10px at 12% 25%, rgba(251, 191, 36, 0.75) 0%, rgba(251, 191, 36, 0.2) 40%, transparent 70%),
        radial-gradient(circle 8px at 90% 30%, rgba(144, 201, 138, 0.8) 0%, rgba(144, 201, 138, 0.2) 45%, transparent 75%),
        radial-gradient(circle 9px at 15% 70%, rgba(251, 191, 36, 0.8) 0%, rgba(251, 191, 36, 0.2) 40%, transparent 70%),
        radial-gradient(circle 10px at 85% 65%, rgba(144, 201, 138, 0.85) 0%, rgba(144, 201, 138, 0.2) 50%, transparent 75%),
        radial-gradient(circle 7px at 28% 45%, rgba(251, 191, 36, 0.8) 0%, transparent 70%),
        radial-gradient(circle 9px at 72% 50%, rgba(144, 201, 138, 0.85) 0%, transparent 70%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 40 40'%3E%3Cpath d='M10 20 Q20 15 20 5 Q20 25 30 20 Z' fill='%2390c98a' opacity='0.12'/%3E%3C/svg%3E");
    background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100px 100px;
    background-position: center, center, center, center, center, center, 10% 40%;
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
    pointer-events: none;
    z-index: 15;
    animation: fireflies-path-a 14s ease-in-out infinite !important;
    will-change: transform, opacity;
}

/* Organic Section Transition Curved Boundary */
.section-curve-receiver {
    --section-curve-height: 20px;
    --section-curve-base-padding: 3.5rem;
    --section-curve-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'%3E%3Cpath d='M0 19C270 43 470 58 720 54C985 50 1170 20 1440 19V64H0Z' fill='white'/%3E%3C/svg%3E");
    margin-top: calc(-1 * var(--section-curve-height));
    padding-top: calc(var(--section-curve-base-padding) + var(--section-curve-height)) !important;
    -webkit-mask-image:
        var(--section-curve-mask),
        linear-gradient(#000, #000);
    mask-image:
        var(--section-curve-mask),
        linear-gradient(#000, #000);
    -webkit-mask-size:
        100% var(--section-curve-height),
        100% calc(100% - var(--section-curve-height) + 1px);
    mask-size:
        100% var(--section-curve-height),
        100% calc(100% - var(--section-curve-height) + 1px);
    -webkit-mask-position: top left, bottom left;
    mask-position: top left, bottom left;
    -webkit-mask-repeat: no-repeat, no-repeat;
    mask-repeat: no-repeat, no-repeat;
}

.section-curve-drift {
    --section-curve-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'%3E%3Cpath d='M0 31C230 15 430 12 650 29C890 48 1120 55 1440 25V64H0Z' fill='white'/%3E%3C/svg%3E");
}

.section-curve-crest {
    --section-curve-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'%3E%3Cpath d='M0 24C235 43 470 48 700 28C930 8 1180 13 1440 34V64H0Z' fill='white'/%3E%3C/svg%3E");
}

#about.section-curve-receiver {
    --section-curve-base-padding: 4rem;
}

#gallery.section-curve-receiver,
#adventure.section-curve-receiver,
#reviews.section-curve-receiver {
    --section-curve-base-padding: 5rem;
}

@media (max-width: 767px) {
    .section-curve-receiver {
        --section-curve-height: 20px;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .section-curve-receiver {
        --section-curve-height: 30px;
        --section-curve-base-padding: 5rem;
    }

    #about.section-curve-receiver {
        --section-curve-base-padding: 6rem;
    }

    #gallery.section-curve-receiver,
    #reviews.section-curve-receiver {
        --section-curve-base-padding: 7rem;
    }
}

@media (min-width: 1024px) {
    .section-curve-receiver {
        --section-curve-height: clamp(36px, 3.2vw, 50px);
        --section-curve-base-padding: 5rem;
    }

    #about.section-curve-receiver {
        --section-curve-base-padding: 6rem;
    }

    #gallery.section-curve-receiver,
    #reviews.section-curve-receiver {
        --section-curve-base-padding: 7rem;
    }
}

@media (max-width: 375px) {
    /* Hero heading, prevent overflow on very small widths */
    /* Hero heading — prevent overflow on very small widths */
    #home h1 {
        font-size: clamp(1.65rem, 8vw, 2.25rem);
        line-height: 1.2;
    }

    /* Hero subtitle — tighten font for narrow screens */
    #home p {
        font-size: 0.875rem;
        line-height: 1.6;
    }

    /* Stat tiles — reduce vertical padding */
    #home .liquid-glass.rounded-2xl {
        padding: 0.5rem 0.4rem;
    }

}

@media (max-width: 320px) {
    /* Hero heading — even tighter */
    #home h1 {
        font-size: clamp(1.4rem, 9vw, 1.8rem);
    }

    /* Hero subtitle */
    #home p {
        font-size: 0.8rem;
    }
}