/* ========================================================================== MIK'ARBRE ÉLAGAGE — seasons.css Thèmes saisonniers : override des variables CSS selon la saison détectée Dépendances : style.css (définit les variables par défaut), js/seasons.js qui ajoute la classe .season-* sur ========================================================================== */ /* ============================================ PRINTEMPS (mars-mai) Pétales roses, vert frais, ambiance douce ============================================ */ body.season-spring { --season-hero-overlay: rgba(45, 80, 22, 0.6); --season-particle-color: #FFB7C5; --season-accent: #7CB342; } body.season-spring .hero-badge .dot { background: #FFB7C5; box-shadow: 0 0 12px #FFB7C5; } body.season-spring .season-tint { color: #7CB342; } /* ============================================ ÉTÉ (juin-août) Doré lumineux, soleil vibrant ============================================ */ body.season-summer { --season-hero-overlay: rgba(45, 80, 22, 0.5); --season-particle-color: #FFD54F; --season-accent: #F9A825; } body.season-summer .hero-badge .dot { background: #FFD54F; box-shadow: 0 0 12px #FFD54F; } body.season-summer .season-tint { color: #F9A825; } /* ============================================ AUTOMNE (septembre-novembre) Tons chauds, orangés, rouges ============================================ */ body.season-autumn { --season-hero-overlay: rgba(92, 64, 51, 0.6); --season-particle-color: #E65100; --season-accent: #BF360C; } body.season-autumn .hero-badge .dot { background: #E65100; box-shadow: 0 0 12px #E65100; } body.season-autumn .season-tint { color: #BF360C; } body.season-autumn .hero-overlay { background-image: linear-gradient(to bottom, rgba(92,64,51,0.2) 0%, var(--season-hero-overlay) 50%, rgba(62, 39, 35, 0.9) 100%); } /* ============================================ HIVER (décembre-février) Bleu froid, gris-bleu, sobriété ============================================ */ body.season-winter { --season-hero-overlay: rgba(55, 71, 79, 0.6); --season-particle-color: #ECEFF1; --season-accent: #607D8B; } body.season-winter .hero-badge .dot { background: #ECEFF1; box-shadow: 0 0 12px #ECEFF1; } body.season-winter .season-tint { color: #607D8B; } body.season-winter .hero-overlay { background-image: linear-gradient(to bottom, rgba(55,71,79,0.2) 0%, var(--season-hero-overlay) 50%, rgba(30, 42, 48, 0.95) 100%); } /* ============================================ SÉLECTION DE L'IMAGE HERO SELON LA SAISON Classes HTML : .v-spring / .v-summer / .v-autumn / .v-winter L'image correspondant à la saison active (body.season-*) passe en opacity 1. - Printemps → hero-elagueur-soleil-printemps - Été → hero-duo-grimpeurs-cedre - Automne + Hiver → hero-demontage-foret-sapin (image partagée, classes cumulées) ============================================ */ body.season-spring .hero-img-variant.v-spring, body.season-summer .hero-img-variant.v-summer, body.season-autumn .hero-img-variant.v-autumn, body.season-winter .hero-img-variant.v-winter { opacity: 1; } /* Couleurs saisonnières subtiles sur les accents de titre */ body.season-autumn .section-head h2::after { background: linear-gradient(90deg, #BF360C, #E65100); } body.season-winter .section-head h2::after { background: linear-gradient(90deg, #607D8B, #90A4AE); } body.season-spring .section-head h2::after { background: linear-gradient(90deg, #7CB342, #AED581); }