/* ASPIRIONS, page d'attente. Identité 3.4, plateforme 3.4.
   Fond Encre, texte Papier, Ambre réservé au seuil.
   Le milieu de la barre du A du sigle tombe sur l'axe du seuil (28,896 % de la hauteur du sigle depuis son bas).
   Aucune ressource externe, aucun script, polices auto-hébergées. */

@font-face{font-family:"Source Serif 4"; font-style:normal; font-weight:600; font-display:swap; src:url("fonts/source-serif-4-600-display.woff2") format("woff2")}
@font-face{font-family:"Source Serif 4"; font-style:italic; font-weight:400; font-display:swap; src:url("fonts/source-serif-4-400-italic.woff2") format("woff2")}
@font-face{font-family:"Source Sans 3"; font-style:normal; font-weight:400; font-display:swap; src:url("fonts/source-sans-3-400.woff2") format("woff2")}
@font-face{font-family:"Source Sans 3"; font-style:normal; font-weight:600; font-display:swap; src:url("fonts/source-sans-3-600.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono"; font-style:normal; font-weight:400; font-display:swap; src:url("fonts/ibm-plex-mono-400.woff2") format("woff2")}

:root{
  --encre:#14233C; --encre-claire:#2A3D5C; --papier:#F7F4EE;
  --brume:#C8CEDC; --ambre-clair:#D9964F;
  --on-encre:#F7F4EE; --on-encre-2:#C8CEDC; --on-encre-rule:#2A3D5C; --focus:#E0A867;
  --serif:"Source Serif 4", Cambria, Georgia, serif;
  --sans:"Source Sans 3", Calibri, "Segoe UI", system-ui, sans-serif;
  --mono:"IBM Plex Mono", Consolas, "Courier New", monospace;
  --wrap:1264px;
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{background:var(--encre)}
body{margin:0; background:var(--encre); color:var(--on-encre); font:400 17px/1.6 var(--sans);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility}
h1,p,ul,dl,dd{margin:0}
ul{padding:0}
img{display:block; max-width:100%}
a{color:var(--on-encre); text-underline-offset:3px; text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--focus); outline-offset:3px}
@media (prefers-reduced-motion: reduce){ *{transition:none!important} }

.wrap{width:100%; max-width:var(--wrap); margin-inline:auto;
  padding-left:max(20px, env(safe-area-inset-left,0px)); padding-right:max(20px, env(safe-area-inset-right,0px))}
@media (min-width:720px){ .wrap{padding-left:max(32px, env(safe-area-inset-left,0px)); padding-right:max(32px, env(safe-area-inset-right,0px))} }

/* Premier écran */
.hero{position:relative; overflow:hidden; min-height:100vh; min-height:100svh; display:flex; flex-direction:column;
  --wm-h:clamp(230px, 31vw, 430px); --foot-min:50px;
  --foot-h:max(calc(var(--wm-h) * 0.28896 + 2px), var(--foot-min))}
.top{position:relative; z-index:1; padding-top:max(28px, env(safe-area-inset-top,0px))}
.top img{height:clamp(30px, 3.4vw, 40px); width:auto}
.hero-inner{position:relative; z-index:1; flex:1; display:flex; align-items:center;
  padding-top:clamp(48px, 7vw, 96px); padding-bottom:clamp(40px, 5vw, 64px)}
.hero-text{max-width:720px; display:grid; gap:24px}

.surtitre{font:600 .78rem/1.3 var(--sans); letter-spacing:.18em; text-transform:uppercase; color:var(--on-encre-2)}
h1{font:600 clamp(2.6rem, 6.4vw, 4.75rem)/1.04 var(--serif); letter-spacing:-.012em; text-wrap:balance}
.chapeau{font:italic 400 clamp(1.15rem, 1.8vw, 1.35rem)/1.5 var(--serif); color:var(--on-encre-2); max-width:52ch}

.annonce{display:grid; gap:6px; max-width:58ch; padding-top:18px; border-top:1px solid var(--on-encre-rule)}
.annonce .quand{font:400 .85rem/1.3 var(--mono); letter-spacing:.04em; color:var(--on-encre-2)}

.actions{display:flex; flex-wrap:wrap; gap:12px; margin-top:4px}
.btn{display:inline-flex; align-items:center; gap:10px; padding:13px 22px; font:600 1rem/1.2 var(--sans);
  text-decoration:none; border:1px solid var(--on-encre-2); color:var(--on-encre); background:transparent}
.btn:hover{text-decoration:none; border-color:var(--on-encre)}
.btn-papier{background:var(--papier); border-color:var(--papier); color:var(--encre)}
.btn-papier:hover{filter:brightness(1.06); border-color:var(--papier)}
.btn .adr{font:400 .92rem/1 var(--mono)}

.watermark{position:absolute; z-index:0; bottom:calc(var(--foot-h) - 2px - var(--wm-h) * 0.28896);
  height:var(--wm-h); width:calc(var(--wm-h) * 1.5917);
  right:max(12px, calc((100% - var(--wrap)) / 2 + 24px))}
.wm-stroke{fill:none; stroke:var(--encre-claire)}
.wm-fill{fill:var(--encre-claire)}

/* Le seuil, filet Ambre de 4 px */
.hero-foot{position:relative; z-index:1; height:var(--foot-h); border-top:4px solid var(--ambre-clair); display:flex; align-items:center}
.refs{list-style:none; display:flex; flex-wrap:wrap; gap:6px 22px; font:400 .8rem/1.4 var(--mono); color:var(--on-encre-2); padding-block:14px}
@media (max-width:720px){ .hero{--foot-min:68px} .refs{padding-block:10px} }

/* Pied de page */
.site-footer{padding-block:48px 40px}
.foot-sign{font:italic 400 1.1rem/1.4 var(--serif)}
.foot-place{margin-top:6px; color:var(--on-encre-2); font-size:.95rem}
.legal{margin-top:32px; padding-top:20px; border-top:1px solid var(--on-encre-rule); color:var(--on-encre-2); font-size:.88rem}
.legal summary{cursor:pointer; font-weight:600; color:var(--on-encre)}
.legal dl{display:grid; grid-template-columns:220px minmax(0,1fr); gap:8px 20px; margin-top:16px; max-width:900px}
.legal dt{color:var(--on-encre); font-weight:600}
.legal p{margin-top:14px; max-width:80ch}
@media (max-width:860px){ .legal dl{grid-template-columns:1fr; gap:2px 0} .legal dd{margin-bottom:10px} }
.copyline{margin-top:28px; font:400 .8rem/1.4 var(--mono); color:var(--on-encre-2)}

/* Bloc « Loi Résilience » de la page d'accueil, bande Papier entre le premier écran et le pied de page.
   Styles propres au bloc, sans dépendre de loi-resilience.css (qui redéfinit body, .wrap et .btn). */
.faq-accueil{background:var(--papier); color:var(--encre); padding-block:clamp(48px, 6vw, 80px)}
.faq-accueil .faq-inner{max-width:860px}
.faq-accueil .surtitre{color:#566279}
.faq-accueil h2{margin:10px 0 24px; font:600 clamp(1.6rem, 2.8vw, 2.1rem)/1.2 var(--serif); text-wrap:balance}
.faq-accueil a{color:var(--encre)}
.faq-accueil :focus-visible{outline-color:var(--encre)}
.faq-accueil details{border-bottom:1px solid #D6DAE3}
.faq-accueil details:first-of-type{border-top:1px solid #D6DAE3}
.faq-accueil summary{cursor:pointer; list-style:none; position:relative; padding:16px 40px 16px 0}
.faq-accueil summary::-webkit-details-marker{display:none}
.faq-accueil summary h3{display:inline; margin:0; font:600 1.06rem/1.45 var(--sans)}
.faq-accueil summary::after{content:"+"; position:absolute; right:4px; top:14px; font:400 1.4rem/1 var(--mono); color:var(--encre)}
.faq-accueil details[open] summary::after{content:"\2212"}
.faq-accueil .rep{padding:0 0 18px; max-width:68ch}
.faq-accueil .rep p{margin:0 0 8px}
.faq-accueil .ref{font:400 .8rem/1.4 var(--mono); color:#566279}
.faq-accueil .faq-suite{margin-top:28px}
.btn-encre{background:var(--encre); border-color:var(--encre); color:var(--papier)}
.faq-accueil .btn-encre{color:var(--papier); text-decoration:none}
.btn-encre:hover{filter:brightness(1.18); border-color:var(--encre)}
