/* Accueil — héros « Mix V9 » : extrait du <style> inline de index.html. */
/* =====================================================================
   REFONTE 09 — « Mix » : base V1 (héros photo + carte session glass)
   + mots rotatifs de la V7 dans le titre.
   Config Tweaks figée : photo Sonde, assombrissement 0.10, Poppins,
   badge inscriptions masqué. Certifications intégrées au héros.
   Photo héros : plan large paysage (praticien + geste pédagogique,
   fond bleu raccord marque) — cadrage object-position 50% 45%.
   ===================================================================== */
:root{--veil-extra:.1;}
.hero{--pad:clamp(26px,4vw,65px);position:relative;width:100%;min-height:100vh;overflow:hidden;background:var(--navy-dark);}

/* fond photo plein écran */
.hero__bg{position:absolute;inset:0;z-index:0;overflow:hidden;}
.hero__bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;transform:scale(1.03);transition:transform 16s var(--ease-out);}
/* mobile : recentre sur la sonde (audit UX 2026-07) */
@media(max-width:640px){.hero__bg img{object-position:60% 45%;}}
body.is-ready .hero__bg img{transform:scale(1);}
.hero__veil{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(106deg,rgba(8,26,52,.93) 0%,rgba(11,42,82,.74) 34%,rgba(8,26,52,.42) 62%,rgba(8,26,52,.66) 100%);}
.hero__veil::after{content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,26,52,.55) 0%,rgba(8,26,52,0) 26%,rgba(8,26,52,0) 64%,rgba(8,26,52,.85) 100%);}

/* grille héros */
.hero__grid{position:relative;z-index:5;min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:48px;
  padding:140px var(--pad) clamp(48px,7vh,72px);}
@media(max-width:1040px){.hero__grid{grid-template-columns:1fr;gap:40px;align-items:end;padding-top:128px;}}

