/*
Theme Name: Stalunea
Theme URI: https://stalunea.fr
Author: Stalunea
Author URI: https://stalunea.fr
Description: Thème WordPress sur-mesure de Stalunea, agence web & marketing. Direction artistique premium : fond quasi-noir, dégradé signature violet→jaune, typographie Archivo Expanded + Inter, univers étoilé et écran de chargement animé. Conçu pour la performance et la conversion (SEO/GEO), avec réalisations, offres et certifications gérées en contenus natifs. Compatible Elementor, Rank Math, Contact Form 7 et réservation Cal.com.
Version: 1.2.0
Requires at least: 6.4
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: stalunea
*/

/* =============================================================
   STALUNEA — Feuille de style partagée
   Direction artistique validée (fond quasi-noir, dégradé étoile).
   Organisée par sections. Une seule source de vérité pour toutes
   les pages : ne modifier la DA qu'ici.
   ============================================================= */

/* ---------- Tokens / variables ---------- */
:root{
  --ink:#0a0a0b;          /* fond principal */
  --panel:#101013;        /* cartes / panneaux */
  --panel-2:#151519;      /* survol / élévation */
  --line:rgba(255,255,255,.09);
  --line-strong:rgba(255,255,255,.16);
  --white:#ffffff;
  --muted:#a2a2ad;        /* texte secondaire */
  --muted-dim:#6f6f7a;    /* texte atténué */
  --violet:#a494ff;
  --yellow:#fff083;
  --grad:linear-gradient(115deg,#a494ff 0%,#c9b8ff 40%,#fff083 100%);
  --grad-soft:linear-gradient(115deg,#a494ff,#fff083);
  --radius:20px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --maxw:1160px;
}

/* ---------- Reset ---------- */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--ink);
  color:var(--white);
  font-family:"Inter",system-ui,sans-serif;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img,svg,video{max-width:100%;display:block}
::selection{background:rgba(164,148,255,.35)}
:focus-visible{outline:2px solid var(--violet);outline-offset:3px;border-radius:6px}
.skip-link{position:absolute;left:-999px;top:0;z-index:200;background:var(--panel);
  color:var(--white);padding:12px 18px;border-radius:10px;border:1px solid var(--line-strong)}
.skip-link:focus{left:16px;top:16px}

.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:28px}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- Champ d'étoiles (limité aux HERO uniquement) ---------- */
/* Placé DANS chaque .hero / .page-hero. Le reste du site reste noir pur. */
.stars{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.55;overflow:hidden}
.stars span{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;opacity:.35;
  animation:twinkle 4s var(--ease) infinite}
@keyframes twinkle{0%,100%{opacity:.12;transform:scale(.7)}50%{opacity:.7;transform:scale(1)}}

/* ---------- Typographie titres ---------- */
h1,h2,h3,h4{font-family:"Archivo",sans-serif;font-stretch:125%;letter-spacing:-.02em}
h1{font-weight:800;font-size:clamp(2.7rem,7vw,5.1rem);line-height:.98;letter-spacing:-.03em}
h2{font-weight:700;font-size:clamp(2rem,4.6vw,3.1rem);line-height:1.02;letter-spacing:-.025em}
h3{font-weight:600;font-size:1.35rem;letter-spacing:-.01em}
h4{font-weight:600;font-size:1.25rem;letter-spacing:-.01em}

/* ---------- Boutons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:550;font-size:14.5px;
  padding:11px 20px;border-radius:100px;cursor:pointer;border:0;
  transition:transform .25s var(--ease),box-shadow .3s,background .3s,border-color .3s}
.btn-primary{background:var(--grad-soft);color:#12100a;
  box-shadow:0 0 0 1px rgba(255,255,255,.06),0 8px 30px -12px rgba(164,148,255,.7)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 0 0 1px rgba(255,255,255,.1),0 14px 40px -12px rgba(164,148,255,.85)}
.btn-ghost{background:transparent;color:var(--white);border:1px solid var(--line-strong)}
.btn-ghost:hover{border-color:var(--white);transform:translateY(-2px)}
.btn-book{border-color:#fff} /* CTA « Réserver un appel » : contour blanc */
.btn-lg{padding:15px 28px;font-size:15.5px}

