/* ===========================================================
   SECUMAX — Design system « Niveau »  (thème secumax)
   Noir + Rouge signature. Or interdit. VIP = bascule sérif radicale.
   =========================================================== */
:root{
  --noir:#0B0B0D; --noir2:#101013; --noir3:#17171b;
  --rouge:#E4032E; --rouge-hi:#ff2b4e;
  --blanc:#F4F5F7; --gris:#8b8f98; --gris2:#7d818c;
  --steel:#C3C8D2;
  --line:rgba(255,255,255,.09);
  --disp:'Sora',system-ui,'Segoe UI',Helvetica,Arial,sans-serif;
  --body:'Inter',system-ui,'Segoe UI',Helvetica,Arial,sans-serif;
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --accent:var(--rouge);
  --accent-soft:rgba(228,3,46,.14);
  --pad:clamp(20px,5vw,80px);
  --maxw:1240px;
  --hd-h:100px; /* topbar + rangée principale (offset du contenu) */
}
@media(max-width:1024px){:root{--hd-h:66px}} /* topbar masquée sur mobile */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--noir);color:var(--blanc);font-family:var(--body);line-height:1.55;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background .6s ease}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}
.eyebrow{font-family:var(--disp);font-weight:600;font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;
  color:var(--gris);display:flex;gap:8px;align-items:center}
.eyebrow .n{color:var(--accent)}
/* Fil d'Ariane */
.smx-crumb{margin-bottom:16px}
.smx-crumb ol{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin:0;padding:0;
  font-family:var(--disp);font-size:.74rem;letter-spacing:.05em}
.smx-crumb li{display:flex;align-items:center;gap:9px;color:var(--gris2)}
.smx-crumb li:not(:last-child)::after{content:"›";color:var(--gris2)}
.smx-crumb a{color:var(--gris);transition:color .2s}
.smx-crumb a:hover{color:var(--accent)}
.smx-crumb [aria-current]{color:var(--gris2)}

/* ---------- Header ---------- */
.smx-hd{position:fixed;inset:0 0 auto 0;z-index:60;display:flex;flex-direction:column;align-items:stretch;
  backdrop-filter:blur(10px);background:linear-gradient(var(--noir),rgba(11,11,13,.35));
  border-bottom:1px solid transparent;transition:border-color .4s,background .4s}
.smx-hd.scrolled{border-bottom-color:var(--line);background:rgba(11,11,13,.82)}
/* Bandeau supérieur (coordonnées) */
.smx-topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:6px var(--pad);font-size:.75rem;color:var(--gris);border-bottom:1px solid var(--line);white-space:nowrap}
.tb-contacts{display:flex;align-items:center;gap:20px;min-width:0}
.tb-item{display:inline-flex;align-items:center;gap:6px;color:var(--gris);transition:color .2s;min-width:0}
a.tb-item:hover{color:var(--blanc)}
.tb-item svg{color:var(--accent);flex-shrink:0}
.tb-addr{color:var(--gris2)}
.tb-addr span{overflow:hidden;text-overflow:ellipsis}
/* Rangée principale */
.smx-hd-row{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:12px var(--pad);min-height:64px}
.smx-brand{font-family:var(--disp);font-weight:800;letter-spacing:.14em;font-size:1.05rem;white-space:nowrap}
.smx-brand.has-logo{display:inline-flex;align-items:center;gap:11px;line-height:1}
.smx-brand-text{font-family:var(--disp);font-weight:800;letter-spacing:.1em;font-size:1rem;color:var(--blanc);white-space:nowrap}
.smx-brand-text .r,.smx-brand .r{color:var(--rouge)}
.smx-logo-img{height:44px;width:auto;display:block;transition:height .25s}
.smx-hd.scrolled .smx-logo-img{height:38px}
@media(max-width:1024px){.smx-topbar{display:none}}
@media(max-width:768px){.smx-logo-img{height:36px}}
.smx-nav .smx-menu{display:flex;gap:28px;list-style:none;margin:0;padding:0;font-size:.82rem;font-weight:500}
/* Sous-menus déroulants (§11 : la profondeur en dropdown, jamais un menu plat qui déborde) */
.smx-menu li{position:relative}
.smx-menu .sub-menu{position:absolute;top:100%;left:0;min-width:210px;list-style:none;margin:0;padding:8px 0;
  background:rgba(11,11,13,.98);border:1px solid var(--line);opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .2s,transform .2s,visibility .2s;z-index:70}
.smx-menu li:hover>.sub-menu,.smx-menu li:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none}
.smx-menu .sub-menu a{display:block;padding:8px 16px;white-space:nowrap}
.smx-nav a{position:relative;color:var(--gris);padding:4px 0;transition:color .25s}
.smx-nav a:hover{color:var(--blanc)}
.smx-nav a::after{content:"";position:absolute;left:0;bottom:-2px;height:1px;width:0;background:var(--accent);transition:width .3s}
.smx-nav a:hover::after{width:100%}
.smx-cta{display:flex;gap:10px;align-items:center}
.smx-btn{font-family:var(--disp);font-weight:600;font-size:.78rem;letter-spacing:.04em;padding:11px 18px;border-radius:2px;
  border:1px solid var(--line);color:var(--blanc);background:none;cursor:pointer;transition:.25s;white-space:nowrap;display:inline-block}
.smx-btn:hover{border-color:var(--blanc)}
.smx-btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.smx-btn.primary:hover{background:var(--rouge-hi);border-color:var(--rouge-hi);transform:translateY(-1px)}
.smx-burger{display:none;flex-direction:column;gap:5px;width:34px;height:34px;justify-content:center;align-items:center;
  background:none;border:1px solid var(--line);border-radius:2px;cursor:pointer}
