/* Habillage de Noël — Petite Graine (activé par noel.js jusqu'au 6 janvier 2027) */

/* Éléments « Noël uniquement » : disparaissent d'eux-mêmes après la période */
html.hors-noel .noel-only{display:none!important}

/* ---------- Guirlande de sapin et boules dans le héro ---------- */
.noel-guirlande{position:absolute;top:0;left:0;right:0;height:calc(max(100vw,760px)*.1167);overflow:hidden;pointer-events:none;z-index:3}
.noel-guirlande svg{position:absolute;top:0;left:50%;width:max(100%,760px);height:auto;transform:translateX(-50%);display:block}
.noel-guirlande .b{transform-box:fill-box;transform-origin:50% 0;animation:noel-balance var(--d,3.6s) ease-in-out var(--o,0s) infinite alternate}
.noel-guirlande .l{animation:noel-scintille 3s ease-in-out var(--o,0s) infinite}
@keyframes noel-balance{from{transform:rotate(-2.8deg)}to{transform:rotate(2.8deg)}}
html.noel .hero__in{padding-top:calc(max(100vw,760px)*.1167 + 1.6rem)}

/* ---------- Neige : calque fixe, les flocons ne s'affichent jamais sur les photos ---------- */
.noel-neige-cv{position:fixed;left:0;top:0;pointer-events:none;z-index:20}

/* ---------- Frises sous les sections (composées en JS à la largeur exacte de l'écran) ---------- */
html.noel .section{position:relative}
.noel-frise{display:block;position:relative;height:clamp(92px,8vw,112px);margin-top:clamp(1.2rem,3vw,2.2rem);margin-bottom:calc(-1 * clamp(2rem,5vw,4.2rem));pointer-events:none}
.noel-frise::after{content:"";position:absolute;left:0;right:0;bottom:0;height:16px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='16' viewBox='0 0 64 16'%3E%3Cpath d='M0 16V9Q16 1 32 9T64 9V16Z' fill='%23fff'/%3E%3Cpath d='M0 9Q16 1 32 9T64 9' fill='none' stroke='%238A9A7E' stroke-opacity='.55' stroke-width='1.2'/%3E%3C/svg%3E") repeat-x left bottom/64px 16px}
.noel-frise .pc{position:absolute;display:block;line-height:0}
.noel-frise svg,.noel-orn svg{display:block;overflow:visible}
.noel-frise .it,.noel-orn .it{transform-origin:50% 100%;opacity:0;transform:translateY(26px) scale(.82);transition:opacity .6s ease,transform .8s cubic-bezier(.3,1.5,.5,1);transition-delay:calc(var(--i,0) * 80ms)}
.noel-frise .pc,.noel-orn .po{--d:0}
.noel-frise .pc .it{transition-delay:calc(var(--i,0) * 80ms)}
.noel-frise.vu .it,.reveal.vu .noel-orn .it,.noel-orn.vu .it{opacity:1;transform:none}
.tw{animation:noel-scintille 2.6s ease-in-out infinite}
@media(max-width:640px){.noel-frise{height:84px}}

/* ---------- Ornement au-dessus des titres de section ---------- */
.noel-orn{display:flex;align-items:flex-end;gap:6px;height:56px;margin:0 0 .5rem;line-height:0}
.noel-orn--centre{justify-content:center}
.noel-orn .po{display:block}
.noel-orn .po .it{transition-delay:calc(var(--i,0) * 90ms)}

/* ---------- Éléments flottants qui suivent le défilement (grands écrans seulement) ---------- */
.noel-flot{position:absolute;display:none;pointer-events:none;z-index:1;will-change:transform}
.noel-flot svg{display:block;width:100%;height:auto;overflow:visible;filter:drop-shadow(0 8px 10px rgba(43,40,35,.18))}
.noel-flot--droite{right:max(1rem,calc((100vw - 1480px)/2))}
.noel-flot--gauche{left:max(1rem,calc((100vw - 1480px)/2))}
@media(min-width:1360px){.noel-flot{display:block}}

/* ---------- Forêt de sapins avant le pied de page ---------- */
.pied{position:relative}
.noel-foret{position:absolute;left:0;right:0;bottom:100%;height:64px;overflow:hidden;pointer-events:none}
.noel-foret svg{position:absolute;bottom:0;left:50%;width:max(100%,900px);height:auto;transform:translateX(-50%);display:block}
.noel-foret .l{animation:noel-scintille 2.8s ease-in-out var(--o,0s) infinite}
@keyframes noel-scintille{0%,100%{opacity:.35}50%{opacity:1}}

/* ---------- Séparateurs : flocon ---------- */
.noel-sep{display:inline-flex;align-items:center;gap:.5rem;line-height:0}
.noel-sep svg{display:block;overflow:visible}
/* Petits détails de Noël posés sur les coins */
.noel-coin{position:absolute;z-index:4;pointer-events:none;line-height:0;filter:drop-shadow(0 5px 6px rgba(43,40,35,.2))}
.noel-coin svg{display:block;overflow:visible}
.noel-coin--photo-houx{top:-24px;right:-10px;transform:rotate(8deg)}
.noel-coin--photo-noeud{top:-30px;right:34px;transform:rotate(-8deg)}
html.noel .avis blockquote{position:relative}
.noel-coin--avis{top:-18px;right:18px}
@media(max-width:880px){.noel-coin--photo-houx{top:-20px;right:-4px;transform:rotate(6deg) scale(.86)}.noel-coin--photo-noeud{top:-26px;right:30px;transform:rotate(-8deg) scale(.86)}}

@media(prefers-reduced-motion:reduce){
  .noel-guirlande .b,.noel-guirlande .l,.noel-foret .l,.tw{animation:none}
  .noel-frise .it,.noel-orn .it{opacity:1;transform:none;transition:none}
}
