/* =========================================================================
   WARNING V2 — l'ACCUEIL refait (David, 09/10 : « ya juste la couleur qui a
   changé » → « accueil refait à fond », « épuré et aéré »).
   Posé après style.css et warning2.css, sur <body class="a2"> seulement.
   Les modules repris tels quels (simulateur, contact, mur des réussites,
   fenêtre « Ça m'intéresse », pied de page) gardent leurs classes d'origine.
   ========================================================================= */

.a2 {
  --a-ink: #111a33;
  --a-text: #2b3350;
  --a-muted: #545d78;          /* 6,6 sur blanc */
  --a-line: #e6e8f0;
  --a-soft: #f6f7fb;
  /* LES COULEURS DU LOGO (Sylvie y tient) : bleu nuit + orange « Halloween ».
     Bleu nuit sur orange = 5,8 : boutons et pastilles comme le logo.
     Orange sur blanc = 3,1 : seulement en aplat ou en GRAND titre, jamais
     en petit texte (qui passe au bleu nuit). Orange sur bleu nuit = 5,8. */
  --a-orange: #ff5a1f;
  --a-orange-hover: #ff7a45;
  --a-orange-texte: #f55216;    /* grand texte orange sur fond clair (≥ 3,0 partout) */
  --a-orange-d: #0b1437;        /* petit texte « d'accent » : bleu nuit */
  --a-orange-bg: #fff3ec;
  --a-navy: #0b1437;
  background: #fff;
  color: var(--a-text);
}
.a-wrap { width: min(100% - 40px, 1120px); margin-inline: auto; }
.a-narrow { width: min(100% - 40px, 760px); }
.a-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.a-center { text-align: center; }
.a-gap { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 40px; }
.a-muted { color: var(--a-muted); }
.a-small { font-size: .88rem; }
.a2 main :is(p, dd, .a-fine li, .a-signup-list li, .a-bullets li) > a:not([class]) { color: var(--a-navy); text-decoration: underline; text-decoration-color: var(--a-orange); text-decoration-thickness: 2px; text-underline-offset: 3px; }

/* ---------- Titres ---------- */
.a2 h1, .a2 h2, .a2 h3, .a2 h4 { color: var(--a-ink); letter-spacing: -.02em; }
.a2 .a-eyebrow { display: flex; align-items: center; gap: 10px; font-size: .85rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--a-navy); margin-bottom: 10px; }
.a2 .a-eyebrow::before { content: ""; width: 26px; height: 3px; border-radius: 2px; background: var(--a-orange); }
.a-head { max-width: 680px; margin-bottom: 48px; }
.a-head h2, .a-split h2, .a-signup h2 { font-size: clamp(1.8rem, 3.4vw, 2.5rem); line-height: 1.15; margin-bottom: 14px; text-wrap: balance; }
.a-head p { color: var(--a-muted); font-size: 1.06rem; }
.a-cat { font-size: 1.35rem; margin: 64px 0 20px; scroll-margin-top: 90px; }
.a-cat:first-of-type { margin-top: 32px; }

