:root {
  --ink: #080b12;
  --cream: #f6f8fb;
  --paper: #ffffff;
  --lime: #f5d316;
  --teal: #075aa8;
  --line: rgba(8,11,18,.14);
}

.nav-wrap { background: rgba(255,255,255,.94); }
.hero { max-width: 1400px; grid-template-columns: .72fr 1.28fr; gap: 42px; }
.nav-wrap:after { content: ''; display: block; height: 6px; background: repeating-linear-gradient(90deg,#080b12 0 18px,#fff 18px 36px); }
.nav-cta, .primary { background: #075aa8; }
.eyebrow span { background: #f5d316; box-shadow: 0 0 0 1px #080b12; }
h1 em, .section-head .kicker, .method .kicker { color: #075aa8; }
h1 { text-transform: uppercase; font-size: clamp(44px,5.4vw,78px); line-height: .96; }
h1 em { position: relative; display: inline-block; z-index: 0; }
h1 em:after { content: ''; position: absolute; z-index: -1; left: -8px; right: -12px; bottom: -2px; height: .28em; background: #f5d316; transform: rotate(-1.5deg); }
.road-card { height: auto; aspect-ratio: 1290 / 724; border-radius: 18px; box-shadow: 22px 22px 0 #f5d316; }
.photo-label { background: #080b12; border-left: 5px solid #f5d316; }
.photo-label span, .primary span { color: #f5d316; }
.course.featured { background: #f5d316; }
.course.dark { background: #080b12; }
.course.code { background: #e7f1fb; }
.course:nth-child(1) { transform: rotate(-.45deg); z-index: 1; }
.course:nth-child(3) { transform: rotate(.45deg); z-index: 1; }
.course-icon { border-width: 3px; box-shadow: 4px 4px 0 currentColor; }
.course-num { z-index: 2; padding: 5px 8px; background: #fff; color: #080b12; border: 2px solid #080b12; }

/* Cartes de formations : grille asymétrique et verre dépoli. */
.course-grid { grid-template-columns: 1.25fr .9fr .9fr; grid-template-rows: repeat(2, minmax(220px, auto)); gap: 20px; border: 0; }
.course { min-height: 260px; border: 1px solid rgba(255,255,255,.55); border-radius: 24px; background: rgba(255,255,255,.18); box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 18px 40px rgba(8,11,18,.14); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); isolation: isolate; overflow: hidden; transition: transform .3s ease, box-shadow .3s ease; }
.course::before { content: ''; position: absolute; inset: -2px; z-index: -1; border-radius: inherit; background: linear-gradient(135deg, rgba(255,255,255,.9), rgba(245,211,22,.55), transparent 62%); opacity: 0; filter: blur(13px); transition: opacity .3s ease; }
.course.featured { grid-row: span 2; background: linear-gradient(145deg, rgba(245,211,22,.84), rgba(245,211,22,.52)); color: #080b12; }
.course.dark { background: linear-gradient(145deg, rgba(8,11,18,.84), rgba(7,90,168,.68)); color: #fff; }
.course.code { grid-column: 2 / 4; background: linear-gradient(145deg, rgba(7,90,168,.8), rgba(7,28,57,.68)); color: #fff; }
.course:nth-child(1), .course:nth-child(3) { transform: none; }
.course:hover { transform: translateY(-8px); box-shadow: 0 0 22px rgba(245,211,22,.42), 0 22px 54px rgba(8,11,18,.24); }
.course:hover::before { opacity: 1; }
.course a { position: relative; z-index: 1; }
.pop-ribbon { margin: -32px 0 55px; padding: 12px 18px; display: flex; justify-content: space-between; gap: 20px; overflow: hidden; background: #075aa8; color: #fff; border: 3px solid #080b12; box-shadow: 8px 8px 0 #f5d316; transform: rotate(-1deg); font: 800 12px Manrope,sans-serif; letter-spacing: .1em; }
.agencies { background: #080b12; }
.agency { background: #123b66; }
.agency.accent { background: #075aa8; }
.section-head.light .kicker, .hours b { color: #f5d316; }

.quality {
  padding: 110px max(32px,calc((100vw - 1216px)/2));
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: 90px;
  background: #fff;
}
.quality .kicker { color: #075aa8; }
.quality h2, .cpf h2 { font-size: clamp(38px,4.4vw,64px); line-height: 1.02; letter-spacing: -.05em; margin-top: 12px; }
.quality-intro>p { color: #586271; font-size: 18px; max-width: 570px; }
.quality-badges { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 34px; }
.quality-badge { min-height: 122px; border: 2px solid #075aa8; padding: 18px; display: flex; flex-direction: column; justify-content: space-between; }
.quality-badge:first-child { transform: rotate(-1deg); box-shadow: 7px 7px 0 #f5d316; }
.quality-badge strong { color: #075aa8; font: 800 20px Manrope,sans-serif; letter-spacing: .08em; }
.quality-badge span { font-size: 12px; font-weight: 700; line-height: 1.35; }
.quality-badge.qualiopi { border-color: #080b12; border-bottom: 8px solid #f5d316; }
.quality-badge.qualiopi strong { color: #080b12; }
.quality-points { border-top: 1px solid var(--line); }
.quality-points article { display: grid; grid-template-columns: 42px 1fr; gap: 20px; padding: 25px 0; border-bottom: 1px solid var(--line); }
.quality-points article>span { color: #075aa8; font: 800 13px Manrope,sans-serif; }
.quality-points h3 { font-size: 21px; }
.quality-points p { color: #606b79; margin: 5px 0 0; }

.cpf {
  padding: 100px max(32px,calc((100vw - 1216px)/2));
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 90px;
  background: #075aa8;
  color: #fff;
}
.cpf-label { display: inline-block; padding: 7px 11px; background: #f5d316; color: #080b12; text-transform: uppercase; letter-spacing: .12em; font-size: 11px; font-weight: 800; }
.cpf-copy>p { max-width: 680px; color: #dceafa; font-size: 18px; }
.cpf ul { list-style: none; padding: 0; margin: 26px 0; }
.cpf li { margin: 8px 0; font-weight: 600; }
.cpf li:before { content: '✓'; color: #f5d316; margin-right: 10px; }
.cpf-button { background: #f5d316; color: #080b12; }
.cpf-card { background: #fff; color: #080b12; padding: 34px; align-self: center; box-shadow: 14px 14px 0 #080b12; }
.cpf-card { transform: rotate(1deg); }
.cpf-card>span { text-transform: uppercase; letter-spacing: .13em; color: #075aa8; font-size: 11px; font-weight: 800; }
.cpf-card ol { list-style: none; padding: 0; margin: 20px 0; }
.cpf-card li { display: grid; grid-template-columns: 36px 1fr; gap: 12px; align-items: center; border-bottom: 1px solid var(--line); }
.cpf-card li b { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: #075aa8; color: #fff; }
.cpf-note { font-size: 12px; background: #fff8d1; border-left: 3px solid #f5d316; padding: 12px; }
.footer-legal { text-align: center; }
.footer-legal p { margin: 2px 0; }

.inside { padding: 105px max(32px,calc((100vw - 1216px)/2)); background: #075aa8; color: #fff; }
.inside-grid { display: grid; grid-template-columns: 1.25fr .75fr .75fr; grid-template-rows: 310px 310px; gap: 16px; margin-top: 42px; }
.inside-grid figure { position: relative; overflow: hidden; margin: 0; border: 3px solid #fff; background: #080b12; }
.inside-grid .inside-main { grid-row: 1 / 3; }
.inside-grid figure:last-child { grid-column: 2 / 4; }
.inside-grid img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.inside-grid figure:hover img { transform: scale(1.035); }
.inside-grid figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 42px 18px 17px; color: #fff; background: linear-gradient(transparent,rgba(8,11,18,.9)); }
.inside-grid figcaption strong { display: block; font: 800 18px Manrope,sans-serif; }
.inside-grid figcaption span { display: block; margin-top: 3px; font-size: 13px; }
.inside-grid figure:nth-child(2) { box-shadow: 7px 7px 0 #f5d316; }
.inside { position: relative; overflow: hidden; }
.inside:before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 9px; background: #f5d316; }
.inside .section-head { position: relative; }
.inside .section-head h2 { color: #fff; }
.inside .section-head > p { color: #dcecf9; }
.inside .section-head .kicker { color: #f5d316; }
.inside .section-head h2 br { display: block; }
.inside .section-head h2::first-line { color: #fff; }

@media (max-width: 850px) {
  .hero { grid-template-columns: 1fr; }
  .hero-visual { max-width: none; }
  .road-card { height: auto; }
  .quality, .cpf { grid-template-columns: 1fr; gap: 48px; padding: 72px 20px; }
  .quality-badges { grid-template-columns: 1fr; }
  .cpf-card { box-shadow: 8px 8px 0 #080b12; }
  .footer-legal { text-align: center; }
  .pop-ribbon { white-space: nowrap; justify-content: flex-start; }
  .inside { padding: 72px 20px; }
  .inside-grid { grid-template-columns: 1fr 1fr; grid-template-rows: 390px 260px 290px; }
  .inside-grid .inside-main { grid-column: 1 / 3; grid-row: auto; }
  .inside-grid figure:last-child { grid-column: 1 / 3; }
}
@media (max-width: 480px) {
  .road-card { height: auto; }
  .road-card { box-shadow: 10px 10px 0 #f5d316; }
  .quality h2, .cpf h2 { font-size: 38px; }
  h1 { font-size: 40px; line-height: 1; }
  .course:nth-child(1), .course:nth-child(3), .cpf-card { transform: none; }
  .inside-grid { display: block; }
  .inside-grid figure { height: 270px; margin-bottom: 14px; }
  .inside-grid .inside-main { height: 390px; }
}

@media (max-width: 850px) {
  .course-grid { grid-template-columns: 1fr; grid-template-rows: auto; gap: 16px; }
  .course.featured, .course.code { grid-column: auto; grid-row: auto; }
  .course { min-height: 300px; border-radius: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .course { transition: none; }
  .course:hover { transform: none; }
}