/* ---------- En-tête / navigation ---------- */
header{position:sticky;top:0;z-index:50;backdrop-filter:blur(14px);
  background:rgba(10,10,11,.62);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:0}
.brand svg,.brand-logo{height:22px;width:auto;display:block}
.brand .logo-fill{fill:var(--white)}
nav.links{display:flex;gap:34px;align-items:center}
nav.links a{color:var(--muted);font-size:14.5px;font-weight:450;transition:color .25s;position:relative}
nav.links a:hover{color:var(--white)}
nav.links a[aria-current="page"]{color:var(--white)}
nav.links a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;
  border-radius:2px;background:var(--grad-soft)}
.nav-cta{display:flex;align-items:center;gap:14px}

/* Sous-menu déroulant (desktop) */
.nav-item{position:relative;display:flex;align-items:center}
.has-submenu > a{display:inline-flex;align-items:center;gap:5px}
.has-submenu > a .caret{transition:transform .25s var(--ease);font-size:10px;color:var(--muted-dim)}
.has-submenu:hover > a .caret,.has-submenu:focus-within > a .caret{transform:rotate(180deg)}
.submenu{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(-8px);
  min-width:230px;background:rgba(16,16,19,.96);backdrop-filter:blur(14px);border:1px solid var(--line-strong);
  border-radius:16px;padding:8px;display:flex;flex-direction:column;gap:2px;opacity:0;visibility:hidden;
  transition:opacity .25s var(--ease),transform .25s var(--ease),visibility .25s;
  box-shadow:0 20px 50px -20px rgba(0,0,0,.8);z-index:60}
.submenu::before{content:"";position:absolute;top:-14px;left:0;right:0;height:14px}
.has-submenu:hover .submenu,.has-submenu:focus-within .submenu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.submenu a{padding:11px 14px;border-radius:10px;color:var(--muted);font-size:14.5px;font-weight:450;
  transition:background .2s,color .2s}
.submenu a::after{display:none}
.submenu a:hover,.submenu a[aria-current="page"]{background:rgba(164,148,255,.10);color:var(--white)}

/* Bouton burger (mobile) */
.menu-toggle{display:none;width:44px;height:44px;border:1px solid var(--line-strong);border-radius:12px;
  background:transparent;cursor:pointer;position:relative}
.menu-toggle span{position:absolute;left:11px;right:11px;height:2px;background:var(--white);border-radius:2px;
  transition:transform .3s var(--ease),opacity .2s}
.menu-toggle span:nth-child(1){top:15px}
.menu-toggle span:nth-child(2){top:21px}
.menu-toggle span:nth-child(3){top:27px}
body.menu-open .menu-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg)}
body.menu-open .menu-toggle span:nth-child(2){opacity:0}
body.menu-open .menu-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* Tiroir mobile */
.mobile-menu{position:fixed;inset:72px 0 0;z-index:49;background:rgba(10,10,11,.97);backdrop-filter:blur(18px);
  padding:34px 28px;display:flex;flex-direction:column;gap:6px;transform:translateY(-12px);opacity:0;
  visibility:hidden;transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s}
body.menu-open .mobile-menu{opacity:1;visibility:visible;transform:none}
.mobile-menu a{font-family:"Archivo",sans-serif;font-stretch:125%;font-weight:600;font-size:1.5rem;
  color:var(--white);padding:14px 0;border-bottom:1px solid var(--line)}
.mobile-menu a.sub{font-size:1.1rem;font-weight:450;color:var(--muted);padding-left:16px}
.mobile-menu .btn{margin-top:24px;font-size:16px;padding:16px}

/* ---------- Hero page d'accueil ---------- */
.hero{position:relative;z-index:1;padding:96px 0 84px;text-align:center}
.hero .aura{position:absolute;top:-60px;left:50%;transform:translateX(-50%);
  width:760px;height:760px;max-width:120vw;border-radius:50%;pointer-events:none;z-index:-1;
  background:radial-gradient(circle,rgba(164,148,255,.28),rgba(255,240,131,.10) 42%,transparent 66%);
  filter:blur(10px);animation:breathe 9s ease-in-out infinite}
