/* =====================================================================
   site.css — styles communs du site public (lié par contact.php, merci.php).
   Versionné via ?v=AAAAMMJJx dans le <link>. index.php et 404.php restent
   autonomes (héro photo / page 404 sans dépendance) mais alignés sur ces valeurs.
   NB : les url() (mask monogramme) sont en chemin ABSOLU car résolues
   relativement à CE fichier (/assets/), pas à la page.
   ===================================================================== */
:root{
  --paper:#fcfbf9; --cream:#f5ede1; --card:#f5ede1; --ink:#1d1b17; --soft:#3f3a33;
  --muted:#9b8f78; --muted-deep:#6f6555; --green:#657e73; --green-deep:#3f5249;
  --blush:#fadac5; --line:rgba(29,27,23,.28); --err:#9a3b2e; --m:18px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Jost',system-ui,sans-serif;font-weight:300;color:var(--ink);-webkit-font-smoothing:antialiased;font-optical-sizing:auto}
a{transition:color .25s ease,background-color .25s ease,border-color .25s ease,opacity .25s ease}
:focus-visible{outline:2px solid var(--green);outline-offset:3px}
:focus:not(:focus-visible){outline:none}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}

/* lien d'évitement (accessibilité clavier) */
.skip{position:absolute;left:-9999px;top:0;z-index:20;background:var(--ink);color:var(--paper);padding:10px 16px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;text-decoration:none}
.skip:focus{left:8px;top:8px}

/* en-tête */
.top{display:flex;align-items:center;justify-content:space-between;padding:26px 56px}
.brand{font-size:12px;letter-spacing:.30em;text-transform:uppercase;font-weight:600;white-space:nowrap}
a.brand{text-decoration:none;color:var(--ink)}
@media(hover:hover){a.brand:hover{opacity:.72}}

/* kicker capitales (filet à gauche ; le 2e filet éventuel est géré par la page) */
.sur{display:flex;align-items:center;gap:13px;font-size:10px;letter-spacing:.30em;text-transform:uppercase;color:var(--muted);font-weight:500}
.sur::before{content:"";width:30px;height:1px;background:var(--green)}

/* titre serif (échelle unique pour les pages secondaires) */
.h{font-family:'Literata',Georgia,serif;font-weight:400;letter-spacing:.005em;font-size:clamp(30px,4.4vw,36px);line-height:1.12}

/* texte de lecture */
.prose p{font-size:14px;line-height:1.75;color:var(--soft)}

/* bouton secondaire (encre sur fond clair) */
.btn{display:inline-block;min-width:208px;text-align:center;font-family:'Jost',system-ui,sans-serif;font-size:11px;letter-spacing:.24em;text-transform:uppercase;font-weight:500;padding:14px 26px;background:var(--ink);color:var(--paper);border:1px solid var(--ink);text-decoration:none;cursor:pointer;transition:color .25s ease,background-color .25s ease}
@media(hover:hover){.btn:hover{background:transparent;color:var(--ink)}}

/* pied de page commun */
.foot{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;font-size:9px;letter-spacing:.30em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:36px 0 16px}
.foot .flogo{display:flex;flex-direction:column;align-items:center;gap:9px;text-decoration:none}
@media(hover:hover){.foot .flogo:hover{opacity:.72}}
.foot .mono{display:block;width:30px;height:30px;background:var(--ink);-webkit-mask:url(/espace/assets/monogramme.svg) center/contain no-repeat;mask:url(/espace/assets/monogramme.svg) center/contain no-repeat}
.foot .brand{color:var(--ink);font-weight:600;letter-spacing:.30em}
.foot .legal{display:block;margin-top:9px;font-size:8.5px;letter-spacing:.18em;color:var(--muted-deep)}
.foot .legal a{white-space:nowrap;color:var(--green-deep);text-decoration:none}
@media(hover:hover){.foot .legal a:hover{color:var(--green)}}
.foot .dot{margin:0 9px;opacity:.6}

@media(max-width:760px){
  :root{--m:9px}
  .top{padding:18px 20px}
}