/* Page publique et pages légales. Chargée après academie.css, seulement par templates/accueil.html et templates/legal/*.html.
   Depuis le 23 octobre 2026 : calquée sur les sections claires de fabm.ca (eyebrow mono avec trait vert, titres deux tons, cartes à
   filet, boutons en deux blocs), sur fond Lin. Aucun dégradé, aucune ombre, aucun vert pâle. Aucun tiret cadratin. */

/* ------------------------------------------------------------------ accueil */
.pub{display:flex;flex-direction:column}
.pub section{min-width:0}
.pub h1{font-size:clamp(2.6rem,5.6vw,4.75rem);line-height:1;letter-spacing:-.04em;font-weight:600;max-width:13ch;color:var(--fg)}
.pub h2{font-size:clamp(1.9rem,3.6vw,3rem);line-height:1.04;letter-spacing:-.035em;font-weight:600;max-width:18ch;color:var(--fg)}
.pub .acc{color:var(--accent)}
.pub .lead{font-size:clamp(1.05rem,1.5vw,1.25rem);line-height:1.55;color:var(--muted);max-width:44ch}
.pub p{line-height:1.6}
.pub .muted{color:var(--muted)}
.pub .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.pub .marque-pilier{display:inline-flex;align-items:center;gap:12px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:400;color:var(--fg)}
.pub .marque-pilier::before{content:"";width:28px;height:1.5px;background:var(--accent);flex:none}
.pub .marque-pilier img{height:20px;width:auto}

/* étiquette de section : DM Mono majuscules, trait vert FABM (comme .eyebrow de fabm.ca) */
.etape{display:inline-flex;align-items:center;gap:12px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:400;color:var(--fg)}
.etape::before{content:"";width:28px;height:1.5px;background:var(--accent);flex:none}

/* héros : à plat sur Lin, schéma du parcours dans un panneau Lin clair */
.pub-hero{position:relative;padding-block:clamp(40px,7vw,96px) clamp(56px,8vw,112px);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(32px,5vw,80px);align-items:center}
.pub-hero .texte{display:flex;flex-direction:column;gap:24px}
.pub-hero .filigrane{display:none}

/* schéma du parcours : quatre étapes, aucun chiffre */
.schema{list-style:none;margin:0;padding:8px 24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-grand);display:flex;flex-direction:column;position:relative;z-index:1}
.schema li{display:grid;grid-template-columns:40px 1fr;gap:16px;align-items:center;padding:18px 0;position:relative}
.schema li+li{border-top:1px solid var(--line)}
.schema .pastille{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);color:var(--accent-dark)}
.schema .pastille svg{width:20px;height:20px}
.schema li:last-child .pastille{background:var(--accent-dark);color:#fff}
.schema b{display:block;font-size:1rem;font-weight:600;letter-spacing:-.01em}
.schema small{display:block;color:var(--muted);font-size:.86rem;line-height:1.4}

/* bloc : une idée par section, séparée par un filet (sections claires de fabm.ca) */
.bloc{border-top:1px solid var(--line);padding-block:clamp(56px,8vw,112px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:start}
.bloc .tete{display:flex;flex-direction:column;gap:20px}
.bloc .corps{display:flex;flex-direction:column;gap:16px;padding-top:36px}
.bloc .corps p{font-size:1.08rem;max-width:56ch}
.bloc.doux{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);background:var(--surface-2);border-top:0;border-radius:var(--r-grand);padding-inline:clamp(22px,4vw,56px);margin-block:8px}
.bloc.doux+.fin{border-top:0}
.bloc-large{grid-template-columns:1fr}

/* tuiles : cartes à filet, rayon 4, icône au trait vert, titre en bas (comme .tl de fabm.ca) */
.tuiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:16px}
.tuile{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:24px 24px 28px;min-height:212px;display:flex;flex-direction:column;gap:8px}
.tuile .pastille{width:30px;height:30px;display:block;color:var(--accent)}
.tuile .pastille svg{width:30px;height:30px;stroke-width:1.6}
.tuile b{display:block;margin-top:auto;padding-top:32px;font-size:1.25rem;font-weight:600;letter-spacing:-.02em}
.tuile span:not(.pastille){color:var(--muted);font-size:.94rem;line-height:1.55}

