/* Harmonisation footer ,  aligné sur preview-v3/main */
.ft{background:#14224F;color:#aab6d2;padding-block:44px}
.ft .ft-grid{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px 34px;align-items:center}
.ft .ft-brand{display:inline-grid;gap:1px;width:max-content;color:#fff;text-decoration:none}
.ft .ft-brand img{height:52px;width:auto;display:block}
.ft .ft-links{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px 22px}
.ft .ft-links a{color:#dbe4f5;font-size:.9rem;font-weight:650;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.ft .ft-links a:hover{color:#fff;text-decoration:underline}
.ft .ft-copy{grid-column:1/-1;color:#8593b5;text-align:right;font-size:.86rem}
@media (max-width:899px){
  body.is-authenticated .learn-header{
    position:fixed !important;
    top:0 !important;
    right:0 !important;
    left:0 !important;
    z-index:400 !important;
    transform:none !important;
    overflow: visible !important;
    background:#FBF7EC !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }
  body.is-authenticated .learn-header.compact .learn-logo-wrap{
    width:auto !important;
    max-width:min(174px,46vw) !important;
  }
  body.is-authenticated .learn-header-fusion,
  body.is-authenticated [data-dashboard-home],
  body.is-authenticated .dashboard-welcome,
  body.is-authenticated .dashboard-home-discover,
  body.is-authenticated .dashboard-home-rail,
  body.is-authenticated .dashboard-home-mobile-help{
    display: none !important;
  }
  body.is-authenticated .dashboard-tabs{
    position:fixed !important;
    top:64px !important;
    right:0 !important;
    left:0 !important;
    z-index:399 !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    border-radius:0 !important;
    background:#FBF7EC !important;
    box-shadow:none !important;
  }
  body.is-authenticated .learning-dashboard{
    padding-top:calc(64px + env(safe-area-inset-top,0px)) !important;
  }
  body.is-authenticated .learning-dashboard:has([data-learn-view="cours"]:not([hidden])){
    padding-top:calc(120px + env(safe-area-inset-top,0px)) !important;
  }
  .learn-mnav [data-logout],
  .dashboard-drawer-help [data-logout]{
    color:#9B1C1C;
    border-color:#E8B4B4;
    background:#fff;
  }
}
.ft .ft-consent:hover{color:#cfe0ff}
@media(max-width:820px){ .ft .ft-grid{grid-template-columns:1fr} .ft .ft-links{justify-content:flex-start} .ft .ft-copy{text-align:left} }
@media(max-width:520px){ .ft .ft-brand img{height:46px} }

/* Preview : harmonisation catalogue, grille lisible */
.learning-catalog-grid{display:grid;gap:16px}
@media(min-width:640px){.learning-catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1020px){.learning-catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.learning-catalog-grid .learning-course-card{margin:0}
.learning-course-level span{font-size:.78rem}
.learn-chip:focus-visible{outline:2px solid var(--learn-teal);outline-offset:2px}
.learning-catalog-grid .learning-course-level{margin:0}
.learning-catalog-grid .learning-course-price{margin:8px 0 0;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.learning-catalog-grid .learning-course-price{margin:8px 0 0}


/* === Cadre cartes formation : premium friendly, sans duree (Variante A serree + Variante B air) === */
/* Variante A appliquee (serree) : padding 14, radius 16, image radius 12, titre 1.02rem/1.25, niveau .78rem teal-dark 700, prix pill 13px */
/* Variante B non appliquee (airee Duolingo/Medium) : padding 18, radius 18, image 14, titre 1.06rem/1.3, niveau .82rem, prix 15px  :  basculer en remplaçant les 4 valeurs ci-dessous */
.learning-course-card{
  padding:14px;
  border:1px solid rgba(231,225,210,.92);
  border-radius:16px;
  background:#fff;
  box-shadow:0 10px 28px rgba(20,34,79,.06);
  overflow:hidden;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.learning-course-card:hover{transform:translateY(-2px);border-color:rgba(15,157,140,.22);box-shadow:0 14px 36px rgba(20,34,79,.08)}
.learning-course-visual{aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:var(--learn-ivory);border:1px solid rgba(231,225,210,.9)}
.learning-course-visual img{width:100%;height:100%;object-fit:cover;display:block}
.learning-course-title{margin:10px 0 0;color:var(--learn-navy);font-size:1.02rem;font-weight:800;line-height:1.25;letter-spacing:-.01em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em}
.learning-course-level{display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border:1px solid rgba(217,149,33,.42);border-radius:999px;background:linear-gradient(145deg, rgba(217,149,33,.10), rgba(217,149,33,.04));color:#8A5C0D;font-size:.76rem;font-weight:800;letter-spacing:.01em;line-height:1;white-space:nowrap}
.learning-course-price{margin:8px 0 0}
.learning-course-price .tag-free{display:inline-flex;align-items:center;gap:6px;min-height:26px;padding:0 10px;border-radius:999px;border:1px solid rgba(15,157,140,.18);background:linear-gradient(145deg, rgba(15,157,140,.08), rgba(15,157,140,.03));color:var(--learn-teal-dark);font-size:.76rem;font-weight:800;letter-spacing:.01em}
.learning-course-price .tag-free::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--learn-teal);box-shadow:0 0 0 3px rgba(15,157,140,.12)}
.learning-course-fiche-link{margin-left:auto;display:inline-flex;align-items:center;gap:9px;color:var(--learn-teal-dark);font-size:.8rem;font-weight:800;letter-spacing:.01em;text-decoration:none;transition:color .18s ease}
.learning-course-fiche-link:hover{color:#087b6e}
.learning-course-arrow{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;color:#fff;background:linear-gradient(145deg,var(--learn-teal-dark),var(--learn-teal));border:1px solid rgba(255,255,255,.58);box-shadow:0 10px 22px rgba(15,157,140,.22),0 0 0 6px rgba(15,157,140,.06);transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.learning-course-arrow svg{width:20px;height:20px}
.learning-course-card:hover .learning-course-arrow,.learning-course-fiche-link:hover .learning-course-arrow{transform:translateX(3px);background:linear-gradient(145deg,#087b6e,#11ad9b);box-shadow:0 13px 26px rgba(15,157,140,.3),0 0 0 8px rgba(15,157,140,.085)}
.learning-course-fiche-link:focus-visible{outline:3px solid var(--learn-teal-dark);outline-offset:3px;border-radius:14px}
@media (prefers-reduced-motion:reduce){.learning-course-arrow{transition:none}}
@media(min-width:640px){.learning-course-card{padding:15px}}
@media(min-width:1020px){.learning-course-card{padding:16px}.learning-course-visual{border-radius:13px}}



/* Finition hero et filtres, Variante A appliquee (Compact premium, Linear/Stripe)
   Rythme 3 niveaux sans couleur ni cadre ajoute : badge+kicker (niveau 3, petit),
   titre (niveau 1, grand), sous-titre (niveau 2, intermediaire). Gap grille porte le rythme.
   Variante A (appliquee) : gap 10/12, badge 52/60, kicker .74rem .11em 700,
   h1 clamp 2.1 vers 3.5 /1.05 -.035em, sub .96 vers 1rem/1.52 48ch, filtres p10 r14 gap7, pills 38px .825rem .015em 700/800.
   Variante B (air friendly Duolingo/Medium, non appliquee) : gap 14/18, badge 62/72, kicker .78rem .09em 800,
   h1 2 vers 3.3/1.1, sub 1.02/1.6 52ch, filtres p14 r16 gap8, pills 38px .84rem 0 750.
   Refs : Stripe (kicker 11px .08em, pills 38px 600/.01em, gap 16), Linear (stack 10-12px, carte 14r subtile),
   Vercel (type tight -.03em, sub muted 15px/1.6). Contrat DESIGN-FORMATIONS 2-3 hors contenu catalogue.
*/
.learning-hero-inner{display:grid;gap:10px}
.learning-hero-badge{height:52px;margin:0 0 2px}
.learning-hero-inner .learning-hero-kicker{margin:0;letter-spacing:.11em;font-size:.74rem;font-weight:700;line-height:1}
.learning-hero-inner h1{margin:0;max-width:16ch;line-height:1.05;letter-spacing:-.035em}
.learning-hero-inner .learning-hero-sub{margin:0;max-width:48ch;color:#C9D6EA;font-size:.96rem;line-height:1.52}
.learning-hero-actions{margin-top:6px;gap:10px}
.learning-hero-actions .learn-btn{border-radius:13px;min-height:44px}
@media(min-width:900px){
  .learning-hero-inner{gap:12px}
  .learning-hero-badge{height:60px}
  .learning-hero-inner .learning-hero-sub{font-size:1rem}
}

/* Hero sur fond navy : focus blanc lisible (teal ne passe pas sur #14224F) et hover ghost renforce */
.learning-hero :where(a,button):focus-visible{ outline-color:#fff; box-shadow:0 0 0 6px rgba(15,157,140,.28); }
.learning-hero .learn-btn-line:hover:not(:disabled){ background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.9); }
.learning-hero .learn-btn-line:active:not(:disabled){ background:rgba(255,255,255,.24); }