/* Page publique et pages légales (phase 2, huitième tranche). Chargée après academie.css, seulement par templates/accueil.html et
   templates/legal/*.html. Silent Luxury : beaucoup de blanc, une idée par bloc, vert ACADÉMIE en accent. Aucun tiret cadratin. */

/* ------------------------------------------------------------------ accueil */
.pub{display:flex;flex-direction:column;gap:20px}
.pub section{min-width:0}
.pub h1{font-size:clamp(2rem,4.6vw,3.25rem);line-height:1.08;letter-spacing:-.025em;font-weight:700;max-width:16ch}
.pub h2{font-size:clamp(1.45rem,2.8vw,2.05rem);line-height:1.15;letter-spacing:-.018em;max-width:22ch}
.pub .lead{font-size:clamp(1.02rem,1.6vw,1.18rem);line-height:1.6;color:var(--muted);max-width:52ch}
.pub p{line-height:1.65}
.pub .ctas{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.pub .btn.grand{padding:13px 22px;font-size:1rem}
.pub .marque-pilier{display:inline-flex;align-items:center;gap:10px;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--accent-dark)}
.pub .marque-pilier img{height:22px;width:auto}

.pub-hero{position:relative;overflow:hidden;border-radius:28px;padding:clamp(28px,5vw,64px);background:
  radial-gradient(120% 90% at 100% 0%,var(--accent-soft) 0%,rgba(234,244,214,0) 60%),
  radial-gradient(80% 70% at 0% 100%,#F3F8EA 0%,rgba(243,248,234,0) 70%),var(--surface);
  box-shadow:var(--shadow-sm);display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,4vw,56px);align-items:center}
.pub-hero .texte{display:flex;flex-direction:column;gap:18px}
.pub-hero .filigrane{position:absolute;right:-90px;bottom:-110px;width:340px;opacity:.06;pointer-events:none}

/* schéma du parcours : quatre étapes, aucun chiffre */
.schema{list-style:none;margin:0;padding:18px;background:var(--surface);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:4px;position:relative;z-index:1}
.schema li{display:grid;grid-template-columns:40px 1fr;gap:14px;align-items:center;padding:12px 10px;border-radius:14px;position:relative}
.schema li+li::before{content:"";position:absolute;left:29px;top:-10px;height:16px;border-left:2px dotted var(--line)}
.schema .pastille{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent-dark)}
.schema .pastille svg{width:20px;height:20px}
.schema li:last-child .pastille{background:var(--bleu-soft);color:var(--bleu)}
.schema b{display:block;font-size:.98rem}
.schema small{display:block;color:var(--muted);font-size:.84rem;line-height:1.35}

/* bloc : une idée */
.bloc{background:var(--surface);border-radius:24px;padding:clamp(26px,4.5vw,56px);box-shadow:var(--shadow-sm);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(20px,4vw,56px);align-items:start}
.bloc .tete{display:flex;flex-direction:column;gap:12px}
.bloc .corps{display:flex;flex-direction:column;gap:14px;padding-top:4px}
.bloc .corps p{font-size:1.04rem;max-width:58ch}
.bloc.doux{background:var(--surface-2);box-shadow:none}
.etape{font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--accent-dark)}  /* #5E7E20 : 4,7:1 sur blanc (AA) */
.bloc.doux .etape{color:#4F6A1B}  /* fond vert pâle : #5E7E20 n'y donne que 4,2:1 ; 4F6A1B = 5,5:1 */

.tuiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:6px}
.tuile{border:1px solid var(--line);border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:8px;background:var(--surface)}
.tuile .pastille{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent-dark)}
.tuile .pastille svg{width:18px;height:18px}
.tuile b{font-size:1rem}
.tuile span{color:var(--muted);font-size:.9rem;line-height:1.45}
.bloc-large{grid-template-columns:1fr}

