/*
Theme Name:   APISENS — Alvéole d'Or (enfant Kadence)
Theme URI:    https://apisens.eu/
Description:  Thème enfant Kadence pour APISENS. Direction artistique « Alvéole d'Or » (dégradés métallisés, reflets), architecture orientée situations client. Contient le gabarit de page d'accueil, le système de design complet et les interactions accessibles. Visuels officiels APISENS intégrés (logo, portraits, hero, bande immersive, sections solutions).
Author:       Développé pour APISENS
Template:     kadence
Version:      1.4.1
Requires PHP: 7.4
Text Domain:  apisens-child
License:      Usage réservé à APISENS
*/

/* --------------------------------------------------------------------------
   IMPORTANT — Les couleurs sont centralisées dans :root ci-dessous.
   Pour aligner Kadence : Personnaliser > Couleurs globales, puis reporter
   les mêmes valeurs hexadécimales (voir README.md, étape 4).
   -------------------------------------------------------------------------- */

/* Neutralisation des marges du conteneur Kadence sur le gabarit APISENS */
.page-template-template-apisens .site-container,
.page-template-template-apisens .content-area,
.page-template-template-apisens .entry-content{
  max-width:none;padding:0;margin:0;
}
.page-template-template-apisens .entry-header,
.page-template-template-apisens .entry-content > .alignfull{margin:0}

/* ==========================================================================
   APISENS — Système « Alvéole d'Or »
   Architecture orientée situations · WCAG 2.2 AA · prefers-reduced-motion
   Variables à reporter dans les couleurs globales Kadence lors de la
   transposition WordPress.
   ========================================================================== */
:root{
  --ivoire:#F7F3EA;
  --parchemin:#EFE7D5;
  --anthracite:#211E19;
  --anthracite-2:#3A352C;
  --ambre:#B97E24;
  --ambre-fonce:#7E5210; /* contraste AA sur ivoire */
  --nectar:#EBD08E;
  --lichen:#5E6555;
  --blanc-doux:#FCFAF4;
  --erreur:#8C2F1B;
  --ok:#3E5E3A;
  --or-metal:linear-gradient(108deg,#7A4E0E 0%,#B97E24 22%,#F2DFA6 48%,#D9A84E 62%,#8A5A12 85%,#6E4408 100%);
  --or-metal-clair:linear-gradient(108deg,#B97E24 0%,#EBD08E 30%,#FBF3D9 50%,#D9A84E 72%,#A96F1C 100%);
  --acier-sombre:linear-gradient(150deg,#2B2822 0%,#211E19 45%,#33302A 70%,#1B1914 100%);
  --font-display:'Cormorant Garamond', Georgia, serif;
  --font-body:'Figtree', 'Segoe UI', sans-serif;
  --maxw:1180px;
  --radius:2px;
  --transition:.4s cubic-bezier(.22,.61,.36,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{
  font-family:var(--font-body);background:var(--ivoire);color:var(--anthracite);
  font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased;
}
::selection{background:var(--nectar);color:var(--anthracite)}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--ambre);outline-offset:3px;border-radius:2px}
.skip-link{
  position:absolute;left:-9999px;top:0;background:var(--anthracite);color:var(--ivoire);
  padding:.8rem 1.2rem;z-index:200;
}
.skip-link:focus{left:1rem;top:1rem}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 6vw}
.eyebrow{
  font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;font-weight:600;
  color:var(--ambre-fonce);display:flex;align-items:center;gap:.9rem;
}
.eyebrow::before{
  content:"";width:13px;height:15px;flex:none;background:var(--or-metal);
  clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
}
.eyebrow.centre{justify-content:center}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:500;line-height:1.14;letter-spacing:.005em}
h2{font-size:clamp(1.9rem,3.8vw,2.8rem);margin:1rem 0 1.3rem}
h3{font-size:1.4rem}
.lede{max-width:60ch;color:var(--anthracite-2);font-size:1.05rem}
section{padding:clamp(4rem,8vw,6.5rem) 0}
.metal{
  background:var(--or-metal);background-size:220% auto;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  animation:sheen 7s ease-in-out infinite;
}
@keyframes sheen{0%,100%{background-position:0% center}50%{background-position:100% center}}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s cubic-bezier(.22,.61,.36,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .metal{animation:none}
  html{scroll-behavior:auto}
  *{transition-duration:.01ms !important;animation-duration:.01ms !important}
}

/* ---------- boutons ---------- */
.btn{
  position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:.7rem;
  background:var(--anthracite);color:var(--ivoire);padding:.9rem 1.7rem;
  border-radius:var(--radius);font-weight:500;font-size:.93rem;letter-spacing:.03em;
  border:1px solid var(--anthracite);cursor:pointer;font-family:var(--font-body);
  transition:transform var(--transition),box-shadow var(--transition);
}
.btn::before{
  content:"";position:absolute;top:-30%;bottom:-30%;left:-70%;width:45%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.5) 50%,transparent);
  transform:skewX(-20deg);transition:left .7s ease;pointer-events:none;
}
.btn:hover::before,.btn:focus-visible::before{left:130%}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 30px -14px rgba(122,78,14,.5)}
.btn.solar{
  background:var(--or-metal);background-size:180% auto;border:none;color:#2A1F08;font-weight:600;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -2px 4px rgba(110,68,8,.35),0 8px 22px -10px rgba(122,78,14,.55);
}
.btn.ghost{background:transparent;color:var(--anthracite);border:1px solid color-mix(in srgb,var(--ambre) 55%,transparent)}
.btn.ghost:hover{color:var(--ambre-fonce)}
.lien-fleche{
  display:inline-block;margin-top:1.1rem;font-size:.86rem;font-weight:600;letter-spacing:.05em;
  color:var(--ambre-fonce);border-bottom:1px solid transparent;transition:border-color var(--transition);
}
.lien-fleche:hover{border-color:var(--ambre-fonce)}