.smx-burger span{width:16px;height:1.5px;background:var(--blanc);transition:.3s}
.smx-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.smx-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.smx-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
@media(max-width:1280px){
  .smx-nav{position:fixed;inset:var(--hd-h) 0 auto 0;background:rgba(11,11,13,.98);border-bottom:1px solid var(--line);
    padding:14px var(--pad) 22px;transform:translateY(-120%);transition:transform .35s;z-index:59}
  .smx-hd.nav-open .smx-nav{transform:none}
  .smx-nav .smx-menu{flex-direction:column;gap:2px}
  .smx-menu .sub-menu{position:static;opacity:1;visibility:visible;transform:none;border:0;background:transparent;padding:0 0 6px 16px}
  .smx-nav a{display:block;padding:12px 0;font-size:1rem;border-bottom:1px solid var(--line)}
  .smx-burger{display:flex}
  .smx-cta .smx-btn.ghost{display:none}
}
@media(max-width:520px){.smx-cta .smx-btn.primary{display:none}}

/* ---------- Jauge Niveau ---------- */
.gauge{position:fixed;top:50%;right:26px;transform:translateY(-50%);z-index:50;display:flex;gap:16px;pointer-events:none}
.gauge .label{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--disp);font-size:.62rem;letter-spacing:.34em;
  text-transform:uppercase;color:var(--gris2);align-self:center}
.gauge .track{position:relative;width:3px;height:46vh;background:var(--line);border-radius:3px;overflow:hidden}
.gauge .fill{position:absolute;left:0;bottom:0;width:100%;height:0;
  background:linear-gradient(to top,var(--rouge),var(--rouge-hi));transition:height .25s ease-out}
.gauge .stops{position:relative;display:flex;flex-direction:column-reverse;justify-content:space-between;padding:2px 0}
.stop{display:flex;align-items:center;gap:9px;opacity:.4;transition:opacity .35s,transform .35s}
.stop .dot{width:9px;height:9px;border-radius:50%;border:1px solid var(--gris);background:var(--noir)}
.stop .num{font-family:var(--disp);font-weight:800;font-size:.62rem;color:var(--gris)}
.stop .txt{font-family:var(--disp);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gris)}
.stop.active{opacity:1;transform:translateX(-2px)}
.stop.active .dot{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.stop.active .num,.stop.active .txt{color:var(--blanc)}
.gauge .big{position:absolute;top:-46px;right:0;font-family:var(--disp);font-weight:800;font-size:2.4rem;line-height:1;color:var(--accent)}
@media(max-width:1024px){
  .gauge{top:auto;bottom:0;right:0;left:0;transform:none;flex-direction:column;gap:0;
    background:rgba(11,11,13,.92);border-top:1px solid var(--line);padding:8px 16px calc(8px + env(safe-area-inset-bottom))}
  .gauge .label,.gauge .big{display:none}
  .gauge .track{width:100%;height:3px}
  .gauge .fill{height:100%;width:0;left:0;bottom:0;background:linear-gradient(to right,var(--rouge),var(--rouge-hi));
    transition:width .25s}
  .gauge .stops{flex-direction:row;justify-content:space-between;padding:6px 0 0}
  .stop .txt{display:none}.stop.active .txt{display:inline}
}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.16,.8,.3,1),transform .8s cubic-bezier(.16,.8,.3,1)}
.reveal.in{opacity:1;transform:none}

/* ---------- Sections ---------- */
section{position:relative;padding:clamp(80px,13vh,160px) 0}
.lvl-tag{display:inline-flex;align-items:center;gap:12px;margin-bottom:22px}
.lvl-tag b{font-family:var(--disp);font-weight:800;font-size:2.6rem;color:var(--accent);line-height:.8}
.lvl-tag span{font-family:var(--disp);letter-spacing:.28em;text-transform:uppercase;font-size:.72rem;color:var(--gris)}

/* ---------- Hero ---------- */
.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding-top:120px;overflow:hidden}
.hero .bg{position:absolute;inset:0;z-index:0;
  background:radial-gradient(1100px 620px at 78% -8%,rgba(228,3,46,.16),transparent 60%),
    radial-gradient(800px 500px at 8% 108%,rgba(228,3,46,.08),transparent 55%),var(--noir)}
.hero .grid-lines{position:absolute;inset:0;z-index:0;opacity:.5;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:100% 80px,25% 100%;-webkit-mask-image:linear-gradient(var(--noir),transparent 85%);mask-image:linear-gradient(var(--noir),transparent 85%)}
.hero .wrap{position:relative;z-index:2}
.hero h1{font-family:var(--disp);font-weight:800;letter-spacing:-.02em;line-height:.98;margin:.2em 0 .3em;
  font-size:clamp(2.9rem,8.4vw,6.6rem)}
.hero h1 .l2{display:block;color:var(--gris2)}
.hero h1 .dot{color:var(--rouge)}
.hero p.sub{max-width:640px;font-size:clamp(1rem,1.5vw,1.22rem);color:#c9ccd3;margin:0 0 34px}
.hero .actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.wa-inline{display:inline-flex;align-items:center;gap:9px;font-size:.85rem;color:var(--gris)}
.wa-inline .d{width:8px;height:8px;border-radius:50%;background:#25D366;box-shadow:0 0 0 4px rgba(37,211,102,.15)}
.scrollcue{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:2;font-family:var(--disp);
  font-size:.64rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gris2);display:flex;flex-direction:column;align-items:center;gap:8px}
.scrollcue .bar{width:1px;height:44px;background:linear-gradient(var(--gris2),transparent);animation:cue 2s infinite}
@keyframes cue{0%{opacity:.2;transform:scaleY(.4)}50%{opacity:1}100%{opacity:.2;transform:scaleY(.4)}}

/* ---------- Niveaux ---------- */
.niveau{border-top:1px solid var(--line)}
.niveau .head{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:end}
.niveau h2{font-family:var(--disp);font-weight:800;font-size:clamp(2rem,4.6vw,3.6rem);letter-spacing:-.01em;margin:0;line-height:1}
.niveau .lead{color:#c4c7ce;font-size:1.05rem;margin:0}
.feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line);margin-top:52px}
.feat{background:var(--noir);padding:26px 24px;transition:background .3s}
.feat:hover{background:var(--noir3)}
.feat .k{font-family:var(--disp);font-weight:600;font-size:.7rem;letter-spacing:.2em;color:var(--accent);text-transform:uppercase}
.feat .t{font-weight:600;margin:.5em 0 .3em}
.feat .x{color:var(--gris);font-size:.92rem}
.more{margin-top:34px;display:inline-flex;align-items:center;gap:10px;font-family:var(--disp);font-weight:600;font-size:.82rem;color:var(--blanc)}
.more .ln{width:34px;height:1px;background:var(--accent)}
.more svg{transition:transform .3s}.more:hover svg{transform:translateX(6px)}
@media(max-width:820px){.niveau .head{grid-template-columns:1fr}}

