/* Proposition 5 — « blanc néon ».
   Fond très clair, typographie de la proposition 1 (celle que Gautier adore),
   et le néon qui passe du fond au personnage : Zuri en tunique noire dont les
   coutures sont soulignées d'un fil bleu électrique. Le noir de la tunique revient
   en touches (boutons secondaires), le bleu électrique fait la lumière. */
:root{
  --ink:#F6F8FC;--navy:#FFFFFF;--card:#FFFFFF;--panel:#FFFFFF;--win:#EEF2F8;
  --bgc:246,248,252;--fg:11,18,32;--shd:11,18,40;
  --acc:47,107,255;--neon:#2F6BFF;--on-acc:#FFFFFF;--lum-mid:#2F6BFF;
  --turq:#2DD5DC;--noir:#0B1220;
  --white:#0B1220;--g-72:#394357;--g-60:#5A6479;--g-45:#8A93A6;
  --line:rgba(11,18,32,.08);--line-2:rgba(11,18,32,.13);
  --sh2:0 1px 2px rgba(11,18,40,.05),0 14px 36px -12px rgba(11,18,40,.16);
  --sh3:0 40px 100px -40px rgba(11,18,40,.35);
}
h1,h2,h3,h4{font-weight:650}
.lum{background:linear-gradient(100deg,#1B3FD6 0%,#2F6BFF 48%,#27B8E6 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 22px rgba(47,107,255,.28))}
.wordmark .s{color:var(--neon);text-shadow:0 0 14px rgba(47,107,255,.45)}
.kicker{color:var(--neon)}
.bar{border-bottom:1px solid rgba(47,107,255,.18);box-shadow:0 1px 0 rgba(47,107,255,.06)}
.sec + .sec{border-top:0}
#probleme,#metiers,#espace,#comment,#tarif{background:#fff}
.figs{background:#fff}

/* le noir de la tunique, en touches */
.btn-neon{background:var(--neon);box-shadow:0 0 0 1px rgba(47,107,255,.35),0 12px 30px -10px rgba(47,107,255,.7)}
.btn-neon:hover{box-shadow:0 0 0 1px rgba(47,107,255,.5),0 0 28px rgba(47,107,255,.55)}
.btn-ghost{background:var(--noir);color:#fff;border-color:var(--noir);box-shadow:inset 0 0 0 1px rgba(47,107,255,.0)}
.btn-ghost:hover{border-color:var(--neon);box-shadow:0 0 0 1px var(--neon),0 0 22px rgba(47,107,255,.45)}
.ecoute{background:var(--noir);color:#fff;border-color:var(--noir)}
.ecoute small{color:#9aa6c0}
.ecoute:hover{box-shadow:0 0 22px rgba(47,107,255,.45)}

/* cartes blanches, liseré néon en tête — le fil de la tunique */
.card,.tile,.step,.vx,.stats > div,.checks div,.call,.sx,.concret,.faq details{background:#fff;box-shadow:var(--sh2)}
#probleme .stats > div,#metiers .tabs,#espace .checks div,#comment .step,#tarif .tile{background:#F6F8FC;box-shadow:none}
.card::before,.tile::before,.step::before,.vx::before{content:"";position:absolute;left:24px;right:24px;top:0;height:1.5px;
  background:linear-gradient(90deg,transparent,var(--neon),transparent);box-shadow:0 0 12px rgba(47,107,255,.7)}
.step,.vx,.tile{position:relative;overflow:hidden}
#tarif .tile.best{background:#fff;box-shadow:0 0 0 1.5px rgba(47,107,255,.55),0 0 40px -6px rgba(47,107,255,.35),var(--sh2)}
.tile .tag{box-shadow:0 0 16px rgba(47,107,255,.55)}
.fenetre,.ph,.media,.demo-box .pic{box-shadow:var(--sh3)}
.win-glow{opacity:.3}
.call{-webkit-backdrop-filter:none;backdrop-filter:none;border-color:var(--line)}
.media .ui{background:rgba(255,255,255,.92);color:var(--g-72)}
.media .tag{color:var(--white)}
.cli{background:#fff}
.cli img{filter:none;opacity:1}
.demo-box{background:radial-gradient(90% 90% at 0% 50%,rgba(47,107,255,.09),transparent 60%),#fff;box-shadow:var(--sh2)}
.calc .b.res .v{text-shadow:0 0 40px rgba(47,107,255,.35)}
.step .n{-webkit-text-stroke:1.5px rgba(47,107,255,.6)}
.vx.joue{box-shadow:0 0 0 1.5px rgba(47,107,255,.5),0 0 40px -8px rgba(47,107,255,.45)}
.tab-bar button.on::after{box-shadow:0 0 10px var(--neon)}
footer{background:#fff}
.av{background:conic-gradient(from 0deg,#2F6BFF,#2DD5DC,#2F6BFF)}
.live{color:var(--neon)}

/* ── Héros : lumière du jour, Zuri à droite, texte sur le clair de la pièce ── */
.cine h1{text-shadow:none}
.cine .lead{color:var(--g-60)}
.cine .hint{color:var(--g-45)}
.cine .hint b{color:var(--white)}
.cine-note{color:rgba(11,18,32,.45)}
.cine-veil::after{background:linear-gradient(90deg,transparent,rgba(47,107,255,.7),transparent);box-shadow:0 0 12px rgba(47,107,255,.6)}
.cine.gauche .cine-bg{left:14%}
.cine.gauche .cine-veil{background:linear-gradient(90deg,#F6F8FC 0%,rgba(246,248,252,.94) 32%,rgba(246,248,252,.45) 54%,rgba(246,248,252,0) 70%),
  linear-gradient(180deg,transparent 70%,#F6F8FC 100%)}
.cine.gauche .txt{max-width:600px}
@media (max-width:760px){
  .cine.gauche{flex-direction:column;align-items:stretch;padding:14px 0 56px}
  .cine.gauche .cine-bg{position:relative;inset:auto;left:auto;height:44vh;margin:0 var(--gut) 26px;border-radius:26px;overflow:hidden;box-shadow:var(--sh3)}
  .cine.gauche .cine-bg img{height:100%;object-position:88% 30%}
  .cine.gauche .cine-veil,.cine-note{display:none}
}

/* ══ Accueil : héros clair, texte centré puis la photo dans un grand cadre ══ */
.hc{position:relative;isolation:isolate;overflow:hidden;padding:clamp(56px,8vh,110px) 0 clamp(48px,6vw,88px)}
.hc::before{content:"";position:absolute;left:50%;top:-24%;width:min(1300px,120vw);height:820px;transform:translateX(-50%);z-index:-1;
  background:radial-gradient(closest-side,rgba(47,107,255,.13),rgba(45,213,220,.05) 55%,transparent 72%)}
.hc h1{font-size:clamp(2.6rem,6vw,5.2rem);letter-spacing:-.05em;margin-top:20px}
.hc .lead{max-width:60ch}
.hc-stage{position:relative;margin-top:clamp(44px,6vw,76px);border-radius:34px;overflow:hidden;aspect-ratio:21/9;box-shadow:var(--sh3);border:1px solid var(--line)}
.hc-stage > img{width:100%;height:100%;object-fit:cover;object-position:62% 42%}
.hc-stage::after{content:"";position:absolute;left:12%;right:12%;bottom:0;height:2px;background:linear-gradient(90deg,transparent,var(--neon),transparent);box-shadow:0 0 16px var(--neon)}
.hc-pill{position:absolute;left:clamp(14px,2.4vw,28px);bottom:clamp(14px,2.4vw,28px);display:flex;align-items:center;gap:12px;padding:9px 18px 9px 9px;border-radius:999px;
  background:rgba(255,255,255,.95);box-shadow:var(--sh2);border:1px solid var(--line)}
.hc-pill .av{width:40px;height:40px}
.hc-pill b{display:block;font-size:.92rem}
.hc-pill span{display:block;font-size:.76rem;color:var(--g-60)}
.hc-pill .ok{margin-left:8px;font:600 .72rem var(--mono);color:#16a34a;white-space:nowrap}
.hc-note{position:absolute;right:20px;bottom:16px;font-size:.7rem;color:rgba(255,255,255,.75)}
@media (max-width:760px){.hc-stage{aspect-ratio:4/5}.hc-stage > img{object-position:66% 50%}.hc-pill .ok{display:none}.hc-note{display:none}}
/* cartes d'équipe : portraits sur blanc, le texte se pose sur un blanc qui monte */
.agent::before{background:linear-gradient(180deg,transparent 40%,rgba(255,255,255,.86) 64%,#fff 100%)}
.agent{background:#fff;box-shadow:var(--sh2)}
.agent:hover{box-shadow:0 0 0 1.5px color-mix(in srgb,var(--c) 60%,transparent),0 30px 70px -30px var(--c)}
.origine::before{background:linear-gradient(90deg,rgba(246,248,252,.97) 0%,rgba(246,248,252,.9) 38%,rgba(246,248,252,.3) 70%,rgba(246,248,252,.1) 100%),linear-gradient(180deg,#F6F8FC 0%,transparent 16%,transparent 84%,#F6F8FC 100%)}
.origine .note{color:rgba(11,18,32,.45)}
.origine blockquote{border-left-color:var(--neon);box-shadow:-8px 0 16px -12px var(--neon)}
.stage-frame::after{background:linear-gradient(90deg,rgba(246,248,252,.9) 0%,rgba(246,248,252,.45) 34%,transparent 56%)}
.stage-frame{border-color:var(--line);box-shadow:var(--sh3)}
.stage-glow{opacity:.35}
.horloge{border-color:rgba(47,107,255,.3);box-shadow:var(--sh2)}
.snx{box-shadow:var(--sh2)}
.law .card,.tiles .tile{background:#fff}
.hint{color:var(--g-60)}
.hint b{color:var(--white)}
.origine > img{object-position:88% 40%}
.origine::before{background:linear-gradient(90deg,rgba(246,248,252,.99) 0%,rgba(246,248,252,.96) 44%,rgba(246,248,252,.45) 70%,rgba(246,248,252,.12) 100%),linear-gradient(180deg,#F6F8FC 0%,transparent 16%,transparent 84%,#F6F8FC 100%)}
@media (max-width:760px){.origine::before{background:linear-gradient(180deg,rgba(246,248,252,.5) 0%,rgba(246,248,252,.94) 46%,#F6F8FC 100%)}}