.engagements{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.engagement{background:var(--surface);border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:6px}
.engagement b{font-size:1rem}
.engagement span{color:var(--muted);font-size:.94rem;line-height:1.55}

/* aperçu du bandeau client : nom FABM, logo du client */
.apercu-marque{border:1px solid var(--line);border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:14px;background:var(--page)}
.apercu-marque .ligne-fabm img{height:34px;width:auto;display:block}
.apercu-marque .ligne-client{display:flex;align-items:center;gap:12px;background:var(--surface);border-radius:14px;padding:10px 14px;box-shadow:var(--shadow-sm)}
.apercu-marque .logo-vide{width:44px;height:44px;border-radius:10px;border:1.5px dashed var(--argent);display:grid;place-items:center;font-size:.62rem;font-weight:700;letter-spacing:.04em;color:var(--argent);text-transform:uppercase;flex:none;text-align:center;line-height:1.1}
.apercu-marque .ligne-client b{display:block;font-size:.95rem}
.apercu-marque .ligne-client small{color:var(--muted);font-size:.8rem}

.fin{text-align:center;border-radius:28px;padding:clamp(32px,6vw,72px) clamp(20px,4vw,48px);background:linear-gradient(135deg,#3F5615,#557220);color:#fff;display:flex;flex-direction:column;align-items:center;gap:16px}
.fin h2{color:#fff;max-width:24ch}
.fin p{color:#fff;max-width:46ch}  /* blanc sur #557220 au plus clair du dégradé : 5,5:1 (AA) */
.fin .ctas{justify-content:center}
.fin .btn.primary{background:#fff;color:var(--accent-dark);box-shadow:0 6px 16px rgba(0,0,0,.14)}
.fin .btn.clair{background:transparent;border-color:rgba(255,255,255,.6);color:#fff}
.fin a.courriel{color:#fff;font-weight:600}

@media (max-width:900px){
  .pub-hero,.bloc{grid-template-columns:1fr}
  .tuiles{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .pub{gap:14px}
  .pub-hero{border-radius:22px;padding:24px 18px}
  .bloc{border-radius:20px;padding:24px 18px}
  .tuiles,.engagements{grid-template-columns:1fr}
  .pub .ctas .btn{flex:1 1 100%;justify-content:center}
  .fin{border-radius:22px}
}

/* ------------------------------------------------------------------ pages légales */
.legal{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:14px}
.legal-version{align-self:flex-start;font-size:.78rem;color:var(--muted);border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:4px 12px}
.legal-brouillon{background:var(--or-soft);border:1px solid #F1D98C;color:var(--or-fg);border-radius:14px;padding:12px 16px;font-size:.88rem;line-height:1.5}
.legal-doc{background:var(--surface);border-radius:22px;box-shadow:var(--shadow-sm);padding:clamp(22px,5vw,52px)}
.legal-doc h1{font-size:clamp(1.6rem,3.4vw,2.1rem);letter-spacing:-.02em;margin-bottom:10px}
.legal-doc .chapeau{color:var(--muted);font-size:1.02rem;line-height:1.6;margin-bottom:8px}
.legal-doc h2{font-size:1.12rem;margin-top:30px;padding-top:22px;border-top:1px solid var(--line)}
.legal-doc h3{font-size:.98rem;margin-top:18px}
.legal-doc p,.legal-doc li{line-height:1.65;font-size:.97rem}
.legal-doc p{margin-top:10px}
.legal-doc ul{margin:10px 0 0;padding-left:1.2em}
.legal-doc li+li{margin-top:6px}
.legal-doc dl{margin:10px 0 0;display:grid;grid-template-columns:minmax(0,13rem) minmax(0,1fr);gap:8px 18px}
.legal-doc dt{font-weight:600}
.legal-doc dd{margin:0;color:var(--fg)}
.legal-doc .sommaire{margin-top:14px;padding:14px 18px;background:var(--surface-2);border-radius:14px}
.legal-doc .sommaire ol{margin:6px 0 0;padding-left:1.3em;columns:2;column-gap:28px}
.legal-doc .sommaire li{font-size:.9rem;break-inside:avoid}
.legal-doc .coord{margin-top:12px;padding:14px 18px;border-left:3px solid var(--accent);background:var(--page);border-radius:0 12px 12px 0}
.legal-liens{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:.88rem;justify-content:center;padding-top:4px}
@media (max-width:560px){
  .legal-doc{border-radius:18px}
  .legal-doc dl{grid-template-columns:1fr;gap:2px}
  .legal-doc dd{margin-bottom:8px}
  .legal-doc .sommaire ol{columns:1}
}

/* gabarit de consentement : champs à remplir à l'écran ou à la main, imprimable */
.formulaire .champs{display:grid;grid-template-columns:1fr 1fr;gap:14px 22px;margin-top:12px}
.formulaire .champs .plein{grid-column:1/-1}
.formulaire label.champ{display:flex;flex-direction:column;gap:4px;font-size:.84rem;color:var(--muted);font-weight:600}
.formulaire label.champ input{font:inherit;font-size:1rem;color:var(--fg);border:0;border-bottom:1px solid #B9BFB0;background:transparent;padding:6px 2px;border-radius:0;min-width:0;width:100%}
.formulaire label.champ input:focus{outline:none;border-bottom-color:var(--accent)}
.formulaire .choix-liste{list-style:none;padding:0;margin:12px 0 0;display:flex;flex-direction:column;gap:10px}
.formulaire .choix-liste li{display:grid;grid-template-columns:26px 1fr;gap:10px;align-items:start}
.formulaire .choix-liste input[type=checkbox]{width:20px;height:20px;margin:2px 0 0;accent-color:var(--accent-dark)}
.formulaire .zone-signatures{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:16px}
.formulaire .case-signature{display:flex;flex-direction:column;gap:10px}
.formulaire .case-signature .trait{height:48px;border-bottom:1px solid #8F9488}
.formulaire .case-signature b{font-size:.92rem}
.formulaire .case-signature small{color:var(--muted);font-size:.8rem}
.formulaire .actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
@media (max-width:640px){
  .formulaire .champs,.formulaire .zone-signatures{grid-template-columns:1fr}
}
@media print{
  .legal{max-width:none;gap:6px}
  .legal-doc{box-shadow:none;padding:0;border-radius:0}
  .legal-doc h2{margin-top:16px;padding-top:10px;break-after:avoid}
  .legal-doc p,.legal-doc li{font-size:10.5pt;line-height:1.45}
  .legal-version{border:0;padding:0}
  .legal-brouillon,.formulaire .actions,.legal-liens{display:none!important}
  .formulaire label.champ input{border-bottom-color:#777}
  .formulaire .zone-signatures{grid-template-columns:repeat(3,1fr);break-inside:avoid}
  .formulaire .champs{grid-template-columns:1fr 1fr}
}