/* ---------- Seuil premium ---------- */
.seuil{display:flex;align-items:center;gap:22px;max-width:var(--maxw);margin:0 auto;padding:10px var(--pad)}
.seuil .line{flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--gris2),transparent)}
.seuil .txt{font-family:var(--disp);font-size:.66rem;letter-spacing:.4em;text-transform:uppercase;color:var(--gris)}

/* ---------- VIP : bascule radicale ---------- */
.niveau.vip{border-top:none;overflow:hidden;padding:clamp(120px,20vh,220px) 0;
  background:radial-gradient(150% 130% at 50% -12%,#0a0a0d,#000 64%)}
/* grain cinématographique */
.niveau.vip::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.5;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E")}
/* halo qui suit le curseur (--mx/--my posés en JS) */
.niveau.vip .vip-light{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(520px 520px at var(--mx,34%) var(--my,32%),rgba(255,255,255,.13),transparent 60%);
  transition:background .18s ease-out}
.niveau.vip.drift .vip-light{animation:vipdrift 18s ease-in-out infinite alternate}
@keyframes vipdrift{0%{background-position:26% 28%}100%{background-position:62% 58%}}
.niveau.vip .wrap{position:relative;z-index:2}
.niveau.vip .lvl-tag{margin-bottom:36px}
.niveau.vip .lvl-tag b{color:#fff}
.niveau.vip .lvl-tag span{color:var(--steel);letter-spacing:.42em}
.niveau.vip h2{font-family:var(--serif);font-weight:500;font-style:italic;letter-spacing:0;
  font-size:clamp(3rem,7vw,6rem);line-height:.98}
.niveau.vip .lead{font-family:var(--serif);font-size:clamp(1.4rem,2.4vw,1.9rem);color:#e9eaec;line-height:1.42;max-width:640px}
.niveau.vip .feats{border-color:rgba(255,255,255,.05);background:rgba(255,255,255,.05);margin-top:64px}
.niveau.vip .feat{background:#040405}
.niveau.vip .feat .k{color:var(--steel);letter-spacing:.26em}
.niveau.vip .feat .t{font-family:var(--serif);font-size:1.3rem;font-weight:600}
.niveau.vip .feat .x{color:#9aa0ab}
.niveau.vip .more{color:#fff}.niveau.vip .more .ln{background:var(--steel)}
.niveau.vip .whisper{margin-top:42px;font-family:var(--serif);font-style:italic;font-size:clamp(1.4rem,2.4vw,1.9rem);color:#aeb3bd;max-width:720px}

/* Niveau 03 atteint : toute l'interface se calme (monochrome premium) */
body[data-level="3"]{background:#040406}
body[data-level="3"] .smx-hd.scrolled{background:rgba(4,4,6,.86)}
body[data-level="3"] .gauge .fill{background:linear-gradient(to top,#7d828f,#e4e8f0)}
body[data-level="3"] .gauge .fill{width:auto}
body[data-level="3"] .stop.active .dot{background:var(--steel);border-color:var(--steel);box-shadow:0 0 0 4px rgba(195,200,210,.16)}
body[data-level="3"] .gauge .big{color:var(--steel)}
@media(max-width:1024px){body[data-level="3"] .gauge .fill{background:linear-gradient(to right,#7d828f,#e4e8f0)}}

/* ---------- Bande configurateur ---------- */
.configband{text-align:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:radial-gradient(700px 380px at 80% 120%,rgba(228,3,46,.18),transparent 60%),var(--noir2)}
.configband h2{font-family:var(--disp);font-weight:800;font-size:clamp(1.8rem,4.4vw,3rem);margin:.2em 0}
.configband p{color:var(--gris);max-width:560px;margin:0 auto 30px}
.steps{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:34px}
.steps span{font-family:var(--disp);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gris2);
  border:1px solid var(--line);padding:7px 13px;border-radius:2px}

/* ---------- Footer ---------- */
.smx-ft{border-top:1px solid var(--line);color:var(--gris);font-size:.85rem;background:var(--noir2)}
.smx-ft-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:40px;padding:64px 0 44px}
.smx-ft-logo{display:inline-flex;align-items:center;gap:11px;margin-bottom:16px}
.smx-ft-logo img{height:42px;width:auto;display:block}
.smx-ft-logo .smx-brand-text{font-size:1.05rem}
.smx-ft-desc{color:var(--gris);max-width:340px;margin:0 0 18px;line-height:1.6}
.smx-ft-social{display:flex;gap:10px;margin-bottom:16px}
.smx-ft-social a{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--line);border-radius:3px;color:var(--gris);transition:.25s}
.smx-ft-social a:hover{color:#fff;border-color:var(--accent);background:var(--accent)}
.smx-ft-avis a,.smx-ft-avis span{color:var(--gris2);text-decoration:none;font-size:.82rem}
.smx-ft-avis a:hover{color:var(--blanc)}
.smx-ft-col h3{font-family:var(--disp);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--blanc);margin:0 0 16px}
.smx-ft-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.smx-ft-col a{color:var(--gris);transition:color .2s}
.smx-ft-col a:hover{color:var(--accent)}
.smx-ft-contact ul{gap:12px}
.smx-ft-contact li{display:flex;flex-direction:column;gap:2px}
.smx-ft-contact .k{font-family:var(--disp);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gris2)}
.smx-ft-contact a{color:var(--gris)}
.smx-ft-bottom{border-top:1px solid var(--line)}
.smx-ft-bottom-in{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:20px 0}
.smx-ft-copy{color:var(--gris2);font-size:.8rem}
.smx-ft-sign{color:var(--gris2);font-size:.8rem;font-family:var(--disp);letter-spacing:.02em}
.smx-ft-sign strong{color:var(--blanc);font-weight:700}
@media(max-width:1024px){.smx-ft-grid{grid-template-columns:1fr 1fr;gap:32px}}
@media(max-width:600px){.smx-ft-grid{grid-template-columns:1fr;gap:28px;padding:48px 0 28px}.smx-ft-bottom-in{padding-bottom:calc(90px + env(safe-area-inset-bottom));flex-direction:column;align-items:flex-start;gap:8px}}

/* ---------- Auteur (E-E-A-T) ---------- */
.art-author{margin-top:48px;border-top:1px solid var(--line);border-left:2px solid var(--accent);padding:22px 24px;background:var(--noir2)}
.art-author .au-k{font-family:var(--disp);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.art-author .au-name{font-family:var(--disp);font-weight:600;margin-top:.3em}
.art-author .au-org{color:var(--gris);font-weight:400}
.art-author .au-bio{color:var(--gris);font-size:.92rem;margin:.5em 0 0;max-width:680px}

/* ---------- Lead magnet (téléchargement de guide contre e-mail) ---------- */
.smx-leadmagnet{margin-top:48px;border:1px solid var(--line);border-left:2px solid var(--accent);background:var(--noir2);padding:28px 26px}
.smx-leadmagnet h2{font-family:var(--disp);font-size:1.4rem;margin:.2em 0 .3em}
.smx-leadmagnet p{color:var(--gris);margin:0 0 16px}
.smx-leadmagnet .row2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.smx-leadmagnet .fld input{width:100%}
.smx-leadmagnet .smx-dl{margin-left:10px}
@media(max-width:600px){.smx-leadmagnet .row2{grid-template-columns:1fr}}

/* ---------- Hub FAQ (accordéon générique, hors fiche service) ---------- */
.faq-hub{max-width:820px}
.faq-hub details{border-top:1px solid var(--line);padding:18px 0}
.faq-hub details:last-child{border-bottom:1px solid var(--line)}
.faq-hub summary{cursor:pointer;font-weight:600;font-family:var(--disp);font-size:1.05rem;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq-hub summary::-webkit-details-marker{display:none}
.faq-hub summary::after{content:"+";color:var(--accent);font-weight:400;transition:transform .25s}
.faq-hub details[open] summary::after{content:"–"}
.faq-hub p{color:var(--gris);margin:.7em 0 0;max-width:760px}

/* ---------- WhatsApp flottant ---------- */
.smx-wa{position:fixed;right:22px;bottom:22px;z-index:55;width:54px;height:54px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;color:#fff;background:#25D366;
  box-shadow:0 10px 30px rgba(0,0,0,.4);transition:transform .25s}
.smx-wa:hover{transform:translateY(-3px) scale(1.04)}
@media(max-width:1024px){.smx-wa{bottom:74px;right:16px;width:48px;height:48px}}

/* ---------- Barre d'action mobile ---------- */
.smx-mobilebar{display:none}
@media(max-width:768px){
  .smx-mobilebar{display:grid;grid-template-columns:1fr 1fr 1fr;position:fixed;inset:auto 0 0 0;z-index:56;
    background:rgba(11,11,13,.96);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
  .smx-mobilebar a{text-align:center;padding:14px 4px;font-family:var(--disp);font-weight:600;font-size:.8rem;color:var(--blanc);
    border-right:1px solid var(--line)}
  .smx-mobilebar a:last-child{border-right:none}
  .smx-mobilebar a.primary{background:var(--rouge);color:#fff}
  .gauge{bottom:56px}
  .smx-wa{bottom:70px}
}

/* ---------- Repli article ---------- */
.smx-main{padding-top:calc(var(--hd-h) + 40px);min-height:60vh}
.smx-article{padding:24px 0;border-bottom:1px solid var(--line)}
.smx-article-title a{font-family:var(--disp)}

/* ---------- Preuves de confiance ---------- */
.preuves{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:44px 0;background:var(--noir2)}
.preuves-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:24px;text-align:center}
.preuve .pv-num{font-family:var(--disp);font-weight:800;font-size:clamp(2rem,4vw,3rem);color:var(--accent);line-height:1}
.preuve .pv-lbl{font-family:var(--disp);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gris);margin-top:8px}

/* ---------- Pages internes (service) ---------- */
.smx-service .svc-hero{padding:calc(var(--hd-h) + 70px) 0 40px;
  background:radial-gradient(1000px 500px at 80% -10%,rgba(228,3,46,.14),transparent 60%),var(--noir)}
.smx-service h1{font-family:var(--disp);font-weight:800;font-size:clamp(2.4rem,6vw,4.4rem);letter-spacing:-.01em;margin:.2em 0}
.smx-service .svc-accroche{font-size:1.2rem;color:#c9ccd3;max-width:640px}
.smx-service .svc-hero .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.smx-service .svc-body{padding:60px 0 100px}
.svc-block{margin-bottom:52px}
.svc-k{display:inline-block;font-family:var(--disp);font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.smx-service .svc-intro{font-size:1.2rem;color:#c4c7ce;max-width:720px}
.smx-service .svc-content{color:#b9bcc4;max-width:720px}
.smx-service .svc-block .feats{margin-top:0}

/* Page service VIP : bascule premium (sérif, noir, halo) */
.smx-service.is-vip{position:relative;overflow:hidden;background:radial-gradient(150% 130% at 50% -12%,#0a0a0d,#000 64%)}
.smx-service.is-vip .vip-light{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(520px 520px at var(--mx,34%) var(--my,32%),rgba(255,255,255,.13),transparent 60%);transition:background .18s ease-out}
.smx-service.is-vip .svc-hero{background:transparent}
.smx-service.is-vip .svc-hero,.smx-service.is-vip .svc-body{position:relative;z-index:2}
.smx-service.is-vip h1{font-family:var(--serif);font-style:italic;font-weight:500}
.smx-service.is-vip .svc-accroche{font-family:var(--serif);font-size:clamp(1.3rem,2.2vw,1.7rem);color:#e9eaec}
.smx-service.is-vip .svc-k{color:var(--steel)}
.smx-service.is-vip .feat .t{font-family:var(--serif);font-size:1.3rem}
.smx-service.is-vip .feats{border-color:rgba(255,255,255,.05);background:rgba(255,255,255,.05)}
.smx-service.is-vip .feat{background:#060607}
.smx-service.is-vip .svc-faq summary{font-family:var(--serif)}
.smx-service .svc-faq{margin-top:56px;max-width:820px}
.smx-service .svc-faq h2{font-family:var(--disp);font-size:1.6rem}
.smx-service .svc-faq details{border-top:1px solid var(--line);padding:16px 0}
.smx-service .svc-faq summary{cursor:pointer;font-weight:600;font-family:var(--disp)}
.smx-service .svc-faq p{color:var(--gris);margin:.6em 0 0}
/* FAQ de l'accueil (teaser) */
.faq-home-sec .svc-faq{max-width:860px;margin-top:14px;border-top:1px solid var(--line)}
.faq-home-sec details{border-bottom:1px solid var(--line);padding:18px 0}
.faq-home-sec summary{font-family:var(--disp);font-weight:600;font-size:1.05rem;color:var(--blanc)}
.faq-home-sec details p{color:var(--gris);margin:12px 0 0;max-width:780px}
.faq-home-sec .more{margin-top:30px}
/* Nos engagements */
.engagements{border-top:1px solid var(--line)}
.eng-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:40px}
.eng{background:var(--noir);padding:34px 28px;transition:background .3s;position:relative}
.eng::before{content:"";position:absolute;top:0;left:0;height:2px;width:0;background:var(--accent);transition:width .35s}
.eng:hover{background:var(--noir3)}
.eng:hover::before{width:100%}
.eng-ic{color:var(--accent);display:inline-flex;margin-bottom:16px}
.eng h3{font-family:var(--disp);font-weight:700;font-size:1.12rem;margin:0 0 .45em;line-height:1.2}
.eng p{color:var(--gris);font-size:.92rem;margin:0}
@media(max-width:900px){.eng-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.eng-grid{grid-template-columns:1fr}}
.smx-service .svc-cta{margin-top:48px}

/* ---------- Secteurs (accueil) ---------- */
.secteurs{border-top:1px solid var(--line)}
.secteurs h2{font-family:var(--disp);font-weight:800;font-size:clamp(1.8rem,4vw,2.8rem);margin:.3em 0 1em}
.sect-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.sect-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:22px 24px;background:var(--noir);
  font-family:var(--disp);font-weight:600;transition:background .25s}
.sect-card:hover{background:var(--noir3)}
.sect-card svg{color:var(--gris);transition:transform .3s,color .25s}
.sect-card:hover svg{transform:translateX(5px);color:var(--accent)}

/* ---------- Pages secteur (single) ---------- */
.smx-secteur .svc-hero{padding:calc(var(--hd-h) + 70px) 0 40px;background:radial-gradient(1000px 500px at 80% -10%,rgba(228,3,46,.12),transparent 60%),var(--noir)}
.smx-secteur h1{font-family:var(--disp);font-weight:800;font-size:clamp(2.2rem,5.5vw,4rem);margin:.2em 0}
.smx-secteur .svc-accroche{font-size:1.2rem;color:#c9ccd3;max-width:680px}
.smx-secteur .svc-hero .actions{margin-top:24px}
.smx-secteur .svc-body{padding:20px 0 100px}
.smx-secteur .sect-q{border-top:1px solid var(--line);padding:32px 0}
.smx-secteur .sect-q h2{font-family:var(--disp);font-size:1.25rem;color:var(--accent);margin:0 0 .4em}
.smx-secteur .sect-q p{color:#c4c7ce;max-width:760px;margin:0}
.smx-secteur .sect-cta{margin-top:44px}

/* ---------- Pages de fond (Pourquoi / À propos / Références) ---------- */
.smx-page .svc-hero{padding:calc(var(--hd-h) + 70px) 0 40px;background:radial-gradient(1000px 500px at 80% -10%,rgba(228,3,46,.12),transparent 60%),var(--noir)}
.smx-page h1{font-family:var(--disp);font-weight:800;font-size:clamp(2.2rem,5.5vw,4rem);margin:.2em 0}
.smx-page .svc-accroche{font-size:1.2rem;color:#c9ccd3;max-width:680px}
.smx-page .svc-body{padding:40px 0 100px}
.smx-page .svc-content{color:#c4c7ce;max-width:760px;margin-bottom:40px}
.diff-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.methode{margin-top:64px}
.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px;margin-top:24px}
.step{border-top:2px solid var(--accent);padding-top:16px}
.step-n{font-family:var(--disp);font-weight:800;font-size:1.6rem;color:var(--accent);line-height:1}
.step-t{font-family:var(--disp);font-weight:600;margin:.4em 0 .2em}
.step-x{color:var(--gris);font-size:.92rem}
.fil-rouge{margin:44px 0}
.fil-rouge p{font-family:var(--disp);font-weight:800;font-size:clamp(1.4rem,3vw,2.2rem);margin:.1em 0;line-height:1.05}
.fil-rouge p:last-child{color:var(--accent)}
.ref-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:24px}
.ref-card{background:var(--noir);padding:24px}
.ref-card h3{font-family:var(--disp);margin:0 0 .3em}
.ref-card p{color:var(--gris);font-size:.92rem;margin:0}

/* ---------- Archives de liste (services / secteurs) ---------- */
.arch-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:24px}
.arch-card{position:relative;display:block;background:var(--noir);padding:34px 28px 30px;transition:background .3s}
.arch-card:hover{background:var(--noir3)}
.arch-card .arch-n{font-family:var(--disp);font-weight:800;font-size:1rem;letter-spacing:.1em;color:var(--accent)}
.arch-card h2{font-family:var(--disp);font-weight:800;font-size:clamp(1.4rem,2.4vw,1.9rem);line-height:1.05;margin:.35em 0 .5em}
.arch-card p{color:var(--gris);font-size:.95rem;margin:0 0 22px}
.arch-card .more{margin-top:0}

/* ---------- Formulaires (devis / VIP) ---------- */
.smx-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.smx-devis,.smx-vipcontact{border-top:1px solid var(--line);padding:clamp(70px,10vh,120px) 0}
.smx-devis{background:radial-gradient(700px 380px at 15% 0%,rgba(228,3,46,.10),transparent 60%),var(--noir)}
.devis-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:start}
.devis-intro h2,.smx-vipcontact h2{font-family:var(--disp);font-weight:800;font-size:clamp(1.8rem,3.6vw,2.6rem);margin:.3em 0}
.devis-intro p{color:var(--gris);max-width:420px}
.smx-form .fld{margin-bottom:14px;display:flex;flex-direction:column;gap:6px}
.smx-form .row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.smx-form label{font-family:var(--disp);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gris)}
.smx-form input,.smx-form select,.smx-form textarea{background:var(--noir2);border:1px solid var(--line);color:var(--blanc);
  padding:12px 14px;border-radius:2px;font-family:var(--body);font-size:.95rem;width:100%}
.smx-form input:focus,.smx-form select:focus,.smx-form textarea:focus{outline:none;border-color:var(--accent)}
.smx-form button[type=submit]{margin-top:10px}
.smx-form-status{margin-top:12px;font-size:.9rem;min-height:1.2em}
.smx-form-status.ok{color:#3ad07a}.smx-form-status.err{color:var(--rouge-hi)}
.smx-form-note{color:var(--gris2);font-size:.82rem;margin-top:10px}
.smx-vipcontact{background:#040406}
.smx-vipcontact .smx-form{max-width:680px}
@media(max-width:820px){.devis-grid{grid-template-columns:1fr}.smx-form .row2{grid-template-columns:1fr}}

/* ---------- Contact ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.contact-grid h2{font-family:var(--disp);font-weight:800;font-size:1.5rem;margin:0 0 18px}
.ci-list{list-style:none;margin:0 0 32px;padding:0}
.ci-list li{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;padding:14px 0;border-top:1px solid var(--line)}
.ci-k{font-family:var(--disp);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gris);min-width:90px}
.ci-map{color:var(--accent);font-size:.85rem}
.urgence-block{border:1px solid var(--rouge);border-radius:2px;padding:22px;margin:0 0 32px;background:var(--accent-soft)}
.urgence-block h3{font-family:var(--disp);margin:0 0 .3em}
.urgence-block p{color:#d6d8dd;margin:0 0 16px}
.urgence-block .actions{display:flex;gap:10px;flex-wrap:wrap}
.rappel{border-top:1px solid var(--line);padding-top:24px}
.rappel h3,.contact-form h2{margin-top:0}
@media(max-width:820px){.contact-grid{grid-template-columns:1fr;gap:36px}}

/* ---------- Articles / Conseils ---------- */
.art-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.art-card{display:block;background:var(--noir);padding:24px;transition:background .25s}
.art-card:hover{background:var(--noir3)}
.art-card-thumb{display:block;margin:-24px -24px 16px;overflow:hidden}
.art-card-thumb img{width:100%;height:170px;object-fit:cover;display:block}
.art-card-date{font-family:var(--disp);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.art-card h3{font-family:var(--disp);font-size:1.15rem;margin:.4em 0 .3em;line-height:1.2}
.art-card p{color:var(--gris);font-size:.92rem;margin:0}
.art-meta{color:var(--gris);font-size:.85rem;margin-top:8px}
.art-body{max-width:760px}
.art-thumb{margin:0 0 28px}.art-thumb img{width:100%;border-radius:2px}
.art-content{color:#c4c7ce;line-height:1.7}
.art-content h2,.art-content h3{font-family:var(--disp);color:var(--blanc);margin:1.4em 0 .4em}
.art-content a{color:var(--accent)}
.art-content p{margin:0 0 1em}

/* ---------- Carrières ---------- */
.carrieres .car-postes{margin-bottom:56px}
.carrieres h2{font-family:var(--disp);font-weight:800;font-size:1.5rem;margin:0 0 18px}
.car-poste{display:flex;align-items:center;padding:18px 22px;background:var(--noir);font-family:var(--disp);font-weight:600}
.car-form{max-width:720px}
.smx-candidature .fld input[type=file]{width:100%;padding:11px;background:rgba(255,255,255,.03);border:1px dashed var(--line);border-radius:2px;color:var(--gris);cursor:pointer}

/* ---------- Configurateur « Évaluer mon besoin » ---------- */
.smx-config{max-width:620px;margin:34px auto 0;text-align:left;border:1px solid var(--line);border-radius:2px;padding:28px;background:rgba(255,255,255,.02)}
.cfg-progress{height:3px;background:var(--line);border-radius:3px;overflow:hidden;margin-bottom:24px}
.cfg-bar{display:block;height:100%;width:16%;background:linear-gradient(90deg,var(--rouge),var(--rouge-hi));transition:width .3s}
.cfg-step{display:none}
.cfg-step.is-active{display:block}
.cfg-step h4{font-family:var(--disp);font-weight:600;font-size:1.15rem;margin:0 0 16px}
.cfg-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.cfg-opt{display:flex;align-items:center;gap:8px;padding:11px 14px;border:1px solid var(--line);border-radius:2px;cursor:pointer;
  font-size:.9rem;color:var(--gris);transition:border-color .2s,background .2s,color .2s}
.cfg-opt:hover{border-color:var(--gris)}
.cfg-opt input{accent-color:var(--rouge);margin:0}
.cfg-opt:has(input:checked){border-color:var(--rouge);background:var(--accent-soft);color:var(--blanc)}
.cfg-nav{display:flex;gap:10px;align-items:center;margin-top:24px;flex-wrap:wrap}
.cfg-nav .cfg-next,.cfg-nav .cfg-submit{margin-left:auto}
/*
   Sur téléphone, les trois boutons du configurateur (Précédent · Suivant ·
   Transmettre à un expert) totalisent près de 400 px : sans repli, le dernier
   sortait de l'écran et faisait défiler toute la page latéralement. On passe
   en pleine largeur — le bouton qui conclut le parcours devient au passage
   une cible confortable au pouce.
*/
@media(max-width:520px){
  .cfg-nav{gap:8px}
  .cfg-nav .smx-btn{width:100%;justify-content:center;margin-left:0}
}

/* ---------- Consentement cookies ---------- */
.smx-consent{position:fixed;left:16px;right:16px;bottom:16px;z-index:80;max-width:520px;margin:0 auto;
  background:var(--noir2);border:1px solid var(--line);border-radius:4px;padding:18px 20px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.smx-consent p{margin:0 0 14px;color:#c9ccd3;font-size:.9rem}
.smx-consent-btns{display:flex;gap:10px;justify-content:flex-end}
@media(max-width:768px){.smx-consent{bottom:76px}}

/* ---------- Images éditables (hero + fiches). Repli = dégradé si aucune image. ---------- */
/* Point d'ancrage remonté quand la photo est verticale (voir smx_hero_bg_attr) :
   sinon le cadrage « cover » d'un portrait d'agent coupe la tête. */
.hero.has-img .bg{background-image:linear-gradient(rgba(4,4,5,.55),rgba(4,4,5,.82)),var(--smx-hero);background-size:cover;background-position:var(--smx-hero-pos,center);background-repeat:no-repeat}
.svc-hero.has-img{background-image:linear-gradient(rgba(4,4,5,.60),rgba(4,4,5,.85)),var(--smx-hero)!important;background-size:cover;background-position:var(--smx-hero-pos,center);background-repeat:no-repeat}
/* Sections d'accueil (niveau) avec photo de fond + voile sombre fort (texte lisible) */
.niveau.has-img{background-image:linear-gradient(rgba(4,4,5,.90),rgba(4,4,5,.93)),var(--smx-hero);background-size:cover;background-position:center;background-repeat:no-repeat}
/* Cartes secteurs / quartiers en image (photo + titre en surimpression) */
.sect-card.has-img{min-height:200px;align-items:flex-end;color:#fff;background-image:linear-gradient(rgba(8,8,10,.12),rgba(8,8,10,.90)),var(--smx-card);background-size:cover;background-position:center;background-repeat:no-repeat;transition:background-image .35s}
.sect-card.has-img span{font-family:var(--disp);font-weight:600;font-size:1.06rem}
.sect-card.has-img:hover{background-image:linear-gradient(rgba(228,3,46,.28),rgba(8,8,10,.92)),var(--smx-card)}
/* Cartes services (archive) en image */
.arch-card.has-img{background-image:linear-gradient(rgba(8,8,10,.72),rgba(8,8,10,.93)),var(--smx-card);background-size:cover;background-position:center;background-repeat:no-repeat}
.arch-card.has-img:hover{background-image:linear-gradient(rgba(8,8,10,.66),rgba(8,8,10,.90)),var(--smx-card)}
.arch-card.has-img p{color:#d7dade}
/* Galerie « À propos » */
.smx-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin:44px 0}
.smx-gallery .smx-gal-img{width:100%;height:220px;object-fit:cover;display:block;border:1px solid var(--line);filter:grayscale(.12);transition:filter .35s,transform .35s}
.smx-gallery .smx-gal-img:hover{filter:none;transform:scale(1.015)}
/* Références avec photo (carte image + corps) */
.ref-card{padding:0;overflow:hidden}
.ref-thumb img{width:100%;height:190px;object-fit:cover;display:block}
.ref-body{padding:24px}

/* ---------- Scrollytelling « Notre démarche » (fiche service) ---------- */
.smx-method .method-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;align-items:start;margin-top:14px}
.method-sticky{position:sticky;top:calc(var(--hd-h) + 40px);display:flex;flex-direction:column;gap:6px}
.method-sticky .ms-num{font-family:var(--disp);font-weight:800;font-size:clamp(3rem,8vw,6rem);color:var(--accent);line-height:.8}
.method-sticky .ms-title{font-family:var(--disp);letter-spacing:.22em;text-transform:uppercase;font-size:.9rem;color:var(--gris)}
.method-steps{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.method-step{background:var(--noir);padding:32px 28px;transition:background .3s}
.method-step .num{font-family:var(--disp);font-weight:800;color:var(--accent);font-size:.85rem;letter-spacing:.12em}
.method-step h3{font-family:var(--disp);font-size:1.3rem;margin:.35em 0 .4em}
.method-step p{color:var(--gris);margin:0}
.method-step.active{background:var(--noir3)}
@media(max-width:860px){.smx-method .method-grid{grid-template-columns:1fr;gap:18px}.method-sticky{position:static;flex-direction:row;align-items:baseline;gap:14px}.method-sticky .ms-num{font-size:2.4rem}}

/* ---------- Typewriter des H1 ---------- */
.smx-tw{position:relative}
.smx-tw-ghost{visibility:hidden}                 /* réserve la place exacte : pas de saut de page */
.smx-tw-live{position:absolute;left:0;top:0;right:0} /* calque animé aligné sur le fantôme */
.smx-tw-cursor{display:inline-block;width:4px;height:.92em;background:var(--rouge);vertical-align:middle;margin-left:5px;border-radius:1px;box-shadow:0 0 10px rgba(228,3,46,.75);animation:twBlink .65s step-end infinite}
@keyframes twBlink{0%,100%{opacity:1}50%{opacity:0}}

/* ---------- Signature VIP (WebGL) ---------- */
.vip-webgl{position:absolute;inset:0;z-index:0;width:100%;height:100%;display:block;pointer-events:none;opacity:0;transition:opacity 1.4s ease}
.vip-webgl.is-live{opacity:1} /* révélé en JS au 1er rendu (robuste, indépendant du cascade) */
.webgl-on .vip-light{display:none} /* le shader remplace le halo CSS quand il est actif */

/* ---------- Motion / Lenis (smooth scroll) ---------- */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
.lenis.lenis-smooth iframe{pointer-events:none}
/* Repli : ancres fluides quand Lenis n'est pas actif (JS off / navigateur ancien), sauf reduced-motion */
@media(prefers-reduced-motion:no-preference){html:not(.lenis){scroll-behavior:smooth}}
/* Focus visible homogène (accessibilité + finition) */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}
/* Lien d'évitement clavier (WCAG 2.4.1) */
.smx-skip{position:fixed;left:8px;top:-56px;z-index:200;background:var(--accent);color:#fff;padding:10px 16px;border-radius:2px;font-family:var(--disp);font-weight:600;font-size:.8rem;transition:top .2s}
.smx-skip:focus{top:8px}
#smx-main:focus{outline:none}

/* ---------- Effets ---------- */
/* Hero kinétique : révélation ligne par ligne (masque clip-path) */
.hero h1 .ln{display:block}
@keyframes lineIn{from{clip-path:inset(0 100% 0 0);transform:translateY(10%);opacity:0}to{clip-path:inset(0 0 0 0);transform:none;opacity:1}}
.hero h1 .ln1{animation:lineIn .9s cubic-bezier(.16,.8,.3,1) both}
.hero h1 .ln2{animation:lineIn .9s .12s cubic-bezier(.16,.8,.3,1) both}
/* Seuil premium : les traits se dessinent quand on arrive */
.seuil .line{transform:scaleX(0);transform-origin:center;transition:transform .9s cubic-bezier(.16,.8,.3,1)}
.seuil.in .line{transform:scaleX(1)}
.seuil .txt{opacity:.15;transition:opacity .8s .15s}
.seuil.in .txt{opacity:1}
/* Ambiance qui se resserre en entrant dans le premium (niveau 03) */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:40;opacity:0;transition:opacity .8s;
  box-shadow:inset 0 0 220px 50px rgba(0,0,0,.75)}
body[data-level="3"]::after{opacity:1}

/* ---------- Micro-interactions & finitions ---------- */
/* Champs : anneau de focus accent + fond qui se relève */
.smx-form input:focus,.smx-form select:focus,.smx-form textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(228,3,46,.15);background:var(--noir3)}
/* Messages de formulaire : apparition douce */
.smx-form-status.ok,.smx-form-status.err{animation:smxStatusIn .4s ease both}
@keyframes smxStatusIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
/* Cartes-atouts : filet rouge qui se dessine au survol */
.feat{position:relative}
.feat::before{content:"";position:absolute;top:0;left:0;height:2px;width:0;background:var(--accent);transition:width .35s}
.feat:hover::before{width:100%}
/* FAQ : chevron animé + confort de clic */
.svc-faq summary{cursor:pointer;list-style:none;position:relative;padding-right:30px}
.svc-faq summary::-webkit-details-marker{display:none}
.svc-faq summary::after{content:"";position:absolute;right:6px;top:calc(.7em);width:8px;height:8px;border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(45deg);transition:transform .3s}
.svc-faq details[open] summary::after{transform:rotate(-135deg)}
/* Cartes secteurs/quartiers image : léger zoom du contenu au survol */
.sect-card.has-img span{transition:transform .35s}
.sect-card.has-img:hover span{transform:translateX(4px)}

/* ---------- Impression : page propre noir/blanc ---------- */
@media print{
  .smx-hd,.smx-nav,.smx-cta,.smx-burger,.smx-skip,.smx-wa,.smx-mobilebar,.gauge,.scrollcue,
  .vip-webgl,.smx-devis,.smx-vipcontact,.configband,.smx-form,.smx-leadmagnet,.method-sticky{display:none!important}
  html,body{background:#fff!important}
  *{color:#000!important;background-color:transparent!important;box-shadow:none!important;text-shadow:none!important}
  .svc-hero.has-img,.hero.has-img .bg,.niveau.has-img,.sect-card.has-img,.arch-card.has-img{background-image:none!important}
  main{padding-top:0!important}
  a{color:#000!important;text-decoration:underline}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:.85em}
  img{max-width:100%!important}
}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
  .hero h1 .ln{clip-path:none;opacity:1;transform:none}
  .seuil .line{transform:none}
  .niveau.vip .vip-light{opacity:.85}
}