@keyframes breathe{0%,100%{opacity:.85;transform:translateX(-50%) scale(1)}50%{opacity:1;transform:translateX(-50%) scale(1.06)}}

.star-mark{width:66px;height:66px;margin:0 auto 30px;
  filter:drop-shadow(0 0 22px rgba(164,148,255,.55));animation:spin 26s linear infinite}
.star-mark svg,.star-mark img{width:100%;height:100%;display:block}
@keyframes spin{to{transform:rotate(360deg)}}

.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:13px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);border:1px solid var(--line);
  padding:7px 15px;border-radius:100px;margin-bottom:28px;background:rgba(255,255,255,.02)}
.eyebrow b{color:var(--white);font-weight:500}
.dot{width:6px;height:6px;border-radius:50%;background:var(--grad-soft)}

.hero h1{margin-bottom:26px}
.hero h1 .grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{max-width:600px;margin:0 auto 38px;color:var(--muted);font-size:clamp(1rem,2.2vw,1.18rem);line-height:1.6}
.hero-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* rangée d'accroches (remplace les faux chiffres) */
.stats{display:flex;justify-content:center;gap:56px;flex-wrap:wrap;margin-top:70px;
  padding-top:42px;border-top:1px solid var(--line)}
.stat{text-align:center}
.stat .n{font-family:"Archivo",sans-serif;font-stretch:125%;font-weight:600;font-size:1.7rem;letter-spacing:-.02em;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat .l{font-size:13.5px;color:var(--muted-dim);margin-top:6px;max-width:170px}

/* ---------- Hero page intérieure ---------- */
.page-hero{position:relative;z-index:1;padding:72px 0 40px;text-align:center}
.page-hero .aura{position:absolute;top:-120px;left:50%;transform:translateX(-50%);
  width:680px;height:680px;max-width:120vw;border-radius:50%;pointer-events:none;z-index:-1;
  background:radial-gradient(circle,rgba(164,148,255,.20),rgba(255,240,131,.07) 44%,transparent 66%);filter:blur(12px)}
.page-hero h1{font-size:clamp(2.4rem,6vw,4rem);margin:14px auto 22px;max-width:14ch}
.page-hero .sub{margin-bottom:0}
.breadcrumb{display:flex;gap:8px;justify-content:center;align-items:center;font-size:13px;color:var(--muted-dim);
  list-style:none;flex-wrap:wrap}
.breadcrumb a:hover{color:var(--white)}
.breadcrumb li::after{content:"/";margin-left:8px;color:var(--line-strong)}
.breadcrumb li:last-child::after{content:""}
.breadcrumb li[aria-current="page"]{color:var(--muted)}

/* ---------- Section de base ---------- */
section{position:relative;z-index:1}
.section{padding:72px 0}
.sec-head{max-width:640px;margin-bottom:52px}
.sec-head.center{margin-inline:auto;text-align:center}
.kicker{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--violet);font-weight:500;margin-bottom:14px}
.sec-head h2 .grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.sec-head p{color:var(--muted);margin-top:16px;font-size:1.05rem}

/* ---------- Grille de cartes ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cards.two{grid-template-columns:repeat(2,1fr)}
.card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:34px 30px 32px;overflow:hidden;transition:transform .35s var(--ease),border-color .35s,background .35s}
.card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;
  background:var(--grad-soft);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .35s}
.card:hover{transform:translateY(-6px);background:var(--panel-2)}
.card:hover::before{opacity:.7}
.card .ic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;margin-bottom:22px;
  background:rgba(164,148,255,.10);border:1px solid var(--line-strong)}
.card .ic svg{width:22px;height:22px;stroke:var(--violet);fill:none;stroke-width:1.6}
.card h3{margin-bottom:11px}
.card p{color:var(--muted);font-size:.97rem;line-height:1.6}
.card .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.tag{font-size:12px;color:var(--muted-dim);border:1px solid var(--line);padding:5px 11px;border-radius:100px}
.card-link{display:inline-flex;align-items:center;gap:7px;margin-top:22px;font-size:14px;font-weight:500;color:var(--violet)}
.card-link:hover{gap:11px}

/* ---------- Étapes / approche ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.step{position:relative;padding-top:30px;border-top:1px solid var(--line)}
.step .num{font-family:"Archivo",sans-serif;font-stretch:125%;font-size:1rem;font-weight:600;
  width:30px;height:30px;border-radius:50%;display:grid;place-items:center;margin-bottom:20px;
  color:#12100a;background:var(--grad-soft)}
.step h4{margin-bottom:9px}
.step p{color:var(--muted);font-size:.96rem}

/* ---------- Offres / formules (page Services) ---------- */
.offer{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:34px 30px;display:flex;flex-direction:column;overflow:hidden;transition:border-color .35s,background .35s}
.offer.featured{border-color:transparent}
.offer.featured::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;
  background:var(--grad-soft);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude}