/* ---------- Boutons ---------- */
.a-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 0 22px; border-radius: 10px; border: 2px solid transparent;
  font: inherit; font-weight: 600; font-size: .98rem; line-height: 1.2; text-decoration: none; cursor: pointer;
  transition: background-color .2s ease-out, border-color .2s ease-out, color .2s ease-out;
}
.a-btn svg { width: 18px; height: 18px; flex: none; }
.a-btn-primary { background: var(--a-orange); color: var(--a-navy); }
.a-btn-primary:hover { background: var(--a-orange-hover); color: var(--a-navy); }
.a-btn-ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.4); }
.a-btn-ghost:hover { border-color: #fff; color: #fff; }
.a-btn-line { background: transparent; color: var(--a-ink); border-color: #c9cede; }
.a-btn-line:hover { border-color: var(--a-orange); color: var(--a-orange-d); }
.a-full { width: 100%; }
.a-link { color: var(--a-navy); text-decoration-color: var(--a-orange) !important; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Sections ---------- */
.a-section { padding: 112px 0; }
.a-alt { background: var(--a-soft); }
.a-card { background: #fff; border: 1px solid var(--a-line); border-radius: 16px; padding: 28px; }
.a-alt .a-card { border-color: #e1e4ee; }
.a-split { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 64px; align-items: center; }
.a-split-top { align-items: start; margin-bottom: 48px; }
.a-tag { display: inline-block; font-size: .85rem; font-weight: 600; color: var(--a-orange-d); background: #fff3ec; border-radius: 999px; padding: 4px 12px; }

/* ---------- Héros ---------- */
.a-hero { padding: calc(var(--nav-h, 68px) + 72px) 0 72px; background: var(--a-navy); color: #fff; }
.a2 .a-hero h1 { color: #fff; }
.a-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: center; }
.a-kicker { font-size: .92rem; font-weight: 600; color: var(--a-orange); margin-bottom: 18px; }
.a-hero h1 { font-size: clamp(2.5rem, 5.2vw, 4rem); line-height: 1.04; margin-bottom: 22px; }
.a-accent { color: var(--a-orange); }
.a-lead { font-size: 1.15rem; line-height: 1.65; color: #c9d1ea; max-width: 34rem; margin-bottom: 32px; }
.a-lead b { color: #fff; }
.a-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 18px; }
.a-open { margin-bottom: 18px; }
.a-open .open-badge { background: rgba(255,255,255,.08); color: #fff; border: 1px solid rgba(255,255,255,.18); }
.a-checks { list-style: none; display: grid; gap: 8px; color: #c9d1ea; font-size: .97rem; }
.a-checks li { display: flex; gap: 10px; }
.a-checks li::before {
  content: ""; flex: none; width: 20px; height: 20px; margin-top: 3px; border-radius: 50%; background: var(--a-orange)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b1437' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 12px no-repeat;
}
.a-hero-media { position: relative; }
.a-hero-media > img { width: 100%; aspect-ratio: 5 / 4; object-fit: cover; object-position: 50% 78%; border-radius: 24px; }
.a-rating {
  position: absolute; left: -28px; bottom: 28px; display: flex; align-items: center; gap: 14px;
  background: #fff; border-radius: 16px; padding: 16px 20px; box-shadow: 0 16px 40px rgba(17, 26, 51, .16);
}
.a-rating b { font-family: "Sora", sans-serif; font-size: 2.2rem; line-height: 1; color: var(--a-ink); }
.a-rating b small { font-size: .95rem; color: var(--a-muted); }
.a-rating div { display: grid; gap: 2px; font-size: .85rem; color: var(--a-muted); }
.a-stars { color: #b45309; letter-spacing: .12em; font-size: 1rem; }

/* ---------- Offres ---------- */
.a-offers { padding: 8px 0 72px; }
.a-offer-list { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--a-line); border-radius: 18px; overflow: hidden; }
.a-offer-list li + li { border-left: 1px solid var(--a-line); }
.a-offer-list a { display: grid; gap: 4px; padding: 28px; height: 100%; color: inherit; text-decoration: none; transition: background-color .2s ease-out; }
.a-offer-list a:hover { background: var(--a-soft); }
.a-ico { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--a-orange); color: var(--a-navy); margin-bottom: 12px; }
.a-ico svg { width: 24px; height: 24px; }
.a-offer-name { font-family: "Sora", sans-serif; font-weight: 700; color: var(--a-ink); font-size: 1.08rem; }
.a-offer-price { font-family: "Sora", sans-serif; font-weight: 800; color: var(--a-orange-texte); font-size: 1.5rem; }
.a-offer-sub { font-size: .88rem; color: var(--a-muted); }
.a-note { margin-top: 16px; font-size: .88rem; color: var(--a-muted); max-width: 52rem; }

/* ---------- Chiffres ---------- */
.a-figures { padding: 72px 0; background: var(--a-navy); }
.a-figures .a-fig-list dt { color: #c9d1ea; }
.a-figures .a-fig-list dd { color: var(--a-orange); }
.a-figures .a-fig-list .a-fig-sub { color: #c9d1ea; }
.a-fig-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
.a-fig-list dt { font-size: .9rem; font-weight: 600; color: var(--a-muted); }
.a-fig-list dd { font-family: "Sora", sans-serif; font-weight: 800; font-size: clamp(2.2rem, 4vw, 3rem); color: var(--a-ink); line-height: 1.15; }
.a-fig-list .a-fig-sub { font-family: inherit; font-weight: 400; font-size: .85rem; color: var(--a-muted); line-height: 1.5; }
.a-fig-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin: 16px 0; }
.a-fig-compact dd:not(.a-fig-sub) { font-size: 2rem; }

/* ---------- Avis ---------- */
.a-bignote { display: flex; align-items: baseline; gap: 4px; margin: 8px 0 12px; }
.a-bignote b { font-family: "Sora", sans-serif; font-size: 4.5rem; line-height: 1; color: var(--a-ink); }
.a-bignote span { font-weight: 700; color: var(--a-muted); }
.a-split-head p { margin-bottom: 12px; }
.a-os-note { margin-bottom: 12px; }

/* ---------- Tarifs ---------- */
.a-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.a-chips a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border-radius: 999px;
  border: 1px solid #d5d9e6; background: #fff; color: var(--a-ink); font-weight: 600; text-decoration: none; font-size: .95rem;
}
.a-chips a:hover { border-color: var(--a-orange); color: var(--a-orange-d); }
.a-table-wrap { overflow-x: auto; border: 1px solid #e1e4ee; border-radius: 16px; background: #fff; }
.a-table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: .97rem; }
.a-table th, .a-table td { padding: 16px 20px; text-align: left; border-bottom: 1px solid var(--a-line); vertical-align: top; }
.a-table thead th { font-family: "Sora", sans-serif; font-size: 1.02rem; color: var(--a-ink); vertical-align: bottom; }
.a-table thead small { font-family: "Poppins", sans-serif; font-weight: 500; font-size: .82rem; color: var(--a-muted); }
.a-table tbody th { font-weight: 500; color: var(--a-muted); width: 30%; }
.a-table tbody tr:last-child th, .a-table tbody tr:last-child td { border-bottom: 0; }
.a-table .a-price { font-family: "Sora", sans-serif; font-weight: 800; font-size: 1.6rem; color: var(--a-ink); white-space: nowrap; }
.a-table .a-hl { background: #fff8f3; }
.a-table thead .a-hl { box-shadow: inset 0 3px 0 var(--a-orange); }
.a-table-2 { min-width: 520px; }
.a-cta-row .a-btn { white-space: nowrap; }
.a-fine { margin: 16px 0 0; padding-left: 20px; color: var(--a-muted); font-size: .9rem; display: grid; gap: 6px; }
.a-fine-p { margin-top: 14px; color: var(--a-muted); font-size: .9rem; }
.a-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 20px; }
.a-trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.a-card h4 { font-size: 1.08rem; margin-bottom: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; justify-content: space-between; }
.a-card p { font-size: .95rem; }
.a-card .a-btn { margin-top: 16px; }
.a-hint { color: var(--a-orange-d); font-weight: 600; margin-top: 8px; }
.a-prices { display: grid; }
.a-prices > div { display: flex; justify-content: space-between; gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--a-line); font-size: .94rem; }
.a-prices > div:last-child { border-bottom: 0; }
.a-prices dt { color: var(--a-text); }
.a-prices dd { font-weight: 700; color: var(--a-ink); white-space: nowrap; }
.a-bullets { padding-left: 20px; display: grid; gap: 6px; margin-bottom: 12px; font-size: .95rem; }
.a2 .a-center > .fw-open { margin-top: 20px; }

/* ---------- Formations ---------- */
.a-form-list { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; margin-bottom: 40px; }
.a-form-list a { display: block; padding: 24px 0; border-bottom: 1px solid var(--a-line); color: inherit; text-decoration: none; }
.a-form-list a:hover h3 { color: var(--a-orange-d); }
.a-form-list h3 { font-size: 1.12rem; margin-bottom: 6px; transition: color .2s ease-out; }
.a-form-list h3::after { content: " →"; color: var(--a-orange); }
.a-form-list p { color: var(--a-muted); font-size: .95rem; margin-bottom: 10px; }

/* ---------- Parcours & inscription ---------- */
.a-steps { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; position: relative; }
.a-steps::before { content: ""; position: absolute; top: 22px; left: 22px; right: 22px; height: 2px; background: #dfe2ec; }
.a-steps li { position: relative; }
.a-step-n {
  position: relative; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%;
  background: var(--a-orange); border: 2px solid var(--a-orange); color: var(--a-navy); font-family: "Sora", sans-serif; font-weight: 800; margin-bottom: 18px;
}
.a-steps h3 { font-size: 1.12rem; margin-bottom: 8px; }
.a-steps p { color: var(--a-muted); font-size: .95rem; }
.a-when { margin-top: 10px; font-size: .85rem !important; font-weight: 600; color: var(--a-ink) !important; }
.a-signup { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: 56px; margin-top: 96px; padding-top: 72px; border-top: 1px solid #dfe2ec; scroll-margin-top: 90px; }
.a-signup > div > p { color: var(--a-muted); margin-bottom: 20px; }
.a-signup-list { padding-left: 22px; display: grid; gap: 14px; color: var(--a-text); }
.a-signup-list b { color: var(--a-ink); }
.a-hours h3 { font-size: 1.1rem; margin-bottom: 12px; }
.a-hours dl { margin-bottom: 8px; }
.a-hours dl > div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--a-line); font-size: .94rem; }
.a-hours dd { font-weight: 600; color: var(--a-ink); text-align: right; }
.a-hours .a-btn { margin-top: 12px; }

/* ---------- Code ---------- */
.a-options { list-style: none; counter-reset: opt; display: grid; gap: 24px; margin-top: 28px; }
.a-options li { counter-increment: opt; display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 16px; }
.a-options li::before {
  content: counter(opt); grid-row: span 2; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px;
  background: var(--a-orange); color: var(--a-navy); font-family: "Sora", sans-serif; font-weight: 800;
}
.a-options h3 { font-size: 1.05rem; margin-bottom: 4px; }
.a-options p { color: var(--a-muted); font-size: .95rem; }
.a-code3 { text-align: center; padding: 48px 32px; background: var(--a-navy) !important; border-color: var(--a-navy) !important; }
.a2 .a-code3 .a-code3-l { color: #fff; }
.a-code3 .a-tag { background: rgba(255,255,255,.1); color: #fff; }
.a2 .a-code3 .next-sess { color: #fff; }
.a-code3-n { display: block; font-family: "Sora", sans-serif; font-size: 7rem; line-height: 1; color: var(--a-orange); }
.a-code3-l { font-family: "Sora", sans-serif; font-weight: 700; font-size: 1.3rem; color: var(--a-ink); margin: 8px 0 16px; }
.a-code3 .next-sess { margin-top: 12px; }

/* ---------- Agde ---------- */
.a-photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-bottom: 32px; }
.a-photos figure { margin: 0; }
.a-photos img { width: 100%; height: 260px; object-fit: cover; border-radius: 16px; }
.a-ph-big { grid-column: 1 / -1; }
.a-ph-big img { height: auto; aspect-ratio: 21 / 9; }
.a-photos figcaption { margin-top: 12px; font-size: .94rem; color: var(--a-muted); }
.a-photos figcaption b { color: var(--a-ink); }
.a-sector { margin-top: 72px; }
.a-sector h3 { font-size: 1.35rem; margin-bottom: 8px; }
.a-sector-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; margin: 24px 0 32px; }
.a-sector-list > div { padding: 18px 0; border-bottom: 1px solid #dfe2ec; }
.a-sector-list dt { font-family: "Sora", sans-serif; font-weight: 700; color: var(--a-ink); margin-bottom: 4px; }
.a-sector-list dd { color: var(--a-muted); font-size: .95rem; }
.a-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.a-gallery img, .a-gallery video { width: 100%; height: 180px; object-fit: cover; border-radius: 12px; display: block; background: #0b1437; }
.a-gallery .a-g2 { grid-column: span 2; }
.a-gallery video { height: auto; aspect-ratio: 16 / 9; }
.a-gallery img { height: 100%; min-height: 180px; }
/* La vidéo d'une minute */
.a-film { margin: 0 auto 40px; max-width: 900px; }
.a-film video { width: 100%; aspect-ratio: 16 / 9; border-radius: 18px; background: #0b1437; display: block; box-shadow: 0 24px 60px rgba(11,20,55,.25); }
.a-film figcaption { margin-top: 12px; font-size: .94rem; color: var(--a-muted); text-align: center; }

/* ---------- Équipe ---------- */
.a-team-photo { margin: 0 0 56px; }
.a-team-photo img { width: 100%; max-height: 520px; object-fit: cover; border-radius: 24px; }
.a-team-photo figcaption { margin-top: 12px; font-size: .94rem; color: var(--a-muted); text-align: center; }
.a-team { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 24px; }
.a-team li { display: grid; grid-template-columns: 64px minmax(0, 1fr); column-gap: 14px; align-items: start; }
.a-team img { grid-row: span 2; width: 64px; height: 64px; object-fit: cover; object-position: top; border-radius: 50%; background: var(--a-soft); }
.a-team h3 { font-size: 1.05rem; }
.a-team p { font-size: .85rem; color: var(--a-muted); line-height: 1.45; }

/* ---------- Qualiopi ---------- */
.a-links3 { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-bottom: 40px; }
.a-links3 a { display: block; height: 100%; background: #fff; border: 1px solid #e1e4ee; border-radius: 16px; padding: 24px; color: inherit; text-decoration: none; transition: border-color .2s ease-out; }
.a-links3 a:hover { border-color: var(--a-orange); }
.a-links3 h3 { font-size: 1.05rem; margin-bottom: 8px; }
.a-links3 h3::after { content: " →"; color: var(--a-orange); }
.a-links3 p { font-size: .92rem; color: var(--a-muted); }

/* ---------- FAQ ---------- */
.a-faq details { border-bottom: 1px solid var(--a-line); }
.a-faq summary {
  list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px;
  min-height: 64px; padding: 16px 0; font-family: "Sora", sans-serif; font-weight: 600; color: var(--a-ink); font-size: 1.05rem;
}
.a-faq summary::-webkit-details-marker { display: none; }
.a-faq summary::after { content: "+"; flex: none; font-size: 1.6rem; font-weight: 400; color: var(--a-orange); transition: transform .2s ease-out; }
.a-faq details[open] summary::after { transform: rotate(45deg); }
.a-faq details p { padding: 0 0 22px; color: var(--a-muted); }

/* ---------- Modules repris : remis au calme dans la nouvelle page ---------- */
.a2 #simulateur, .a2 #contact, .a2 #reussites-home { padding: 112px 0; }
.a2 #simulateur { background: #fff; }
.a2 #contact { background: var(--a-soft); }
.a2 .section-head .grad-text { color: var(--a-orange-texte); }
/* les apparitions au défilement sont celles du site (style.css + main.js) : rendues le 09/10, « c'était plus waouh » */

/* ---------- Écrans ---------- */
@media (max-width: 1000px) {
  .a-hero-grid, .a-split, .a-signup { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .a-rating { left: 16px; bottom: 16px; }
  .a-offer-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .a-offer-list li:nth-child(3) { border-left: 0; }
  .a-offer-list li:nth-child(n+3) { border-top: 1px solid var(--a-line); }
  .a-fig-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .a-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .a-steps::before { display: none; }
  .a-trio, .a-links3 { grid-template-columns: minmax(0, 1fr); }
  .a-team { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .a-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .a-section, .a2 #simulateur, .a2 #contact, .a2 #reussites-home { padding: 72px 0; }
  .a-hero { padding: calc(var(--nav-h, 68px) + 40px) 0 48px; }
  .a-actions .a-btn { flex: 1 1 100%; }
  .a-offer-list, .a-fig-list, .a-steps, .a-duo, .a-form-list, .a-sector-list, .a-team, .a-photos { grid-template-columns: minmax(0, 1fr); }
  .a-offer-list li + li { border-left: 0; border-top: 1px solid var(--a-line); }
  .a-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .a-photos img, .a-gallery img, .a-gallery video { height: 200px; }
  .a-gallery .a-g2 { grid-column: span 2; }
  .a-gallery video { height: auto; }
  .a-gallery .a-gp { order: 1; }   /* les deux vraies photos côte à côte, en fin de grille */
  .a-ph-big img { aspect-ratio: 4 / 3; }
  .a-rating { position: static; margin-top: 12px; box-shadow: none; border: 1px solid var(--a-line); }
  .a-hero-media > img { aspect-ratio: 16 / 11; object-position: 50% 85%; }
  .a-card { padding: 22px; }
  .a-table th, .a-table td { padding: 14px; }
}
@media (max-width: 700px) {
  /* le tableau défile DANS son cadre ; la colonne des libellés reste visible */
  .a-table tbody th, .a-table thead th:first-child { position: sticky; left: 0; z-index: 1; background: #fff; box-shadow: 1px 0 0 var(--a-line); width: 128px; min-width: 128px; }
  .a-table { font-size: .92rem; }
  .a-table .a-price { font-size: 1.3rem; }
}

/* =========================================================================
   LE « WAOUH » DE L'ORIGINAL, REMIS (David, 09/10 : « dans l'ancien il y avait
   des animations, apparition etc., c'était plus waouh »). Les mécanismes sont
   ceux du site : main.js anime .reveal, [data-count] et #herocanvas.
   ========================================================================= */
.a-hero { position: relative; overflow: hidden; }
.a-hero .hero-canvas { z-index: 0; opacity: .75; }
.a-hero::before {                       /* le halo orange de l'original, qui respire */
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background: radial-gradient(42% 52% at 80% 18%, rgba(255, 90, 31, .35), transparent 70%),
              radial-gradient(46% 56% at 14% 82%, rgba(255, 176, 0, .18), transparent 70%);
  animation: heroglow 14s ease-in-out infinite alternate;
}
.a-hero .a-hero-grid { position: relative; z-index: 1; }

/* le mot qui change : B — Voiture, Moto A1 / A2… */
.a-rot { font-family: "Sora", sans-serif; font-weight: 700; font-size: 1.2rem; color: #fff; margin: -8px 0 16px; }
.a-rot .rotator > span { -webkit-text-fill-color: #ff5a1f; color: #ff5a1f; background: none; }

/* la photo suit la souris (script de la page), le badge flotte */
.a-hero-media { perspective: 1200px; }
.a-hero-media > img { transition: transform .5s cubic-bezier(.22, 1, .36, 1); will-change: transform; }
.a-float { animation: a-flotte 5s ease-in-out infinite; }
@keyframes a-flotte { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

/* cartes et liens qui se soulèvent au survol */
.a-offer-list a, .a-links3 a, .a-card { transition: background-color .2s ease-out, border-color .2s ease-out, transform .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s; }
.a-offer-list a:hover { transform: translateY(-4px); }
.a-links3 a:hover, .a-duo .a-card:hover, .a-trio .a-card:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(11, 20, 55, .10); }
.a-gallery img, .a-photos img { transition: transform .5s cubic-bezier(.22, 1, .36, 1); }
.a-gallery img:hover, .a-photos figure:hover img { transform: scale(1.03); }
.a-step-n { transition: transform .35s cubic-bezier(.22, 1, .36, 1); }
.a-steps li:hover .a-step-n { transform: translateY(-4px) scale(1.06); }

@media (prefers-reduced-motion: reduce) {
  .a-hero::before, .a-float, .a-rot .rotator > span { animation: none; }
  .a-rot .rotator > span:first-child { opacity: 1; transform: none; }
  .a-hero-media > img, .a-offer-list a, .a-links3 a, .a-card, .a-gallery img, .a-photos img, .a-step-n { transition: none; transform: none !important; }
}

/* la classe .hero est gardée exprès : main.js n'ouvre la fenêtre « prochaines
   sessions » de l'accueil que sur une page qui en a une. On neutralise la mise
   en page que style.css lui attache (pleine hauteur, flex, perspective). */
.a2 .a-hero.hero { min-height: 0; display: block; perspective: none; }
.a2 .a-hero h1 span { display: inline; }
