/* ============================================================
   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:#171310;
  --am-blue:#75C4E7;
  --am-turq:#6AD5E7;
  --am-cream:#FAF6EE;
  --am-cream-2:#F3ECDF;
  --am-line:#E5DCCB;
  --am-text:#2A2622;
  --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,span,div,a,input,textarea,select,button{
  font-weight:400;
}
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}
}