/* =========================================================== Le Labo du Pilote — couche interactions & animations Chargé sur toutes les pages. CSS-first, sobre, réactif. Respecte prefers-reduced-motion. Ne cache rien si JS absent (les états masqués ne s'appliquent que si ). =========================================================== */ :root { --lp-amber:#D4860A; --lp-navy:#0B1929; } /* Barre de progression de lecture (injectée par labo.js) */ #lp-progress{ position:fixed; top:0; left:0; height:3px; width:0; background:linear-gradient(90deg,#D4860A,#ffb963); z-index:60; box-shadow:0 0 10px rgba(212,134,10,.55); transition:width .08s linear; } /* Cartes cliquables : élévation vive au survol */ a.group, article.group{ transition:transform .28s cubic-bezier(.16,.84,.44,1), box-shadow .28s ease, border-color .28s ease; } a.group:hover, article.group:hover{ transform:translateY(-6px); box-shadow:0 20px 45px -22px rgba(11,25,41,.5); } /* Titre de carte : léger grossissement au survol de la carte */ .group h2, .group h3{ display:inline-block; transform-origin:left center; transition:transform .28s cubic-bezier(.16,.84,.44,1), color .2s ease; } .group:hover h2, .group:hover h3{ transform:scale(1.03); } /* Icônes flèche : avancent au survol du parent */ .material-symbols-outlined{ transition:transform .25s ease; } .group:hover .material-symbols-outlined, .lp-cta:hover .material-symbols-outlined{ transform:translateX(4px); } /* Bouton d'action principal : ressort */ .lp-cta{ transition:transform .18s ease, background-color .2s ease, box-shadow .2s ease; } .lp-cta:hover{ transform:translateY(-3px); box-shadow:0 14px 30px -12px rgba(212,134,10,.55); } .lp-cta:active{ transform:translateY(0) scale(.98); } /* Liens du menu : soulignement animé */ header nav a{ position:relative; } header nav a::after{ content:""; position:absolute; left:0; bottom:-2px; height:2px; width:0; background:var(--lp-amber); transition:width .25s ease; } header nav a:hover::after{ width:100%; } /* Lisibilité du texte des héros par-dessus une photo */ .lp-hero-copy{ text-shadow:0 2px 14px rgba(11,25,41,.55); } @media (prefers-reduced-motion: no-preference){ /* Hero : zoom lent facon Ken Burns */ .lp-hero-bg{ animation:lp-kb 30s ease-in-out infinite alternate; transform-origin:60% 42%; will-change:transform; } @keyframes lp-kb{ from{transform:scale(1.06)} to{transform:scale(1.15)} } /* Apparition au defilement (seulement si JS present) */ .lp-js .lp-reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1); } .lp-js .lp-reveal.is-in{ opacity:1; transform:none; } } /* === Bandeau consentement cookies (ajout 2026-07-20) === */ #lp-cookie{position:fixed;left:0;right:0;bottom:0;z-index:9999;background:#0B1929;color:#fff;border-top:3px solid #D4860A;box-shadow:0 -6px 24px rgba(0,0,0,.28);} #lp-cookie .lp-cookie-in{max-width:1200px;margin:0 auto;padding:16px 20px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;} #lp-cookie .lp-cookie-txt{margin:0;flex:1 1 320px;font-size:14px;line-height:1.55;color:rgba(255,255,255,.85);} #lp-cookie .lp-cookie-txt a{color:#F0B45A;text-decoration:underline;text-underline-offset:2px;} #lp-cookie .lp-cookie-btns{display:flex;gap:10px;flex:0 0 auto;} #lp-cookie .lp-cookie-btn{font:inherit;font-size:14px;font-weight:700;padding:10px 22px;border-radius:8px;border:1px solid transparent;cursor:pointer;transition:opacity .2s ease;} #lp-cookie .lp-cookie-btn:hover{opacity:.85;} #lp-cookie .lp-cookie-refuse{background:transparent;color:#fff;border-color:rgba(255,255,255,.45);} #lp-cookie .lp-cookie-accept{background:#D4860A;color:#0B1929;} @media (max-width:560px){#lp-cookie .lp-cookie-in{flex-direction:column;align-items:stretch;}#lp-cookie .lp-cookie-btns{justify-content:flex-end;}}