.engagements{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.engagement{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:8px}
.engagement b{font-size:1.1rem;font-weight:600;letter-spacing:-.015em}
.engagement span{color:var(--muted);font-size:.95rem;line-height:1.55}

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

/* appel final : grande phrase sur Lin, comme la section .cta de fabm.ca */
.fin{border-top:1px solid var(--line);padding-block:clamp(64px,9vw,128px) clamp(24px,4vw,48px);display:flex;flex-direction:column;align-items:flex-start;gap:28px}
.fin h2{font-size:clamp(2.6rem,6vw,5.5rem);line-height:1;letter-spacing:-.045em;max-width:13ch}
.fin p{color:var(--muted);max-width:46ch;font-size:1.05rem}
.fin .ctas{margin-top:12px}
.fin a.courriel{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg);font-weight:400;text-underline-offset:4px}

/* présentation (20 octobre 2026) : lecteur paysage, vertical sous 700 px (static/js/presentation.js) */
.presentation .tete{align-items:flex-start;text-align:left}
.presentation .tete h2{max-width:none}
.presentation .tete p{max-width:52ch;font-size:1.05rem}
.presentation-cadre{display:flex;justify-content:center;margin-top:24px}
.presentation video{display:block;width:100%;max-width:1040px;aspect-ratio:16/9;height:auto;border-radius:12px;background:#fff;border:1px solid var(--line)}
.presentation video.vertical{width:auto;max-width:100%;max-height:80vh;aspect-ratio:9/16;margin:0 auto}

@media (max-width:900px){
  .pub-hero,.bloc,.bloc.doux{grid-template-columns:1fr}
  .bloc .corps{padding-top:0}
  .tuiles{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .pub-hero{padding-block:28px 56px}
  .bloc{padding-block:56px}
  .bloc.doux{padding:40px 18px}
  .tuiles,.engagements{grid-template-columns:1fr}
  .tuile{min-height:0}
  .tuile b{padding-top:20px}
  .pub .ctas{width:100%}
  .pub .ctas .btn.duo{flex:1 1 100%}
  .pub .ctas .btn.duo>span:first-child{flex:1;justify-content:center}
  .fin{padding-block:64px 16px}
}

/* ------------------------------------------------------------------ pages légales */
.legal{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:16px}
.legal-version{align-self:flex-start;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border:1px solid var(--line);background:var(--surface);border-radius:var(--r);padding:5px 10px}
.legal-brouillon{background:var(--or-soft);border-left:3px solid var(--warn);color:var(--fg);border-radius:var(--r);padding:12px 16px;font-size:.88rem;line-height:1.5}
.legal-doc{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-grand);padding:clamp(22px,5vw,56px)}
.legal-doc h1{font-size:clamp(1.9rem,4vw,2.75rem);line-height:1.05;letter-spacing:-.035em;font-weight:600;margin-bottom:14px}
.legal-doc .chapeau{color:var(--muted);font-size:1.05rem;line-height:1.6;margin-bottom:8px}
.legal-doc h2{font-size:1.25rem;font-weight:600;letter-spacing:-.02em;margin-top:32px;padding-top:24px;border-top:1px solid var(--line)}
.legal-doc h3{font-size:1rem;font-weight:600;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::marker{color:var(--accent)}
.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:16px;padding:16px 20px;background:var(--surface-2);border-radius:var(--r)}
.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 var(--r) var(--r) 0}
.legal-liens{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:center;padding-top:4px}
.legal-liens a{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-dark);text-underline-offset:4px}
@media (max-width:560px){
  .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:13px;color:var(--fg);font-weight:600}
.formulaire label.champ input{font:inherit;font-size:1rem;font-weight:400;color:var(--fg);border:0;border-bottom:1px solid var(--gris-moyen);background:transparent;padding:6px 2px;border-radius:0;min-width:0;width:100%;box-shadow:none}
.formulaire label.champ input:focus{outline:none;border-bottom-color:var(--accent);box-shadow:0 1px 0 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 var(--aide)}
.formulaire .case-signature b{font-size:.92rem;font-weight:600}
.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{border:0;padding:0;border-radius:0;background:#fff}
  .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}
}