/* ---------- header & navigation ----------
   Le header APISENS est ciblé par une classe dédiée (.apisens-header) plutôt
   que par le sélecteur d'élément « header », afin de ne jamais entrer en
   collision avec un éventuel header du thème parent Kadence. */
.apisens-header{
  position:sticky;top:0;z-index:1000;
  background:color-mix(in srgb,var(--ivoire) 94%,transparent);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid color-mix(in srgb,var(--anthracite) 10%,transparent);
  overflow:visible;height:auto;
}
.apisens-header::after{
  content:"";display:block;height:1px;
  background:linear-gradient(90deg,transparent,#D9A84E 30%,#F2DFA6 50%,#D9A84E 70%,transparent);
  opacity:.55;
}
/* Le container « .nav » adopte une hauteur généreuse pour laisser respirer
   le logo complet (icône + wordmark + baseline). */
.nav{display:flex;align-items:center;justify-content:space-between;padding:.9rem 0;gap:1rem;min-height:96px}
.logo{display:flex;align-items:center;gap:.7rem;font-family:var(--font-display);font-size:1.4rem;letter-spacing:.14em;font-weight:600;flex:none;flex-shrink:0;max-width:60%}
/* Le logo APISENS est affiché en entier : hauteur pilotée par CSS, largeur auto.
   L'image ne dépasse jamais son conteneur (max-width:100%) et conserve son ratio. */
.logo-img{height:72px;width:auto;max-width:100%;display:block;object-fit:contain}
.logo-fallback{display:none;align-items:center;gap:.7rem}
.nav-links{display:flex;gap:.1rem;align-items:center;font-size:.86rem;font-weight:500;list-style:none;flex-wrap:nowrap}
.nav-item{position:relative}
.nav-item > a, .nav-item > button{
  display:flex;align-items:center;gap:.3rem;padding:.6rem .55rem;color:var(--anthracite-2);
  white-space:nowrap;
  background:none;border:none;font:inherit;cursor:pointer;border-radius:var(--radius);
  transition:color var(--transition),background var(--transition);
}
.nav-item > a:hover,.nav-item > button:hover{color:var(--anthracite);background:color-mix(in srgb,var(--nectar) 30%,transparent)}
.nav-item > button::after{
  content:"";width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translateY(-2px);transition:transform var(--transition);
}
.nav-item > button[aria-expanded="true"]::after{transform:rotate(-135deg) translateY(-2px)}
.sous-menu{
  position:absolute;top:calc(100% + .4rem);left:0;min-width:300px;list-style:none;
  background:var(--blanc-doux);border:1px solid color-mix(in srgb,var(--ambre) 30%,transparent);
  border-radius:var(--radius);box-shadow:0 24px 50px -24px rgba(33,30,25,.35);
  padding:.6rem;display:none;z-index:1010;
}
.sous-menu::before{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,#D9A84E 30%,#F2DFA6 50%,#D9A84E 70%,transparent);
}
.nav-item > button[aria-expanded="true"] + .sous-menu{display:block}
.sous-menu a{
  display:block;padding:.6rem .8rem;font-size:.88rem;color:var(--anthracite-2);border-radius:var(--radius);
  transition:background var(--transition),color var(--transition);
}
.sous-menu a:hover{background:color-mix(in srgb,var(--nectar) 35%,transparent);color:var(--anthracite)}
.nav-cta{flex:none}
.burger{
  display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:.6rem;
  flex-shrink:0;
}
.burger span{width:24px;height:2px;background:var(--anthracite);transition:transform var(--transition),opacity var(--transition)}
body.menu-ouvert .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
body.menu-ouvert .burger span:nth-child(2){opacity:0}
body.menu-ouvert .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- hero ---------- */
.hero{
  position:relative;overflow:hidden;
  padding:clamp(4.5rem,9vw,7.5rem) 0 clamp(4.5rem,8vw,6.5rem);
  background:radial-gradient(1100px 600px at 88% 12%, rgba(235,208,142,.28), transparent 60%),var(--ivoire);
}
.hero-layout{display:grid;grid-template-columns:1.08fr .92fr;gap:4rem;align-items:center}
.hero .verbes{
  display:flex;gap:1.1rem;flex-wrap:wrap;margin:0 0 1.2rem;
  font-family:var(--font-display);font-size:1.25rem;font-style:italic;color:var(--anthracite-2);
}
.hero .verbes span{display:flex;align-items:center;gap:1.1rem}
.hero .verbes span + span::before{
  content:"";width:9px;height:10px;background:var(--or-metal-clair);
  clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
}
.hero h1{font-size:clamp(2.2rem,4.6vw,3.5rem);max-width:22ch;margin:0 0 1.3rem}
.hero .lede + .lede{margin-top:.9rem;font-size:.98rem}
.hero-cta{display:flex;gap:1rem;flex-wrap:wrap;align-items:center;margin-top:2rem}
.cadre-photo{
  position:relative;overflow:hidden;border-radius:var(--radius);aspect-ratio:4/5;max-height:540px;
  background:linear-gradient(160deg,#EBD08E,#B97E24 60%,#7A4E0E);
  box-shadow:0 30px 60px -30px rgba(122,78,14,.5),inset 0 1px 0 rgba(255,255,255,.5);
}
.cadre-photo::before{content:"";position:absolute;inset:10px;z-index:2;pointer-events:none;border:1px solid color-mix(in srgb,var(--nectar) 75%,transparent)}
.cadre-photo::after{
  content:"";position:absolute;top:-30%;left:-30%;width:70%;height:70%;z-index:2;pointer-events:none;
  background:radial-gradient(closest-side,rgba(255,255,255,.32),transparent 70%);
}
.cadre-photo img{width:100%;height:100%;object-fit:cover}
.cadre-photo figcaption{
  position:absolute;left:0;right:0;bottom:0;z-index:3;padding:1rem 1.3rem;color:var(--ivoire);
  font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  background:linear-gradient(to top,rgba(27,25,20,.75),transparent);
}

/* ---------- réassurance ---------- */
.trust{
  background:var(--blanc-doux);padding:1.4rem 0;
  border-top:1px solid color-mix(in srgb,var(--anthracite) 8%,transparent);
  border-bottom:1px solid color-mix(in srgb,var(--anthracite) 8%,transparent);
}
.trust ul{display:flex;gap:1.8rem 2.6rem;flex-wrap:wrap;justify-content:center;list-style:none}
.trust li{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--anthracite-2);font-weight:500}
.trust li strong{
  background:var(--or-metal);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;font-weight:700;
}

/* ---------- cartes situations ---------- */
.situations-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem;margin-top:2.4rem}
.carte{
  position:relative;overflow:hidden;display:flex;flex-direction:column;
  background:linear-gradient(165deg,#FDFBF5 0%,#F6F0E1 100%);
  border:1px solid color-mix(in srgb,var(--ambre) 22%,transparent);
  border-radius:var(--radius);padding:2rem 1.8rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
  transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition);
}
.carte::before{
  content:"";position:absolute;top:-40%;bottom:-40%;left:-80%;width:38%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.5) 50%,transparent);
  transform:skewX(-18deg);transition:left .9s ease;pointer-events:none;
}
.carte:hover::before{left:150%}
.carte:hover{
  transform:translateY(-5px);
  border-color:color-mix(in srgb,var(--ambre) 55%,transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 24px 48px -26px rgba(122,78,14,.4);
}
.carte .hex{
  width:40px;height:46px;display:flex;align-items:center;justify-content:center;flex:none;
  background:var(--or-metal);clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
  margin-bottom:1.2rem;color:#FFF7E0;font-weight:700;font-size:.95rem;text-shadow:0 1px 1px rgba(110,68,8,.6);
}
.carte h3{margin-bottom:.6rem;font-size:1.35rem}
.carte p{font-size:.93rem;color:var(--anthracite-2)}
.carte ul{list-style:none;margin-top:.8rem;font-size:.88rem;color:var(--anthracite-2)}
.carte li{padding:.22rem 0 .22rem 1.4rem;position:relative}
.carte li::before{
  content:"";position:absolute;left:0;top:.8em;width:7px;height:8px;background:var(--or-metal-clair);
  clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
}
.carte .lien-fleche{margin-top:auto;padding-top:1.2rem}

/* ---------- APISCAN ---------- */
.apiscan{background:var(--parchemin)}
.apiscan-niveaux{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem;margin-top:2.4rem}
.niveau{
  background:var(--blanc-doux);border:1px solid color-mix(in srgb,var(--ambre) 28%,transparent);
  border-radius:var(--radius);padding:2.2rem 2rem;position:relative;overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.niveau .badge{
  display:inline-block;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;
  padding:.35rem .8rem;border-radius:2px;margin-bottom:1.1rem;
}
.niveau .badge.gratuit{background:var(--or-metal);color:#2A1F08;text-shadow:0 1px 0 rgba(255,255,255,.3)}
.niveau .badge.devis{background:var(--anthracite);color:var(--nectar)}
.niveau ul{list-style:none;margin-top:1rem;font-size:.92rem;color:var(--anthracite-2)}
.niveau li{padding:.3rem 0 .3rem 1.5rem;position:relative}
.niveau li::before{
  content:"";position:absolute;left:0;top:.85em;width:8px;height:9px;background:var(--or-metal-clair);
  clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
}
.apiscan-cta{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2.2rem}

/* ---------- méthode ---------- */
.methode{
  position:relative;color:var(--ivoire);
  background:radial-gradient(900px 500px at 12% 0%,rgba(235,208,142,.10),transparent 55%),var(--acier-sombre);
}
.methode::before,.methode::after{
  content:"";position:absolute;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,#8A5A12 15%,#F2DFA6 50%,#8A5A12 85%,transparent);
}
.methode::before{top:0}
.methode::after{bottom:0}
.methode .eyebrow{color:var(--nectar)}
.methode h2{color:var(--ivoire)}
.methode .lede{color:color-mix(in srgb,var(--ivoire) 78%,transparent)}
.piliers{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:2.8rem;
  border:1px solid color-mix(in srgb,var(--nectar) 22%,transparent);
  background:color-mix(in srgb,#000 12%,transparent);
}
.pilier{
  position:relative;overflow:hidden;padding:2.4rem 2rem;
  border-right:1px solid color-mix(in srgb,var(--nectar) 22%,transparent);
}
.pilier:last-child{border-right:none}
.pilier::before{
  content:"";position:absolute;top:-40%;bottom:-40%;left:-80%;width:36%;
  background:linear-gradient(105deg,transparent,rgba(242,223,166,.2) 50%,transparent);
  transform:skewX(-18deg);transition:left .9s ease;pointer-events:none;
}
.pilier:hover::before{left:150%}
.pilier .num{
  font-family:var(--font-display);font-size:2.4rem;font-style:italic;line-height:1;
  background:var(--or-metal-clair);background-size:200% auto;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
}
.pilier h3{margin:1rem 0 .7rem;color:var(--ivoire)}
.pilier p{font-size:.92rem;color:color-mix(in srgb,var(--ivoire) 72%,transparent)}
.pilier .resultat{
  margin-top:1.2rem;padding-top:1.1rem;font-size:.88rem;font-style:italic;
  border-top:1px solid color-mix(in srgb,var(--nectar) 25%,transparent);
  color:var(--nectar);font-family:var(--font-display);font-size:1.05rem;
}

/* ---------- bande immersive ---------- */
.bande-image{
  position:relative;overflow:hidden;padding:clamp(6rem,12vw,9rem) 0;
  background:linear-gradient(rgba(27,25,20,.55),rgba(27,25,20,.55)),linear-gradient(160deg,#3A352C,#211E19);
  background-size:cover;background-position:center;color:var(--ivoire);text-align:center;
}
.bande-image::before,.bande-image::after{
  content:"";position:absolute;left:0;right:0;height:2px;z-index:2;
  background:linear-gradient(90deg,transparent,#8A5A12 15%,#F2DFA6 50%,#8A5A12 85%,transparent);
}
.bande-image::before{top:0}
.bande-image::after{bottom:0}
.bande-image p{
  font-family:var(--font-display);font-style:italic;
  font-size:clamp(1.4rem,3vw,2.1rem);max-width:28ch;margin:0 auto;position:relative;z-index:1;
}

/* ---------- solutions / pour qui / intergénérationnel ---------- */
.grille-2{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem;margin-top:2.4rem}
.grille-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem;margin-top:2.4rem}
.interg .cle{font-size:.95rem;color:var(--anthracite-2)}
.interg .cles-liste{
  columns:2;column-gap:3rem;margin:1.6rem 0;list-style:none;font-size:.94rem;color:var(--anthracite-2);
}
.interg .cles-liste li{padding:.3rem 0 .3rem 1.5rem;position:relative;break-inside:avoid}
.interg .cles-liste li::before{
  content:"";position:absolute;left:0;top:.85em;width:8px;height:9px;background:var(--or-metal-clair);
  clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
}
.barometre{
  margin-top:2.4rem;padding:2.4rem 2.2rem;position:relative;overflow:hidden;
  background:var(--acier-sombre);color:var(--ivoire);border-radius:var(--radius);
}
.barometre::before{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,#8A5A12 15%,#F2DFA6 50%,#8A5A12 85%,transparent);
}
.barometre h3{color:var(--ivoire);font-size:1.6rem}
.barometre p{color:color-mix(in srgb,var(--ivoire) 78%,transparent);font-size:.96rem;max-width:62ch}
.barometre .chiffre{
  font-family:var(--font-display);font-size:3rem;font-style:italic;line-height:1;
  background:var(--or-metal-clair);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}

/* ---------- fondatrices ---------- */
.fondatrices{background:var(--parchemin)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem;margin-top:2.4rem}
.portrait{
  background:linear-gradient(165deg,#FDFBF5 0%,#F5EEDD 100%);
  border:1px solid color-mix(in srgb,var(--ambre) 25%,transparent);
  border-radius:var(--radius);padding:2.3rem 2rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.portrait .photo{
  width:108px;height:124px;position:relative;overflow:hidden;
  clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
  background:var(--or-metal);display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-size:2.3rem;color:#FFF7E0;
  text-shadow:0 1px 2px rgba(110,68,8,.6);margin-bottom:1.4rem;
}
.portrait .photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.portrait .role{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ambre-fonce);font-weight:600;margin:.4rem 0 1rem}
.portrait p{font-size:.93rem;color:var(--anthracite-2)}

/* ---------- preuves ---------- */
.preuves-liste{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem;margin-top:2.4rem}

/* ---------- FAQ ---------- */
.faq h3{
  font-size:1rem;font-family:var(--font-body);letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--ambre-fonce);margin:2.6rem 0 .4rem;
}
.faq h3:first-of-type{margin-top:2rem}
.faq-list{max-width:820px;margin:0 auto}
details{border-bottom:1px solid color-mix(in srgb,var(--ambre) 25%,transparent)}
details summary{
  cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;
  gap:2rem;padding:1.2rem 0;font-family:var(--font-display);font-size:1.2rem;font-weight:500;
  transition:color var(--transition);
}
details summary::-webkit-details-marker{display:none}
details summary:hover{color:var(--ambre-fonce)}
details summary::after{
  content:"+";font-family:var(--font-body);font-size:1.35rem;font-weight:300;color:var(--ambre);
  transition:transform var(--transition);flex:none;
}
details[open] summary::after{transform:rotate(45deg)}
details .rep{padding:0 0 1.4rem;font-size:.94rem;color:var(--anthracite-2);max-width:64ch}

/* ---------- CTA final ---------- */
.cta-final{
  position:relative;overflow:hidden;text-align:center;color:var(--ivoire);
  background:radial-gradient(800px 420px at 50% 120%,rgba(235,208,142,.16),transparent 60%),var(--acier-sombre);
}
.cta-final::before{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,#8A5A12 15%,#F2DFA6 50%,#8A5A12 85%,transparent);
}
.cta-final h2{color:var(--ivoire);max-width:24ch;margin:1rem auto 1.2rem}
.cta-final .lede{margin:0 auto 2.2rem;color:color-mix(in srgb,var(--ivoire) 78%,transparent)}
.cta-final .coordonnees-inline{
  margin-top:2.4rem;font-size:.9rem;color:color-mix(in srgb,var(--ivoire) 72%,transparent);
  display:flex;gap:.6rem 2.2rem;flex-wrap:wrap;justify-content:center;
}
.cta-final .coordonnees-inline a{color:var(--nectar);border-bottom:1px solid transparent}
.cta-final .coordonnees-inline a:hover{border-color:var(--nectar)}

/* ---------- formulaire ---------- */
.contact .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:4rem;align-items:start}
.contact form{display:grid;gap:1.1rem;grid-template-columns:1fr 1fr}
.champ{display:flex;flex-direction:column;gap:.35rem}
.champ.large{grid-column:1 / -1}
.contact label{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--anthracite-2)}
.contact label .fac{font-weight:400;text-transform:none;letter-spacing:0;color:var(--lichen)}
.contact input,.contact textarea,.contact select{
  width:100%;padding:.85rem 1rem;font-family:var(--font-body);font-size:.95rem;
  background:var(--blanc-doux);border:1px solid color-mix(in srgb,var(--anthracite) 18%,transparent);
  border-radius:var(--radius);color:var(--anthracite);
  transition:border-color var(--transition),box-shadow var(--transition);
}
.contact input:focus,.contact textarea:focus,.contact select:focus{
  outline:none;border-color:var(--ambre);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--ambre) 18%,transparent);
}
.aide{font-size:.8rem;color:var(--lichen)}
.err{display:none;font-size:.82rem;color:var(--erreur);font-weight:600}
.champ.invalide .err{display:block}
.champ.invalide input,.champ.invalide select,.champ.invalide textarea{border-color:var(--erreur)}
.consentement{grid-column:1 / -1;display:flex;gap:.8rem;align-items:flex-start;font-size:.85rem;color:var(--anthracite-2)}
.consentement input{width:auto;margin-top:.3rem;accent-color:var(--ambre)}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden} /* antispam honeypot */
.confirmation{
  display:none;grid-column:1 / -1;padding:1.4rem 1.6rem;border-radius:var(--radius);
  background:color-mix(in srgb,var(--ok) 12%,var(--blanc-doux));border:1px solid var(--ok);
  color:var(--ok);font-weight:500;font-size:.95rem;
}
.coordonnees p{margin-bottom:1.1rem;font-size:.95rem;color:var(--anthracite-2)}
.coordonnees strong{color:var(--anthracite)}
.coordonnees a{color:var(--ambre-fonce);border-bottom:1px solid transparent}
.coordonnees a:hover{border-color:var(--ambre-fonce)}

