/* ============================================================
   Finitions v13 — design uniquement (aucun contenu modifié)
   Charge en dernier sur toutes les pages. Supprimer ce fichier
   et son <link> suffit à revenir à la version précédente.
   ============================================================ */
.home{
  --r:6px;        /* angle des photos, cartes, formulaires */
  --r-sm:4px;     /* angle des boutons et champs */
  --edge:max(var(--pad), calc((100% - var(--maxw)) / 2 + var(--pad)));
}

/* ---------- Typographie : titres équilibrés, pas de mot orphelin ---------- */
.home h1, .home h2, .home h3{ text-wrap:balance; }
.home p, .home dd, .home li{ text-wrap:pretty; }

/* ---------- En-tête : aligné sur la colonne de contenu ---------- */
.home .site-header{ padding-inline:var(--edge); }
/* Hauteur fixe : elle ne varie plus pendant le chargement des polices
   (la photo du hero se calait parfois 12 px trop bas) */
@media (min-width: 481px){ .home .site-header{ height:63px; padding-block:0 !important; } }
.home .lang-switch{ gap:4px; }
.home .lang-switch button{
  font:500 .72rem/1 var(--f-utility); letter-spacing:.1em;
  min-width:36px; padding:8px 9px; border-radius:var(--r-sm);
  border-color:rgba(244,241,232,.22);
}
.home .lang-switch button.active{ background:#e8c766; border-color:#e8c766; color:var(--graphite); }

/* ---------- Boutons et liens ---------- */
.home .h-btn{ border-radius:var(--r-sm); gap:10px; }
.home .h-link{ transition:color .2s ease, border-color .2s ease; }
.home .h-link::after{ content:'\2192'; display:inline-block; margin-inline-start:.5em; transition:transform .25s ease; }
.home .h-link:hover::after{ transform:translateX(4px); }
[dir=rtl] .home .h-link::after{ content:'\2190'; }
[dir=rtl] .home .h-link:hover::after{ transform:translateX(-4px); }

/* ---------- Accueil : hero ---------- */
/* Le bandeau de chiffres tient désormais dans le premier écran */
.home .h-hero{ min-height:min(calc(100svh - 86px), 860px); }
.home .h-hero::before{
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(90% 70% at 0% 100%, #2b2e34 0%, rgba(30,32,36,0) 70%);
}
.home .h-hero-inner{ align-self:center; padding-top:calc(var(--hdr-h) + 48px); padding-bottom:56px; }
.home .h-kicker{ display:flex; align-items:center; gap:14px; letter-spacing:.01em; }
.home .h-kicker::before{ content:''; flex:none; width:32px; height:1px; background:#e3c45c; }
.home .h-chips li{
  display:inline-flex; align-items:center; gap:9px;
  border-radius:999px; padding:7px 15px 7px 13px;
  border-color:rgba(246,244,238,.24); background:rgba(246,244,238,.05);
}
.home .h-chips li::before{ content:''; width:6px; height:6px; border-radius:50%; background:#e3c45c; }

/* ---------- Titres de section de l'accueil : petit filet doré ---------- */
.home .h-intro h2::before, .home .story-head h2::before, .home .h-edu h2::before,
.home .h-clubs h2::before, .home .h-gallery h2::before, .home .h-final h2::before{
  content:''; display:block; width:32px; height:2px; background:var(--gold); margin-bottom:1.5rem;
}

/* ---------- Parcours au défilement ---------- */
.story-on .home .step{ min-height:66svh; }
.story-on .home .step:last-child{ min-height:60svh; }
.home .step-media, .story-on .home .stage-frame{ border-radius:var(--r); }
.story-on .home .stage-rail li{ border-radius:2px; }

/* ---------- Formation ---------- */
.home .edu-line li{ transition:color .2s ease; }
.home .edu-line li:hover{ color:var(--ink); }

/* ---------- Clubs : survol discret ---------- */
.home .club-row li{ transition:background-color .25s ease; }
.home .club-row img{ transition:transform .3s ease; }
.home .club-row li:hover{ background:rgba(245,244,240,.6); }
.home .club-row li:hover img{ transform:translateY(-3px); }

/* ---------- Mosaïque : quatre colonnes régulières (plus de colonne étroite) ---------- */
.home .h-mosaic{ grid-template-columns:repeat(4, minmax(0,1fr)); grid-auto-rows:clamp(160px, 15vw, 230px); gap:12px; }
.home .m-a{ grid-column:span 2; grid-row:span 2; }
.home .m-b{ grid-column:span 1; grid-row:span 2; }
.home .m-c, .home .m-d{ grid-column:span 1; grid-row:span 1; }
.home .h-mosaic figure{ border-radius:var(--r); }
.home .h-mosaic img{ transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.home .h-mosaic figure:hover img{ transform:scale(1.04); }
.home .h-mosaic figcaption{ padding:40px 16px 14px; }

/* ---------- Bloc final ---------- */
.home .h-final{ background:linear-gradient(160deg, #31343a 0%, var(--graphite) 55%); }

/* ---------- Pied de page : aligné et séparé par un filet doré ---------- */
.home .site-footer{ padding-inline:0; border-top:1px solid rgba(201,162,39,.28); }
.home .footer-grid{ padding-inline:var(--pad); }
.home .footer-nav a{ transition:color .2s ease; }

/* ---------- Pages intérieures : en-tête sombre, dans la continuité du menu ---------- */
.home .p-hero{
  position:relative; isolation:isolate; overflow:hidden;
  background:var(--graphite); border-bottom:0;
  padding-bottom:clamp(56px, 7vw, 96px);
}
.home .p-hero::before{
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(60% 120% at 100% 100%, #33363c 0%, rgba(42,44,49,0) 70%);
}
.home .p-hero::after{
  content:''; position:absolute; inset:auto 0 0 0; height:1px;
  background:linear-gradient(90deg, rgba(201,162,39,0), rgba(201,162,39,.55) 50%, rgba(201,162,39,0));
}
.home .p-hero h1{ color:#f6f4ee; text-shadow:none; }
.home .p-hero .p-label{ display:flex; align-items:center; gap:14px; color:#e3c45c; }
.home .p-hero .p-label::before{ content:''; flex:none; width:32px; height:1px; background:#e3c45c; }
.home .p-hero .p-lead{ color:#cfcdc6; }
.home .p-hero .p-lead::before{ display:none; }

/* ---------- Photos et cartes : un seul arrondi partout ---------- */
.home .p-media, .home .gslide button, .home .gitem button, .home .pc-card{ border-radius:var(--r); }
.home .fcard, .home .fcard .face{ border-radius:var(--r) !important; }
.home .fcard .front{ transition:border-color .25s ease; }
.home .fcard:hover .front{ border-color:rgba(122,96,15,.45); }
.home .p-tags li{ border-radius:999px; padding:7px 15px; }

/* Boutons ronds pour les flèches de carrousel, filtres en pilules */
.home .gcar-btn, .home .pc-btn{ border-radius:50%; transition:background-color .2s ease, border-color .2s ease; }
.home .gfilters button{ border-radius:999px; padding:10px 18px; }
.home .gdots button{ border-radius:2px; }

/* ---------- Contact ---------- */
.home .p-form{ border-radius:var(--r); box-shadow:0 1px 2px rgba(38,41,46,.06); }
.home .p-field input, .home .p-field textarea{
  border-radius:var(--r-sm); border-color:rgba(38,41,46,.2);
  transition:border-color .2s ease, box-shadow .2s ease;
}
.home .p-field input:hover, .home .p-field textarea:hover{ border-color:rgba(38,41,46,.4); }
.home .p-field input:focus, .home .p-field textarea:focus{
  outline:none; border-color:var(--gold-ink); box-shadow:0 0 0 3px rgba(201,162,39,.28);
}

/* ---------- Téléphone ---------- */
@media (max-width: 900px){
  .home .h-hero{ min-height:0; }
  .home .h-hero-inner{ padding:32px var(--pad) 48px !important; }
  .home .h-mosaic{ grid-template-columns:repeat(2, minmax(0,1fr)); grid-auto-rows:clamp(150px, 42vw, 260px); }
  .home .m-a{ grid-column:span 2; grid-row:span 2; }
  .home .m-b{ grid-column:span 1; grid-row:span 2; }
}
@media (max-width: 480px){
  .home .lang-switch button{ min-width:0; padding:7px 8px; }
}

@media (prefers-reduced-motion: reduce){
  .home .h-link::after, .home .club-row img, .home .h-mosaic img{ transition:none; }
}