.offer .badge{position:absolute;top:20px;right:20px;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;
  font-weight:600;color:#12100a;background:var(--grad-soft);padding:5px 12px;border-radius:100px}
.offer h3{margin-bottom:6px}
.offer .tagline{color:var(--muted);font-size:.95rem;font-style:italic;margin-bottom:6px}
.offer .price{color:var(--muted-dim);font-size:.9rem;margin:14px 0 20px}
.offer ul{list-style:none;display:flex;flex-direction:column;gap:11px;margin:6px 0 26px}
.offer li{position:relative;padding-left:28px;color:var(--muted);font-size:.95rem;line-height:1.5}
.offer li::before{content:"";position:absolute;left:0;top:3px;width:16px;height:16px;border-radius:50%;
  background:rgba(164,148,255,.14);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23a494ff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center}
.offer .benefit{margin-top:auto;padding:14px 16px;border-radius:12px;background:rgba(164,148,255,.06);
  border:1px solid var(--line);color:var(--muted);font-size:.9rem}
.offer .btn{margin-top:24px}

/* ---------- Tableau comparatif ---------- */
.table-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);-webkit-overflow-scrolling:touch}
table.compare{width:100%;border-collapse:collapse;min-width:640px;font-size:.94rem}
table.compare th,table.compare td{padding:16px 20px;text-align:left;border-bottom:1px solid var(--line)}
table.compare thead th{font-family:"Archivo",sans-serif;font-stretch:125%;font-weight:600;font-size:.95rem;
  background:var(--panel-2);position:sticky;top:0}
table.compare tbody th{font-weight:500;color:var(--white)}
table.compare td{color:var(--muted);text-align:center}
table.compare td:first-child,table.compare th:first-child{text-align:left}
table.compare tr:last-child td,table.compare tr:last-child th{border-bottom:0}
table.compare .yes{color:var(--violet);font-weight:600}
table.compare .no{color:var(--muted-dim)}
table.compare .col-featured{color:var(--white)}

