/* ---------------- PAGE FORMATION ---------------- */

/* ===== Variables (fusion de tous les :root) ===== */
:root{
  /* Palette page formation */
  --isb-bg:#0b0f1a; 
  --isb-card:#111729; 
  --isb-muted:#8ea0c2; 
  --isb-text:#e9eefc;
  --isb-accent:#4fd1c5; 
  --isb-accent-2:#7c4dff; 
  --isb-border:#1b2742;

  /* Jaunes/CTA utilisés (hero + zone finale) */
  --accent-yellow:#FFD166;
  --accent-yellow-ink:#0b1220;

  --cta-yellow:#FFD166;
  --cta-yellow-2:#F7C55A;
  --cta-text-dark:#0b1220;
  --cta-stroke:rgba(255, 209, 102, .5);

  /* Ancienne palette or (gardée si utilisée ailleurs) */
  --gold:#ffd166;
  --gold-weak:rgba(255,209,102,.08);
  --ink:#0b1220;
}

/* ===== Fond & texte ===== */
body{ background:#0b0f1a; color:var(--isb-text); }

/* ===== Containers & typographies ===== */
.isb-container{max-width:1160px;margin:0 auto;padding:0 20px;}
.isb-title{font-weight:800;letter-spacing:.2px;}
.isb-subtitle{color:var(--isb-muted);}
.isb-btn{display:inline-flex;align-items:center;gap:8px;border-radius:10px;
  padding:12px 16px;font-weight:700;text-decoration:none;border:1px solid transparent}
.isb-btn-primary{background:linear-gradient(135deg,var(--isb-accent),var(--isb-accent-2));color:#0a0d18}
.isb-btn-ghost{color:var(--isb-text);border-color:var(--isb-border);background:transparent}
.isb-ctas{display:flex;gap:12px;flex-wrap:wrap}

/* ===== HERO formation (bloc classique) ===== */
.formation-hero{padding:64px 0 40px;background:linear-gradient(180deg,var(--isb-bg),#0d1426);}
.formation-hero .isb-hero-grid{display:grid;grid-template-columns:1.2fr 0.8fr;gap:40px;align-items:center}
.formation-hero .isb-title{font-size:clamp(28px,3.2vw,40px);margin:0 0 10px}
.formation-hero .isb-subtitle{font-size:clamp(16px,1.6vw,18px);margin:0 0 18px}
.isb-hero-visual{display:flex;justify-content:center}
.isb-visual-box{width:min(420px,100%);aspect-ratio:21/13;border-radius:16px;overflow:hidden;
  border:1px solid var(--isb-border);box-shadow:0 8px 30px rgba(3,6,20,.35);background:#0e1730}
.isb-hero-img{width:100%;height:100%;object-fit:cover}

/* ===== Sections génériques ===== */
section{padding:40px 0}
.isb-section-title{font-size:clamp(22px,2.5vw,28px);font-weight:800;margin-bottom:16px}
.isb-list-bullets{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.isb-list-bullets li{position:relative;padding-left:28px;color:var(--isb-muted)}
.isb-list-bullets li::before{content:"✔";position:absolute;left:0;top:0;color:var(--isb-accent);font-weight:800}

/* ===== Bouton appel permanent ===== */
.cta-fixed{
  position: fixed;
  top: calc(7px + env(safe-area-inset-top));
  right: calc(12px + env(safe-area-inset-right));
  z-index: 2147483647; /* au-dessus de tout */
  background: #FFD000;           /* jaune */
  color: #111;                    /* lisible sur jaune */
  padding: 8px 12px;
  border-radius: 9999px;          /* pill */
  font-weight: 700;
  text-decoration: none;
  border: 1px solid rgba(0,0,0,.15);
  box-shadow: 0 6px 20px rgba(0,0,0,.15);
  transition: transform .15s ease, box-shadow .15s ease, opacity .2s ease;
}
.cta-fixed:hover,
.cta-fixed:focus{
  transform: translateY(-1px);
  box-shadow: 0 10px 28px rgba(0,0,0,.2);
  outline: none;
}
@media (max-width: 640px){
  .cta-fixed{
    font-size: 14px;
    padding: 9px 14px;
    top: calc(10px + env(safe-area-inset-top));
    right: calc(10px + env(safe-area-inset-right));
  }
}


/* ===== Programme (3 cartes) ===== */
.isb-program-days{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.isb-day{background:var(--isb-card);border:1px solid var(--isb-border);border-radius:12px;padding:16px}
.isb-day h3{margin:0 0 8px;font-size:18px}
.isb-day p{margin:0;color:var(--isb-muted)}

/* ===== Logos ===== */
.isb-logos{text-align:center}
.isb-logos-title{font-size:16px;color:var(--isb-muted);margin-bottom:20px;font-weight:600}
.isb-logos-grid{display:flex;justify-content:center;gap:40px;flex-wrap:wrap}
.isb-logos-grid img{max-height:70px;object-fit:contain;filter:grayscale(100%);opacity:.8;transition:.3s}
.isb-logos-grid img:hover{filter:none;opacity:1}

/* ===== CTA final (section) ===== */
.isb-cta-final{padding:56px 0}

/* ===== Responsive général ===== */
@media (max-width:980px){
  .formation-hero .isb-hero-grid{grid-template-columns:1fr}
  .isb-hero-visual{order:-1}
}

/* ===== Forcer couleurs Header (cohérence) ===== */
.site-header,
.site-header a,
.site-header .nav-menu a{
  color: var(--text) !important;
}
.site-header .nav-menu a:hover{ color: var(--accent) !important; }
.site-header .brand-badge{
  background: var(--accent-weak) !important;
  color: var(--accent) !important;
}

/* ===== Audience chips ===== */
.audience-chips{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0 20px;}
.aud-chip{
  display:inline-flex;align-items:center;gap:6px;background:#f4f6fb;border:1px solid var(--border);
  border-radius:999px;padding:10px 16px;font-size:15px;font-weight:600;color:var(--text);
  box-shadow:var(--shadow);transition:all .25s ease;
}
.aud-chip:hover{background:var(--accent-weak);border-color:var(--accent);color:var(--accent);transform:translateY(-2px);}

/* ===== HERO BRIDGE (grand visuel) ===== */
.hero-bridge{position:relative;min-height:68vh;display:grid;align-items:end;overflow:hidden;border-bottom:1px solid #1b2742;}
.hero-bridge__bg{position:absolute;inset:0;}
.hero-bridge__bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.02);filter:saturate(1.02) contrast(1.02);}
.hero-bridge__overlay{
  position:absolute;inset:0;
  background:
    linear-gradient(180deg, rgba(8,12,24,0.55) 0%, rgba(8,12,24,0.75) 45%, rgba(8,12,24,0.92) 100%),
    radial-gradient(1200px 300px at 15% -10%, rgba(124,77,255,.20), transparent 60%),
    radial-gradient(800px 240px at 95% 110%, rgba(79,209,197,.18), transparent 60%);
  pointer-events:none;
}
.hero-bridge__inner{position:relative;z-index:1;padding:clamp(36px,5vw,70px) 0;}
.hero-bridge__content{max-width:980px;color:#e9eefc;}
.hero-bridge h1{margin:0 0 10px;line-height:1.1;font-weight:800;font-size:clamp(30px,4vw,48px);}
.hero-bridge .highlight{display:inline-block;background:linear-gradient(90deg, rgba(255,209,102,.22), rgba(124,77,255,.18));padding:0 .22em;border-radius:.2em;}
.hero-bridge .lead{margin:8px 0 14px;font-size:clamp(16px,1.6vw,18px);color:#c8d3f0;max-width:840px;}
.differentiator{margin:12px 0 18px;color:#aab7da;font-style:italic;border-left:3px solid rgba(255,209,102,.8);padding-left:12px;}
.hero-bridge__ctas{display:flex;gap:12px;flex-wrap:wrap;}

/* CTAs accent jaunes (utilisés dans hero-bridge) */
.btn.btn-accent{
  background: var(--accent-yellow);
  color: var(--accent-yellow-ink);
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 10px 24px rgba(255,209,102,.25);
}
.btn.btn-accent:hover{filter:brightness(1.02);transform:translateY(-1px);}
.btn.btn-accent-ghost{background:transparent;color:var(--accent-yellow);border:1px solid var(--accent-yellow);}
.btn.btn-accent-ghost:hover{background:rgba(255,209,102,.12);}

/* ===== Audience cards (4) ===== */
.audience-cards{
  background: linear-gradient(180deg, #0d1426, #0f1a33);
  color: #e9eefc;
  padding-top: 28px;
  padding-bottom: 32px;
  border-bottom: 1px solid #1b2742;
}
.audience-cards h2{margin:0 0 14px;font-weight:800;font-size:clamp(22px,2.4vw,28px);}
.cards-4{display:grid;gap:14px;grid-template-columns:repeat(1,1fr);}
@media (min-width:780px){ .cards-4{grid-template-columns:repeat(4,1fr);} }
.aud-card{
  background:#111729;border:1px solid #1b2742;border-radius:16px;padding:16px;
  box-shadow:0 10px 30px rgba(3,6,20,.25);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  display:grid;gap:8px;
}
.aud-card:hover{transform:translateY(-2px);border-color:#ffd166;box-shadow:0 18px 50px rgba(124,77,255,.18);}
.aud-card__icon{font-size:22px;line-height:1;}
.aud-card h3{margin:0;font-size:16px;font-weight:800;color:#e9eefc;}
.aud-card p{margin:0;font-size:14px;color:#aab7da;}

/* ===== Boîte d'impact (note-impact) ===== */
.note-impact{
  max-width:700px;margin:40px auto;padding:25px;background-color:#1c2a44;
  border-radius:8px;border-left:6px solid #FFC300;box-shadow:0 4px 10px rgba(0,0,0,.3);
}
.impact-content{display:flex;flex-direction:column;gap:10px;color:#fff;}
.impact-header{display:flex;align-items:center;gap:15px;}
.icon-light{font-size:1.8rem;color:#FFC300;margin-bottom:0;flex-shrink:0;}
.impact-constat{font-size:1.05rem;font-style:italic;line-height:1.5;margin:0;opacity:.8;flex-grow:1;}
.impact-solution{font-size:1.3rem;font-weight:800;line-height:1.3;color:#fff;margin:0;padding-top:10px;text-shadow:0 1px 1px rgba(0,0,0,.3);}
@media (max-width:768px){
  .note-impact{margin:30px 15px;padding:18px;}
  .impact-solution{font-size:1.15rem;}
}

/* ===== Logos ribbon ===== */
.logos-ribbon{
  background: linear-gradient(180deg, #0f1a33, #0b0f1a);
  border-top: 1px solid #1b2742;
  border-bottom: 1px solid #1b2742;
  padding-top: 18px;
  padding-bottom: 18px;
}
.logos-ribbon__inner{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:18px;}
.logos-ribbon__title{color:#aab7da;font-weight:700;font-size:14px;white-space:nowrap;}
.logos-ribbon__list{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:max-content;        /* resserre l’espacement quand peu de logos */
  justify-content:start;
  column-gap:clamp(14px, 3.5vw, 32px);
}
.logos-ribbon__item{display:flex;align-items:center;justify-content:center;opacity:.9;transition:opacity .2s ease, transform .2s ease;}
.logos-ribbon__item:hover{opacity:1;transform:translateY(-1px);}
.logos-ribbon__item img{max-height:40px;width:auto;filter:grayscale(100%) contrast(1.05);opacity:.85;transition:filter .2s ease, opacity .2s ease;}
.logos-ribbon__item:hover img{filter:grayscale(0%);opacity:1;}
.logos-ribbon--compact .container{max-width:980px;}
@media (max-width:920px){
  .logos-ribbon__inner{grid-template-columns:1fr;gap:12px;text-align:center;}
  .logos-ribbon__list{grid-auto-columns:minmax(100px,1fr);gap:18px;}
  .logos-ribbon__title{justify-self:center;}
}

/* ===== POURQUOI : 6 raisons (cartes) ===== */
.section.why-choose{
  background: linear-gradient(180deg, #0f172a, #0b1220);
  padding: 56px 0;                 /* version compacte validée */
  color: #eaf0ff;
  border-top: 1px solid #1b2742;
}
.section.why-choose.compact{ padding: 48px 0; }
.section.why-choose .section-title{
  text-align:center;font-weight:800;font-size:clamp(22px, 2.2vw, 30px);
  margin:0 0 28px;letter-spacing:.2px;position:relative;
}
.section.why-choose .section-title::after{
  content:"";display:block;width:88px;height:3px;margin:10px auto 0;border-radius:999px;
  background: linear-gradient(90deg, #ffd166, #7c4dff);opacity:.9;
}

/* Grille */
.features-grid{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:14px;}
@media (max-width:980px){ .features-grid{grid-template-columns:1fr;} }

/* Cartes encadrées (fusion des définitions) */
.feature-card{
  background: rgba(17, 25, 48, .35);
  border: 1px solid #263253;
  border-radius: 14px;
  padding: 16px 16px 14px;
  display:flex;flex-direction:column;gap:10px;
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
  backdrop-filter: saturate(1.1) blur(0.5px);
  box-shadow: 0 8px 20px rgba(3,6,20,.18) inset, 0 1px 0 rgba(255,255,255,.05);
}
.feature-card:hover{
  border-color:#ffd166;
  box-shadow:0 14px 36px rgba(255,209,102,.18), 0 1px 0 rgba(255,255,255,.06) inset;
  transform:translateY(-2px);
}
/* Titres + textes compacts */
.feature-card h3{margin:0;font-weight:800;font-size:clamp(15px, 1.4vw, 17px);letter-spacing:.2px;}
.feature-card p{margin:0;color:#c7d3f4;font-size:clamp(14px, 1.2vw, 15px);line-height:1.55;}
/* Listes internes */
.feature-card .ul{margin:0 0 2px 18px;padding:0;color:#d3ddfb;font-size:clamp(14px, 1.2vw, 15px);}
.feature-card .ul li{margin:6px 0;}
/* Meta collée en bas (une seule fois) */
.feature-card .meta{
  margin-top:auto;padding-top:10px;border-top:1px dashed rgba(255,255,255,.08);
  color:#e8edff;font-weight:700;font-size:clamp(13px, 1.1vw, 14px);
}
.feature-card > *:last-child{ margin-bottom:0; }
/* Option encore plus compacte pour 13–14" */
@media (max-height:820px) and (min-width:981px){
  .section.why-choose{padding:42px 0;}
  .features-grid{gap:12px;}
  .feature-card{padding:14px;}
}

/* ===== Cartes "parcours en bref" ===== */
.program-card{
  background:#111a2e;border:1.5px solid rgba(255,255,255,.28);
  border-radius:22px;padding:28px 32px;box-shadow:0 6px 20px rgba(3,6,20,.28);
  transition:border-color .22s ease, box-shadow .22s ease, transform .22s ease, background .22s ease;
  position:relative;
}
.program-card::before{
  content:"";position:absolute;inset:0;border-radius:20px;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}
.program-card:hover,
.program-card:focus-within{
  border-color:#ffd166;
  box-shadow:0 12px 34px rgba(255,209,102,.18), 0 2px 0 rgba(255,209,102,.08) inset;
  transform:translateY(-2px);
  background:linear-gradient(180deg, #111a2e 0%, #0f172a 100%);
}
.program-card:hover::before,
.program-card:focus-within::before{
  box-shadow:inset 0 0 0 1px rgba(255,209,102,.45), 0 0 0 3px rgba(255,209,102,.10);
}
.program-card h3{margin:0 0 14px;font-weight:800;letter-spacing:.2px;}
@media (prefers-reduced-motion:reduce){ .program-card{transition:none;} }

.note{
  background: rgba(255, 209, 102, 0.08);
  border: 1px solid rgba(255, 209, 102, 0.35);
  border-radius: 14px;
  padding: 18px 22px;
  color: #ffd166;
  font-weight: 500;
}

/* ===== PRICING (page formation) ===== */
.pricing{
  padding: 44px 0 28px;
  background: linear-gradient(180deg, #0f172a, #0b1220);
  border-top: 1px solid var(--isb-border, #1b2742);
  color: var(--isb-text, #e9eefc);
}
.pricing .section-title{
  margin: 0 0 18px;
  font-weight: 800;
  font-size: clamp(22px, 2.4vw, 28px);
  letter-spacing: .2px;
}

.pricing-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.pricing-card{
  position: relative;
  background: var(--isb-card, #111729);
  border: 1px solid var(--isb-border, #1b2742);
  border-radius: 16px;
  padding: 18px 16px;
  box-shadow: 0 8px 26px rgba(3,6,20,.20);
  display: grid;
  align-content: start;
  gap: 12px;
}

/* Carte recommandée (au centre) */
.pricing-card.recommended{
  background: linear-gradient(180deg, #121d39, #0f1a33);
  border-color: rgba(124,77,255,.45);
  box-shadow: 0 12px 40px rgba(124,77,255,.15);
}

.pricing-ribbon{
  position: absolute;
  top: -10px; right: 14px;
  padding: 6px 10px;
  font-size: 12px; font-weight: 800;
  border-radius: 999px;
  color: #0a0d18;
  background: linear-gradient(135deg, var(--isb-accent, #4fd1c5), var(--isb-accent-2, #7c4dff));
  border: 1px solid rgba(255,255,255,.2);
}

/* Ligne de tête : Titre (gauche) + Prix (droite) */
.pricing-head{
  display: flex;
  align-items: baseline;           /* aligne mieux les textes */
  justify-content: space-between;  /* titre à gauche, prix à droite */
  gap: 12px;
  margin: 0;                       /* pas d'espace parasite */
}

.pricing-title{
  margin: 0;
  font-size: 16px;
  font-weight: 800;
}
.pricing-price{
  margin: 0 0 0 auto;              /* pousse le prix à droite */
  white-space: nowrap;             /* évite le retour à la ligne 3 195 € */
  font-size: 22px;
  font-weight: 900;
  color: var(--isb-text, #e9eefc);
}
.pricing-price span{
  font-size: 14px;
  font-weight: 700;
  opacity: .8;
  margin-left: 4px;
}

/* Mobile : si tu veux les empiler proprement en petit écran */
@media (max-width: 560px){
  .pricing-head{
    align-items: center;
  }
}

.pricing-features{
  margin: 0; padding: 0;
  list-style: none;
  display: grid; gap: 8px;
  color: var(--isb-muted, #8ea0c2);
  font-size: 14px;
}

/* Note tickets */
.pricing-note{
  margin: 12px 0 0;
  color: var(--isb-muted, #8ea0c2);
  font-size: 14px;
  border-top: 1px solid var(--isb-border, #1b2742);
  padding-top: 12px;
}

/* Hover léger comme sur la home */
.pricing-card:hover{
  border-color: #ffd166;
  box-shadow: 0 14px 36px rgba(255,209,102,.18);
  transform: translateY(-2px);
  transition: .22s ease;
}

/* Responsive 
@media (max-width: 980px){
  .pricing-grid{ grid-template-columns: 1fr; gap: 14px; }
  .pricing{ padding: 38px 0 24px; }
}*/


/* ===== CTA finale (fond + textes) ===== */
.section.cta-final{
  background: linear-gradient(180deg, #14233d 0%, #0f1d33 100%);
  border-top: 1px solid #1b2742;
  padding: 52px 0 70px;
}
.cta-final .cta-title{margin:0 0 8px;font-weight:800;font-size:clamp(20px,2.4vw,28px);color:#eaf0ff;letter-spacing:.2px;}
.cta-final .cta-sub{margin:0 0 22px;color:#aab7da;max-width:900px;}
.cta-buttons{display:flex;gap:14px;flex-wrap:wrap;}

/* ===== Système CTA homogène (utilisé en bas + réutilisable) ===== */
.cta-center{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin-top:18px;}
.cta{
  display:inline-flex;align-items:center;justify-content:center;padding:16px 22px;border-radius:999px;
  border:1.5px solid transparent;font-weight:800;font-size:clamp(14px,1.4vw,18px);line-height:1;
  text-decoration:none;cursor:pointer;
  transition:transform .15s ease, box-shadow .2s ease, filter .2s ease, border-color .2s ease, background .2s ease;
}
.cta-primary{
  color:#0b1220;background:linear-gradient(135deg, #FFD166, #F2B84D);
  box-shadow:0 10px 24px rgba(255,209,102,.18);
}
.cta-primary:hover{transform:translateY(-1px);filter:brightness(1.04);box-shadow:0 16px 34px rgba(255,209,102,.28);}
.cta-primary:active{transform:translateY(0);}
.cta-outline{
  color:#EAF0FF;background:rgba(255,255,255,.02);border-color:rgba(255,209,102,.40);
  box-shadow:inset 0 0 0 1px rgba(255, 209, 102, .25);
}
.cta-outline:hover{border-color:#FFD166;box-shadow:0 8px 24px rgba(255,209,102,.22);transform:translateY(-1px);}
.cta-outline:active{transform:translateY(0);}
@media (max-width:720px){ .cta{width:100%;} }
