/* ============================================================
   BANNIÈRE DE PAGE — version claire (reprise de site_blanc_25)
   ------------------------------------------------------------
   Remplace l'ancien bandeau vert plein des pages intérieures :
   fond blanc dominant, armoirie officielle en filigrane à droite,
   mention « portail officiel », liseré tricolore en pied.

   Les sélecteurs sont préfixés par `body` afin de primer sur les
   règles `.page-hero` déclarées en <style> dans chaque page, quel
   que soit l'ordre de chargement.

   Les couleurs d'accent utilisent les variables du thème
   (--or, --or-dark, --texte...) : elles restent donc pilotées par
   le dashboard (Apparence → couleurs) via theme.js.
   ============================================================ */

body .page-hero{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(760px 340px at 90% -160px, rgba(2,121,1,.10), transparent 65%),
    radial-gradient(520px 260px at 4% 130%, rgba(201,168,76,.12), transparent 70%),
    #FFFFFF;
  padding:44px 40px 46px;
  color:var(--texte);
  box-shadow:0 18px 30px -26px rgba(23,21,16,.35);
}

/* Neutralise l'ancien filet doré / le voile radial vert des pages */
body .page-hero::before{content:none}

/* Liseré tricolore du drapeau en pied de bandeau */
body .page-hero::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  top:auto;
  height:5px;
  background:
    
    linear-gradient(90deg, #0a851a 0 33.33%, #0a851a 33.33% 66.66%, #0a851a 66.66% 100%);
  opacity:.95;
  box-shadow:0 1px 0 rgba(23,21,16,.06);
}

/* Mention « site officiel » — codes de confiance des portails d'État */
body .page-hero-official{
  position:absolute;z-index:2;
  top:20px;right:32px;
  margin:0;
  font-family:'Barlow',sans-serif;
  font-size:10.5px;font-weight:700;
  letter-spacing:.11em;text-transform:uppercase;
  color:var(--or-dark);opacity:.85;
}
@media (max-width:900px){body .page-hero-official{display:none}}

/* Filigrane armoirie — blason officiel fondu en médaillon, cerné d'un anneau fin */
body .page-hero-crest{
  position:absolute;z-index:1;pointer-events:none;
  top:20px;right:-30px;width:280px;
  -webkit-mask-image:radial-gradient(circle at 58% 50%, #000 52%, transparent 76%);
  mask-image:radial-gradient(circle at 58% 50%, #000 52%, transparent 76%);
}
body .page-hero-crest-ring{
  position:absolute;inset:0;width:100%;height:100%;
  color:var(--or);opacity:.20;
}
body .page-hero-crest img{
  position:relative;width:100%;height:auto;display:block;opacity:.24;
}
@media (max-width:640px){body .page-hero-crest{width:230px;top:36px}}

body .page-hero-inner{position:relative;z-index:2;max-width:1900px;margin:0 auto}

/* L'eyebrow reste dans le DOM (alimenté par le dashboard) mais n'est plus
   affiché : la maquette de référence n'affiche que titre + chapô.
   Pour le réafficher : body .page-hero .page-eyebrow{display:block} */
body .page-hero .page-eyebrow{display:none}

body .page-hero .page-title{
  font-family:'Cormorant Garamond',serif;
  font-weight:600;
  color:var(--texte);
  font-size:clamp(30px,4.2vw,52px);
  line-height:1.1;
  margin-top:0;
  max-width:900px;
}

body .page-hero .page-sub{
  margin-top:16px;
  max-width:760px;
  color:var(--texte-2);
  font-size:16.5px;
  font-weight:300;
  line-height:1.7;
}

@media (max-width:768px){
  body .page-hero{padding:32px 16px 34px}
  body .page-hero .page-sub{font-size:15px}
}