/* ---------- Grille de secteurs ---------- */
.sectors{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.sector{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:20px 22px;
  transition:border-color .3s,background .3s}
.sector:hover{border-color:var(--line-strong);background:var(--panel-2)}
.sector b{display:block;font-family:"Archivo",sans-serif;font-stretch:125%;font-weight:600;margin-bottom:5px}
.sector span{color:var(--muted);font-size:.9rem}
.sector .price-tag{display:block;margin-top:9px;font-weight:600;font-size:.85rem;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- FAQ (accordéon) ---------- */
.faq{max-width:820px;margin-inline:auto;display:flex;flex-direction:column;gap:12px}
.faq details{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;
  transition:border-color .3s}
.faq details[open]{border-color:var(--line-strong)}
.faq summary{cursor:pointer;list-style:none;padding:20px 24px;font-family:"Archivo",sans-serif;font-stretch:125%;
  font-weight:600;font-size:1.05rem;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.5rem;color:var(--violet);transition:transform .3s;line-height:1}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 24px 22px;color:var(--muted);font-size:.97rem;line-height:1.6}

/* ---------- Réalisations ---------- */
.works{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.work{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;transition:transform .35s var(--ease),border-color .35s}
.work:hover{transform:translateY(-6px);border-color:var(--line-strong)}
.work .thumb{aspect-ratio:16/10;background:
  radial-gradient(120% 120% at 30% 20%,rgba(164,148,255,.16),transparent 55%),
  radial-gradient(120% 120% at 80% 90%,rgba(255,240,131,.10),transparent 55%),var(--panel-2);
  display:grid;place-items:center;border-bottom:1px solid var(--line);color:var(--muted-dim);font-size:.85rem;
  position:relative;overflow:hidden}
.work .thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.work .body{padding:26px 28px 28px}
.work .meta{display:flex;gap:10px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.work .meta .tag{background:rgba(164,148,255,.08)}
.work .meta .date{margin-left:auto;color:var(--muted-dim);font-size:12.5px;white-space:nowrap}
.work h3{margin-bottom:8px}
.work p{color:var(--muted);font-size:.95rem}
.work .kpis{display:flex;gap:24px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.work .kpi .v{font-family:"Archivo",sans-serif;font-stretch:125%;font-weight:600;font-size:1.3rem;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.work .kpi .k{font-size:12px;color:var(--muted-dim);margin-top:2px}
.work.placeholder{border-style:dashed}
.work.placeholder .thumb{color:var(--muted-dim)}

/* ---------- Contact ---------- */
.contact-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:start}
.form{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:34px 32px}
.field{margin-bottom:20px}
.field label{display:block;font-size:14px;font-weight:500;margin-bottom:8px}
.field label .req{color:var(--violet)}
.field input,.field select,.field textarea{width:100%;background:var(--ink);border:1px solid var(--line-strong);
  border-radius:12px;padding:13px 15px;color:var(--white);font-family:inherit;font-size:15px;
  transition:border-color .25s,box-shadow .25s}
.field textarea{resize:vertical;min-height:130px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--violet);
  box-shadow:0 0 0 3px rgba(164,148,255,.16)}
.field input::placeholder,.field textarea::placeholder{color:var(--muted-dim)}
.field .error{display:none;color:#ff9d9d;font-size:12.5px;margin-top:6px}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:#ff9d9d}
.field.invalid .error{display:block}
/* Réservation d'appel : créneaux */
.booking{border:1px solid var(--line-strong);border-radius:14px;padding:20px 20px 22px;margin-bottom:22px;
  background:rgba(164,148,255,.04)}
.booking > .lab{font-family:"Archivo",sans-serif;font-stretch:125%;font-weight:600;font-size:1.05rem;margin-bottom:4px}
.booking > .hint{color:var(--muted);font-size:.9rem;margin-bottom:16px}
.slots{display:flex;flex-wrap:wrap;gap:10px;border:0;padding:0;margin:0}
.slots legend{color:var(--muted-dim);font-size:12.5px;margin-bottom:10px}
.slot-chip input{position:absolute;opacity:0;width:0;height:0}
.slot-chip span{display:inline-flex;padding:10px 16px;border:1px solid var(--line-strong);border-radius:100px;
  font-size:14px;color:var(--muted);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.slot-chip span:hover{border-color:var(--white);color:var(--white)}
.slot-chip input:checked + span{background:var(--grad-soft);color:#12100a;border-color:transparent;font-weight:600}
.slot-chip input:focus-visible + span{outline:2px solid var(--violet);outline-offset:2px}

.form .consent{display:flex;gap:12px;align-items:flex-start;font-size:13.5px;color:var(--muted)}
.form .consent input{width:18px;height:18px;margin-top:2px;flex:none;accent-color:var(--violet)}
.form .form-note{font-size:12.5px;color:var(--muted-dim);margin-top:16px}
.form-success{display:none;padding:16px 18px;border-radius:12px;background:rgba(164,148,255,.10);
  border:1px solid var(--line-strong);color:var(--white);font-size:.95rem;margin-bottom:22px}
.form-success.show{display:block}

/* ---- Contact Form 7 : adopte le style .form ---- */
.form .wpcf7-form-control-wrap{display:block}
.form .wpcf7-not-valid-tip{color:#ff9d9d;font-size:12.5px;margin-top:6px}
.form input.wpcf7-not-valid,.form select.wpcf7-not-valid,.form textarea.wpcf7-not-valid{border-color:#ff9d9d}
.form .wpcf7-submit{width:100%;margin-top:4px}
.form .wpcf7-spinner{display:block;margin:14px auto 0}
/* Consentement (tag [acceptance]) */
.form .consent .wpcf7-form-control-wrap{display:inline}
.form .consent .wpcf7-acceptance .wpcf7-list-item{margin:0}
.form .consent .wpcf7-list-item label{display:flex;gap:12px;align-items:flex-start}
.form .consent .wpcf7-list-item input{width:18px;height:18px;margin-top:2px;flex:none;accent-color:var(--violet)}
.form .consent .wpcf7-list-item-label{font-size:13.5px;color:var(--muted)}
.form .consent .wpcf7-list-item-label a{color:var(--white);text-decoration:underline}
/* Bandeau de réponse (succès / erreur) — forcé à la charte Stalunea.
   Préfixe .contact-form-col = spécificité > au CSS par défaut de CF7 (vert/jaune). */
.contact-form-col .wpcf7-response-output,
.contact-form-col .wpcf7 form.sent .wpcf7-response-output,
.contact-form-col .wpcf7 form.init .wpcf7-response-output{
  margin:26px 0 0;padding:15px 20px;border-radius:12px;font-size:.95rem;font-weight:500;line-height:1.45;
  border:1px solid var(--violet);background:rgba(164,148,255,.12);color:var(--white)}
.contact-form-col .wpcf7 form.invalid .wpcf7-response-output,
.contact-form-col .wpcf7 form.unaccepted .wpcf7-response-output,
.contact-form-col .wpcf7 form.payment-required .wpcf7-response-output,
.contact-form-col .wpcf7 form.spam .wpcf7-response-output,
.contact-form-col .wpcf7 form.aborted .wpcf7-response-output,
.contact-form-col .wpcf7 form.failed .wpcf7-response-output{
  border-color:rgba(255,157,157,.55);background:rgba(255,157,157,.10);color:#ffd2d2}

.contact-aside{display:flex;flex-direction:column;gap:16px}
.info-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px 24px}
.info-card .ic{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;margin-bottom:14px;
  background:rgba(164,148,255,.10);border:1px solid var(--line-strong)}
.info-card .ic svg{width:19px;height:19px;stroke:var(--violet);fill:none;stroke-width:1.6}
.info-card .lab{font-size:12.5px;color:var(--muted-dim);text-transform:uppercase;letter-spacing:.1em;margin-bottom:5px}
.info-card a,.info-card p{font-size:1.02rem;color:var(--white)}

/* ---- Réservation d'appel (embed Cal.com) ---- */
#call{scroll-margin-top:96px} /* décalage sous le header sticky pour l'ancre #call */
.booking-section .booking-head{max-width:720px;margin:0 auto 34px;text-align:center}
.booking-section .booking-head .kicker{justify-content:center}
.cal-embed{min-height:640px;width:100%;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden}
.cal-consent-fallback{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:18px;min-height:640px;padding:40px 24px;text-align:center}
.cal-consent-fallback p{max-width:460px;color:var(--muted);margin:0}
.cal-consent-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center}
.cal-consent-actions .cmplz-manage-consent{background:none;border:0;color:var(--violet);
  text-decoration:underline;cursor:pointer;font:inherit;padding:0}

/* ---- Certifications Google Ads (badges) ---- */
.cert-band{padding:46px 0;text-align:center}
.cert-lead{font-family:"Archivo",sans-serif;font-stretch:125%;font-weight:700;font-size:1.15rem;
  margin-bottom:30px;color:var(--white)}
.cert-badges{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}
.cert-badge{display:flex;align-items:center;gap:16px;background:var(--panel);border:1px solid var(--line);
  border-radius:16px;padding:16px 24px}
.cert-medal{width:38px;height:38px;flex:none}
.cert-txt{display:flex;flex-direction:column;gap:4px;text-align:left;line-height:1.25}
.cert-txt b{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-dim);font-weight:600}
.cert-txt > span{font-family:"Archivo",sans-serif;font-stretch:110%;font-weight:700;font-size:.98rem;color:var(--white)}
/* Variante footer : compacte, alignée à gauche */
.foot-certs{margin:26px 0 22px;border-top:1px solid var(--line);padding-top:22px}
.cert-badges.cert-footer{justify-content:flex-start;gap:12px}
.cert-footer .cert-badge{gap:12px;padding:10px 14px;border-radius:12px;background:transparent}
.cert-footer .cert-medal{width:26px;height:26px}
.cert-footer .cert-txt b{font-size:10px}
.cert-footer .cert-txt > span{font-size:.86rem}
.info-card a:hover{color:var(--violet)}

/* ---------- Bloc CTA ---------- */
.cta-box{position:relative;overflow:hidden;border:1px solid var(--line-strong);border-radius:28px;
  padding:78px 40px;text-align:center;background:
    radial-gradient(120% 140% at 50% -20%,rgba(164,148,255,.22),transparent 55%),
    radial-gradient(120% 140% at 50% 120%,rgba(255,240,131,.14),transparent 55%),
    var(--panel)}
.cta-box h2{margin-bottom:18px}
.cta-box h2 .grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.cta-box p{color:var(--muted);max-width:460px;margin:0 auto 34px}

/* ---------- Contenu riche (pages légales) ---------- */
.prose{max-width:760px;margin-inline:auto}
.prose h2{font-size:1.7rem;margin:44px 0 16px}
.prose h3{margin:28px 0 10px}
.prose p,.prose li{color:var(--muted);margin-bottom:14px;line-height:1.7}
.prose ul{padding-left:22px;margin-bottom:14px}
.prose a{color:var(--violet);text-decoration:underline;text-underline-offset:3px}
.prose strong{color:var(--white);font-weight:600}

/* Encadré « à compléter » — repère visuel pour Maxime */
.todo-note{border:1px dashed var(--violet);border-radius:12px;padding:14px 18px;margin:14px 0;
  background:rgba(164,148,255,.06);color:var(--violet);font-size:.9rem}

/* ---------- Pied de page ---------- */
footer{border-top:1px solid var(--line);padding:60px 0 40px;position:relative;z-index:1}
.foot-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;margin-bottom:44px}
.foot-brand svg,.foot-brand .brand-logo{height:20px;margin-bottom:16px}
.foot-brand p{color:var(--muted);font-size:.92rem;max-width:280px}
.foot-col h5{font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-dim);
  margin-bottom:16px;font-family:"Inter",sans-serif;font-weight:600}
.foot-col a{display:block;color:var(--muted);font-size:.92rem;padding:6px 0;transition:color .25s}
.foot-col a:hover{color:var(--white)}
.foot-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
  padding-top:28px;border-top:1px solid var(--line)}
.copy{color:var(--muted-dim);font-size:13px}
.foot-legal{display:flex;gap:22px}
.foot-legal a{color:var(--muted-dim);font-size:13px;transition:color .25s}
.foot-legal a:hover{color:var(--white)}

/* ---------- Reveal au scroll ---------- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ---------- Écran de chargement (tout le site, 1×/session) ----------
   #loader masqué par défaut : affiché uniquement quand <html> a la classe
   .loading (ajoutée par le script inline du header au 1er affichage de la
   session) ou pendant le fondu de sortie (.done). Évite tout flash sur les
   pages déjà vues, et évite un loader bloqué si le JS ne s'exécute pas. */
html.loading{overflow:hidden}
html.loading body{overflow:hidden}
#loader{display:none}
html.loading #loader,#loader.done{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;
  background:#0a0a0b;transition:opacity .6s var(--ease),visibility .6s var(--ease)}
#loader.done{opacity:0;visibility:hidden;pointer-events:none}
#loader video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block}
#loader .skip{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);
  font-family:"Inter",sans-serif;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted-dim);background:none;border:0;cursor:pointer;transition:color .25s;padding:8px 14px}
#loader .skip:hover{color:var(--white)}

/* ---------- Responsive ---------- */
@media(max-width:1040px){
  .nav-cta .btn-book{display:none} /* évite de surcharger la nav ; reste dans le menu mobile */
}
@media(max-width:980px){
  .foot-top{grid-template-columns:1fr 1fr;gap:28px}
  .foot-brand{grid-column:1 / -1}
}
@media(max-width:880px){
  .cards,.cards.two,.steps,.sectors,.works,.contact-grid{grid-template-columns:1fr}
  nav.links{display:none}
  .nav-cta .btn-ghost{display:none}
  .nav-cta .btn-primary{display:none}
  .menu-toggle{display:block}
  .stats{gap:34px}
  .hero{padding:70px 0 56px}
  .section{padding:56px 0}
  .cta-box{padding:56px 26px}
  .contact-aside{flex-direction:row;flex-wrap:wrap}
  .contact-aside .info-card{flex:1 1 200px}
}
@media(max-width:560px){
  .wrap{padding-inline:20px}
  .sectors{grid-template-columns:1fr}
  .stats{gap:26px;flex-direction:column;align-items:center}
  .stat .l{max-width:none}
  .foot-top{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important}
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none}
  #loader{display:none}
}

