/* Couche « luxe » chargée EN DERNIER par chaque maquette.
   Révision du 2026-10-28 (Capri) : l'ARGENT est le métal principal (continuité du logo) ;
   le CHAMPAGNE n'apparaît qu'en touches rares : fin des grands titres et Formule phare.
   Le métal est un décor : jamais pour un texte courant. */
:root{
  --metal:#B7BFC7; --metal-fonce:#8E98A3; --metal-texte:#5E6A76; --marine-nuit:#15344A;
  --reflet:linear-gradient(115deg,#9AA4AE 0%,#E9EDF1 28%,#B7BFC7 50%,#F4F6F8 72%,#A3ADB7 100%);
  --champagne:#C9A96E;
  --reflet-champagne:linear-gradient(115deg,#B08D57 0%,#EBD9B0 28%,#C4A36A 50%,#F3E6C6 72%,#AE8B55 100%);
}

/* Boutons : angles nets ; marine sur fond clair, argent sur fond marine */
.btn{border-radius:2px;letter-spacing:.04em;background:var(--marine);box-shadow:0 0 0 1px var(--metal) inset}
.btn:hover{background:var(--marine-nuit)}
.btn-ghost{background:transparent;box-shadow:none;border:1px solid var(--marine)}
.btn-ghost:hover{background:var(--brume)}
.hero .btn,.bandeau .btn,.phare .btn,footer .btn{background:var(--reflet);color:var(--marine-nuit);box-shadow:none}
.hero .btn:hover,.bandeau .btn:hover,.phare .btn:hover,footer .btn:hover{filter:brightness(1.05);background:var(--reflet)}

/* En-tête : filet d'argent */
header{border-bottom:1px solid var(--argent)}

/* Liens de suite : soulignés d'argent */
.lien-tarifs,.lien-suite,.public a,.hero-actions a.lien{text-decoration:none;border-bottom:1px solid var(--metal-fonce);padding-bottom:3px}
.hero-actions a.lien{border-bottom-color:var(--metal)}

/* Titres : petit filet d'argent sous chaque titre de section */
section h2::after{content:"";display:block;width:64px;height:1px;background:var(--reflet);margin-top:20px}
.prest-tete h2::after,.carte-tete h2::after{margin-top:16px}

/* Hauts de page : marine profond + cadre à double filet argent */
.hero,.bandeau{background:radial-gradient(120% 140% at 0% 0%,var(--marine) 0%,var(--marine-nuit) 100%)}
.bandeau{position:relative}
.bandeau::after{content:"";position:absolute;inset:16px;border:1px solid var(--metal);opacity:.4;pointer-events:none}
.hero-texte .devise,.bandeau .devise{color:var(--argent);letter-spacing:.22em}
/* Touche champagne n° 1 : la fin des grands titres */
.hero h1 em,.bandeau h1 em{font-style:italic;background:var(--reflet-champagne);-webkit-background-clip:text;background-clip:text;color:transparent}

/* Petites capitales sur fond clair */
.valeur .devise{color:var(--metal-texte)}

/* Formules : double filet argent */
.formule{border-radius:2px;position:relative;border-color:var(--argent-clair)}
.formule::before{content:"";position:absolute;inset:8px;border:1px solid var(--metal);opacity:.6;pointer-events:none}
.phare{background:linear-gradient(160deg,var(--marine) 0%,var(--marine-nuit) 100%)}
.phare::before{opacity:.7}
/* Touche champagne n° 2 : la Formule phare (prix et étiquette) */
.phare .prix{background:var(--reflet-champagne);-webkit-background-clip:text;background-clip:text;color:transparent}
.phare .prix small{-webkit-text-fill-color:var(--sur-marine);color:var(--sur-marine)}
.phare .devise{color:var(--champagne);letter-spacing:.22em}
.formule li::before{border-color:var(--metal-fonce)}
.phare li::before{border-color:var(--metal)}

/* Repères numérotés et filets de séparation */
.num{border-color:var(--metal)}
.etapes .num{color:var(--metal);border:none}
.theme,.valeur,.etapes li{border-top:1px solid var(--metal)}
.groupe h3{border-bottom:1px solid var(--metal)}
.ligne dt::after{border-bottom-color:var(--metal)}

/* Encadrés et cartes */
.encadre,.public,.cercle,.sigles{border-radius:2px}
.encadre.fort{background:linear-gradient(160deg,var(--marine) 0%,var(--marine-nuit) 100%);box-shadow:0 0 0 1px var(--metal) inset}

/* Pied de page */
footer{background:var(--marine-nuit)}
.pastille{box-shadow:0 0 0 2px var(--metal),0 0 0 6px var(--marine-nuit),0 0 0 7px rgba(192,198,204,.45)}
.pied-marque .devise,.pied h4{color:var(--argent)}
.legal{border-top-color:rgba(192,198,204,.3)}

/* Arc de fin d'Accueil : décalé pour ne pas passer sur le texte */
.final svg{right:-240px}

/* Logo de l'en-tête (2026-10-28) : symbole + nom seuls, fond transparent, sans les lignes de slogan */
header .marque{display:flex;align-items:center}
header img{width:auto;height:56px;object-fit:contain}
@media (max-width:860px){header img{width:auto;height:42px}}

/* Menu mobile ouvert en plein écran (menu.js) ; liens légaux toujours visibles sur mobile */
@media (max-width:860px){
  body.menu-ouvert{overflow:hidden}
  body.menu-ouvert header nav{display:flex;position:fixed;top:84px;left:0;right:0;bottom:0;flex-direction:column;align-items:stretch;gap:0;padding:16px 24px 32px;background:#fff;z-index:20;overflow:auto}
  body.menu-ouvert header nav a{font-size:22px;padding:18px 4px;border-bottom:1px solid var(--argent-clair)}
  body.menu-ouvert header nav .btn{margin-top:28px;border-bottom:none;justify-content:center}
  body.menu-ouvert .barre-mobile{display:none}
  .legal nav{display:flex;flex-wrap:wrap;gap:12px 24px}
}