/* ---------- footer ---------- */
.apisens-footer{
  position:relative;background:var(--anthracite);color:color-mix(in srgb,var(--ivoire) 62%,transparent);
  padding:3rem 0;font-size:.85rem;
}
.apisens-footer::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,#D9A84E 30%,#F2DFA6 50%,#D9A84E 70%,transparent);opacity:.6;
}
.apisens-footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1.5rem;align-items:center}
.apisens-footer nav{display:flex;gap:1.8rem;flex-wrap:wrap}
.apisens-footer a{border-bottom:1px solid transparent;transition:border-color var(--transition)}
.apisens-footer a:hover{border-color:var(--nectar);color:var(--ivoire)}
/* Le paragraphe contenant le logo et le copyright peut se scinder sur les
   écrans étroits, afin de ne jamais rogner ni comprimer le logo. */
.apisens-footer p{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
/* Le logo APISENS en blanc dans le pied de page est affiché en entier :
   hauteur généreuse, largeur auto, aucun rognage, ratio préservé. */
.footer-logo{height:56px;width:auto;max-width:100%;display:block;object-fit:contain;opacity:1}

/* ---------- cartes solutions avec visuel ---------- */
.carte-visuel{padding:0;overflow:hidden}
.carte-visuel .carte-media{
  position:relative;aspect-ratio:16/10;overflow:hidden;flex:none;
  background:linear-gradient(160deg,#EBD08E,#B97E24 60%,#7A4E0E);
}
.carte-visuel .carte-media img{
  width:100%;height:100%;object-fit:cover;
  transition:transform 5s cubic-bezier(.22,.61,.36,1);
}
.carte-visuel:hover .carte-media img{transform:scale(1.045)}
.carte-visuel .carte-media::after{
  content:"";position:absolute;bottom:0;left:0;right:0;height:2px;z-index:2;
  background:linear-gradient(90deg,transparent,#8A5A12 15%,#F2DFA6 50%,#8A5A12 85%,transparent);
  opacity:.8;
}
.carte-visuel .carte-corps{padding:2rem 1.8rem;display:flex;flex-direction:column;flex:1}
.carte-visuel h3{margin-bottom:.6rem;font-size:1.35rem}
.carte-visuel p{font-size:.93rem;color:var(--anthracite-2)}
.carte-visuel ul{list-style:none;margin-top:.8rem;font-size:.88rem;color:var(--anthracite-2)}
.carte-visuel li{padding:.22rem 0 .22rem 1.4rem;position:relative}
.carte-visuel li::before{
  content:"";position:absolute;left:0;top:.8em;width:7px;height:8px;background:var(--or-metal-clair);
  clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
}
.carte-visuel .lien-fleche{margin-top:auto;padding-top:1.2rem}

/* ---------- APISCAN : intro à deux colonnes avec visuel ---------- */
.apiscan-intro{
  display:grid;grid-template-columns:1.1fr .9fr;gap:3.2rem;align-items:center;margin-top:1.4rem;
}
.apiscan-intro .lede{margin:0}
.apiscan-visuel{
  position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:var(--radius);
  background:linear-gradient(160deg,#EBD08E,#B97E24 60%,#7A4E0E);
  box-shadow:0 30px 60px -30px rgba(122,78,14,.45),inset 0 1px 0 rgba(255,255,255,.5);
}
.apiscan-visuel::before{
  content:"";position:absolute;inset:10px;z-index:2;pointer-events:none;
  border:1px solid color-mix(in srgb,var(--nectar) 65%,transparent);
}
.apiscan-visuel::after{
  content:"";position:absolute;top:-30%;left:-30%;width:70%;height:70%;z-index:2;pointer-events:none;
  background:radial-gradient(closest-side,rgba(255,255,255,.25),transparent 70%);
}
.apiscan-visuel img{width:100%;height:100%;object-fit:cover;display:block}

/* ---------- bande immersive : fond photo ---------- */
.bande-image{
  background:
    linear-gradient(rgba(27,25,20,.62),rgba(27,25,20,.74)),
    url('assets/img/ambiance.jpg') center / cover no-repeat,
    linear-gradient(160deg,#3A352C,#211E19);
}

/* ---------- justification des contenus (v1.4.0) ----------
   Tous les textes courants sont justifiés : le bord droit s'aligne sur les
   marges internes des blocs, qui servent de repères visuels. La césure
   automatique (hyphens) évite les « rivières » de blancs sur colonnes
   étroites — l'attribut lang="fr" de WordPress pilote le dictionnaire. */
.lede,
.hero .lede,
.carte p,.carte li,
.carte-visuel p,.carte-visuel li,
.niveau li,
.apiscan-intro .lede,
.pilier p,.pilier .resultat,
.interg .lede,.cle,.cles-liste li,
.barometre p,
.portrait p,
.faq .rep,
.preuves-liste p,
.coordonnees p{
  text-align:justify;
  text-justify:inter-word;
  hyphens:auto;-webkit-hyphens:auto;
}
/* Exceptions volontairement centrées */
.bande-image p{text-align:center}
.cta-final .lede{text-align:center}

/* ---------- majuscule initiale des puces (v1.4.0) ----------
   Chaque élément de liste commence par une capitale. Le texte source a été
   capitalisé dans le gabarit ; cette règle garantit le rendu même pour des
   contenus ajoutés plus tard en minuscules. */
.carte li::first-letter,
.carte-visuel li::first-letter,
.niveau li::first-letter,
.cles-liste li::first-letter{
  text-transform:uppercase;
}

/* ---------- liens catalogue (carte Alvéoles) ---------- */
.liens-catalogue{margin-top:auto;padding-top:1.2rem;display:flex;flex-direction:column;gap:.15rem}
.liens-catalogue .lien-fleche{margin-top:.2rem;padding-top:0}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .situations-grid,.grille-3,.preuves-liste{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
  .hero-layout,.apiscan-niveaux,.apiscan-intro,.grille-2,.duo,.contact .wrap{grid-template-columns:1fr}
  .apiscan-intro{gap:2rem}
  .situations-grid,.grille-3,.preuves-liste{grid-template-columns:1fr}
  .piliers{grid-template-columns:1fr}
  .pilier{border-right:none;border-bottom:1px solid color-mix(in srgb,var(--nectar) 22%,transparent)}
  .pilier:last-child{border-bottom:none}
  .cadre-photo{max-height:400px;aspect-ratio:4/3}
  .contact form{grid-template-columns:1fr}
  .interg .cles-liste{columns:1}
  /* Sur mobile, le logo peut occuper un peu moins de place pour laisser
     le burger bien visible en haut à droite. */
  .logo-img{height:56px}
  .nav{min-height:80px;padding:.7rem 0}
  /* Footer : passage en colonne pour une lecture confortable. */
  .apisens-footer .wrap{flex-direction:column;align-items:flex-start;text-align:left}
  .apisens-footer nav{gap:1rem 1.6rem}

  /* Bande de réassurance : en mobile, chaque mention passe sur sa propre
     ligne, parfaitement centrée dans la largeur de l'écran. */
  .trust ul{flex-direction:column;align-items:center;gap:.55rem}
  .trust li{text-align:center;width:100%}
}

/* Bascule menu burger : dès que le menu horizontal risque de ne plus tenir
   sur une seule ligne (logo + 6 rubriques + CTA), on passe au menu mobile
   plutôt que de laisser le menu se replier sur deux lignes.
   Les règles critiques sont marquées !important pour ne jamais être
   court-circuitées par le thème parent Kadence ou par Elementor. */
@media (max-width:1180px){
  .burger{display:flex !important}

  /* CORRECTIF v1.4.0 — le backdrop-filter du header fait de lui le
     « containing block » des descendants en position:fixed : le panneau
     se calait sur le header (96px) au lieu du viewport et restait
     invisible. On neutralise le filtre dès que le menu est ouvert ;
     apisens.js déplace en outre le panneau dans <body> (portail),
     ce qui le met définitivement à l'abri de tout ancêtre à
     backdrop-filter/transform/filter, y compris côté Kadence. */
  body.menu-ouvert .apisens-header{
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    background:var(--ivoire);
  }

  /* Panneau du menu mobile : couvre tout le viewport sous le header,
     fond opaque garanti, stacking context élevé — il passe PAR-DESSUS
     le premier bloc de la page. */
  .nav-menu{
    position:fixed !important;
    top:var(--header-hauteur,80px) !important;
    left:0 !important;right:0 !important;bottom:0 !important;
    height:auto !important;max-height:none !important;
    background:var(--ivoire) !important;
    overflow-y:auto;
    padding:1.5rem 6vw 3rem;
    display:none;
    z-index:2147483000 !important; /* au-dessus de tout, y compris widgets tiers */
    -webkit-overflow-scrolling:touch;
  }
  body.menu-ouvert .nav-menu{display:block !important;visibility:visible !important;opacity:1 !important}
  body.menu-ouvert{overflow:hidden}

  .nav-links{flex-direction:column;align-items:stretch;gap:.2rem;width:100%}
  .nav-item{width:100%}
  .nav-item > a,.nav-item > button{width:100%;justify-content:space-between;padding:1rem .4rem;font-size:1.05rem}
  .sous-menu{position:static;min-width:0;box-shadow:none;border:none;background:transparent;padding:.2rem 0 .6rem 1rem}
  .sous-menu::before{display:none}
  .sous-menu a{font-size:.95rem;padding:.7rem .8rem}
  .nav-cta{margin-top:1.4rem;width:100%;justify-content:center;padding:1rem 1.7rem}
}

@media (min-width:1181px){
  .nav-menu{display:flex !important;align-items:center;gap:1.2rem}
  .burger{display:none !important}
}

/* ================= PAGES LÉGALES (Mentions légales / Politique de confidentialité) =================
   Gabarits template-mentions-legales.php et template-politique-confidentialite.php.
   Utilise l'en-tête et le pied de page natifs de Kadence (pages secondaires),
   avec une mise en page texte cohérente avec la charte « Alvéole d'Or ». */
.page-legale{background:var(--ivoire);padding:clamp(3.5rem,7vw,5.5rem) 0 clamp(4.5rem,9vw,7rem)}
.page-legale .wrap-legale{max-width:760px;margin:0 auto;padding:0 6vw}
.page-legale .eyebrow{margin-bottom:.6rem}
.page-legale h1{font-size:clamp(2rem,4.2vw,3rem);margin-bottom:.9rem;color:var(--anthracite)}
.page-legale .maj{color:var(--anthracite-2);font-size:.9rem;margin-bottom:2.6rem}
.page-legale h2{font-size:1.35rem;margin:2.6rem 0 1rem;padding-top:1.6rem;border-top:1px solid color-mix(in srgb,var(--anthracite) 10%,transparent)}
.page-legale h2:first-of-type{border-top:none;padding-top:0;margin-top:0}
.page-legale h3{font-size:1.05rem;margin:1.6rem 0 .6rem;color:var(--anthracite-2)}
.page-legale p{color:var(--anthracite-2);line-height:1.75;margin-bottom:1rem}
.page-legale ul{list-style:none;margin:0 0 1.2rem;padding:0}
.page-legale li{position:relative;padding-left:1.3rem;color:var(--anthracite-2);line-height:1.7;margin-bottom:.5rem}
.page-legale li::before{content:"";position:absolute;left:0;top:.65em;width:6px;height:6px;background:var(--ambre);border-radius:1px;transform:rotate(45deg)}
.page-legale a{color:var(--ambre-fonce);border-bottom:1px solid color-mix(in srgb,var(--ambre) 45%,transparent);text-decoration:none}
.page-legale a:hover{border-color:var(--ambre-fonce)}
.page-legale strong{color:var(--anthracite);font-weight:600}
.page-legale .coord-grille{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin:1.2rem 0 1.6rem}
.page-legale .coord-carte{background:var(--blanc-doux);border:1px solid color-mix(in srgb,var(--ambre) 22%,transparent);border-radius:var(--radius);padding:1.3rem 1.4rem}
.page-legale .coord-carte p{margin-bottom:.35rem;font-size:.93rem}
.page-legale .coord-carte p:last-child{margin-bottom:0}
.page-legale .coord-carte strong{display:block;margin-bottom:.4rem;font-family:var(--font-display);font-size:1.05rem;letter-spacing:.01em}
.page-legale .retour{display:inline-block;margin-bottom:2rem;font-size:.9rem}
@media (max-width:700px){
  .page-legale .coord-grille{grid-template-columns:1fr}
}