/* =============================================================
   Menu WordPress éditable (Apparence → Menus)
   Reproduit le look exact de la nav d'origine sur la sortie
   standard de wp_nav_menu (ul.nav-menu > li > a, ul.sub-menu).
   ============================================================= */
nav.links .nav-menu{display:flex;gap:34px;align-items:center;list-style:none;margin:0;padding:0}
nav.links .nav-menu li{position:relative;display:flex;align-items:center}
nav.links .nav-menu a{color:var(--muted);font-size:14.5px;font-weight:450;transition:color .25s;position:relative;display:inline-flex;align-items:center;gap:5px}
nav.links .nav-menu a:hover{color:var(--white)}
nav.links .nav-menu .current-menu-item>a,
nav.links .nav-menu .current-menu-ancestor>a,
nav.links .nav-menu .current_page_item>a{color:var(--white)}
nav.links .nav-menu>.current-menu-item>a::after,
nav.links .nav-menu>.current_page_item>a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:var(--grad-soft)}
/* Chevron sur les entrées à sous-menu */
nav.links .nav-menu .menu-item-has-children>a::after{content:"▾";font-size:10px;color:var(--muted-dim);transition:transform .25s var(--ease)}
nav.links .nav-menu .menu-item-has-children:hover>a::after,
nav.links .nav-menu .menu-item-has-children:focus-within>a::after{transform:rotate(180deg)}
/* Sous-menu déroulant */
nav.links .nav-menu .sub-menu{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(-8px);
  min-width:230px;background:rgba(16,16,19,.96);backdrop-filter:blur(14px);border:1px solid var(--line-strong);
  border-radius:16px;padding:8px;display:flex;flex-direction:column;gap:2px;opacity:0;visibility:hidden;
  transition:opacity .25s var(--ease),transform .25s var(--ease),visibility .25s;
  box-shadow:0 20px 50px -20px rgba(0,0,0,.8);z-index:60;list-style:none;margin:0}