/* colonne titre */
.hero__left{display:flex;flex-direction:column;}
.hero__eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--teal-vif);}
.hero__eyebrow::before{content:'';width:26px;height:1.5px;background:var(--teal-vif);border-radius:2px;}
.hero__title{margin-top:26px;color:#fff;font-weight:600;letter-spacing:-.03em;line-height:1.08;font-size:clamp(46px,6.4vw,98px);}
.hero__title span{display:block;}
.hero__title .dim{color:rgba(255,255,255,.46);}
.hero__title em{font-style:normal;color:var(--teal-vif);}
/* mot rotatif : gabarit invisible en flux (ligne de base native) + fenêtre centrée */
.hero__title .rot{position:relative;display:inline-block;vertical-align:baseline;white-space:nowrap;transition:width .5s var(--ease-out);}
.hero__title .rot__sizer{visibility:hidden;}
.hero__title .rot__view{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);height:1.45em;overflow:hidden;pointer-events:none;}
.hero__title .rot__track{display:flex;flex-direction:column;transition:transform .6s var(--ease-in-out);}
.hero__title .rot__word{display:block;line-height:1.45;white-space:nowrap;}
@media(prefers-reduced-motion:reduce){.hero__title .rot,.hero__title .rot__track{transition:none;}}
.hero__desc{margin-top:30px;max-width:430px;color:rgba(255,255,255,.78);font-size:clamp(15px,1.25vw,18px);font-weight:300;line-height:1.62;}
.hero__desc strong{color:#fff;font-weight:600;}
.hero__actions{margin-top:34px;display:flex;align-items:center;gap:26px;flex-wrap:wrap;}
.hero__rating{display:flex;flex-direction:column;gap:3px;}
.hero__rating .stars-row{display:flex;align-items:center;gap:8px;color:#fff;}
.hero__rating .stars-row b{font-size:24px;font-weight:700;line-height:1;}
.hero__rating .stars{color:#FFC53D;font-size:15px;letter-spacing:1px;}
.hero__rating small{color:rgba(255,255,255,.62);font-size:13px;}

/* bouton blanc */
.btn-white{display:inline-flex;align-items:center;gap:10px;padding:15px 28px;border-radius:40px;background:#fff;color:var(--navy);font-weight:600;font-size:15px;text-decoration:none;box-shadow:0 12px 32px rgba(8,24,48,.3);transition:transform .22s,box-shadow .22s,background .22s;}
.btn-white:hover{transform:translateY(-2px);background:#f1f4f9;box-shadow:0 16px 40px rgba(8,24,48,.36);}
.btn-white:active,.tcard__cta:active,.scard-sm:active{transform:scale(.97);}
.btn-white svg{width:13px;height:13px;}

/* carte session glass */
.hero__right{display:flex;flex-direction:column;align-items:flex-end;gap:14px;}
@media(max-width:1040px){.hero__right{align-items:flex-start;}}

/* carte « sur mesure » — forte demande de formations dans les structures */
.scard-sm{position:relative;width:100%;max-width:420px;display:flex;align-items:center;gap:14px;padding:15px 18px;border-radius:20px;text-decoration:none;color:#fff;
  background:rgba(79,210,224,.09);border:1px dashed rgba(79,210,224,.5);
  backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);
  box-shadow:0 18px 44px rgba(6,18,40,.3);
  transition:background .25s,border-color .25s,transform .25s,box-shadow .25s;}
.scard-sm:hover{background:rgba(79,210,224,.15);border-color:var(--teal-vif);transform:translateY(-2px);box-shadow:0 22px 52px rgba(6,18,40,.42);}
.sm-ico{flex:none;width:40px;height:40px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:rgba(79,210,224,.16);color:var(--teal-vif);}
.sm-ico svg{width:16px;height:16px;}
.sm-bd{display:flex;flex-direction:column;gap:3px;min-width:0;}
.sm-kick{display:inline-flex;align-items:center;gap:7px;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--teal-vif);}
.sm-dot{width:6px;height:6px;border-radius:50%;background:var(--teal-vif);box-shadow:0 0 0 0 rgba(79,210,224,.6);animation:pulse 2.4s ease-out infinite;}
@media(prefers-reduced-motion:reduce){.sm-dot{animation:none;}}
.sm-bd b{font-size:15.5px;font-weight:600;color:#fff;line-height:1.3;}
.sm-txt{font-size:12.5px;color:rgba(255,255,255,.68);line-height:1.5;}
.sm-go{flex:none;margin-left:auto;width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,.28);display:flex;align-items:center;justify-content:center;color:#fff;transition:transform .25s,background .25s,border-color .25s,color .25s;}
.sm-go svg{width:12px;height:12px;}
.scard-sm:hover .sm-go{background:#fff;border-color:#fff;color:var(--navy);transform:translateX(2px);}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(79,210,224,.55);}70%{box-shadow:0 0 0 7px rgba(79,210,224,0);}100%{box-shadow:0 0 0 0 rgba(79,210,224,0);}}
/* carte « nos formations » : 4 types + bouton « Où se former ? » */
.tcard{position:relative;width:100%;max-width:420px;border-radius:28px;overflow:hidden;padding:24px;
  background:rgba(13,34,66,.46);border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(26px) saturate(1.4);-webkit-backdrop-filter:blur(26px) saturate(1.4);
  box-shadow:0 30px 70px rgba(6,18,40,.5),inset 0 1px 0 rgba(255,255,255,.18);
  display:flex;flex-direction:column;gap:16px;color:#fff;}
.tcard__kicker{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-vif);}
.tcard__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:10px;}
.tile{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:10px;min-height:88px;padding:16px 18px;border-radius:14px;
  background:rgba(0,0,0,.26);border:1px solid rgba(255,255,255,.08);color:#fff;text-decoration:none;
  transition:background .22s,border-color .22s,transform .22s;}
a.tile:hover{background:rgba(79,210,224,.13);border-color:rgba(79,210,224,.45);transform:translateY(-2px);}
.tile b{font-size:16px;font-weight:600;line-height:1.28;text-wrap:balance;max-width:100%;}
.tile small{font-size:11.5px;color:rgba(255,255,255,.55);}
a.tile .tile__arr{position:absolute;top:13px;right:13px;width:22px;height:22px;border-radius:50%;border:1px solid rgba(255,255,255,.22);
  display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.7);opacity:0;transform:translateX(-3px);transition:opacity .2s,transform .2s,color .2s;}
a.tile .tile__arr svg{width:9px;height:9px;}
a.tile:hover .tile__arr{opacity:1;transform:none;color:#fff;}
.tile--soon{border-style:dashed;border-color:rgba(255,255,255,.14);background:rgba(0,0,0,.14);cursor:default;}
.tile--soon b{color:rgba(255,255,255,.42);}
.tile__soon{display:inline-flex;align-items:center;padding:3px 9px;border-radius:20px;background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.14);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.6);}
.tcard__cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:50px;border-radius:13px;background:#fff;color:var(--navy);font-weight:600;font-size:15px;text-decoration:none;transition:transform .2s,background .2s;}
.tcard__cta:hover{transform:translateY(-2px);background:#f1f4f9;}
.tcard__cta svg{width:12px;height:12px;}

/* certifications — chips blanches sous la carte « sur mesure » */
.hero-certs{width:100%;max-width:420px;display:flex;align-items:stretch;gap:12px;}
.hero-certs .hc{flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;padding:18px 20px;border-radius:18px;cursor:default;
  background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.55);
  box-shadow:0 14px 34px rgba(6,18,40,.3);
  transition:transform .25s,box-shadow .25s,background .25s;}
.hero-certs .hc:hover{transform:translateY(-2px);background:#fff;box-shadow:0 18px 42px rgba(6,18,40,.38);}
.hero-certs .hc img{height:62px;width:auto;max-width:100%;object-fit:contain;display:block;}
@media(max-width:420px){.hero-certs .hc{padding:12px 14px;}.hero-certs .hc img{height:46px;}}
/* très petits écrans (≤360px) : réduit le titre pour que le mot le plus long
   (« L'échographie », insécable) tienne sans être rogné par overflow:hidden */
@media(max-width:360px){.hero__title{font-size:clamp(38px,11.6vw,45px);}}

/* scroll hint */
.hero__scroll{position:absolute;left:var(--pad);bottom:24px;z-index:5;display:inline-flex;align-items:center;gap:11px;color:rgba(255,255,255,.85);font-size:13px;font-weight:500;letter-spacing:.04em;text-decoration:none;
  padding:8px 20px 8px 9px;border-radius:40px;border:1px solid rgba(255,255,255,.2);background:rgba(8,26,52,.32);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  transition:color .25s,border-color .25s,background .25s,transform .25s;}
.hero__scroll:hover{color:#fff;border-color:rgba(79,210,224,.55);background:rgba(11,42,82,.55);transform:translateY(-2px);}
.hero__scroll .circ{width:30px;height:30px;border-radius:50%;border:1px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;overflow:hidden;transition:background .25s,border-color .25s;}
.hero__scroll:hover .circ{background:var(--teal-vif);border-color:var(--teal-vif);}
.hero__scroll svg{width:9px;height:11px;color:#fff;animation:arrow 2.6s cubic-bezier(.4,0,.7,1) infinite;transition:color .25s;}
.hero__scroll:hover svg{color:var(--navy-dark);}
@keyframes arrow{0%{transform:translateY(-7px);opacity:0;}30%{opacity:1;}55%{transform:translateY(7px);opacity:0;}100%{transform:translateY(7px);opacity:0;}}
@media(max-width:1040px){.hero__scroll{display:none;}}

/* animations légères et discrètes — état caché seulement si le JS est là pour le lever
   (html.js posé par header.php ; sans JS, contenu visible d'emblée) */
:where(html.js) .reveal{opacity:0;transform:translateY(16px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);}
body.is-ready .reveal{opacity:1;transform:none;}
body.is-ready .reveal.d1{transition-delay:.06s;}
body.is-ready .reveal.d2{transition-delay:.14s;}
body.is-ready .reveal.d3{transition-delay:.22s;}
body.is-ready .reveal.d4{transition-delay:.30s;}
body.is-ready .reveal.d5{transition-delay:.40s;}
body.is-ready .reveal.d6{transition-delay:.50s;}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1!important;transform:none!important;}.hero__bg img{transform:none!important;}.hero__scroll svg{animation:none;}}

/* couche d'assombrissement (Tweaks : 0.15) */
.hero__dim{position:absolute;inset:0;z-index:1;background:#06122a;opacity:var(--veil-extra,0);pointer-events:none;transition:opacity .4s;}
.is-hidden{display:none!important;}
/* sheen discret en haut de la carte */
.tcard::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,0) 38%);}
.tcard>*{position:relative;}

/* images réelles : cartes actus + logos presse */
.actu img.ph{width:100%;height:100%;aspect-ratio:16/9;object-fit:cover;display:block;}
.press{gap:24px 44px;}
.press a{display:inline-flex;align-items:center;opacity:.72;filter:grayscale(1);transition:opacity .25s,filter .25s;}
.press a:hover{opacity:1;filter:none;}
.press img{height:30px;width:auto;max-width:150px;object-fit:contain;display:block;}
