/* ==========================================================================
   SpeakPro Academy — harmonisation premium des pages de formation
   (modules, parcours, simulations, FAQ, pages légales…).
   Chargée uniquement par ces pages (classe body.sp-learn). Elle ne modifie
   aucun comportement : seulement la présentation des composants existants
   (.card, .icon, .quiz-*, .practice-item, .btn…), alignée sur les pages
   Programmes / À propos (ivoire, encre, cuivre, titres Fraunces).
   ========================================================================== */
body.sp-learn{
  --lr-ivory:#FBF8F3; --lr-paper:#F4EEE6; --lr-line:#E5DBCF; --lr-line-2:#EFE7DC;
  --lr-ink:#1E2430; --lr-ink-2:#4A505B; --lr-mute:#6B707A; --lr-copper:#A9552F; --lr-copper-2:#8E4626; --lr-navy:#10233F;
  /* l'ancien bleu d'accent devient l'encre de la marque sur ces pages */
  --blue:#10233F; --blue-dark:#0B1A30;
  background:var(--lr-ivory);
}

/* --- En-tête de page (remplace l'ancien bandeau centré à pastille) --- */
body.sp-learn .sp-lhero{ background:var(--lr-paper); padding:56px 0 46px; border-bottom:1px solid var(--lr-line); }
body.sp-learn .sp-lhero .wrap-narrow{ text-align:left; }
body.sp-learn .sp-lhero .eyebrow{
  display:flex; align-items:center; gap:12px; justify-content:flex-start; margin:0;
  padding:0; background:none; border:0; box-shadow:none; border-radius:0; transform:none;
  font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--lr-copper);
}
body.sp-learn .sp-lhero .eyebrow::before{ content:""; width:28px; height:1.5px; background:var(--lr-copper); flex-shrink:0; }
body.sp-learn .sp-lhero .eyebrow .dot{ display:none; }
body.sp-learn .sp-lhero h1{
  font-family:var(--display-serif); font-weight:500; letter-spacing:-.02em; color:var(--lr-ink);
  font-size:clamp(34px,5vw,54px); line-height:1.06; margin:16px 0 0; max-width:20ch;
}
body.sp-learn .sp-lhero p.lead{ margin:16px 0 0; max-width:60ch; font-size:clamp(16.5px,1.6vw,19px); line-height:1.6; color:var(--lr-ink-2); }
body.sp-learn .sp-lhero p.sp-lhero-meta{ margin:18px 0 0; font-size:13.5px; font-weight:600; color:var(--lr-mute); }

