/* Brothers Lawn and Tree Service - holiday-season.css
 *
 * Loaded ONLY when the effective site season is holiday (template.php gates the
 * <link> on $br_season === 'holiday'), AFTER styles.css + cms-sections.css.
 *
 * Rules:
 * - Every selector is scoped under [data-site-season="holiday"] so this file can
 *   never affect the standard site (it is not even requested in standard mode).
 * - The Brothers brand is preserved: dark green, Brothers green, orange CTA, the
 *   existing type and components are untouched. Holiday adds a restrained warm-gold
 *   and deep-red ACCENT layer; the photography carries the seasonal feeling.
 * - No novelty template: no snow, no red page background, no clip-art, no glowing
 *   borders, no gratuitous motion. Motion (if any is added later) respects
 *   prefers-reduced-motion.
 * - Zero layout impact in this foundation layer: accents use inset box-shadow and
 *   color, never properties that change box sizing.
 */

[data-site-season="holiday"] {
    /* Restrained seasonal accents. Brand tokens (--green/--orange/...) are left as-is. */
    --holiday-gold: #c9a227;
    --holiday-gold-soft: #e6cf7a;
    --holiday-red: #9e2b25;      /* deep, muted red - not fire-engine red */
    --holiday-red-soft: #b8433c;
    --holiday-evergreen: #0f2c1c;
}

/* A quiet warm-gold hairline at the very top of the sticky header. Inset shadow =
   no layout shift, no effect on the sticky offset. */
[data-site-season="holiday"] .site-header {
    box-shadow: inset 0 4px 0 0 var(--holiday-gold), 0 1px 0 rgba(0,0,0,0.04);
}

/* Holiday home hero: swap the background photo for a decorated-home night shot, keeping
   the same dark gradient stack (slightly deepened) so the white/green hero title stays
   legible. The holiday hero COPY + secondary CTA come from the section's holiday_override. */
[data-site-season="holiday"] .hero-bg {
    background:
        linear-gradient(to top, rgba(6,12,7,.90) 0%, rgba(6,12,7,.46) 32%, rgba(6,12,7,.06) 60%),
        linear-gradient(to right, rgba(6,12,7,.92) 0%, rgba(6,12,7,.60) 45%, rgba(6,12,7,.16) 100%),
        url('assets/holiday-1.webp') center 42% / cover no-repeat;
}
@media (max-width: 768px) {
    [data-site-season="holiday"] .hero-bg {
        background:
            linear-gradient(to top, rgba(6,12,7,.90) 0%, rgba(6,12,7,.46) 32%, rgba(6,12,7,.06) 60%),
            linear-gradient(to right, rgba(6,12,7,.92) 0%, rgba(6,12,7,.60) 45%, rgba(6,12,7,.16) 100%),
            url('assets/holiday-1.webp') center 42% / cover no-repeat;
    }
}

/* Utility hooks the seasonal content stages (hero eyebrow, section kickers, the
   Christmas page) opt into deliberately. Inert until markup uses them, so they add
   nothing on their own. */
[data-site-season="holiday"] .br-holiday-accent { color: var(--holiday-red); }
[data-site-season="holiday"] .br-holiday-kicker {
    color: var(--holiday-gold);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* Footer season switch (markup added in _br-footer.php). A quiet, non-decorative
   link, legible on the dark-green footer, keyboard-focusable. */
.br-season-switch {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    margin-top: 0.75rem;
    font-size: 0.85rem;
    line-height: 1.3;
    color: rgba(255, 255, 255, 0.78);
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-color: rgba(255, 255, 255, 0.35);
}
.br-season-switch:hover,
.br-season-switch:focus-visible {
    color: #ffffff;
    text-decoration-color: var(--holiday-gold, #c9a227);
}
.br-season-switch:focus-visible {
    outline: 2px solid var(--holiday-gold, #c9a227);
    outline-offset: 2px;
    border-radius: 2px;
}

/* Holiday hero on mobile: .hero-trust is pinned absolutely (bottom:106px) against the
   standard 820px min-height, tuned for the 2-line standard title. The holiday hero is taller
   (3-line "CHRISTMAS LIGHT INSTALLATION" + longer subhead + a longer secondary CTA), so the
   actions were overlapping the trust bar by ~64px (measured). Raising ONLY the holiday hero's
   mobile min-height drops the pinned trust bar below the actions with a comfortable gap, with
   no change to the standard hero. */
@media (max-width: 768px) {
    [data-site-season="holiday"] .hero { min-height: 960px; }
}

@media (prefers-reduced-motion: reduce) {
    [data-site-season="holiday"] * {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
    }
}

/* Holiday mode: a restrained garland swag across the top of the global footer, so every
   holiday page (home included) carries a festive footer, echoing the approved mockup.
   Scoped to holiday, so the standard footer is untouched. */
[data-site-season="holiday"] .footer{position:relative}
[data-site-season="holiday"] .footer::before{content:"";position:absolute;top:-6px;left:50%;transform:translateX(-50%);width:min(1500px,96%);height:86px;background:url('assets/decor-garland.webp') center top/contain no-repeat;pointer-events:none;opacity:.92;z-index:3;filter:drop-shadow(0 4px 10px rgba(0,0,0,.4))}
[data-site-season="holiday"] .footer .footer-inner{position:relative;z-index:2;padding-top:64px}
@media(max-width:860px){[data-site-season="holiday"] .footer::before{height:52px}[data-site-season="holiday"] .footer .footer-inner{padding-top:44px}}