nav.links .nav-menu .sub-menu::before{content:"";position:absolute;top:-14px;left:0;right:0;height:14px}
nav.links .nav-menu .menu-item-has-children:hover .sub-menu,
nav.links .nav-menu .menu-item-has-children:focus-within .sub-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
nav.links .nav-menu .sub-menu li{display:block}
nav.links .nav-menu .sub-menu a{padding:11px 14px;border-radius:10px;color:var(--muted);font-size:14.5px;font-weight:450;width:100%}
nav.links .nav-menu .sub-menu a::after{display:none!important}
nav.links .nav-menu .sub-menu a:hover,
nav.links .nav-menu .sub-menu .current-menu-item>a{background:rgba(164,148,255,.10);color:var(--white)}

/* Menu mobile (tiroir) sur sortie wp_nav_menu */
.mobile-menu .mobile-nav{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;width:100%}
.mobile-menu .mobile-nav li{width:100%}
.mobile-menu .mobile-nav a{display:block;font-family:"Archivo",sans-serif;font-stretch:125%;font-weight:600;
  font-size:1.5rem;color:var(--white);padding:14px 0;border-bottom:1px solid var(--line)}
.mobile-menu .mobile-nav .sub-menu{list-style:none;margin:0;padding:0}
.mobile-menu .mobile-nav .sub-menu a{font-size:1.1rem;font-weight:450;color:var(--muted);padding-left:16px}

/* Le loader ne s'affiche que si présent (accueil) — géré par le thème */