/* --- Contenu --- */
body.sp-learn section.tight{ padding-top:40px; }
body.sp-learn .card{
  background:#fff; border:1px solid var(--lr-line); border-radius:20px; box-shadow:none;
  padding:28px 28px 26px; transition:border-color .2s ease;
}
body.sp-learn .card:hover{ transform:none; box-shadow:none; }
body.sp-learn .card[style*="border-color:var(--gold)"]{ border-color:#D9B8A3 !important; }
body.sp-learn .card[style*="background:var(--blue-tint2)"]{ background:var(--lr-paper) !important; border-color:var(--lr-line); }
body.sp-learn .card h3{ font-family:var(--display); font-size:19px; font-weight:700; color:var(--lr-ink); letter-spacing:-.01em; margin:14px 0 6px; }
body.sp-learn .card p{ color:var(--lr-ink-2); font-size:15px; line-height:1.65; }
body.sp-learn .card .icon,
body.sp-learn .card .icon.blue, body.sp-learn .card .icon.gold, body.sp-learn .card .icon.teal, body.sp-learn .card .icon.navy{
  width:42px; height:42px; border-radius:12px; background:var(--lr-paper); color:var(--lr-copper);
  display:flex; align-items:center; justify-content:center; margin:0; box-shadow:none;
}
body.sp-learn .card .icon svg *{ stroke:currentColor; }
body.sp-learn .card .icon svg [fill="#fff"], body.sp-learn .card .icon svg [fill="white"]{ fill:currentColor; }
body.sp-learn .card[style*="background:var(--blue-tint2)"] .icon{ background:#fff; }
body.sp-learn .card .card{ padding:22px; border-radius:16px; }
body.sp-learn audio{ display:block; margin-top:4px; border-radius:999px; }

/* Note « mode démo » / bloc verrouillé */
body.sp-learn .placeholder-note{
  background:var(--lr-paper); border:0; border-left:2px solid var(--lr-copper); border-radius:0 12px 12px 0;
  color:var(--lr-ink-2); font-size:14px; line-height:1.6; padding:12px 16px;
}
body.sp-learn #locked-notice{ background:transparent !important; border:1.5px dashed #D6C8B8 !important; border-radius:18px; padding:22px; }
body.sp-learn #locked-notice p{ color:var(--lr-ink-2) !important; font-weight:600; font-size:14.5px; margin:0; }

/* Exercices */
body.sp-learn .practice-item{ padding-top:18px; border-top:1px solid var(--lr-line-2); }
body.sp-learn .practice-item:first-child{ border-top:0; padding-top:0; }
body.sp-learn .practice-item > p{ color:var(--lr-ink) !important; font-size:15.5px; }

/* Cases à cocher, liens et progression : plus de bleu */
body.sp-learn input[type="checkbox"]{ accent-color:var(--lr-copper) !important; }

/* Boutons secondaires : contour encre fin, sans ombre « 3D » */
body.sp-learn main .btn-outline, body.sp-learn section .btn-outline{
  background:#fff; color:var(--lr-ink); border:1.5px solid #CDBFAE; box-shadow:none;
}
body.sp-learn section .btn-outline:hover{ border-color:var(--lr-ink); background:#fff; transform:none; box-shadow:none; }

/* Quiz final : carte sobre */
body.sp-learn .quiz-card{ border:1px solid var(--lr-line); border-radius:22px; box-shadow:none; }

/* Bandeau d'appel à l'action en bas des parcours */
body.sp-learn section[style*="background:var(--blue-tint)"]:not(.sp-lhero){ background:var(--lr-paper) !important; border-top:1px solid var(--lr-line); }
body.sp-learn section[style*="background:var(--blue-tint)"]:not(.sp-lhero) h2{ font-family:var(--display-serif); font-weight:500; letter-spacing:-.02em; color:var(--lr-ink); }

/* Liste de modules d'un parcours */
body.sp-learn .module-card{ border-radius:18px; }

/* FAQ */
body.sp-learn .faq-item{ border-color:var(--lr-line); }

@media (max-width:640px){
  body.sp-learn .sp-lhero{ padding:36px 0 30px; }
  body.sp-learn .card{ padding:22px 18px; border-radius:18px; }
}
@media (prefers-reduced-motion: reduce){ body.sp-learn .card{ transition:none; } }

/* Titres de section en Fraunces (pages de formation, légales, confirmations) */
body.sp-learn section h1, body.sp-learn section h2:not(.ft-h){ font-family:var(--display-serif); font-weight:500; letter-spacing:-.02em; color:var(--lr-ink); }

/* Pages légales : texte long lisible */
body.sp-learn .sp-prose{ padding:48px 0 88px; }
body.sp-learn .sp-prose h2{ font-size:24px !important; line-height:1.2; margin:44px 0 12px !important; padding-top:22px; border-top:1px solid var(--lr-line); }
body.sp-learn .sp-prose > .wrap-narrow > div:first-child h2{ margin-top:0 !important; padding-top:0; border-top:0; }
body.sp-learn .sp-prose p, body.sp-learn .sp-prose li{ color:var(--lr-ink-2) !important; font-size:16px !important; line-height:1.75 !important; }
body.sp-learn .sp-prose a{ color:var(--lr-copper); text-underline-offset:3px; }
body.sp-learn .sp-prose > .wrap-narrow > div{ margin-top:0 !important; }

/* Libellés « eyebrow » : texte cuivre précédé d'un filet, plus de pastille */
body.sp-learn .eyebrow{
  display:inline-flex; align-items:center; gap:12px; padding:0; background:none; border:0; box-shadow:none; border-radius:0; transform:none;
  font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--lr-copper);
}
body.sp-learn .eyebrow:hover{ background:none; box-shadow:none; transform:none; }
body.sp-learn .eyebrow::before{ content:""; width:28px; height:1.5px; background:var(--lr-copper); flex-shrink:0; }
body.sp-learn p[style*="background:var(--gray-panel)"], body.sp-learn div[style*="background:var(--gray-panel)"]:not(#locked-notice){ background:var(--lr-paper) !important; border-radius:14px !important; color:var(--lr-ink-2) !important; }
/* Les panneaux de menu masqués ne doivent jamais créer de défilement horizontal */
body.sp-learn{ overflow-x:clip; }