/* =====================================================================
   SAGARA — Site public : CHARTE INSTITUTIONNELLE PREMIUM
   Chargee APRES site.css uniquement quand "Charte institutionnelle premium"
   est choisie dans Administration du site > Parametres > Apparence
   (voir App\Core\SiteTheme). Meme charte que l'ERP (public/assets/css/premium.css) :
   bleu nuit -> emeraude, touches or, titres serif, cartes effet verre.
   Ne redefinit que des variables et des styles : aucun gabarit n'est modifie,
   revenir a une autre typographie restaure l'ancien site a l'identique.
   ===================================================================== */

:root{
  /* Palette (memes noms que site.css : tout le site suit automatiquement) */
  --vert:#0e7a5a; --vert-fonce:#0a5c44; --vert-700:#08493a;
  --vert-clair:#e3f3ee; --vert-pale:#f1f8f6;
  --or:#f2b632; --or-fonce:#b7841a; --or-clair:#fcf0d2;
  --bordeaux:#b4323f; --bordeaux-clair:#f8e5e7;
  --creme:#f4f6fb; --creme-2:#e9eef7; --papier:#fbfcfe;
  --encre:#0f1b33; --encre-doux:#5b6478;
  --ligne:#e1e6f0; --ligne-2:#d3dbe8;
  --sombre:#0b1f4b; --sombre-2:#12306b;

  /* Charte */
  --nuit:#0b1f4b; --nuit-2:#12306b;
  --degrade:linear-gradient(135deg,#0b1f4b 0%,#12306b 45%,#0e7a5a 100%);
  --serif:'Playfair Display',Georgia,'Times New Roman',serif;
  --verre:rgba(255,255,255,.72); --verre-bord:rgba(255,255,255,.65);

  --sh-xs:0 1px 2px rgba(11,31,75,.05);
  --sh-sm:0 2px 6px rgba(11,31,75,.05), 0 14px 30px -16px rgba(11,31,75,.18);
  --sh-md:0 18px 40px -16px rgba(11,31,75,.25), 0 34px 70px -40px rgba(11,31,75,.30);
  --sh-vert:0 14px 30px -12px rgba(14,122,90,.55);
  --sh-or:0 14px 30px -12px rgba(242,182,50,.55);
}

body{background:
  radial-gradient(900px 600px at 100% 30%, rgba(14,122,90,.05), transparent 70%),
  radial-gradient(800px 600px at 0% 70%, rgba(18,48,107,.05), transparent 70%),
  var(--papier)}

/* Titres : serif elegant, chiffres alignes */
h1,h2,h3,.marque .nom .t,.citation-texte,.chiffre .v{font-family:var(--serif);font-variant-numeric:lining-nums}
h1,h2{font-weight:700;letter-spacing:-.01em}
h3{font-weight:700;letter-spacing:0}
h4,.etape h4{font-weight:800}
.eyebrow{color:var(--vert)}
.eyebrow::before{background:var(--or)}
::selection{background:var(--or-clair)}

/* --- Boutons --- */
.btn{font-weight:700}
.btn.primaire{background:var(--degrade);background-size:140% 100%;background-position:0 0;color:#fff;
  box-shadow:0 14px 30px -14px rgba(11,31,75,.65);transition:transform .15s,box-shadow .15s,background-position .35s}
.btn.primaire:hover{background:var(--degrade);background-size:140% 100%;background-position:100% 0;color:#fff}
.btn.or{background:linear-gradient(135deg,#f5c451,#e3a21c);color:#1d1604}
.btn.or:hover{background:linear-gradient(135deg,#f7cd66,#e8ab2a);color:#1d1604}
.btn.secondaire{background:var(--verre);border-color:var(--ligne-2);color:var(--nuit);backdrop-filter:blur(8px)}
.btn.secondaire:hover{border-color:var(--vert);color:var(--vert-fonce)}

/* --- Bandeau d'annonce + en-tete verre --- */
.site-annonce{background:linear-gradient(90deg,#0b1f4b,#12306b 55%,#0e7a5a)}
.site-annonce b{color:var(--or)}
.site-tete{background:rgba(251,252,254,.78);backdrop-filter:saturate(1.6) blur(16px);-webkit-backdrop-filter:saturate(1.6) blur(16px);
  border-bottom:1px solid rgba(11,31,75,.08);box-shadow:none}
.site-tete.est-defile{box-shadow:0 10px 30px -18px rgba(11,31,75,.35)}
.marque .logo{box-shadow:var(--sh-sm), inset 0 0 0 2px rgba(242,182,50,.45)}
.marque .nom .t{font-weight:700;letter-spacing:.01em}
.marque .nom .s{color:var(--vert)}
.site-nav a{font-weight:600;color:var(--nuit)}
.site-nav a:hover,.site-nav a.actif{color:var(--vert-fonce)}
.site-nav a::after{background:var(--or)}
.site-nav .nav-sous{background:rgba(255,255,255,.92);backdrop-filter:blur(14px);box-shadow:0 20px 40px -18px rgba(11,31,75,.35)}
.site-nav .nav-sous a:hover{background:var(--vert-clair)}
/* Menu long : se resserre avant de deborder a droite (bouton "Se connecter" coupe) */
@media(max-width:1440px) and (min-width:761px){
  .site-nav a{padding:9px 8px;font-size:14px}
  .site-nav .btn{margin-left:8px;padding:11px 16px;font-size:14px}
}
@media(max-width:1300px) and (min-width:761px){
  .marque .nom .s{display:none}
  .marque .nom .t{font-size:16px}
  .site-nav a{padding:8px 6px;font-size:13.3px}
}

/* --- Hero : bleu nuit -> emeraude, texte blanc, halos --- */
.hero{background:var(--degrade);color:#fff;isolation:isolate}
.hero::before{background:
  radial-gradient(42% 60% at 88% 0%, rgba(14,122,90,.55), transparent 70%),
  radial-gradient(38% 50% at 0% 100%, rgba(242,182,50,.20), transparent 70%),
  radial-gradient(30% 40% at 55% 110%, rgba(255,255,255,.08), transparent 70%)}
.hero::after{height:3px;background:linear-gradient(90deg,transparent,var(--or) 30%,var(--or) 70%,transparent);opacity:.85}
.hero h1,.hero h2,.hero h3{color:#fff}
.hero h1 .accent{color:var(--or)}
.hero .accroche,.hero p{color:rgba(255,255,255,.82)}
.hero .eyebrow{color:var(--or)}
.hero a:not(.btn){color:var(--or)}
.hero .btn.primaire{background:#fff;color:var(--nuit);box-shadow:0 16px 34px -14px rgba(0,0,0,.45)}
.hero .btn.primaire:hover{background:#f1f5ff;color:var(--nuit)}
.hero .btn.secondaire{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.35);color:#fff}
.hero .badge-pill{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22);color:#fff;
  backdrop-filter:blur(8px);box-shadow:none}
.hero .badge-pill::before{background:transparent;box-shadow:inset 0 0 0 4px var(--or)}
.hero-media .media{box-shadow:0 30px 60px -24px rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.18)}
.hero-media::after{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14)}
.hero-media .sceau{background:var(--or);color:#1d1604}
.hero .galerie-onglets{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2)}
.hero .galerie-onglets a{color:rgba(255,255,255,.85)}
.hero .galerie-onglets a.actif{background:#fff;color:var(--nuit)}

/* --- Sections --- */
.section--creme{background:linear-gradient(180deg,var(--creme),#fbfcfe)}
.section--vert-pale{background:linear-gradient(180deg,var(--vert-pale),#fbfcfe)}
.section + .section--creme,.section--creme + .section{border-top:0}
.section--sombre{background:var(--degrade);color:rgba(255,255,255,.8)}
.section--sombre .entete p,.section--sombre .chiffre .l,.section--sombre .encadre p{color:rgba(255,255,255,.72)}
.section--sombre .eyebrow{color:var(--or)}

/* --- Chiffres : barre verre --- */
.chiffres{background:var(--verre);border:1px solid var(--verre-bord);border-radius:22px;
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:var(--sh-md)}
.chiffre + .chiffre{border-left:1px solid var(--ligne)}
.chiffre .v{color:var(--nuit);font-weight:700}
.chiffre .l{text-transform:uppercase;letter-spacing:.08em;font-size:12px;font-weight:700}
.section--sombre .chiffres{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);box-shadow:none}
.section--sombre .chiffre + .chiffre{border-left-color:rgba(255,255,255,.14)}
.section--sombre .chiffre .v{color:#fff}

/* --- Cartes verre --- */
.carte,.encadre,.form-carte,.faq-item{background:var(--verre);border:1px solid var(--verre-bord);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:var(--sh-sm)}
.carte{border-radius:20px}
.carte:hover{box-shadow:var(--sh-md);border-color:rgba(14,122,90,.25)}
.carte .puce{background:var(--degrade);color:#fff;border-radius:14px;box-shadow:0 10px 22px -10px rgba(11,31,75,.6)}
.carte--media .media{border-bottom:1px solid var(--ligne)}
.encadre{border-top:3px solid var(--or);border-radius:18px}
.encadre h3{color:var(--nuit)}
.encadre h3 .ic{color:var(--vert)}
.section--sombre .encadre{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.14);border-top-color:var(--or)}

/* --- Media / split --- */
.media{background:var(--creme-2)}
.media--vide{background:var(--creme-2);color:var(--sombre-2)}
.split-media .media,.bande-photo .media{box-shadow:var(--sh-md)}
.split-media::after{background:linear-gradient(135deg,rgba(14,122,90,.16),rgba(242,182,50,.18))}
.split .liste-check li::before{background:var(--vert-clair);box-shadow:none}

/* --- Demarche, timeline --- */
.etape::before{background:var(--degrade);box-shadow:0 10px 22px -10px rgba(11,31,75,.55);font-family:var(--serif)}
.timeline::before{background:linear-gradient(var(--vert),var(--or))}
.timeline .annee{color:var(--vert)}

/* --- Galerie, actualites --- */
.galerie figure{border-radius:16px;box-shadow:var(--sh-sm)}
.news .date{color:var(--vert)}
.news h3{font-family:var(--serif);font-weight:700}
.tag-pill:hover{border-color:var(--vert)}
.galerie-onglets a.actif{background:var(--degrade)}

/* --- Contact --- */
.contact-infos{background:var(--degrade);position:relative;overflow:hidden;box-shadow:var(--sh-md)}
.contact-infos::before{content:"";position:absolute;width:280px;height:280px;right:-90px;top:-110px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(242,182,50,.28),transparent);pointer-events:none}
.contact-infos > *{position:relative}
.champ input,.champ textarea{background:rgba(255,255,255,.8)}

/* --- CTA --- */
.cta{background:var(--degrade);box-shadow:var(--sh-md)}
.cta::before{background:radial-gradient(50% 120% at 50% 0,rgba(242,182,50,.25),transparent 70%)}
.cta p{color:rgba(255,255,255,.8)}

/* --- Pied de page --- */
.site-pied{background:linear-gradient(160deg,#0b1f4b 0%,#0d2657 60%,#0b3b4a 100%);color:rgba(255,255,255,.66);position:relative}
.site-pied::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,transparent,var(--or),transparent);opacity:.7}
.site-pied a{color:rgba(255,255,255,.72)}
.site-pied a:hover{color:var(--or)}
.pied-grille h4{color:var(--or)}
.pied-bas{color:rgba(255,255,255,.5)}

/* --- Divers --- */
.flash{border-radius:14px;backdrop-filter:blur(12px)}
.contenu-riche blockquote{border-left-color:var(--or)}
.contenu-riche .btn-cta{background:var(--degrade)}
.faq-item{border-radius:16px}
.faq-item summary::after{color:var(--vert)}
.citation-auteur{color:var(--vert)}

@media(max-width:760px){
  .site-nav{background:rgba(255,255,255,.96);backdrop-filter:blur(14px)}
  .chiffre + .chiffre{border-left:0;border-top:1px solid var(--ligne);padding-top:14px}
}
@media(prefers-reduced-motion:reduce){.btn.primaire{transition:none}}
