/* =========================================================================
   APRIUM — site vitrine (aprium-formation.fr)
   Même direction artistique que l'espace stagiaire et l'administration :
   olive #3d4432, crème #f4f1e6, or #c7a24a (or foncé #7a5c14 pour le texte),
   titres Fraunces, texte DM Sans, petites capitales espacées.
   S'appuie sur espace.css (polices, boutons, variables).
   ========================================================================= */
.vitrine { --v-olive: #3d4432; --v-olive-2: #2e331f; --v-creme: #f4f1e6; --v-or: #c7a24a; --v-or-fonce: #7a5c14;
  --v-sauge: #b7bba5; --v-largeur: 1160px; background: #ffffff; }
.v-conteneur { width: 100%; max-width: var(--v-largeur); margin: 0 auto; padding: 0 32px; }
.v-messages { padding-top: 24px; }

/* ---------- En-tête ---------- */
.v-entete { background: var(--v-olive); border-bottom: 1px solid var(--v-or); position: sticky; top: 0; z-index: 30; }
.v-entete-in { max-width: var(--v-largeur); margin: 0 auto; padding: 0 32px; height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.v-entete .brand, .v-pied .brand { text-decoration: none; }
.v-entete .brand-name, .v-pied .brand-name { color: var(--v-creme); }
.v-burger { display: none; }
.v-nav { display: flex; align-items: center; gap: 4px; }
.v-nav a { font: 600 11px var(--sans); letter-spacing: .18em; text-transform: uppercase; color: #dcdfd0; text-decoration: none; padding: 10px 12px; white-space: nowrap; }
.v-nav a:hover, .v-nav a.actif { color: #ffffff; }
.v-nav a.actif { box-shadow: inset 0 -2px 0 var(--v-or); }
.v-nav a.v-bouton-espace { margin-left: 12px; border: 1px solid var(--v-or); color: var(--v-creme); border-radius: 6px; padding: 10px 16px; }
.v-nav a.v-bouton-espace:hover { background: var(--v-or); color: var(--v-olive-2); }

/* ---------- Titres communs ---------- */
.v-surtitre { display: inline-block; font: 600 11px var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--v-or-fonce); }
.v-filet { display: block; width: 48px; height: 1px; background: var(--v-or); margin: 22px 0; }
.v-titre-section { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 24px; margin-bottom: 30px; }
.v-titre-section .v-surtitre { flex-basis: 100%; }
.v-titre-section h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(28px, 3vw, 38px); color: #2e331f; letter-spacing: -0.01em; }
.v-lien-fleche { margin-left: auto; font: 600 12px var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--v-or-fonce); text-decoration: none; }
.v-lien-fleche:hover { color: #2e331f; }

/* ---------- Grand bandeau d'accueil ---------- */
.v-hero { background: var(--v-olive); color: var(--v-creme); padding: 96px 0 104px; position: relative; overflow: hidden; }
.v-hero::after { content: ""; position: absolute; right: -120px; top: -120px; width: 520px; height: 520px; border-radius: 50%;
  border: 1px solid rgba(199, 162, 74, .25); pointer-events: none; }
.v-hero .v-surtitre, .v-bande-olive .v-surtitre, .v-entete-page .v-surtitre { color: var(--v-or); }
.v-hero h1 { font-family: var(--serif); font-weight: 350; font-size: clamp(42px, 6vw, 76px); line-height: 1.04; letter-spacing: -0.02em;
  color: var(--v-creme); max-width: 15ch; margin-top: 20px; }
.v-hero-texte { font-size: 18px; line-height: 1.6; color: #dcdfd0; max-width: 56ch; }
.v-hero-boutons { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.v-btn-or { background: var(--v-or); color: var(--v-olive-2); border-radius: 6px; }
.v-btn-or:hover { background: #d9b865; color: var(--v-olive-2); }
.v-btn-contour { background: transparent; color: var(--v-creme); border: 1px solid rgba(244, 241, 230, .45); border-radius: 6px; }
.v-btn-contour:hover { border-color: var(--v-creme); color: #ffffff; }

/* ---------- Engagements ---------- */
.v-engagements { background: var(--v-creme); border-bottom: 1px solid #dcd8c8; }
.v-engagements-grille { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
.v-engagements-grille > div { display: flex; flex-direction: column; gap: 6px; padding: 30px 24px 32px; border-left: 1px solid #dcd8c8; }
.v-engagements-grille > div:first-child { border-left: 0; padding-left: 0; }
.v-engagements strong { font-family: var(--serif); font-weight: 600; font-size: 18px; color: #2e331f; }
.v-engagements span:not(.num) { font-size: 14px; color: #4d5241; line-height: 1.5; }

/* ---------- Sections ---------- */
.v-section { padding: 88px 0; }
.v-section-serree { margin-top: 48px; }
.v-fond-beige { background: #f7f4ea; border-top: 1px solid #e9e6da; border-bottom: 1px solid #e9e6da; }
.v-bande-olive { background: var(--v-olive); color: #dcdfd0; }
.v-bande-olive h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(30px, 3.4vw, 42px); color: var(--v-creme); margin-top: 16px; line-height: 1.12; }
.v-bande-olive p { font-size: 16px; max-width: 52ch; }
.v-deux-colonnes { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 72px; align-items: center; }
.v-etapes { list-style: none; margin: 0; padding: 0; }
.v-etapes li { display: grid; grid-template-columns: 44px minmax(0, 1fr); padding: 20px 0; border-top: 1px solid rgba(244, 241, 230, .18); }
.v-etapes li:last-child { border-bottom: 1px solid rgba(244, 241, 230, .18); }
.v-etapes .num { color: var(--v-or); padding-top: 4px; }
.v-etapes strong { display: block; font-family: var(--serif); font-weight: 600; font-size: 19px; color: var(--v-creme); }
.v-etapes span:not(.num) { font-size: 14.5px; color: var(--v-sauge); }

/* ---------- Domaines ---------- */
.v-domaines { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0; border-top: 1px solid #dcd8c8; }
.v-domaine { display: flex; flex-direction: column; gap: 14px; padding: 28px 24px 30px 0; text-decoration: none; border-bottom: 1px solid #dcd8c8; }
.v-domaine + .v-domaine { padding-left: 24px; border-left: 1px solid #dcd8c8; }
.v-domaine h3 { font-family: var(--serif); font-weight: 500; font-size: 24px; color: #2e331f; line-height: 1.2; }
.v-domaine > span:last-child { font-size: 13.5px; color: var(--v-or-fonce); font-weight: 600; }
.v-domaine:hover h3 { color: var(--v-or-fonce); }

/* ---------- Cartes formation ---------- */
.v-cartes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.v-carte { display: flex; flex-direction: column; gap: 12px; padding: 28px 26px 24px; background: #ffffff; border: 1px solid #dcd8c8;
  border-radius: 6px; text-decoration: none; color: #4d5241; transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease; }
.v-carte:hover { border-color: var(--v-olive); transform: translateY(-2px); box-shadow: 0 12px 28px rgba(46, 51, 31, .08); color: #4d5241; }
.v-carte-domaine { font: 600 10.5px var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--v-or-fonce); }
.v-carte h3 { font-family: var(--serif); font-weight: 600; font-size: 21px; line-height: 1.25; color: #2e331f; }
.v-carte p { font-size: 14.5px; line-height: 1.55; flex: 1; }
.v-carte-pied { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; padding-top: 16px; border-top: 1px solid #e9e6da; font-size: 13px; color: #5f6352; }
.v-fleche { margin-left: auto; color: var(--v-or-fonce); font-size: 18px; }

/* ---------- Sessions ---------- */
.v-sessions { list-style: none; margin: 0; padding: 0; border-top: 1px solid #dcd8c8; }
.v-sessions-cadre { border: 1px solid #dcd8c8; border-top: 0; }
.v-session { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 20px; align-items: center; padding: 20px 16px; border-bottom: 1px solid #e9e6da; }
.v-session:nth-child(even) { background: #f7f4ea; }
.v-sessions-cadre .v-session:last-child { border-bottom: 0; }
.v-date { display: flex; flex-direction: column; line-height: 1; }
.v-date strong { font-family: var(--serif); font-weight: 400; font-size: 34px; color: var(--v-or-fonce); }
.v-date small { font: 600 10.5px var(--sans); letter-spacing: .18em; text-transform: uppercase; color: #5f6352; margin-top: 7px; }
.v-session-titre { display: block; font-family: var(--serif); font-weight: 600; font-size: 18px; color: #2e331f; text-decoration: none; margin-bottom: 4px; }
.v-session-titre:hover { color: var(--v-or-fonce); }
.v-session-meta { font-size: 14px; color: #4d5241; }
.v-session-fin { display: flex; align-items: center; gap: 14px; }
.v-places, .v-complet { font: 600 10.5px var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--v-or-fonce); white-space: nowrap; }
.v-complet { color: #5f6352; }
.v-vide { padding: 22px 0; color: #4d5241; }

/* ---------- Appel à l'action ---------- */
.v-appel { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 40px; align-items: center; padding: 48px 52px;
  border: 1px solid #c7a24a; border-radius: 8px; background: #fbf7ea; }
.v-appel h2 { font-family: var(--serif); font-weight: 500; font-size: clamp(26px, 2.8vw, 34px); color: #2e331f; margin: 12px 0 10px; }
.v-appel p { max-width: 60ch; color: #4d5241; }

/* ---------- En-tête des pages intérieures ---------- */
.v-entete-page { background: var(--v-olive); color: #dcdfd0; padding: 64px 0 60px; }
.v-entete-page h1 { font-family: var(--serif); font-weight: 380; font-size: clamp(36px, 4.6vw, 56px); line-height: 1.08; color: var(--v-creme); max-width: 22ch; margin-top: 14px; }
.v-entete-page p { font-size: 17px; max-width: 62ch; }
.v-retour { font: 600 11px var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--v-or); text-decoration: none; }
.v-retour:hover { color: var(--v-creme); }

/* ---------- Catalogue ---------- */
.v-filtres { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 36px; }
.v-filtres a { padding: 9px 16px; border: 1px solid #dcd8c8; border-radius: 999px; font-size: 13.5px; color: #3d4432; text-decoration: none; }
.v-filtres a:hover { border-color: #3d4432; }
.v-filtres a.actif { background: #3d4432; border-color: #3d4432; color: #ffffff; }
.v-cartes-catalogue { margin-top: 20px; }
.vitrine .section-head { margin-bottom: 0; }
.vitrine main > .v-conteneur:last-child, .vitrine .v-fiche { padding-bottom: 88px; }

/* ---------- Fiche formation ---------- */
.v-fiche { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 48px; align-items: start; }
.v-fiche-infos { position: sticky; top: 100px; margin-top: 48px; }
.v-encadre { border: 1px solid #dcd8c8; border-radius: 6px; overflow: hidden; background: #ffffff; padding-bottom: 20px; }
.v-encadre h2 { background: #3d4432; color: #f4f1e6; padding: 11px 20px; font: 600 11px var(--sans); letter-spacing: .2em; text-transform: uppercase; }
.v-encadre dl { margin: 0; padding: 8px 20px 12px; }
.v-encadre dl > div { padding: 11px 0; border-bottom: 1px solid #e9e6da; }
.v-encadre dt { font-size: 12px; color: #5f6352; }
.v-encadre dd { margin: 3px 0 0; font-size: 14.5px; color: #2e331f; line-height: 1.5; }
.v-encadre .btn { margin: 8px 20px 0; width: calc(100% - 40px); }
.v-liste-num { list-style: none; margin: 0; padding: 0; border: 1px solid #dcd8c8; border-top: 0; }
.v-liste-num li { display: grid; grid-template-columns: 44px minmax(0, 1fr); padding: 15px 16px; border-bottom: 1px solid #e9e6da; color: #2e331f; font-size: 15px; }
.v-liste-num li:nth-child(even) { background: #f7f4ea; }
.v-liste-num li:last-child { border-bottom: 0; }
.v-liste-num .num { padding-top: 3px; }
.v-programme { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border: 1px solid #dcd8c8; border-top: 0; }
.v-jour { padding: 22px 22px 18px; border-bottom: 1px solid #e9e6da; }
.v-jour:nth-child(odd) { border-right: 1px solid #e9e6da; }
.v-jour h3 { font-family: var(--serif); font-weight: 600; font-size: 17px; color: #2e331f; margin-bottom: 10px; }
.v-jour ul, .v-puces { margin: 0; padding-left: 18px; color: #4d5241; font-size: 14.5px; }
.v-jour li, .v-puces li { margin: 5px 0; }
.v-jour li::marker, .v-puces li::marker { color: var(--v-or-fonce); }
.v-deux { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.v-puces { padding: 16px 16px 16px 34px; border: 1px solid #dcd8c8; border-top: 0; }

/* ---------- Textes longs (qui sommes-nous, CGV, légal) ---------- */
.v-texte { max-width: 820px; padding-top: 56px; padding-bottom: 88px; color: #3a3f30; font-size: 16px; line-height: 1.7; }
.v-texte h2 { font-family: var(--serif); font-weight: 500; font-size: 24px; color: #2e331f; margin: 40px 0 12px; padding-top: 22px; border-top: 1px solid #e9e6da; }
.v-texte h2:first-child { margin-top: 0; border-top: 0; padding-top: 0; }
.v-texte h3 { font-family: var(--serif); font-weight: 600; font-size: 21px; color: #2e331f; margin: 36px 0 10px; }
.v-texte h3:first-child { margin-top: 0; }
.v-texte p { margin: 0 0 14px; }
.v-texte ul { margin: 0 0 16px; padding-left: 20px; }
.v-texte li { margin: 6px 0; }
.v-texte li::marker { color: var(--v-or-fonce); }
.v-texte a { color: #3d4432; }

/* ---------- Équipe ---------- */
.v-equipe { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.v-personne { background: #ffffff; border: 1px solid #dcd8c8; border-radius: 6px; padding: 28px 26px; }
.v-initiale { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: #3d4432; color: #f4f1e6;
  font-family: var(--serif); font-size: 22px; margin-bottom: 18px; }
.v-personne h3 { font-family: var(--serif); font-weight: 600; font-size: 21px; color: #2e331f; }
.v-role { display: block; margin: 4px 0 12px; font: 600 10.5px var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--v-or-fonce); }
.v-personne p { font-size: 14.5px; color: #4d5241; line-height: 1.6; }

/* ---------- Contact ---------- */
.v-formulaire { display: flex; flex-direction: column; gap: 22px; margin-top: 48px; }
.v-formulaire select, .v-formulaire input[type=text], .v-formulaire input[type=email], .v-formulaire textarea {
  width: 100%; font: 400 15px var(--sans); color: #2e331f; background: #ffffff; border: 1px solid #b9b5a4; border-radius: 4px; padding: 12px 14px; }
.v-formulaire input[type=text], .v-formulaire input[type=email], .v-formulaire select { height: 48px; }
.v-formulaire textarea { resize: vertical; min-height: 150px; line-height: 1.5; }
.v-formulaire select:focus, .v-formulaire input:focus, .v-formulaire textarea:focus { outline: none; border-color: #7a5c14; }
.v-formulaire .btn { align-self: flex-start; }

/* ---------- Pied de page ---------- */
.v-pied { background: var(--v-olive-2); color: var(--v-sauge); padding: 64px 0 0; }
.v-pied-grille { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 48px; padding-bottom: 48px; }
.v-pied p { font-size: 14px; margin-top: 16px; line-height: 1.6; }
.v-pied a { color: #dcdfd0; text-decoration: none; }
.v-pied a:hover { color: #ffffff; text-decoration: underline; }
.v-pied h2 { font: 600 11px var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--v-or); margin-bottom: 14px; }
.v-pied ul { list-style: none; margin: 0; padding: 0; font-size: 14px; }
.v-pied li { margin: 8px 0; }
.v-pied-legal { padding-top: 20px; padding-bottom: 28px; border-top: 1px solid rgba(244, 241, 230, .14); font-size: 12px; color: #9ea38c; }

/* ---------- Tablette et téléphone ---------- */
@media (max-width: 1000px) {
  .v-cartes, .v-equipe { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v-engagements-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v-engagements-grille > div:nth-child(3) { border-left: 0; padding-left: 0; }
  .v-fiche { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .v-fiche-infos { position: static; }
  .v-deux-colonnes { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .v-pied-grille { grid-template-columns: 1fr 1fr; }
  .v-pied-grille > div:first-child { grid-column: 1 / -1; }
}
@media (max-width: 860px) {
  .v-burger { display: flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px;
    background: none; border: 0; cursor: pointer; padding: 0; }
  .v-burger span { display: block; height: 2px; width: 24px; margin: 0 auto; background: var(--v-creme); transition: transform .2s ease, opacity .2s ease; }
  .menu-ouvert .v-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-ouvert .v-burger span:nth-child(2) { opacity: 0; }
  .menu-ouvert .v-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .v-nav { display: none; }
  .menu-ouvert .v-nav { display: flex; flex-direction: column; align-items: stretch; position: absolute; left: 0; right: 0; top: 77px;
    background: var(--v-olive); padding: 8px 20px 24px; border-bottom: 1px solid var(--v-or); }
  .menu-ouvert .v-nav a { padding: 16px 4px; border-bottom: 1px solid rgba(244, 241, 230, .12); font-size: 12px; }
  .menu-ouvert .v-nav a.actif { box-shadow: none; color: var(--v-or); }
  .menu-ouvert .v-nav a.v-bouton-espace { margin: 16px 0 0; text-align: center; border-bottom: 1px solid var(--v-or); }
}
@media (max-width: 640px) {
  .v-conteneur, .v-entete-in { padding: 0 18px; }
  .v-entete-in { height: 68px; }
  .menu-ouvert .v-nav { top: 69px; }
  .v-hero { padding: 64px 0 72px; }
  .v-hero-texte { font-size: 16.5px; }
  .v-section { padding: 60px 0; }
  .v-cartes, .v-equipe, .v-engagements-grille, .v-programme, .v-deux, .v-pied-grille { grid-template-columns: minmax(0, 1fr); }
  .v-engagements-grille > div { border-left: 0; padding: 20px 0; border-top: 1px solid #dcd8c8; }
  .v-engagements-grille > div:first-child { border-top: 0; }
  .v-domaine + .v-domaine { padding-left: 0; border-left: 0; }
  .v-jour:nth-child(odd) { border-right: 0; }
  .v-session { grid-template-columns: 56px minmax(0, 1fr); gap: 6px 14px; padding: 18px 14px; }
  .v-session-fin { grid-column: 2; justify-content: flex-start; margin-top: 6px; }
  .v-date strong { font-size: 28px; }
  .v-appel { grid-template-columns: minmax(0, 1fr); padding: 30px 24px; gap: 20px; }
  .v-appel .btn { justify-self: start; }
  .v-entete-page { padding: 44px 0 40px; }
  .v-lien-fleche { margin-left: 0; }
  .vitrine main > .v-conteneur:last-child, .vitrine .v-fiche { padding-bottom: 60px; }
}