/* ============================================================
   am-premium.css — couche de finition
   Chargée en DERNIER, après am-ui / am-formats / am-nav.
   Ne change aucune structure : discipline la typographie,
   les graisses, les arrondis, les bordures et les espacements.
   ============================================================ */

:root{
  --am-ink:#0b0b10;
  --am-blue:#d9b77a;
  --am-turq:#d9b77a;
  --am-cream:#FAF6EE;
  --am-cream-2:#F3ECDF;
  --am-line:#E5DCCB;
  --am-text:#0b0b10;
  --am-muted:#6E665E;
  --am-r:14px;      /* rayon unique pour les cartes */
  --am-r-pill:40px; /* rayon unique pour les pilules */
}

/* ---------- 1. GRAISSES : de sept valeurs à trois ---------- */
body,p,li,td,div,input,textarea,select{
  font-weight:400;
}
/* les span et les liens héritent : un mot mis en valeur dans un titre
   doit garder la graisse de son titre */
span,a{font-weight:inherit}
h1,h2,h3,h4,h5,h6,strong,b,
.btn,.btn-primary,.btn-secondary,.btn-contact-header,
.nav-link,.logo,.eyebrow,.sur-titre,.tag,.badge,.stat-number{
  font-weight:600;
}
.logo .anima{font-weight:700}
.logo .musica{font-weight:600}
/* on neutralise les extrêmes qui font "amateur" */
[style*="font-weight:300"],[style*="font-weight: 300"],
[style*="font-weight:800"],[style*="font-weight: 800"],
[style*="font-weight:900"],[style*="font-weight: 900"]{font-weight:600 !important}

p{line-height:1.72}

/* ---------- 2. TITRES : une échelle, un interlignage, un tracking ---------- */
h1{font-size:clamp(2.05rem,4.6vw,3.5rem);line-height:1.08;letter-spacing:-.025em}
h2{font-size:clamp(1.62rem,3vw,2.4rem);line-height:1.16;letter-spacing:-.018em}
h3{font-size:clamp(1.08rem,1.7vw,1.32rem);line-height:1.26;letter-spacing:-.008em}
h4{font-size:1rem;line-height:1.3;letter-spacing:-.004em}
h1,h2,h3,h4{text-wrap:balance}



/* corps de texte : une seule mesure de lecture */



p,li{max-width:74ch}
.hero p,.hero-section p,.hero-services p{max-width:56ch}

/* sur-titres : lisibles, donc jamais en bleu clair sur fond clair */
.sur-titre,.eyebrow,.label,.section-label,.surtitre{
  font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;
}
/* sur fond clair uniquement */
section:not(.hero):not(.hero-section):not(.am-agenda) > .wrap > .surtitre,


/* ---------- 3. ARRONDIS : de dix valeurs à deux ---------- */
.card,.carte,.box,.tile,.bloc,.feature,.service-card,.format-card,
.ref-logo,.avis-card,.testimonial,.faq-item,.pack,.formule,
img.rounded,figure img,.photo,.visual{
  border-radius:var(--am-r);
}
.btn,.btn-primary,.btn-secondary,.btn-contact-header,.pill,
.tag,.badge,.chip{border-radius:var(--am-r-pill)}

/* ---------- 4. BORDURES : hairline unique ---------- */
.card,.carte,.box,.tile,.feature,.service-card,.format-card,
.avis-card,.testimonial,.faq-item,.pack,.formule{
  border:1px solid var(--am-line);
  box-shadow:none;
}

