/* ══════════ ARM — socle commun des pages internes ══════════
   Variables, nav, bande d'en-tête, composants, CTA, footer.
   Le moteur d'animation est déclaratif : voir commun.js. */
:root{
  --fond:#FBFAF6; --sable:#F0EBE0; --sable-f:#E7E0D1; --encre:#1E1B16; --gris:#6E675C;
  --grenat:#8A3241; --grenat-f:#6E2735; --vert:#90C440; --vert-t:#4E7223; --vert-p:#C9D9A8;
  --rayon:20px; --blanc:#FFFFFF;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:auto}
body{background:var(--fond);color:var(--encre);font-family:Figtree,sans-serif;overflow-x:hidden}
img,video{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:Archivo,sans-serif;letter-spacing:-.02em}
.conteneur{max-width:1280px;margin:0 auto;padding:0 5vw}

/* ————— Barre de progression + curseur ————— */
#progression{position:fixed;top:0;left:0;right:0;height:3px;z-index:120;background:var(--grenat);transform:scaleX(0);transform-origin:left}
#curseur-pt,#curseur-halo{position:fixed;top:0;left:0;border-radius:50%;pointer-events:none;z-index:150}
#curseur-pt{width:8px;height:8px;background:var(--grenat)}
#curseur-halo{width:38px;height:38px;border:1.5px solid rgba(138,50,65,.5)}
@media (hover:none), (max-width:1024px), (prefers-reduced-motion:reduce){#curseur-pt,#curseur-halo{display:none}}

/* ————— Navigation (identique à l'accueil) ————— */
#nav{position:fixed;top:0;left:0;right:0;z-index:100;transition:background .35s ease, box-shadow .35s ease, padding .35s ease;padding:18px 0}
#nav .barre{display:flex;align-items:center;justify-content:space-between;max-width:1380px;margin:0 auto;padding:0 4vw}
#nav .logo img{height:62px;transition:height .35s ease}
#nav .logo .fonce{display:none}
#nav ul.menu{display:flex;gap:2px;list-style:none;align-items:center}
#nav ul.menu>li{position:relative}
#nav ul.menu>li>a{display:block;padding:10px clamp(9px,1vw,15px);color:#fff;font-weight:600;font-size:clamp(13px,.95vw,14.5px);text-decoration:none;border-radius:999px;transition:background .2s;white-space:nowrap}
#nav ul.menu>li>a:hover{background:rgba(255,255,255,.14)}
#nav ul.menu>li>a.actif{background:rgba(255,255,255,.18)}
#loupe{background:none;border:0;cursor:pointer;color:#fff;width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .2s;margin-left:4px}
#loupe svg{width:19px;height:19px}
#loupe:hover{background:rgba(255,255,255,.14)}
.nav-solide#nav #loupe{color:var(--encre)}
.nav-solide#nav #loupe:hover{background:var(--sable)}
#nav .cta-nav{background:#fff;color:var(--encre);padding:12px 22px;border-radius:999px;font-size:13.5px;font-weight:700;text-decoration:none;transition:background .25s,color .25s;white-space:nowrap;margin-left:8px}
.nav-solide#nav{background:rgba(251,250,246,.92);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--sable-f);padding:10px 0}
.nav-solide#nav .logo img{height:48px}
.nav-solide#nav .logo .clair{display:none}
.nav-solide#nav .logo .fonce{display:block}
.nav-solide#nav ul.menu>li>a{color:var(--encre)}
.nav-solide#nav ul.menu>li>a:hover{background:var(--sable)}
.nav-solide#nav ul.menu>li>a.actif{background:var(--sable);color:var(--grenat)}
.nav-solide#nav .cta-nav{background:var(--grenat);color:#fff}
.sous-menu{position:absolute;top:100%;left:8px;background:#fff;border-radius:14px;box-shadow:0 18px 44px rgba(40,32,18,.14);padding:10px;min-width:250px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.22s ease;list-style:none}
.deroulant:hover .sous-menu{opacity:1;visibility:visible;transform:translateY(2px)}
.sous-menu a{display:block;padding:10px 14px;border-radius:9px;font-size:14px;font-weight:600;color:var(--encre);text-decoration:none}
.sous-menu a:hover{background:var(--sable);color:var(--grenat)}
#burger{display:none;background:none;border:0;cursor:pointer;width:44px;height:44px;position:relative;z-index:130}
#burger span{display:block;width:26px;height:2.5px;background:#fff;margin:6px auto;border-radius:2px;transition:.3s}
.nav-solide#nav #burger span{background:var(--encre)}
@media(max-width:1024px){
  #nav ul.menu,#nav .cta-nav,#loupe{display:none}
  #burger{display:block}
  body.nav-ouverte #nav{background:var(--fond)}
  body.nav-ouverte #burger span{background:var(--encre)}
  body.nav-ouverte #burger span:nth-child(1){transform:translateY(8.5px) rotate(45deg)}
  body.nav-ouverte #burger span:nth-child(2){opacity:0}
  body.nav-ouverte #burger span:nth-child(3){transform:translateY(-8.5px) rotate(-45deg)}
  #menu-mobile{position:fixed;inset:0;background:var(--fond);z-index:110;padding:110px 7vw 40px;overflow-y:auto;display:none}
  body.nav-ouverte #menu-mobile{display:block}
  #menu-mobile .groupe{border-bottom:1px solid var(--sable-f);padding:18px 0}
  #menu-mobile .groupe>span{font-family:Archivo,sans-serif;font-weight:800;font-size:20px;display:block;margin-bottom:8px}
  #menu-mobile a{display:block;padding:8px 0;font-size:15.5px;font-weight:600;color:var(--gris);text-decoration:none}
  #menu-mobile .groupe a.direct{font-family:Archivo,sans-serif;font-weight:800;font-size:20px;color:var(--encre);padding:0}
  #menu-mobile .cta-mob{margin-top:26px;display:inline-block;background:var(--grenat);color:#fff;padding:15px 30px;border-radius:999px;font-weight:700;text-decoration:none}
}
@media(min-width:1025px){#menu-mobile{display:none!important}}

/* ————— Recherche ————— */
#recherche-overlay{position:fixed;inset:0;z-index:160;background:rgba(30,27,22,.55);backdrop-filter:blur(10px);display:none;align-items:flex-start;justify-content:center;padding:18vh 6vw 0}
#recherche-overlay.ouvert{display:flex}
#recherche-overlay .boite{width:min(680px,100%)}
#recherche-overlay form{display:flex;align-items:center;gap:16px;background:#fff;border-radius:999px;padding:8px 12px 8px 26px;box-shadow:0 30px 80px rgba(0,0,0,.35)}
#recherche-overlay form svg{width:22px;height:22px;color:var(--grenat);flex-shrink:0}
#recherche-overlay input{flex:1;border:0;outline:0;font-family:Figtree,sans-serif;font-size:clamp(16px,1.6vw,20px);font-weight:500;color:var(--encre);background:none;padding:12px 0}
#recherche-overlay input::placeholder{color:var(--gris)}
#fermer-recherche{background:var(--sable);border:0;cursor:pointer;width:46px;height:46px;border-radius:50%;font-size:16px;color:var(--encre);flex-shrink:0;transition:background .2s}
#fermer-recherche:hover{background:var(--sable-f)}
#recherche-overlay p{text-align:center;color:rgba(255,255,255,.75);font-size:13.5px;margin-top:16px}
.recherche-mob{margin-bottom:8px}
.recherche-mob input{width:100%;border:1.5px solid var(--sable-f);border-radius:999px;padding:14px 22px;font-family:Figtree,sans-serif;font-size:16px;background:#fff;outline:0}
.recherche-mob input:focus{border-color:var(--grenat)}

/* ————— Bande d'en-tête des pages internes ————— */
.bande{position:relative;overflow:hidden;padding:calc(96px + 7vh) 0 8vh;color:#fff}
.bande .fond{position:absolute;inset:0;z-index:0}
.bande .fond img{width:100%;height:130%;object-fit:cover;position:relative;top:-15%}
.bande .fond::after{content:"";position:absolute;inset:0;background:linear-gradient(to top, rgba(20,12,8,.74) 0%, rgba(20,12,8,.38) 60%, rgba(20,12,8,.3) 100%)}
.bande .conteneur{position:relative;z-index:2}
.bande .fil{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--vert);margin-bottom:14px}
.bande .fil a{text-decoration:none;color:rgba(255,255,255,.8)}
.bande .fil a:hover{color:#fff}
.bande h1{font-weight:900;font-size:clamp(36px,4.8vw,74px);line-height:1;max-width:18ch}
.bande .intro{margin-top:18px;font-size:clamp(15.5px,1.3vw,18px);line-height:1.6;max-width:58ch;color:rgba(255,255,255,.88)}

/* ————— Composants communs ————— */
.section{padding:90px 0}
.section.serree{padding:64px 0}
.eti{display:inline-block;background:var(--sable);border-radius:999px;padding:8px 16px;font-size:12.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--grenat);margin-bottom:18px}
.titre-sec{font-weight:900;font-size:clamp(28px,3.2vw,46px);line-height:1.05;margin-bottom:16px}
.texte-doux{color:var(--gris);font-size:16.5px;line-height:1.65;max-width:65ch}
.btn{display:inline-block;padding:16px 32px;border-radius:999px;font-weight:700;font-size:15px;text-decoration:none;transition:transform .2s ease;border:0;cursor:pointer;font-family:Figtree,sans-serif}
.btn-grenat{background:var(--grenat);color:#fff}
.btn-ligne{border:2px solid var(--encre);color:var(--encre);background:none}
.carte-blanche{background:#fff;border-radius:var(--rayon);padding:30px;box-shadow:0 12px 30px rgba(40,32,18,.07)}
.grille-2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.grille-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.grille-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media(max-width:1024px){.grille-3,.grille-4{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.grille-2,.grille-3,.grille-4{grid-template-columns:1fr}}
.pastille{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pastille img{width:30px;height:30px;object-fit:contain}
.pastille.g{background:var(--grenat)}
.pastille.v{background:var(--vert-t)}
.rang-liste{display:flex;gap:18px;align-items:flex-start;padding:20px 4px;border-top:1px solid var(--sable-f)}
.rang-liste:last-child{border-bottom:1px solid var(--sable-f)}
.rang-liste span{font-family:Archivo,sans-serif;font-weight:800;font-size:14px;color:var(--grenat);min-width:34px;padding-top:2px}
.rang-liste p{font-size:15.5px;line-height:1.55;font-weight:500}
.note-fournir{background:var(--sable);border-left:4px solid var(--vert-t);border-radius:0 14px 14px 0;padding:18px 22px;font-size:14.5px;color:var(--gris);line-height:1.55}
.note-fournir b{color:var(--encre)}

/* ————— CTA + footer (identiques à l'accueil) ————— */
#cta-fin{padding:20px 5vw 90px}
#cta-fin .panneau{background:var(--grenat);border-radius:34px;color:#fff;text-align:center;padding:clamp(50px,7vw,90px) 6vw;position:relative;overflow:hidden;max-width:1280px;margin:0 auto}
#cta-fin .rosace{position:absolute;left:-90px;bottom:-140px;width:360px;opacity:.1}
#cta-fin h2{font-weight:900;font-size:clamp(30px,3.8vw,56px);line-height:1.02;margin-bottom:16px}
#cta-fin p{opacity:.9;font-size:17px;max-width:52ch;margin:0 auto 30px;line-height:1.6}
#cta-fin .btn-blanc{background:#fff;color:var(--grenat);padding:17px 36px;border-radius:999px;font-weight:800;font-size:15.5px;text-decoration:none;display:inline-block}
footer{background:var(--encre);color:#fff;padding:70px 0 34px}
footer .haut{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:34px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.14)}
footer .marque img{height:58px;margin-bottom:18px}
footer .marque p{font-size:14px;line-height:1.6;color:rgba(255,255,255,.65);max-width:30ch}
footer h4{font-family:Archivo,sans-serif;font-size:14.5px;font-weight:800;margin-bottom:16px;color:var(--vert)}
footer ul{list-style:none}
footer ul a{display:block;padding:5px 0;font-size:14px;color:rgba(255,255,255,.72);text-decoration:none}
footer ul a:hover{color:#fff}
footer .bas{display:flex;justify-content:space-between;gap:20px;padding-top:26px;font-size:13px;color:rgba(255,255,255,.5);flex-wrap:wrap}
footer .lettre-info{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:30px 0;border-bottom:1px solid rgba(255,255,255,.14);flex-wrap:wrap}
footer .lettre-info h4{margin-bottom:6px}
footer .lettre-info .accroche p{color:rgba(255,255,255,.65);font-size:14px}
footer .lettre-info form{display:flex;gap:10px;flex:1;max-width:440px;min-width:260px}
footer .lettre-info input{flex:1;background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.2);border-radius:999px;padding:13px 20px;color:#fff;font-family:Figtree,sans-serif;font-size:14.5px;outline:0;transition:border-color .2s}
footer .lettre-info input::placeholder{color:rgba(255,255,255,.45)}
footer .lettre-info input:focus{border-color:var(--vert)}
footer .lettre-info button{background:var(--vert);color:var(--encre);border:0;border-radius:999px;padding:13px 24px;font-family:Figtree,sans-serif;font-size:14px;font-weight:800;cursor:pointer}
footer .sociaux{display:flex;gap:10px}
footer .sociaux a{width:42px;height:42px;border-radius:50%;border:1.5px solid rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;color:#fff;transition:.2s}
footer .sociaux a:hover{background:var(--grenat);border-color:var(--grenat)}
footer .sociaux svg{width:17px;height:17px;fill:currentColor}
@media(max-width:1024px){footer .haut{grid-template-columns:1fr 1fr}}

/* ————— Moteur (états initiaux gérés par JS ; ici uniquement le split) ————— */
.mot{display:inline-block;overflow:hidden;vertical-align:bottom}
.mot i{display:inline-block;font-style:normal}
::selection{background:var(--vert-p)}