/* ---------- 5. BOUTONS : trois variantes, une hauteur ---------- */
.btn,.btn-primary,.btn-secondary,.btn-contact-header{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:13px 30px;font-size:.83rem;letter-spacing:.01em;
  border:1.5px solid transparent;transition:background .25s,color .25s,border-color .25s;
}
.btn-primary{background:var(--am-ink);color:#fff;border-color:var(--am-ink)}
.btn-primary:hover{background:#000;border-color:#000}
.btn-secondary{background:transparent;color:var(--am-ink);border-color:var(--am-ink)}
.btn-secondary:hover{background:var(--am-ink);color:#fff}

/* ---------- 6. IMAGES : rendu homogène ---------- */
img{image-rendering:auto}
.card img,.carte img,.tile img,.service-card img,.format-card img{
  width:100%;object-fit:cover;display:block;
}

/* ---------- 7. RESPIRATION : un rythme vertical unique ---------- */
section{padding-top:clamp(56px,7vw,96px);padding-bottom:clamp(56px,7vw,96px)}
/* les héros gardent leur propre respiration */
section>.container>*+*,section>.wrap>*+*{margin-top:0}
h2+p,h3+p,h1+p{margin-top:14px}
p+p{margin-top:12px}

/* ---------- 8. LIENS ET FOCUS ---------- */
a{transition:color .2s,border-color .2s,opacity .2s}
:focus-visible{outline:2px solid var(--am-blue);outline-offset:3px;border-radius:4px}

/* ---------- 9. DÉTAILS QUI TRAHISSENT L'AMATEURISME ---------- */
/* pas d'ombres portées diffuses */
.card,.carte,.box,.tile,.feature,.bloc{filter:none}



/* césures propres sur les longs mots */
h1,h2,h3,p,li{overflow-wrap:break-word;hyphens:auto}

/* ---------- 10. HEADER ---------- */
.header{border-bottom:1px solid var(--am-line)}
.nav-link{font-weight:500;letter-spacing:.01em}
.am-lang a{font-weight:600;letter-spacing:.06em}

/* ---------- 11. ACCESSIBILITÉ TACTILE ---------- */
a.btn,a.btn-primary,a.btn-secondary,.btn-contact-header,button{min-height:48px}
.nav-link{padding-top:11px;padding-bottom:11px}

@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}}

/* ---------- 12. CORRECTIFS DE DÉBORDEMENT MOBILE (préexistants) ---------- */
@media(max-width:640px){
  .v10-btn{max-width:100%;white-space:normal;text-align:center;box-sizing:border-box}
  .v10-wrap>.v10-btn,.v10-hero-actions>.v10-btn{width:100%}
  .comp-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}

/* ---------- 13. MISE EN VALEUR DU TITRE ---------- */
.am-souligne{
  color:var(--am-blue);
  text-decoration:underline;
  text-decoration-color:var(--am-blue);
  text-decoration-thickness:3px;
  text-underline-offset:9px;
  text-decoration-skip-ink:none;
}
@media(max-width:640px){
  .am-souligne{text-decoration-thickness:2px;text-underline-offset:6px}
}

/* ============================================================
   14. HARMONISATION DES VARIANTES HISTORIQUES
   Le site a accumulé plusieurs générations de composants.
   On les aligne visuellement sans toucher au HTML.
   ============================================================ */

/* --- tous les en-têtes se comportent pareil --- */
header,.v10-top,.top,.am-top,.brand-header{
  border-bottom:1px solid var(--am-line);
}
header .logo,.v10-top .logo,.top .logo,.am-top .logo,.brand-header .logo{
  letter-spacing:.01em;
}

/* --- tous les boutons partagent la même géométrie --- */
.btn,.btn-primary,.btn-secondary,.btn-contact-header,
.pilule-bleue,.pilule-vide,.v10-btn,.am-btn,.cta-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:13px 30px;
  border-radius:var(--am-r-pill);
  font-size:.83rem;font-weight:600;letter-spacing:.01em;line-height:1.2;
  border-width:1.5px;border-style:solid;
  text-align:center;
  transition:background .25s,color .25s,border-color .25s,transform .2s;
}
/* le survol ne fait plus « sauter » les boutons */
.v10-btn:hover{transform:none;box-shadow:none}

/* --- tous les pieds de page --- */
footer,.v10-footer-simple,.am-foot{
  border-top:1px solid rgba(217,183,122,.22);
}
footer a,.v10-footer-simple a,.am-foot a{padding-top:6px;padding-bottom:6px}

/* --- cartes de toutes générations --- */
.v10-card,.am-card,.card,.carte,.tile,.bloc-c,.feature{
  border-radius:var(--am-r);
}

/* --- surtitres de toutes générations --- */
.surtitre,.sur-titre,.eyebrow,.v10-eyebrow,.am-eyebrow,.label{
  font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;
}

/* --- mise en valeur bleue : une seule et même règle partout --- */
.hl,.am-souligne{
  background:linear-gradient(transparent 62%, rgba(11,11,16,0.55) 62%);
  padding:0 .06em;
  color:inherit;
  text-decoration:none;
}


/* ---------- 15. TITRE DU HERO : une seule graisse, deux lignes ---------- */
.hero h1 .white,.hero h1 .light{font-weight:inherit}
.hero h1 .light{opacity:.92}