/* Espace client — design validé par Pascal le 09/10/2026 (maquettes .apercu-espace-*, style « Suisse », verre dépoli, mobile).
   Assemblé depuis : commun.css, fin.css, styles de l'accueil (B-piliers), verre.css, style-2.css — même ordre que la maquette. */

/* ═══ .apercu-espace-commun.css ═══ */
/* MAQUETTE 07/10/2026 — Synthèse de l'espace client sur le modèle « agrégateur de patrimoine »
   demandé par Pascal. Données fictives, aucun appel serveur. Palette reprise de public/espace/. */
:root{--bg:#F5F6F8;--card:#fff;--line:#E6E8EE;--ink:#0F1E3D;--muted:#6B7280;--soft:#9AA3B2;--gold:#C9A24B;--gold-d:#A8822F;--gold-t:#FBF5E6;--navy:#0F1E3D;--navy-t:#EEF1F8;--up:#1F7A4D;--up-t:#E8F4EE;--down:#B4472A;--r:16px}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:'Plus Jakarta Sans',system-ui,Arial,sans-serif;font-size:14.5px;line-height:1.5}
button{font-family:inherit}
.demo{position:fixed;top:0;left:0;right:0;height:28px;background:#111827;color:#E5E7EB;font-size:11px;letter-spacing:.1em;text-transform:uppercase;display:flex;align-items:center;justify-content:center;z-index:60}
.shell{display:flex;min-height:100vh;padding-top:28px}
/* menu */
.side{width:248px;flex:none;background:var(--bg);padding:22px 14px 16px;position:sticky;top:28px;height:calc(100vh - 28px);display:flex;flex-direction:column;overflow-y:auto}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px;padding:0 10px 26px}
.logo i{width:30px;height:30px;border-radius:9px;background:var(--navy);position:relative;flex:none}
.logo i:after{content:"";position:absolute;inset:9px;border:2px solid #E3C489;transform:rotate(45deg)}
.nav{display:flex;flex-direction:column;gap:3px}
.nav a{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:12px;font-weight:600;color:#374151;text-decoration:none;cursor:pointer;font-size:14.5px}
.nav a svg{width:19px;height:19px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
.nav a:hover{background:#ECEEF2}
.nav a.on{background:#E4E7EE;color:var(--navy);font-weight:700}
.nav a.off{color:var(--soft);cursor:default}.nav a.off:hover{background:none}
.pill{margin-left:auto;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--gold-t);color:var(--gold-d);white-space:nowrap}
.pill.grey{background:#ECEEF2;color:var(--soft)}
.sub{display:none;flex-direction:column;padding:2px 0 6px 45px}
.sub.open{display:flex}
.sub a{padding:6px 8px;font-size:13px;font-weight:500;color:#4B5563}
.chev{margin-left:auto;transition:transform .15s}.open-chev .chev{transform:rotate(90deg)}
.conseiller{margin-top:auto;background:var(--navy);color:#fff;border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:10px}
.conseiller .top{display:flex;gap:10px;align-items:center}
.conseiller .ph{width:38px;height:38px;border-radius:50%;background:#2A3A5E;display:grid;place-items:center;font-weight:800;font-size:13px;color:#E3C489;flex:none}
.conseiller b{font-size:13.5px;display:block}.conseiller small{color:#AEB8CC;font-size:12px}
.conseiller button{background:var(--gold);color:var(--navy);border:0;border-radius:10px;padding:9px 12px;font-weight:800;font-size:13px;cursor:pointer}
.me{display:flex;align-items:center;gap:10px;padding:14px 10px 0;font-weight:700;font-size:14px}
.me .av{width:34px;height:34px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:800}
/* haut */
.main{flex:1;min-width:0;padding:18px 26px 40px}
.topbar{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-bottom:18px;flex-wrap:wrap}
.ico{width:38px;height:38px;border-radius:50%;border:0;background:transparent;display:grid;place-items:center;cursor:pointer;color:var(--ink)}
.ico:hover{background:#ECEEF2}
.ico svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:9px 16px;font-weight:700;font-size:13.5px;border:0;cursor:pointer;white-space:nowrap}
.btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round}
.btn.ghost{background:#E9EBF0;color:var(--soft);cursor:not-allowed}
.btn.ghost .pill{margin-left:2px}
.btn.gold{background:var(--gold);color:var(--navy)}
.btn.gold:hover{background:#D4B062}
.btn.navy{background:var(--navy);color:#fff}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.select{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--card);border-radius:999px;padding:8px 14px;font-weight:600;font-size:13.5px}
.periods{display:flex;gap:2px}
.periods button{border:0;background:transparent;padding:7px 11px;border-radius:999px;font-weight:600;font-size:13px;color:#4B5563;cursor:pointer}
.periods button.on{background:var(--gold-t);color:var(--gold-d)}
/* grille */
.grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:16px}
.card{background:var(--card);border-radius:var(--r);padding:22px 24px;min-width:0}
.date{color:var(--muted);font-size:13px}
.total{font-family:'Fraunces',serif;font-weight:600;font-size:44px;letter-spacing:-.01em;line-height:1.1;margin:2px 0 6px}
.var{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;white-space:nowrap;font-weight:700;font-size:14px;color:var(--up)}
.tag{font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--up-t);color:var(--up)}
.var small{color:var(--muted);font-weight:500;font-size:12.5px}
.chart{margin-top:14px;width:100%;height:250px;display:block}
.chart text{font-size:11px;fill:var(--soft);font-family:inherit}
.ctitle{font-weight:700;font-size:16px;margin:0 0 12px;display:flex;justify-content:space-between;align-items:center}
.ctitle a{font-size:13px;color:var(--gold-d);font-weight:700;text-decoration:none;cursor:pointer}
.donut{display:flex;gap:20px;align-items:center}
.donut svg{width:160px;height:160px;flex:none}
.legend{flex:1;display:flex;flex-direction:column;gap:9px;min-width:0}
.legend div{display:grid;grid-template-columns:10px 1fr auto;gap:9px;align-items:center;font-size:13.5px}
.legend i{width:10px;height:10px;border-radius:3px}
.legend b{font-weight:700}
.legend span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.revenus{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:12px}
.revenus small{color:var(--muted);font-size:12.5px;display:block}
.revenus b{font-size:20px;font-weight:800}
/* connexion banques (teasing) */
.teaser{margin-top:16px;background:linear-gradient(120deg,#0F1E3D 0%,#1B2E57 100%);color:#fff;border-radius:var(--r);padding:22px 24px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px;align-items:center}
.teaser h3{font-family:'Fraunces',serif;font-weight:600;font-size:22px;margin:6px 0 6px}
.teaser p{color:#C5CDDD;margin:0 0 14px;font-size:14px}
.teaser .pill{background:rgba(201,162,75,.18);color:#E3C489}
.banques{display:flex;gap:8px;flex-wrap:wrap}
.banques span{background:rgba(255,255,255,.08);border:1px dashed rgba(255,255,255,.25);border-radius:10px;padding:8px 12px;font-size:12.5px;color:#AEB8CC}
.q{background:#fff;color:var(--ink);border-radius:14px;padding:18px}
.q b{display:block;font-size:14.5px;margin-bottom:12px}
.choix{display:flex;gap:8px;flex-wrap:wrap}
.choix button{flex:1;min-width:80px;border:1.5px solid var(--line);background:#fff;border-radius:10px;padding:10px;font-weight:700;font-size:14px;cursor:pointer;color:var(--ink)}
.choix button:hover{border-color:var(--navy)}
.choix button.on{border-color:var(--navy);background:var(--navy);color:#fff}
.q .suite{margin-top:12px;display:none}
.q .suite.on{display:block}
.q input{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;font-family:inherit;font-size:14px}
.q .merci{margin-top:10px;font-size:13px;color:var(--up);font-weight:700;display:none}
.q .merci.on{display:block}
/* placements */
h2{font-size:19px;font-weight:700;margin:28px 0 12px;display:flex;justify-content:space-between;align-items:center}
.cards{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(240px,1fr);gap:14px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.pc{background:var(--card);border-radius:14px;padding:16px 18px;min-width:0}
.pc .h{display:flex;gap:10px;align-items:center;margin-bottom:12px}
.pc .lg{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;font-weight:800;font-size:12px;flex:none}
.pc .h b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc .h small{color:var(--muted);font-size:12px}
.pc .b{display:flex;justify-content:space-between;align-items:flex-end}
.pc .v{font-size:19px;font-weight:800}
.pc .g{font-size:12px;font-weight:700;color:var(--up);margin-top:2px}
.pc .g.manu{color:var(--soft);font-weight:600}
.pc svg{width:96px;height:38px}
.add{border:1.5px dashed #CBD1DC;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--muted);font-weight:700;cursor:pointer;border-radius:14px;min-height:118px}
.add svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round}
/* analyse */
.an{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.an .card{display:flex;flex-direction:column;gap:6px}
.an .card small{color:var(--muted);font-size:12.5px}
.an .card .k{font-size:20px;font-weight:800;display:flex;align-items:center;gap:8px}
.an .card .k .tag.warn{background:#FFF1EA;color:#C2540A}
.an .card a{margin-top:auto;padding-top:10px;color:var(--gold-d);font-weight:700;font-size:13px;text-decoration:none;cursor:pointer}
.amf{margin-top:26px;font-size:12px;color:var(--soft);line-height:1.6}
.blur .m{filter:blur(7px)}
/* mobile */
.tabbar{display:none}
@media (max-width:1100px){.grid{grid-template-columns:1fr}.teaser{grid-template-columns:1fr}.an{grid-template-columns:1fr}}
@media (max-width:820px){
  .side{display:none}
  .main{padding:14px 16px 90px}
  .total{font-size:36px}
  .topbar .btn.ghost .lbl{display:none}
  .donut{flex-direction:column;align-items:stretch}.donut svg{align-self:center}
  .tabbar{display:flex;position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--line);justify-content:space-around;padding:8px 4px 12px;z-index:40}
  .tabbar a{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;font-weight:600;color:var(--muted);text-decoration:none}
  .tabbar a.on{color:var(--navy)}
  .tabbar svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  .periods button{padding:6px 8px}
}
.btn{text-decoration:none}

/* ═══ .apercu-espace-fin.css ═══ */
/* Pascal 07/10 : « plus fin dans le design ». Surcouche chargée en dernier sur toutes les pages de l'espace :
   graisses plus légères, filets fins, chiffres en sans-serif, curseurs et courbes affinés. */
body{font-size:14px}
b,strong{font-weight:600}
.card{border:1px solid var(--line);border-radius:14px;padding:20px 22px}
.phead .lg{width:44px;height:44px;border-radius:12px}.phead .lg svg{width:22px;height:22px;stroke-width:1.5}
.phead h1{font-size:28px;font-weight:600;letter-spacing:-.025em}
.phead p{font-size:14px}
.sect>h2,h2{font-size:17px;font-weight:600;letter-spacing:-.01em}
.ctitle{font-size:15px;font-weight:600}
.big,.total{font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-weight:500;letter-spacing:-.03em}
.big{font-size:34px}
.nav a{font-weight:500;font-size:14px;padding:9px 12px}.nav a.on{font-weight:600;background:#E9ECF2}
.nav a svg{stroke-width:1.4}
.logo{font-weight:700;font-size:17px}
.btn{font-weight:600;font-size:13px;padding:8px 15px}
.chips button{border:1px solid var(--line);padding:5px 12px;font-weight:500;font-size:13px}
.chips button.on{font-weight:600}
.tabs button{font-weight:500}
.pill{font-weight:600}
.conseiller button{font-weight:600}.conseiller .ph{font-weight:600}
.me{font-weight:600}.me .av{font-weight:600}
.legend div{font-size:13px}.legend b{font-weight:500}
.sl label{font-weight:500;font-size:13px}.sl label b{font-weight:600;font-size:14px}
.sl input[type=range]{-webkit-appearance:none;appearance:none;height:2px;background:var(--line);border-radius:2px;outline:0;margin:10px 0 4px}
.sl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#fff;border:1.5px solid var(--gold-d);cursor:pointer;box-shadow:0 1px 3px rgba(15,30,61,.15)}
.sl input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:1.5px solid var(--gold-d);cursor:pointer}
.out div{background:transparent;border:1px solid var(--line)}
.out b{font-weight:500;letter-spacing:-.02em}
.perfs .v{font-weight:600;font-size:13px}
.perfs .bar{max-width:38px;border-radius:4px 4px 0 0}.perfs .bar.neg{border-radius:0 0 4px 4px}
.perfs .haut{border-bottom:1px solid #DDE1E8}
.perfs-x span{font-weight:500;font-size:12px}
.tbl{font-size:13px}.tbl td.n{font-weight:500}.tbl td{padding:9px 10px}
.part{border:1px solid var(--line)}.part b{font-weight:600;font-size:14px}
.part .tags span{font-weight:500}
.ctaband b{font-weight:600;font-size:16px}
#sCourbe polyline,#bars polyline{stroke-width:1.6}
/* Accueil */
.hello h1,h1{font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-weight:600;font-size:28px;letter-spacing:-.025em}
.val,.pil .val{font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-weight:500;letter-spacing:-.03em}
.pil h3{font-size:20px;font-weight:600}
.lignes span.m{font-weight:500}
/* Pascal 08/10 : cartes « beaucoup moins marquées IA » (modèle montré) — dégradé doux de la couleur du produit,
   formes rondes floues en haut à droite, titre + sous-titre, filet, coches fines, bouton pilule + lien texte. */
.fc{position:relative;overflow:hidden;border-radius:16px;padding:26px 28px;border:1px solid var(--line);background:#fff}
.fc.av{background:linear-gradient(135deg,#F7EEDB 0%,#FFFFFF 55%)}
.fc.per{background:linear-gradient(135deg,#E3E8F6 0%,#FFFFFF 55%)}
.fc .deco{position:absolute;top:-40px;right:-30px;width:190px;height:190px;pointer-events:none}
.fc .deco i{position:absolute;border-radius:50%;filter:blur(.5px)}
.fc.av .deco i:nth-child(1){width:120px;height:120px;right:40px;top:40px;background:radial-gradient(circle at 30% 30%,#FFF6E0,#D9B56A 70%);opacity:.75}
.fc.av .deco i:nth-child(2){width:90px;height:90px;right:0;top:10px;background:radial-gradient(circle at 30% 30%,#FFFFFF,#E8D3A3 75%);opacity:.6}
.fc.per .deco i:nth-child(1){width:120px;height:120px;right:40px;top:40px;background:radial-gradient(circle at 30% 30%,#F3F5FC,#8FA4D6 70%);opacity:.7}
.fc.per .deco i:nth-child(2){width:90px;height:90px;right:0;top:10px;background:radial-gradient(circle at 30% 30%,#FFFFFF,#C3CFEC 75%);opacity:.6}
.fc .marque{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:500;margin-bottom:18px;position:relative}
.fc .marque span{width:30px;height:30px;border-radius:50%;background:#0F1E3D;display:grid;place-items:center}
.fc .marque span:after{content:"";width:9px;height:9px;border:1.5px solid #E3C489;transform:rotate(45deg)}
.fc h3{font-size:20px;font-weight:500;margin:0 0 6px;position:relative;max-width:80%}
.fc .sous{color:var(--muted);font-size:14px;margin:0;max-width:85%;position:relative}
.fc hr{border:0;border-top:1px solid var(--line);margin:18px 0}
.fc ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;font-size:14px}
.fc li{display:block;position:relative;padding-left:24px}
.fc li:before{content:"";position:absolute;left:1px;top:6px;width:12px;height:7px;border-left:1.6px solid #0F1E3D;border-bottom:1.6px solid #0F1E3D;transform:rotate(-45deg)}
.fc .deja{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line);border-radius:10px;padding:11px 14px;margin-top:18px;font-size:13.5px;color:var(--gold-d);text-decoration:none;background:#fff}
.fc.per .deja{color:#3D5A94}
.fc .bas{display:flex;align-items:center;gap:22px;margin-top:22px}
.fc .bas .btn{background:#E9B76A;color:#1B1405;font-weight:500;padding:11px 20px;text-decoration:none}
.fc .bas .txt{color:var(--ink);font-size:14px;text-decoration:none}
.tranches{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.tranches div{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:#fff}
.tranches small{color:var(--muted);font-size:12px;display:block}.tranches b{font-size:22px;font-weight:500;color:#1F7A4D}
@media (max-width:820px){.tranches{grid-template-columns:repeat(2,minmax(0,1fr))}.fc h3,.fc .sous{max-width:100%}}

/* ═══ b.css ═══ */
:root{--nuit:#0F1E3D;--or:#C9A24B;--or-c:#E3C489;--creme:#FAF8F1;--sable:#F1EBDA;--bleu:#E6ECF7;--txt:#3F4452;--titre:#0F1E3D;--filet:#E9E3D2}
html,body{background:#fff}
body{font-family:'Plus Jakarta Sans',system-ui,sans-serif;color:var(--txt);font-size:16px;line-height:1.5}
.side{background:#fff;border-right:1px solid #F0ECE0}
.main{padding:0 0 64px;max-width:none}
.wrap{max-width:1180px;margin:0 auto;padding:0 48px}

/* ── boutons : pilule 56 px, 600 ── */
.b1,.b2{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:56px;padding:0 32px;border-radius:999px;font:600 16px/1 'Plus Jakarta Sans',sans-serif;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s}
.b1{background:var(--nuit);color:#fff;border:0}.b1:hover{background:#1A2E57}
.b2{background:#fff;color:var(--nuit);border:1px solid var(--nuit)}.b2:hover{background:#F6F3EA}
.b1 svg,.b2 svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.btns{display:flex;gap:16px;flex-wrap:wrap}

/* ── typo ── */
.h1{font-size:40px;line-height:1.5;font-weight:600;letter-spacing:-.01em;color:var(--titre);margin:0 0 24px}
.h2{display:block;font-size:32px;line-height:1.45;font-weight:600;letter-spacing:-.01em;color:var(--titre);margin:0}
.h3{font-size:22px;line-height:1.4;font-weight:600;color:var(--titre);margin:0}
.ctr{text-align:center}
.sous{font-size:16px;margin:12px 0 0;color:var(--txt)}

/* ── en-tête : bande crème pleine largeur, arrondie en bas ── */
.tete{background:var(--creme);border-radius:0 0 64px 64px;padding:36px 0 64px;margin-bottom:32px}
.fil{font-size:15px;color:var(--txt);margin:0 0 36px;display:flex;gap:12px;align-items:center}
.fil a{color:var(--nuit);text-decoration:none;font-weight:500}.fil svg{width:14px;height:14px;stroke:#8C93A3;fill:none;stroke-width:2}
.hero{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.etq{display:inline-block;background:var(--sable);color:var(--txt);border-radius:24px;padding:8px 16px;font-size:15px;margin-bottom:28px}
.chapo{font-size:16px;font-weight:600;line-height:1.55;color:var(--txt);margin:0 0 32px;max-width:500px}
.conf{display:flex;align-items:center;gap:12px;margin-top:40px;font-size:14.5px;color:var(--txt)}
.conf i{flex:none;width:40px;height:40px;border-radius:50%;background:#fff;border:1px solid var(--filet);display:grid;place-items:center}
.conf svg{width:20px;height:20px;stroke:var(--nuit);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.conf b{font-weight:600;color:var(--nuit)}

/* bannières de droite */
.ban{position:relative;display:block;overflow:hidden;border-radius:16px;background:linear-gradient(115deg,#0F1E3D 0%,#182C57 100%);color:#fff;text-decoration:none}
.ban+.ban{margin-top:16px}
.ban.un{padding:46px 28px 30px;min-height:236px}
.ban .onglet{position:absolute;top:0;left:50%;transform:translateX(-30%);background:var(--creme);color:var(--nuit);font-size:12.5px;padding:6px 16px;border-radius:0 0 12px 12px;white-space:nowrap}
.ban .t{position:relative;z-index:2;display:block;font-size:27px;line-height:1.22;font-weight:600;letter-spacing:-.01em;max-width:52%}
.ban .pas{position:relative;z-index:2;display:inline-flex;margin-top:22px;background:#fff;color:var(--nuit);border-radius:12px;padding:10px 16px;font-size:17px;font-weight:600;box-shadow:0 4px 0 rgba(255,255,255,.22)}
.ban .pas span{color:var(--or);margin-right:6px}
/* mini relevé : l'exemple de Julie, en petit, à droite */
.releve{position:absolute;z-index:1;right:24px;top:50px;width:196px;background:rgba(255,255,255,.06);border:1px solid rgba(227,196,137,.28);border-radius:14px;padding:14px 16px;font-size:12.5px;color:#C9D1E1;backdrop-filter:blur(2px)}
.releve .l{display:flex;justify-content:space-between;padding:6px 0;border-top:1px solid rgba(255,255,255,.09)}.releve .l:first-of-type{border-top:0}
.releve .l b{color:#fff;font-weight:600}.releve .l.ok b{color:var(--or-c)}
.releve .n{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--or-c);margin-bottom:6px}
.ban.deux{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:28px 30px;min-height:124px}
.ban.deux .t{max-width:none;font-size:26px;line-height:1.2}.ban.deux .t span{font-weight:400}
.ban.deux svg{flex:none;width:118px;height:84px}
.note{font-size:12.5px;color:#7A7F8A;line-height:1.55;margin:12px 0 0}

/* ── cartes crème, rayon 48 ── */
.g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.ca{background:var(--creme);border-radius:40px;padding:28px 24px 24px;display:flex;flex-direction:column}
.ic{width:56px;height:56px;border-radius:12px;background:var(--sable);display:grid;place-items:center;margin-bottom:24px;flex:none}
.ic svg{width:24px;height:24px;stroke:var(--nuit);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ca .h3{margin-bottom:16px}
.ca p{margin:0 0 24px;font-size:16px;line-height:1.5}
.sav{margin-top:auto;display:flex;gap:10px;align-items:flex-start;background:var(--bleu);border-radius:24px;padding:14px 16px;font-size:13.5px;line-height:1.45;color:var(--txt)}
.sav svg{flex:none;width:18px;height:18px;margin-top:1px;stroke:var(--nuit);fill:none;stroke-width:1.5}
.sav b{font-weight:600;color:var(--nuit)}
.renvoi{font-size:13.5px;color:var(--txt);margin:16px 0 0}

section{margin-bottom:96px}
.tete+.wrap>section:first-child{margin-bottom:96px}

/* ── bloc crème large (qu'est-ce que c'est / exemple) ── */
.bloc{background:var(--creme);border-radius:48px;padding:48px 64px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.bloc .h2{margin-bottom:24px}
.bloc p{margin:0 0 32px;line-height:1.5}
.bloc .btns .b1,.bloc .btns .b2{padding:0 26px}
.tab{background:#fff;border:1px solid var(--filet);border-radius:16px;overflow:hidden}
.tab div{display:flex;justify-content:space-between;gap:20px;padding:14px 18px;border-top:1px solid #EFEADC;font-size:15.5px}
.tab div:first-child{border-top:0}
.tab div:nth-child(even){background:#FCFBF7}
.tab span{color:var(--txt);flex:none;max-width:48%}.tab b{font-weight:600;color:var(--nuit);text-align:right}
.tab .vert b{color:#1F7A4D}
.tab-t{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:#7C8496;margin:0 0 12px}
.src{font-size:12.5px;color:#7C8496;margin:12px 0 0}

/* bande d'appel */
.bande{background:var(--creme);border-radius:48px;padding:40px 64px;display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap}
.bande b{font-size:22px;line-height:1.55;font-weight:600;color:var(--nuit);max-width:560px}

/* deux colonnes titre / texte */
.deuxc{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;padding:0 64px;margin-bottom:48px}
.deuxc p{margin:0 0 8px;line-height:1.55}.deuxc p b{font-weight:600;color:var(--nuit)}

/* simulateur */
.sim{background:#fff;border:1px solid var(--filet);border-radius:24px;padding:32px;align-self:stretch}
.sim .st{font-size:20px;font-weight:600;color:var(--nuit);margin:0 0 24px}
.sim label{display:flex;justify-content:space-between;font-size:15px;margin:0 0 10px;color:var(--txt)}.sim label b{font-weight:600;color:var(--nuit)}
.sim input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:4px;background:#ECE6D6;margin:4px 0 26px;outline:0}
.sim input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:var(--nuit);border:4px solid #fff;box-shadow:0 0 0 1px var(--nuit);cursor:pointer}
.sim input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--nuit);border:4px solid #fff;cursor:pointer}
.sim .chips{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0 0 26px}
.sim .chips button{height:44px;border-radius:999px;border:1px solid #DDD5C0;background:#fff;color:var(--nuit);font:500 15px 'Plus Jakarta Sans',sans-serif;cursor:pointer;padding:0}
.sim .chips button.on{background:var(--nuit);border-color:var(--nuit);color:#fff;font-weight:600}
.sim .r{border-top:1px solid #EFEADC;padding-top:20px}
.sim .r .l{display:flex;justify-content:space-between;align-items:baseline;gap:16px;font-size:15px;padding:7px 0}
.sim .r .l b{font-weight:600;color:var(--nuit);white-space:nowrap}
.sim .r .l.eco span{font-weight:600;color:var(--nuit)}.sim .r .l.eco b{font-size:22px;color:#1F7A4D}
.sim .info{background:var(--bleu);border-radius:16px;padding:12px 16px;font-size:13.5px;line-height:1.5;color:var(--txt)}
.sim .b1{width:100%;margin-top:24px}
.sim .note{text-align:center}

/* transfert : un panneau, trois étapes séparées par un filet */
.etapes{background:var(--creme);border-radius:48px;padding:40px 32px;display:grid;grid-template-columns:repeat(3,1fr);margin-top:48px}
.etapes>div{padding:0 32px;border-left:1px solid var(--filet)}.etapes>div:first-child{border-left:0}
.etapes .num{width:56px;height:56px;border-radius:12px;background:var(--sable);display:grid;place-items:center;font-size:24px;font-weight:600;color:var(--nuit);margin-bottom:24px}
.etapes .h3{margin-bottom:12px}
.etapes p{margin:0;line-height:1.5}
.centre{display:flex;justify-content:center;margin-top:32px}
.anoter{display:flex;gap:16px;align-items:center;background:var(--bleu);border-radius:48px;padding:22px 28px;margin-top:32px;font-size:14.5px;line-height:1.5}
.anoter svg{flex:none;width:24px;height:24px;stroke:var(--nuit);fill:none;stroke-width:1.5}
.anoter b{font-weight:600;color:var(--nuit)}
.oubli{max-width:896px;margin:64px auto 0;background:var(--creme);border-radius:48px;padding:40px 32px 32px;text-align:center}
.oubli .h2{font-size:28px;line-height:1.5}
.oubli p{margin:12px 0 24px}
.oubli .b2{width:100%}

/* risques + engagements : deux panneaux, lignes avec icône */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:48px}
.pan{border-radius:48px;padding:40px}
.pan.r{background:var(--creme)}
.pan.e{background:var(--nuit);color:#C9D1E1}
.pan .tt{font-size:13px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;margin:0 0 8px;color:#7C8496}
.pan.e .tt{color:var(--or-c)}
.li{display:grid;grid-template-columns:56px 1fr;gap:20px;padding:22px 0;border-top:1px solid var(--filet)}
.pan.e .li{border-top-color:rgba(255,255,255,.1)}
.li:first-of-type{border-top:0}
.li .ic{margin:0}
.pan.e .ic{background:rgba(227,196,137,.12)}.pan.e .ic svg{stroke:var(--or-c)}
.li b{display:block;font-size:18px;font-weight:600;color:var(--nuit);margin:2px 0 6px}
.pan.e .li b{color:#fff}
.li span{font-size:15px;line-height:1.5}

/* FAQ : titre à gauche, accordéon à droite */
.faq{display:grid;grid-template-columns:310px 1fr;gap:40px;align-items:start}
.faq details{border-bottom:1px solid #E6E1D3}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;font-size:21px;font-weight:600;line-height:1.45;color:var(--nuit)}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{flex:none;width:20px;height:20px;stroke:var(--nuit);fill:none;stroke-width:1.8;transition:transform .2s;margin-right:40px}
.faq details[open] summary svg{transform:rotate(90deg);stroke:var(--or)}
.faq details[open] summary{color:#1A2E57}
.faq details p{margin:-8px 0 24px;line-height:1.6;max-width:860px}

/* fin : besoin d'un conseil */
.fin{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding:0 48px}
.fin .h2{font-size:40px;line-height:1.5;margin-bottom:24px}
.fin p{margin:0 0 16px;line-height:1.55}
.cons{background:linear-gradient(115deg,#0F1E3D 0%,#182C57 100%);border-radius:16px;padding:40px;color:#C9D1E1}
.cons .id{display:flex;gap:16px;align-items:center;margin-bottom:28px}
.cons .ph{width:56px;height:56px;border-radius:50%;background:#22355F;border:1px solid rgba(227,196,137,.4);display:grid;place-items:center;color:var(--or-c);font-weight:600;font-size:18px}
.cons .id b{display:block;color:#fff;font-size:19px;font-weight:600}
.cons .id small{font-size:14px}
.cons .msg{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:16px 20px;font-size:15px;line-height:1.5;color:#E3E8F1;margin-bottom:12px;max-width:88%}
.cons .msg.moi{margin-left:auto;background:rgba(227,196,137,.12);border-color:rgba(227,196,137,.3)}
.cons .btns{margin-top:28px;flex-wrap:nowrap;gap:12px}.cons .btns>*{flex:1;padding:0 16px}
.cons .b1{background:var(--or-c);color:var(--nuit)}.cons .b1:hover{background:#EBCF98}
.cons .b2{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}.cons .b2:hover{background:rgba(255,255,255,.06)}

.mentions{font-size:12.5px;color:#7A7F8A;line-height:1.6;border-top:1px solid #EEE9DC;padding-top:24px;margin-top:0}

/* ── responsive ── */
@media (max-width:1240px){.g4{grid-template-columns:1fr 1fr}.ban .t{font-size:26px}}
@media (max-width:1100px){.hero,.bloc,.deuxc,.duo,.faq,.fin{grid-template-columns:1fr}.deuxc,.fin{padding:0}.bloc{padding:40px}}
@media (max-width:820px){
  .wrap{padding:0 16px}
  .tete{border-radius:0 0 40px 40px;padding:24px 0 40px}
  .h1{font-size:30px;line-height:1.35}.h2{font-size:26px;line-height:1.35}.fin .h2{font-size:30px}
  .g4{grid-template-columns:1fr}.ca{border-radius:32px;padding:28px}
  .bloc{padding:28px 20px;border-radius:32px;gap:32px}
  .bande{padding:28px 24px;border-radius:32px}.bande b{font-size:19px}
  .etapes{grid-template-columns:1fr;padding:28px 24px;border-radius:32px;row-gap:28px}.etapes>div{padding:0;border-left:0}
  .etapes>div+div{border-top:1px solid var(--filet);padding-top:28px}
  .anoter{border-radius:24px;padding:18px 20px}
  .oubli{border-radius:32px;padding:28px 20px}.oubli .b2{white-space:normal;height:auto;min-height:56px;padding:12px 20px;text-align:center}
  .pan{border-radius:32px;padding:28px 22px}
  .sim{padding:22px}
  .faq summary{font-size:18px}.faq summary svg{margin-right:0}
  .cons{padding:28px 22px}
  .cons .btns{flex-wrap:wrap}.cons .btns>*{flex:1 1 100%}
  .ban.un{padding:44px 22px 24px}.ban .t{max-width:none;font-size:24px}
  .releve{display:block;position:relative;right:auto;top:auto;width:auto;margin-top:22px}
  .tab span{flex:1 1 auto;max-width:none}.tab b{flex:0 1 auto}.tab div{padding:13px 16px;font-size:15px}
  .ban.deux{padding:24px 22px}.ban.deux .t{font-size:21px}.ban.deux svg{width:84px}
  .b1,.b2{padding:0 24px}
  section{margin-bottom:64px}
}
/* ── ajouts propres à « Mon portefeuille », dans le vocabulaire du PER (rayons, crème, pilules) ── */
/* synthèse d'en-tête : même panneau nuit que les bannières du modèle, en lignes sobres (pas de gros chiffres) */
.synth{position:relative;overflow:hidden;border-radius:16px;background:linear-gradient(115deg,#0F1E3D 0%,#182C57 100%);color:#C9D1E1;padding:46px 28px 28px}
.synth .onglet{position:absolute;top:0;left:50%;transform:translateX(-30%);background:var(--creme);color:var(--nuit);font-size:12.5px;padding:6px 16px;border-radius:0 0 12px 12px;white-space:nowrap}
.synth .t{display:block;color:#fff;font-size:22px;line-height:1.3;font-weight:600;margin:0 0 14px}
.synth .l{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:13px 0;border-top:1px solid rgba(255,255,255,.1);font-size:15px}
.synth .l b{color:#fff;font-weight:600;white-space:nowrap}.synth .l.ok b{color:var(--or-c)}
.synth .l small{display:block;font-size:12.5px;color:#9FAAC0}
.rep{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}
.rep .n{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--or-c);margin:0 0 10px}
.rep .barre{display:flex;height:8px;border-radius:99px;overflow:hidden;background:rgba(255,255,255,.12)}
.rep .barre i{display:block;height:100%;background:var(--or-c)}
.rep .leg{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:12px;font-size:13px}
.rep .leg span{display:inline-flex;align-items:center;gap:7px}
.rep .leg i{width:9px;height:9px;border-radius:3px;background:rgba(255,255,255,.22)}.rep .leg .on i{background:var(--or-c)}
.rep .leg .on{color:#fff}.rep .leg .on b{font-weight:600}

/* titre de section à gauche */
.st-h{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:32px}
.st-h .sous{margin-top:8px}

/* pastilles d'état */
.etat{display:inline-block;font-size:13px;font-weight:600;padding:5px 12px;border-radius:999px;white-space:nowrap}
.etat.ok{background:#E3F1E9;color:#1F7A4D}.etat.non{background:#fff;color:var(--txt);border:1px solid var(--filet)}

/* carte détenue : le bloc crème du modèle */
.det .ent{display:flex;align-items:center;gap:16px;margin-bottom:20px}
.det .ent .ic{margin:0}
.det .ent .h3{flex:1}
.det .tab span{flex:1 1 auto;max-width:none}.det .tab b{white-space:nowrap}
.tab .tot{background:#fff!important}.tab .tot span{font-weight:600;color:var(--nuit)}
.tab small{display:block;font-size:13px;color:#7C8496;margin-top:2px}

/* cartes « pas activées » : teintes validées sur l'accueil (or = assurance vie, bleu = PER), au rayon du modèle */
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ca.pa{position:relative;overflow:hidden;border:1px solid var(--filet)}
.ca.pa>*{position:relative;z-index:1}
.ca.pa:after{content:"";position:absolute;top:-58px;right:-58px;width:150px;height:150px;border-radius:50%;pointer-events:none;opacity:.45;z-index:0}
.ca.pa.av{background:linear-gradient(135deg,#F7EEDB 0%,#FFFFFF 58%)}.ca.pa.av:after{background:radial-gradient(circle at 30% 30%,#FFF6E0,#D9B56A 72%)}
.ca.pa.per{background:linear-gradient(135deg,#E3E8F6 0%,#FFFFFF 58%)}.ca.pa.per:after{background:radial-gradient(circle at 30% 30%,#F3F5FC,#8FA4D6 72%)}
.ca.pa.lux{background:linear-gradient(135deg,#F1EBDA 0%,#FFFFFF 58%)}.ca.pa.lux:after{background:radial-gradient(circle at 30% 30%,#FBF8F0,#BFB59A 72%)}
.ca.pa .ic{background:rgba(255,255,255,.75)}
.ca.pa .top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.ca.pa .sav{background:rgba(255,255,255,.8)}
.ca.pa .btns{margin-top:20px;gap:12px}
.ca.pa .btns>*{flex:1 1 auto;padding:0 20px;height:48px;font-size:15px}

/* contrats ailleurs : la bande d'appel du modèle, avec deux sorties */
.bande .tx{flex:1;min-width:280px}
.bande .tx p{margin:6px 0 0;font-size:15px;line-height:1.5}

@media (max-width:1240px){.g3{grid-template-columns:1fr 1fr}}
@media (max-width:820px){
  .g3{grid-template-columns:1fr}
  .synth{padding:44px 22px 22px}
  .det .ent{flex-wrap:wrap}
  .bande .btns{width:100%}.bande .btns>*{flex:1 1 100%;white-space:normal;height:auto;min-height:56px;text-align:center}
}
/* ── ajouts propres à l'Accueil, dans le vocabulaire du modèle (pilules, crème, filets) ── */
.fil .topbar{margin:0 0 0 auto}
.fil .btn.ghost{background:#fff;border:1px solid var(--filet);color:#7C8496;font-weight:500}
.fil .ico{background:#fff;border:1px solid var(--filet)}
.piliers .ca p span{color:#7C8496}
.piliers .tab{margin:0 0 24px}
.piliers .btns{margin-top:auto;flex-direction:column;gap:10px}
.piliers .ca.pa .btns>*{flex:none;width:100%;white-space:normal;height:auto;min-height:48px;padding:10px 20px;text-align:center;line-height:1.3}
.piliers.compact .ca{display:flex;flex-direction:column;gap:22px;padding:22px 22px 20px!important}
.piliers.compact .ca .h3{padding-bottom:8px}
.piliers.compact .desc{margin:-8px 0 0;font-size:15px;line-height:1.5;color:#5B6478}
.piliers.compact a.ent{display:flex;align-items:center;text-decoration:none;color:inherit;cursor:pointer}
.piliers.compact a.ent .voir{margin-left:auto;font-style:normal;font-size:20px;color:#7C8496;transition:transform .2s}
.piliers.compact a.ent:hover .voir{transform:translateX(4px);color:var(--nuit)}
.piliers.compact .btns{margin-top:auto;flex-direction:column;gap:8px}
.piliers.compact .btns>*,.piliers.compact .btns .verrou{width:100%;min-height:42px;height:auto;padding:8px 16px;text-align:center;white-space:normal}
.simu{display:flex;align-items:center;gap:10px;margin-top:20px;padding-top:16px;border-top:1px solid var(--filet);font-size:15px;font-weight:500;color:var(--nuit);text-decoration:none;cursor:pointer}
.simu svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.simu em{margin-left:auto;font-style:normal}
.calc div{align-items:center}
.calc label{color:var(--txt)}
.calc input,.calc select{flex:none;width:120px;height:40px;border:1px solid #DDD5C0;border-radius:999px;padding:0 14px;font:600 15px 'Plus Jakarta Sans',sans-serif;color:var(--nuit);text-align:right;background:#fff}
.reco .ph{width:56px;height:56px;border-radius:50%;background:var(--nuit);color:var(--or-c);display:grid;place-items:center;font-weight:600;font-size:18px;flex:none}
/* les trois bandes du bas se suivent comme dans l'original (16 px), au lieu de 96 px chacune */
.wrap>section.bande:not(#q){margin-bottom:16px}
#q .etat{margin-bottom:10px}#q .tx b{display:block}
#q .choix{display:flex;gap:12px;flex-wrap:wrap}
#q .choix button{flex:none;min-width:0;height:56px;padding:0 28px;border-radius:999px;border:1px solid var(--nuit);background:#fff;color:var(--nuit);font:600 16px/1 'Plus Jakarta Sans',sans-serif;cursor:pointer}
#q .choix button.on{background:var(--nuit);color:#fff}
@media (max-width:820px){
  .fil .topbar{gap:6px}
  #q .choix{width:100%}#q .choix button{flex:1 1 0;padding:0 8px;white-space:nowrap}
  .demo{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 8px}
}

/* ═══ .apercu-espace-verre.css ═══ */
/* ── VERRE DÉPOLI + JOUR / NUIT — 08/10/2026 ────────────────────────────────────────────
   Pascal : « j'adore, bouge plus rien » sur .apercu-espace-glass.html (commit 98bc174b).
   Cette couche est chargée EN DERNIER sur les pages de l'espace : elle ne retire aucun
   contenu, elle remplace les aplats (crème, blanc) par du verre posé sur un fond à
   sphères floues, et ajoute le mode nuit (bleu nuit, pas noir : c'est l'espace client).
   Le mode est posé par .apercu-espace-verre.js sur <html data-theme="clair|sombre">. */

:root{
  --fond:#e9eef6;--orbe1:#b9c9e6;--orbe2:#dfe7f3;--orbe3:#f3e3c4;
  --verre:rgba(255,255,255,.42);--verre-fort:rgba(255,255,255,.62);--bord:rgba(255,255,255,.75);
  --ombre:0 10px 40px rgba(31,52,94,.12);--trait:rgba(22,35,61,.10);
  /* socle des pages + feuille commune, alignés sur la maquette */
  --creme:var(--verre);--sable:var(--verre-fort);--bleu:var(--verre-fort);--filet:var(--trait);
  --line:var(--trait);--card:var(--verre);--bg:var(--fond)
}
:root[data-theme="sombre"]{
  --fond:#0b1322;--orbe1:#1d3358;--orbe2:#14213a;--orbe3:#3a2f1c;
  --verre:rgba(255,255,255,.06);--verre-fort:rgba(255,255,255,.10);--bord:rgba(255,255,255,.14);
  --ombre:0 10px 40px rgba(0,0,0,.45);--trait:rgba(255,255,255,.10);
  --nuit:#eef2f9;--titre:#eef2f9;--txt:#b8c3d8;--ink:#eef2f9;--navy:#eef2f9;--muted:#9aa8c2;--soft:#8592ab;
  --navy-t:rgba(255,255,255,.08);--gold-t:rgba(217,178,106,.14);--up-t:rgba(92,199,156,.14);--up:#5cc79c;--track:rgba(255,255,255,.14)
}

/* fond : les sphères floues, sans elles le verre ne se voit pas */
html,body{background:var(--fond)!important;transition:background .5s,color .5s}
body{font-family:'Manrope','Plus Jakarta Sans',system-ui,sans-serif!important;color:var(--txt)}
.fond{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.fond i{position:absolute;border-radius:50%;filter:blur(10px);transition:background .5s}
.fond i:nth-child(1){width:620px;height:620px;left:-160px;top:-180px;background:radial-gradient(circle at 35% 35%,var(--orbe2),var(--orbe1))}
.fond i:nth-child(2){width:520px;height:520px;right:-140px;top:180px;background:radial-gradient(circle at 40% 40%,var(--orbe2),var(--orbe1));opacity:.85}
.fond i:nth-child(3){width:380px;height:380px;left:38%;bottom:-160px;background:radial-gradient(circle,var(--orbe3),transparent 70%);opacity:.9}
.shell,.demo{position:relative;z-index:1}.demo{position:fixed;z-index:60}

/* le verre : un seul réglage pour tous les panneaux */
.side,.tete,.ca,.bloc,.bande,.etapes,.oubli,.pan.r,.sim,.tab,.card,.pc,.fc,.q,.tranches div,.part,.out div,.chiffres .card,.ca.pa{
  background:var(--verre)!important;border:1px solid var(--bord)!important;box-shadow:var(--ombre);
  backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%)}
.tab,.out div,.tranches div,.part{box-shadow:none}
.tab div:nth-child(even){background:transparent}
.tab .tot{background:var(--verre-fort)!important}
.tab div{border-top-color:var(--trait)}
.sav,.anoter,.sim .info,.etq,.ic,.etapes .num{background:var(--verre-fort)!important;border:1px solid var(--bord)}
.conf i{background:var(--verre-fort);border-color:var(--bord)}
/* sur les panneaux bleu nuit, les icônes gardent leur teinte dorée d'origine */
.pan.e .ic,.ban .ic,.cons .ic,.synth .ic{background:rgba(227,196,137,.12)!important;border-color:rgba(227,196,137,.25)}

/* menu : panneau de verre flottant, comme la maquette */
.side{margin:14px 0 14px 14px;height:calc(100vh - 42px)!important;top:28px!important;border-radius:26px;border-right:1px solid var(--bord)!important}
.nav a{color:var(--muted)}
.nav a:hover{background:var(--verre-fort)}
.nav a.on{background:var(--verre-fort)!important;color:var(--titre,var(--ink))}
.me{color:var(--ink)}
.logo{color:var(--titre,var(--ink))}

/* en-tête : la bande crème devient un grand panneau de verre */
.tete{margin:14px 14px 32px;border-radius:32px}
.fil,.fil a{color:var(--txt)}

/* titres fins et grands, comme « Bonjour Camille » */
.h1,.hello h1,h1{font-family:'Manrope',sans-serif!important;font-weight:300!important;letter-spacing:-.5px}
.h2,.h3,.fin .h2,.oubli .h2{font-family:'Manrope',sans-serif;font-weight:400}
.h1,.h2,.h3,h1,h2,h3{color:var(--titre,var(--ink))}
.chapo{font-weight:500}

/* boutons */
.b2{background:var(--verre-fort);border-color:var(--bord)}
.b2:hover{background:var(--verre)}

/* bascule soleil / lune, toujours en haut à droite */
.bascule{position:fixed;top:40px;right:22px;z-index:70;flex:none;display:inline-flex;padding:5px;border-radius:40px;gap:4px;
  background:var(--verre);border:1px solid var(--bord);box-shadow:var(--ombre);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.bascule.dans{position:static;box-shadow:none}
.fil .bascule.dans{margin-left:auto}
.bascule button{border:0;background:transparent;color:var(--muted);width:42px;height:38px;border-radius:30px;cursor:pointer;display:grid;place-items:center}
.bascule button svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.6}
.bascule button.on{background:var(--verre-fort);color:var(--titre,var(--ink));box-shadow:0 2px 10px rgba(0,0,0,.08)}

/* petits boutons de la barre du haut, champs, choix */
.ico,.btn.ghost{background:var(--verre-fort)!important;border:1px solid var(--bord)!important}
.choix button,.sim input:not([type=range]),.sim select,input[type=number],input[type=text],select{background:var(--verre-fort)!important;border-color:var(--bord)!important;color:var(--titre,var(--ink))}
.choix button.on{background:var(--nuit)!important;color:#fff}

/* ── MODE NUIT : ce que le socle écrit en dur ─────────────────────────────── */
:root[data-theme="sombre"] .b1{background:#eef2f9;color:#0b1322}
:root[data-theme="sombre"] .b1:hover{background:#fff}
:root[data-theme="sombre"] .b2{color:#eef2f9;border-color:var(--bord)}
:root[data-theme="sombre"] .ban,:root[data-theme="sombre"] .cons,:root[data-theme="sombre"] .pan.e,:root[data-theme="sombre"] .synth,
:root[data-theme="sombre"] .teaser,:root[data-theme="sombre"] .ctaband,:root[data-theme="sombre"] .conseiller{
  background:rgba(255,255,255,.07)!important;border:1px solid var(--bord);color:#c9d1e1}
:root[data-theme="sombre"] .ban .onglet,:root[data-theme="sombre"] .synth .onglet{background:#1a2742;color:#eef2f9}
:root[data-theme="sombre"] .ban .pas{background:rgba(255,255,255,.12);color:#eef2f9}
:root[data-theme="sombre"] .cons .b1,:root[data-theme="sombre"] .conseiller button{background:#E3C489;color:#0b1322}
:root[data-theme="sombre"] .sim .chips button{background:transparent;border-color:var(--bord);color:#eef2f9}
:root[data-theme="sombre"] .sim .chips button.on{background:#eef2f9;color:#0b1322}
:root[data-theme="sombre"] .chips button{background:transparent;color:#c7cdda;border-color:var(--bord)}
:root[data-theme="sombre"] .chips button.on{background:#eef2f9;border-color:#eef2f9;color:#0b1322}
:root[data-theme="sombre"] .sim input[type=range]{background:rgba(255,255,255,.14)}
:root[data-theme="sombre"] .sim input[type=range]::-webkit-slider-thumb{background:#E3C489;border-color:#0b1322;box-shadow:0 0 0 1px #E3C489}
:root[data-theme="sombre"] .tab .vert b,:root[data-theme="sombre"] .sim .r .l.eco b,:root[data-theme="sombre"] .tranches b{color:#5cc79c}
:root[data-theme="sombre"] .etat.ok{background:rgba(92,199,156,.14);color:#5cc79c}
:root[data-theme="sombre"] .etat.non{background:transparent;color:#c9d1e1;border-color:var(--bord)}
:root[data-theme="sombre"] .pill{background:rgba(217,178,106,.16);color:#E2C68E}
:root[data-theme="sombre"] .pill.grey{background:rgba(255,255,255,.08);color:#9aa8c2}
:root[data-theme="sombre"] .logo i,:root[data-theme="sombre"] .me .av,:root[data-theme="sombre"] .conseiller .ph{background:#1a2742}
:root[data-theme="sombre"] .ic svg,:root[data-theme="sombre"] .conf svg,:root[data-theme="sombre"] .sav svg,:root[data-theme="sombre"] .anoter svg{stroke:#E3C489}
:root[data-theme="sombre"] .fc li:before{border-color:#E3C489}
:root[data-theme="sombre"] .fc .marque span{background:#1a2742}
:root[data-theme="sombre"] .fc .bas .btn{background:#E3C489;color:#0b1322}
:root[data-theme="sombre"] .note,:root[data-theme="sombre"] .src,:root[data-theme="sombre"] .mentions,:root[data-theme="sombre"] .tab small,:root[data-theme="sombre"] .tab-t{color:#8592ab}
:root[data-theme="sombre"] .mentions{border-top-color:var(--trait)}
:root[data-theme="sombre"] .faq details{border-bottom-color:var(--trait)}
:root[data-theme="sombre"] .faq details[open] summary{color:#E3C489}
:root[data-theme="sombre"] .tabbar{background:#0b1322;border-top-color:var(--trait)}
:root[data-theme="sombre"] .demo{background:#000}
:root[data-theme="sombre"] .choix button.on{background:#eef2f9!important;color:#0b1322}
:root[data-theme="sombre"] .ph,:root[data-theme="sombre"] .cons .ph{background:#1a2742!important;color:#E3C489}
:root[data-theme="sombre"] select option{background:#0b1322;color:#eef2f9}
:root[data-theme="sombre"] button.on{color:#0b1322!important}
:root[data-theme="sombre"] [style*="color:#1F7A4D"]{color:#5cc79c!important}
:root[data-theme="sombre"] .alloc svg text{fill:#eef2f9}:root[data-theme="sombre"] .alloc svg text+text{fill:#9aa8c2}
.alloc{background:var(--verre-fort)!important;border:1px solid var(--bord)}

/* menu : entrées « Bientôt » un peu plus lisibles (elles restent grisées) */
.nav a.off{color:#6b778d}.pill.grey{color:#5d6b85}
:root[data-theme="sombre"] .nav a.off{color:#6f7d96}

/* ── TRAITS PLUS FINS, SAUF LES TITRES (Pascal 08/10) ──────────────────────
   Texte courant, chiffres, boutons, pastilles, pictos et filets s'affinent ;
   .h1/.h2/.h3 et h1/h2/h3 gardent leur graisse. */
body{font-weight:400}
b,strong,.tab b,.sim .r .l b,.sim label b,.li b,.chapo,.conf b,.sav b,.anoter b,.fil a{font-weight:500!important}
.b1,.b2,.btn,.chips button,.sim .chips button,.choix button,.tabs button,.etat,.pill{font-weight:500!important}
.nav a,.nav a.on{font-weight:400!important}
.ic svg,.conf svg,.sav svg,.anoter svg,.nav a svg,.b1 svg,.b2 svg,.btn svg,.bascule button svg{stroke-width:1.3!important}
.tab div,.li,.faq details,.mentions,.sim .r,.etapes>div{border-width:0;border-top-width:.5px}
.faq details{border-top-width:0;border-bottom-width:.5px}
.etapes>div{border-top-width:0;border-left-width:.5px}.etapes>div:first-child{border-left-width:0}
.side,.tete,.ca,.bloc,.bande,.etapes,.oubli,.pan.r,.sim,.tab,.card,.pc,.fc,.q,.part,.ca.pa,.b2,.chips button,.choix button,.bascule{border-width:.5px!important}

/* ── CADENAS « Arrive bientôt » (.apercu-espace-cadenas.js) ────────────────
   Même gabarit que le bouton remplacé, mais inactif : on voit ce qui arrive, on ne peut pas cliquer. */
.verrou{display:inline-flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 8px;min-height:48px;padding:8px 22px;border-radius:999px;
  background:var(--verre-fort);border:.5px dashed var(--bord);color:var(--muted);font-size:14px;font-weight:500;cursor:not-allowed;text-align:center;line-height:1.3}
.verrou>span{display:inline}
.verrou svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.5;vertical-align:-2px;margin-right:6px}
.verrou em{font-style:normal;font-size:11.5px;font-weight:500;padding:2px 9px;border-radius:999px;background:rgba(201,162,75,.16);color:#8a6a1f;white-space:nowrap}
.verrou.plein{border-style:solid}
:root[data-theme="sombre"] .verrou em{background:rgba(227,196,137,.16);color:#E3C489}
.sim .verrou,.pied .verrou,.cons .verrou{width:100%}
.cons .verrou{color:#c9d1e1;border-color:rgba(255,255,255,.25);background:rgba(255,255,255,.06)}
.pill.verrou-pill{display:inline-flex;align-items:center;gap:4px;background:rgba(201,162,75,.14);color:#8a6a1f}
.pill.verrou-pill svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:1.8}
:root[data-theme="sombre"] .pill.verrou-pill{color:#E3C489}

/* ── RÉSOLUTIONS RÉELLES (Pascal 08/10 : « la résolution n'est pas la bonne ») ─────────
   Mesuré : écran principal 1504 × 1003 à 150 % (≈ 1504 × 820 utiles dans le navigateur),
   second écran 1920 × 1080. */
/* grand écran : le panneau d'en-tête prend la largeur du contenu, pas celle de la fenêtre,
   pour que titre et cartes restent alignés */
/* même largeur que la colonne des cartes (.wrap : 1180 px max, 48 px de marge intérieure) */
.tete{box-sizing:border-box;width:calc(min(1180px,100%) - 96px);margin-left:auto!important;margin-right:auto!important}
.tete .wrap{padding:0 40px}
@media (max-width:820px){.tete{width:calc(100% - 32px)}.tete .wrap{padding:0 20px}}
/* menu : libellé + pastille sur une seule ligne, pastille plus discrète */
.nav a:has(.pill){white-space:nowrap}
.nav .pill{font-size:10px;padding:2px 7px}
/* écran peu haut (portable à 150 %) : le menu tient sans être coupé, l'en-tête se resserre */
.side{overflow-y:auto;scrollbar-width:none}
@media (max-height:900px){
  .logo{padding-bottom:14px}
  .nav{gap:1px}.nav a{padding:6px 12px}
  .conseiller{padding:12px;gap:8px}.conseiller small{display:none}
  .me{padding-top:8px}
  .tete{padding:26px 0 40px}
  .fil{margin-bottom:22px}
  .etq{margin-bottom:16px}
  .h1,.hello h1{margin-bottom:14px}
  .hero{gap:36px}
}

/* ── Bannière de l'en-tête : le carré de chiffres devient un rectangle allongé (Pascal 08/10) ──
   Il était posé en absolu à droite et recouvrait la pastille « 0 % de frais » ; il passe
   SOUS le titre, sur toute la largeur, les trois lignes côte à côte. */
.ban.un .t{max-width:none}
.ban.un .releve{position:relative;right:auto;top:auto;width:auto;margin-top:22px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 0;padding:14px 18px}
.ban.un .releve .n{grid-column:1/-1;margin-bottom:4px}
.ban.un .releve .l{flex-direction:column;justify-content:flex-start;gap:2px;border-top:0;border-left:1px solid rgba(255,255,255,.12);padding:2px 14px}
.ban.un .releve .n+.l{border-left:0;padding-left:0}
.ban.un .releve .l b{font-size:15px}

/* Bandeau de chiffres pleine largeur, sous le hero (déplacé par .apercu-espace-verre.js) */
.releve.bandeau{position:relative;right:auto;top:auto;width:auto;max-width:none;margin:36px 0 0;display:flex;align-items:stretch;gap:0;
  background:linear-gradient(115deg,#0F1E3D 0%,#182C57 100%);border:.5px solid rgba(227,196,137,.28);border-radius:20px;padding:22px 30px;color:#C9D1E1;backdrop-filter:none}
.releve.bandeau .n{flex:0 0 auto;align-self:center;margin:0 28px 0 0;padding-right:28px;border-right:1px solid rgba(255,255,255,.14);font-size:12px;max-width:220px;line-height:1.5}
.releve.bandeau .l{flex:1;display:flex;flex-direction:column;justify-content:center;gap:4px;border:0;border-left:1px solid rgba(255,255,255,.10);padding:0 24px;font-size:14px}
.releve.bandeau .n+.l{border-left:0;padding-left:0}
.releve.bandeau .l b{font-size:22px;font-weight:500;color:#fff;letter-spacing:-.01em}
.releve.bandeau .l.ok b{color:#E3C489}
:root[data-theme="sombre"] .releve.bandeau{background:rgba(255,255,255,.07);border-color:var(--bord)}
@media (max-width:820px){.releve.bandeau{flex-direction:column;padding:20px}.releve.bandeau .n{border-right:0;padding:0;margin:0 0 10px}.releve.bandeau .l{border-left:0;border-top:1px solid rgba(255,255,255,.1);padding:10px 0}}
/* la bannière n'a plus à réserver la place des chiffres partis dans le bandeau */
.ban.un:not(:has(.releve)){min-height:0;padding-bottom:30px}

/* ── Pleine largeur (Pascal 08/10 : « là c'est vide, étire le tableau ») ─────────────
   Sur grand écran, la colonne de 1 180 px laissait deux bandes vides : le contenu et
   l'en-tête prennent toute la largeur disponible, avec 48 px de marge de chaque côté. */
.wrap{max-width:none!important}
.tete{width:calc(100% - 96px)!important}
@media (max-width:820px){.tete{width:calc(100% - 32px)!important}}

/* Simulateur remonté au plus près de l'en-tête (Pascal 08/10 : « tu vires et tu remontes le simulateur ») */
.tete:has(~ .wrap > #simu:first-child){margin-bottom:12px!important}
.tete ~ .wrap > #simu:first-child .deuxc{margin-bottom:24px}

/* ── Menu (Pascal 08/10) : libellés en gras et foncés, page ouverte en orange ──────────
   L'orange est celui de l'espace client en ligne (--act #FF5A00). */
.side .nav a{font-weight:600!important;color:var(--titre,var(--ink))}
.side .nav a svg{stroke-width:1.7!important}
.side .nav a.off{color:#8592ab}
.side .nav a.on,.side .nav a.on:hover{background:#FF5A00!important;color:#fff!important;box-shadow:0 6px 18px -6px rgba(255,90,0,.55)}
.side .nav a.on svg{stroke:#fff}
.side .nav a.on .pill{background:rgba(255,255,255,.22);color:#fff}
:root[data-theme="sombre"] .side .nav a{color:#eef2f9}
:root[data-theme="sombre"] .side .nav a.off{color:#7d8aa3}

/* Titre + texte du simulateur DANS la carte, en première ligne (Pascal 08/10 : « mets-le dans la même carte ») */
.bloc>.deuxc.dans-carte{grid-column:1/-1;padding:0;margin:0 0 4px;gap:40px;align-items:start}
.bloc>.deuxc.dans-carte .h2{font-size:30px}
.bloc:has(>.deuxc.dans-carte){row-gap:8px}

/* ── AV luxembourgeoise : « la triple sécurité » en avant (Pascal 08/10) ── */
.secu-t{margin:0 0 24px}.secu-t .sous{margin-top:6px}
.ca.secu{position:relative;border:1px solid rgba(201,162,75,.6)!important;box-shadow:0 14px 40px -18px rgba(168,130,47,.45)}
.ca.secu::before{content:attr(data-n);position:absolute;top:24px;right:24px;width:32px;height:32px;border-radius:50%;background:#C9A24B;color:#0b1322;font-weight:700;font-size:15px;display:grid;place-items:center}
:root[data-theme="sombre"] .ca.secu{border-color:rgba(227,196,137,.45)!important}
:root[data-theme="sombre"] .ca.secu::before{background:#E3C489}

/* Le bandeau de chiffres n'est plus bleu (Pascal 08/10 : « j'aime pas ce bandeau bleu ») : verre, comme le reste */
.releve.bandeau{background:var(--verre-fort)!important;border:.5px solid var(--bord)!important;color:var(--txt)}
.releve.bandeau .n{color:#A8822F;border-right-color:var(--trait)}
.releve.bandeau .l{border-left-color:var(--trait)}
.releve.bandeau .l span{color:var(--muted)}
.releve.bandeau .l b{color:var(--titre,var(--ink))}
.releve.bandeau .l.ok b{color:#A8822F}
:root[data-theme="sombre"] .releve.bandeau .n,:root[data-theme="sombre"] .releve.bandeau .l.ok b{color:#E3C489}

/* ── Menu de tous les simulateurs, en haut de la page Simulateurs (Pascal 08/10) ── */
.simus{display:flex;gap:10px;flex-wrap:wrap;margin:-12px 0 28px}
.simus a{display:inline-flex;align-items:center;gap:9px;padding:11px 18px;border-radius:999px;font-weight:600;font-size:14.5px;text-decoration:none;
  color:var(--titre,var(--ink));background:var(--verre-fort);border:.5px solid var(--bord);box-shadow:var(--ombre);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.simus a svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.simus a:hover{background:var(--verre)}
.simus a.on{background:#FF5A00;color:#fff;border-color:#FF5A00;box-shadow:0 6px 18px -6px rgba(255,90,0,.55)}
@media (max-width:820px){.simus{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.simus a{white-space:nowrap}}

/* ══ REPASSE « PLUS CLASSE, PLUS FIN » (Pascal 08/10, toutes les pages de l'espace) ══════════
   Ne change aucun contenu. Garde ce qui est validé : verre, jour/nuit, menu en gras, page
   ouverte en orange, cadenas. Affine : bannières, boutons, titres, cartes, respirations. */

/* 1. Les bannières ne sont plus de gros aplats bleu marine : verre + fin liseré doré */
.ban{background:var(--verre)!important;border:.5px solid rgba(201,162,75,.45)!important;color:var(--txt)!important;
  box-shadow:var(--ombre);backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%)}
.ban .t{color:var(--titre,var(--ink))!important;font-weight:400!important;letter-spacing:-.01em}
.ban .t span{color:var(--muted)}
.ban .onglet{background:transparent!important;color:#A8822F!important;border:.5px solid rgba(201,162,75,.45);border-top:0;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase}
.ban .pas{background:var(--verre-fort)!important;color:var(--titre,var(--ink))!important;box-shadow:none!important;border:.5px solid var(--bord);font-weight:500!important;font-size:15px!important}
.ban .pas span{color:#A8822F}
.ban.deux svg rect[fill="#fff"]{fill:var(--verre-fort);stroke:var(--bord)}
:root[data-theme="sombre"] .ban .onglet,:root[data-theme="sombre"] .ban .pas span{color:#E3C489!important}
/* idem pour le panneau conseiller et les panneaux « nos engagements » / synthèse */
.cons,.pan.e,.synth{background:var(--verre)!important;border:.5px solid rgba(201,162,75,.45)!important;color:var(--txt)!important;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.cons .id b,.pan.e .li b,.synth .t,.synth .l b{color:var(--titre,var(--ink))!important}
.cons .msg{background:var(--verre-fort)!important;border-color:var(--bord)!important;color:var(--txt)!important}
.cons .msg.moi{background:rgba(201,162,75,.12)!important;border-color:rgba(201,162,75,.35)!important}
.cons .b2{color:var(--titre,var(--ink))!important;border-color:var(--bord)!important}
.cons .ph{background:var(--verre-fort)!important;color:#A8822F!important}
.pan.e .tt,.synth .onglet,.rep .n{color:#A8822F!important}
.pan.e .li{border-top-color:var(--trait)!important}
.synth .l{border-top-color:var(--trait)!important}.synth .l small,.rep .leg{color:var(--muted)!important}
.rep .barre{background:var(--trait)!important}.rep .leg .on{color:var(--titre,var(--ink))!important}
:root[data-theme="sombre"] .pan.e .tt,:root[data-theme="sombre"] .synth .onglet,:root[data-theme="sombre"] .rep .n,:root[data-theme="sombre"] .cons .ph{color:#E3C489!important}

/* 2. Boutons : moins hauts, moins épais */
.b1,.b2{height:46px!important;padding:0 24px!important;font-size:14.5px!important;font-weight:500!important;letter-spacing:.005em}
.b1 svg,.b2 svg{width:16px;height:16px}
.verrou{min-height:44px;font-size:13.5px}

/* 3. Titres : plus fins, plus serrés (le menu garde son gras, à la demande de Pascal) */
.h1{font-size:40px!important;line-height:1.2!important;margin-bottom:18px!important;letter-spacing:-.6px!important}
.h2{font-size:28px!important;line-height:1.25!important;font-weight:300!important;letter-spacing:-.3px}
.h3{font-size:19px!important;font-weight:500!important;line-height:1.3!important}
.chapo{font-size:15.5px;line-height:1.6;font-weight:400!important;color:var(--txt)}
.etq{font-size:12.5px!important;letter-spacing:.06em;text-transform:uppercase;padding:6px 14px!important;margin-bottom:20px!important;color:var(--muted)!important}
body{font-size:15px}
.sous,.ca p,.bloc p,.li span,.faq details p{font-size:15px;line-height:1.6}
.faq summary{font-size:18px!important;font-weight:500!important;padding:20px 0!important}

/* 4. Cartes : coins plus sobres, ombres plus légères, marges régulières */
:root{--ombre:0 1px 2px rgba(31,52,94,.04),0 12px 32px -14px rgba(31,52,94,.18)}
:root[data-theme="sombre"]{--ombre:0 1px 2px rgba(0,0,0,.2),0 14px 36px -16px rgba(0,0,0,.6)}
.ca,.etapes,.oubli,.pan{border-radius:26px!important}
.bloc,.bande{border-radius:28px!important;padding:40px 44px!important}
.tete{border-radius:30px!important;padding-bottom:44px!important}
.ca{padding:26px 24px 22px!important}
.ic{width:44px!important;height:44px!important;border-radius:12px!important;margin-bottom:18px!important}
.ic svg{width:20px!important;height:20px!important}
.sim{border-radius:22px!important;padding:28px!important}
.tab{border-radius:14px!important}.tab div{padding:12px 16px!important;font-size:14.5px!important}
.sav{border-radius:14px!important;font-size:13px!important}
.pill,.etat,.verrou em{font-weight:500!important}

/* 5. Respirations : moins d'espace mort entre les sections */
section{margin-bottom:72px!important}
.deuxc{margin-bottom:32px}
.mentions{font-size:12px!important;line-height:1.65}

@media (max-width:820px){.h1{font-size:30px!important}.h2{font-size:24px!important}.bloc,.bande{padding:26px 20px!important}section{margin-bottom:52px!important}}
/* boutons verrouillés du panneau conseiller : le panneau n'est plus bleu, leur texte non plus */
.cons .verrou{color:var(--muted)!important;background:var(--verre-fort)!important;border-color:var(--bord)!important}

/* ── ACCUEIL : « À la une » + fil d'actus (Pascal 08/10 : être commercial, des actus vivantes) ── */
.actus{margin-bottom:56px!important}
.actus-t{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 18px}
.lien-fil{font-size:14px;font-weight:500;color:#A8822F;text-decoration:none}
.une{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.une-c{display:flex;flex-direction:column;gap:10px;position:relative;overflow:hidden}
.une-c::after{content:"";position:absolute;top:-70px;right:-70px;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle,rgba(255,90,0,.16),transparent 70%);pointer-events:none}
.une-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.badge-sp{font-size:11.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:5px 11px;border-radius:999px;background:#FF5A00;color:#fff}
.une-d{font-size:13px;color:var(--muted)}
.une-c .h3{margin:4px 0 0!important;font-size:21px!important}
.une-c p{margin:0!important;font-size:14.5px}
.une-c .une-cond{font-size:13px!important;color:var(--muted);padding:10px 14px;border-radius:12px;background:var(--verre-fort);border:.5px solid var(--bord)}
.une-c .une-cond b{color:var(--titre,var(--ink));font-weight:600}
.une-b{display:flex;align-items:center;gap:18px;margin-top:auto;padding-top:8px;flex-wrap:wrap}
.une-b .lien{font-size:14px;font-weight:500;color:var(--titre,var(--ink));text-decoration:none}
.fil-actus{margin-top:18px;border-radius:22px;background:var(--verre);border:.5px solid var(--bord);box-shadow:var(--ombre);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);overflow:hidden}
.fa{display:grid;grid-template-columns:72px 1fr auto;gap:16px;align-items:center;padding:15px 22px;text-decoration:none;color:var(--titre,var(--ink));border-top:.5px solid var(--trait)}
.fa:first-child{border-top:0}
.fa:hover{background:var(--verre-fort)}
.fa-d{font-size:13px;color:var(--muted);font-weight:500}
.fa-t{font-size:15px;font-weight:500;line-height:1.4}
.fa-t em{font-style:normal;font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:999px;background:rgba(255,90,0,.12);color:#D94B00;margin-right:8px;vertical-align:1px}
.fa-s{font-size:12.5px;color:var(--muted);white-space:nowrap}
:root[data-theme="sombre"] .fa-t em{background:rgba(255,90,0,.2);color:#FF8A4C}
:root[data-theme="sombre"] .lien-fil{color:#E3C489}
@media (max-width:1100px){.une{grid-template-columns:1fr}}
@media (max-width:820px){.fa{grid-template-columns:1fr;gap:4px}.fa-s{white-space:normal}}

/* Fil des acquisitions en cartes illustrées (Pascal 08/10 : la liste de texte, « c'est nul »).
   Même règle que l'observatoire du site : une photo générique est annoncée « Illustration ». */
.acqs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:18px}
.acq{display:flex;flex-direction:column;border-radius:20px;overflow:hidden;text-decoration:none;color:var(--titre,var(--ink));background:var(--verre);border:.5px solid var(--bord);box-shadow:var(--ombre);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);transition:transform .2s}
.acq:hover{transform:translateY(-3px)}
.acq-img{position:relative;display:block;aspect-ratio:16/9;overflow:hidden}
.acq-img img{width:100%;height:100%;object-fit:cover;display:block}
.acq-sect{position:absolute;left:12px;top:12px;font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:999px;background:var(--c);color:#fff}
.acq-ill{position:absolute;right:10px;bottom:8px;font-size:10.5px;color:rgba(255,255,255,.85);text-shadow:0 1px 2px rgba(0,0,0,.5)}
.acq-c{display:flex;flex-direction:column;gap:8px;padding:14px 16px 16px;flex:1}
.acq-h{display:flex;align-items:center;justify-content:space-between;gap:8px}
.acq-logo{height:22px;width:auto;max-width:110px;object-fit:contain}
:root[data-theme="sombre"] .acq-logo{filter:brightness(0) invert(1);opacity:.85}
.acq-d{font-size:12px;color:var(--muted);white-space:nowrap}
.acq-vous{align-self:flex-start;font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;background:#FF5A00;color:#fff}
.acq-t{font-size:15px;font-weight:600;line-height:1.35}
.acq-l{margin-top:auto;font-size:12.5px;color:var(--muted)}
.acq.vous{border-color:rgba(255,90,0,.5)}
@media (max-width:1240px){.acqs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.acqs{grid-template-columns:1fr}}

/* ── MON PROFIL & CONFORMITÉ (Pascal 08/10) ── */
.nav .pill.alerte{background:#FF5A00;color:#fff}
.nav a.on .pill.alerte{background:#fff;color:#FF5A00}
.etat-dossier{align-self:start;display:flex;flex-direction:column;gap:12px}
.ed-l{display:flex;flex-direction:column;gap:2px}.ed-l b{font-size:20px;font-weight:500;color:var(--titre,var(--ink))}.ed-l span{font-size:13px;color:var(--muted)}
.ed-barre{height:6px;border-radius:99px;background:var(--trait);overflow:hidden}.ed-barre i{display:block;height:100%;background:#FF5A00;border-radius:99px}
.ed-a{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:14px}
.ed-a li{display:flex;gap:10px;align-items:center}
.etat.non{background:rgba(255,90,0,.12)!important;color:#D94B00!important;border:0!important}
:root[data-theme="sombre"] .etat.non{background:rgba(255,90,0,.2)!important;color:#FF8A4C!important}
.conf-g{display:grid;grid-template-columns:260px minmax(0,1fr);gap:28px;align-items:start}
.conf-nav{position:sticky;top:44px;display:flex;flex-direction:column;gap:2px;padding:10px;border-radius:20px;background:var(--verre);border:.5px solid var(--bord);box-shadow:var(--ombre);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.conf-nav a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:12px;font-size:14px;font-weight:600;color:var(--titre,var(--ink));text-decoration:none}
.conf-nav a:hover{background:var(--verre-fort)}
.conf-nav i{width:8px;height:8px;border-radius:50%;flex:none}.conf-nav i.ok{background:#2f8f6b}.conf-nav i.non{background:#FF5A00}
.conf-c{display:flex;flex-direction:column;gap:14px}
.rub{border-radius:22px;background:var(--verre);border:.5px solid var(--bord);box-shadow:var(--ombre);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);padding:4px 24px;scroll-margin-top:40px}
.rub.ouvert{padding:20px 24px}
.rub summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:16px 0}
.rub summary::-webkit-details-marker{display:none}
.rub summary .h3,.rub-h .h3{flex:1;margin:0!important;font-size:18px!important}
.rub-h{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.rub-m{font-size:12.5px;color:var(--muted)}
.rub[open]{padding-bottom:22px}
.rub-i{margin:0 0 14px!important;font-size:14px;color:var(--muted)}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}
.form label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:500;color:var(--muted)}
.form .l2{grid-column:1/-1}
.form input,.form select{height:44px;padding:0 14px;border-radius:12px;border:.5px solid var(--bord);background:var(--verre-fort);color:var(--titre,var(--ink));font:500 14.5px 'Manrope',sans-serif}
.rub-b{display:flex;align-items:center;gap:16px;margin-top:18px;flex-wrap:wrap}
.rub-n{font-size:13px;color:var(--muted)}.rub-n b{color:var(--titre,var(--ink))}
.choix-l{display:flex;flex-direction:column;gap:10px}
.choix-l label{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:var(--titre,var(--ink));padding:12px 14px;border-radius:12px;background:var(--verre-fort);border:.5px solid var(--bord)}
.choix-l input{accent-color:#FF5A00;margin-top:3px}
.pj{display:flex;flex-direction:column;border-radius:16px;overflow:hidden;border:.5px solid var(--bord)}
.pj>div{display:grid;grid-template-columns:220px minmax(0,1fr) auto auto;gap:16px;align-items:center;padding:14px 18px;border-top:.5px solid var(--trait);background:var(--verre-fort)}
.pj.docs>div{grid-template-columns:240px minmax(0,1fr) auto}
.pj>div:first-child{border-top:0}
.pj b{font-size:14.5px;font-weight:600;color:var(--titre,var(--ink))}.pj span:not(.etat){font-size:13.5px;color:var(--muted)}
.pj .b1,.pj .b2{height:38px!important;padding:0 16px!important;font-size:13.5px!important}
@media (max-width:1100px){.conf-g{grid-template-columns:1fr}.conf-nav{position:static;flex-direction:row;flex-wrap:wrap}.pj>div,.pj.docs>div{grid-template-columns:1fr}}
@media (max-width:820px){.form{grid-template-columns:1fr}}

/* ── Propositions d'accueil A / B / C (Pascal 08/10 : plus commercial, plus simple) ── */
.vedette,.suite{align-self:start;display:flex;flex-direction:column;gap:14px;position:relative;overflow:hidden}
.vedette::after{content:"";position:absolute;top:-80px;right:-80px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(255,90,0,.18),transparent 70%);pointer-events:none}
.vedette .badge-sp{align-self:flex-start}
.ved-prix{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.ved-prix b{font-size:52px;font-weight:300;letter-spacing:-1px;color:var(--titre,var(--ink));line-height:1}
.ved-prix s{font-size:22px;color:var(--muted)}
.ved-prix span{flex-basis:100%;font-size:14px;color:var(--muted)}
.vedette .une-cond,.suite p{font-size:13.5px}
.suite .h3{margin:0!important}.suite p{margin:0!important;color:var(--txt)}
.resume{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:22px 28px;border-radius:22px;background:var(--verre);border:.5px solid var(--bord);box-shadow:var(--ombre);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);margin-bottom:40px!important}
.resume p{margin:0;font-size:17px;color:var(--txt)}.resume p b{color:var(--titre,var(--ink));font-weight:600}
.une-photo{position:relative;display:block;padding:0!important;overflow:hidden;align-self:start;text-decoration:none}
.une-photo>img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.une-photo .acq-ill{position:absolute;right:12px;top:10px;bottom:auto}
.une-photo-c{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;font-size:14px;font-weight:500;color:var(--titre,var(--ink))}
.produits{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.prod-t{display:flex;flex-direction:column;gap:4px;padding:18px 22px;border-radius:18px;text-decoration:none;background:var(--verre);border:.5px solid var(--bord);box-shadow:var(--ombre);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.prod-t b{font-size:17px;font-weight:600;color:var(--titre,var(--ink))}.prod-t span{font-size:13.5px;color:var(--muted)}
@media (max-width:820px){.produits{grid-template-columns:1fr}.ved-prix b{font-size:40px}}

/* ── ACCUEIL : ligne de salut + deux colonnes, « À la une » à droite (Pascal 08/10) ── */
.salut{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:22px!important;margin-bottom:22px}
.salut .h1{font-size:30px!important;margin:0!important}
.salut .topbar{margin:0}
.acc-g{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:24px;align-items:start}
.acc-main section{margin-bottom:24px!important}
.acc-main .piliers{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))!important}
.acc-cote{position:sticky;top:40px}
.acc-cote .actus{margin:0!important}
.acc-cote .actus-t{flex-direction:column;gap:2px;margin-bottom:12px}
.acc-cote .actus-t .h2{font-size:22px!important}
.acc-cote .une{grid-template-columns:1fr;gap:12px}
.acc-cote .une-c{padding:18px!important;gap:8px}
.acc-cote .une-c .h3{font-size:17px!important}
.acc-cote .une-c p{font-size:13.5px}
.acc-cote .une-c .une-cond{font-size:12.5px!important;padding:8px 12px}
.acc-cote .acqs{grid-template-columns:1fr;gap:10px;margin-top:12px}
.acc-cote .acq{flex-direction:row;border-radius:16px}
.acc-cote .acq-img{flex:0 0 92px;aspect-ratio:auto}
.acc-cote .acq-sect,.acc-cote .acq-ill{display:none}
.acc-cote .acq-c{padding:10px 12px;gap:4px}
.acc-cote .acq-logo{height:16px}
.acc-cote .acq-t{font-size:13px;line-height:1.3}
.acc-cote .acq-l{font-size:11.5px}
.acc-cote .acq-vous{font-size:10px;padding:2px 7px}
.acc-cote .note{font-size:11px}
@media (max-width:1240px){.acc-g{grid-template-columns:1fr}.acc-cote{position:static}}

/* ── ACCUEIL SIMPLE (Pascal 09/10) ── */
.simple{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}
.s-carte{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:34px 36px!important;position:relative;overflow:hidden}
.s-offre::after{content:"";position:absolute;top:-90px;right:-90px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(255,90,0,.16),transparent 70%);pointer-events:none}
.s-etq{font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:500}
.s-phrase{margin:0!important;font-size:24px!important;line-height:1.4!important;font-weight:300;color:var(--titre,var(--ink))}
.s-phrase b{font-weight:600}
.s-sous{margin:0!important;font-size:14px!important;color:var(--muted)}
.s-carte .b1{margin-top:8px}
.s-actu{display:flex;align-items:center;gap:14px;padding:18px 24px;border-radius:18px;text-decoration:none;color:var(--txt);font-size:15px;background:var(--verre);border:.5px solid var(--bord);box-shadow:var(--ombre);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);margin-bottom:20px}
.s-actu b{color:var(--titre,var(--ink));font-weight:600}
.s-point{flex:none;width:9px;height:9px;border-radius:50%;background:#FF5A00;box-shadow:0 0 0 4px rgba(255,90,0,.15)}
.s-date{margin-left:auto;font-size:13px;color:var(--muted);white-space:nowrap}
.s-acces{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:40px}
.s-acces a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:20px 24px;border-radius:18px;text-decoration:none;background:var(--verre);border:.5px solid var(--bord);box-shadow:var(--ombre);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.s-acces b{font-size:17px;font-weight:600;color:var(--titre,var(--ink))}
.s-acces span{font-size:13.5px;color:var(--muted)}
.s-bientot{display:inline-flex;align-items:center;gap:5px;font-size:12px!important;font-weight:500;padding:3px 10px;border-radius:999px;background:rgba(201,162,75,.14);color:#8a6a1f!important}
.s-bientot svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:1.8}
:root[data-theme="sombre"] .s-bientot{color:#E3C489!important}
@media (max-width:1000px){.simple,.s-acces{grid-template-columns:1fr}}

/* ── Accueil : encadré « Actus » qui défile (Pascal 09/10) ── */
.actus-rot{position:relative;border-radius:20px;padding:40px 28px 22px;background:var(--verre-fort);border:.5px solid rgba(201,162,75,.45);box-shadow:var(--ombre);overflow:hidden;min-height:220px}
.actus-rot .onglet{position:absolute;top:0;left:50%;transform:translateX(-50%);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:#A8822F;padding:5px 16px;border:.5px solid rgba(201,162,75,.45);border-top:0;border-radius:0 0 12px 12px;display:inline-flex;align-items:center;gap:7px}
.actus-rot .onglet::before{content:"";width:7px;height:7px;border-radius:50%;background:#FF5A00;box-shadow:0 0 0 3px rgba(255,90,0,.18);animation:pouls 1.8s ease-in-out infinite}
@keyframes pouls{50%{box-shadow:0 0 0 6px rgba(255,90,0,0)}}
.rot{position:relative;min-height:140px}
.sl{position:absolute;inset:0;display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-decoration:none;opacity:0;transform:translateX(24px);transition:opacity .5s,transform .5s;pointer-events:none}
.sl.on{opacity:1;transform:none;pointer-events:auto}
.sl b{font-size:21px;font-weight:500;line-height:1.3;color:var(--titre,var(--ink))}
.sl span:not(.badge-sp){font-size:14px;color:var(--muted)}
.sl em{font-style:normal;font-size:14px;font-weight:600;color:#D94B00;margin-top:2px}
.badge-sp.vous{background:#0F1E3D}
.pts{display:flex;gap:7px;justify-content:center;margin-top:10px}
.pts button{width:8px;height:8px;border-radius:99px;border:0;padding:0;background:var(--trait);cursor:pointer;transition:width .3s,background .3s}
.pts button.on{width:24px;background:#FF5A00}
/* Flèches de navigation manuelle du carrousel (Pascal, 10/10/2026). */
.actus-rot .ctrl{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:10px}
.actus-rot .ctrl .pts{margin-top:0}
.actus-rot .fl{width:28px;height:28px;flex:none;border-radius:50%;border:.5px solid rgba(201,162,75,.5);background:rgba(255,255,255,.9);color:var(--nuit);display:grid;place-items:center;padding:0;cursor:pointer;transition:background .2s,transform .2s}
.actus-rot .fl svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.actus-rot .fl:hover{background:#fff;transform:scale(1.08)}
:root[data-theme="sombre"] .actus-rot .fl{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(201,162,75,.4)}
/* Bandeau parrainage (Pascal, 10/10/2026 : « essentiel »). */
/* En OR (Pascal, 10/10/2026 : « le parrainage est tout blanc, il faudrait le mettre couleur or »). */
.bande.parrain{background:linear-gradient(120deg,#C9A24B 0%,#E3C489 55%,#D4AF5F 100%)!important;border:0;box-shadow:0 14px 30px -16px rgba(169,130,47,.7)}
.bande.parrain .tx b,.bande.parrain .tx p{color:#0F1E3D!important}
.bande.parrain .tx p{opacity:.85}
.bande.parrain .b1{background:#0F1E3D!important;color:#fff!important;border-color:#0F1E3D!important}
.bande.parrain .tx{display:flex;align-items:center;gap:14px}
.bande.parrain .cadeau{flex:none;width:44px;height:44px;border-radius:12px;background:#fff;display:grid;place-items:center;box-shadow:0 4px 14px -6px rgba(15,30,61,.25)}
.bande.parrain .cadeau svg{width:24px;height:24px;stroke:var(--or);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.bande.parrain .tx b{margin:0}
:root[data-theme="sombre"] .bande.parrain{background:linear-gradient(120deg,#B48F3E 0%,#D6B672 55%,#C29F52 100%)!important}
:root[data-theme="sombre"] .bande.parrain .cadeau{background:rgba(255,255,255,.1)}
/* Positionnement anti-frais « à la plume », sous Bonjour (Pascal, 10/10/2026) : pas de bandeau.
   Poussé vers le BAS de l'en-tête (demande Pascal : « descends-le ») via flex + margin-top auto. */
#v-accueil .hero{align-items:stretch}
#v-accueil .hero>div:first-child{display:flex;flex-direction:column;align-items:flex-start}
.plume{margin-top:auto;padding-top:28px;max-width:540px}
.plume .pm{margin:0;font-family:'Caveat',cursive;font-weight:700;font-size:38px;line-height:1.05;color:var(--nuit);letter-spacing:.3px}
.plume .ps{margin:8px 0 0;font-size:14px;line-height:1.55;color:#6b7280;max-width:460px}
:root[data-theme="sombre"] .plume .pm{color:var(--or-c)}
:root[data-theme="sombre"] .plume .ps{color:#9aa6b8}
@media(max-width:760px){.plume .pm{font-size:32px}}
:root[data-theme="sombre"] .actus-rot .onglet{color:#E3C489}
:root[data-theme="sombre"] .sl em{color:#FF8A4C}
:root[data-theme="sombre"] .badge-sp.vous{background:#2a3b5f}

/* ── Les trois cartes piliers en volume 3D (Pascal 09/10 : « donne-leur un peu de volume ») ── */
.piliers{perspective:1400px}
.piliers .ca{transform:rotateX(3deg) translateZ(0);transform-origin:50% 100%;transition:transform .35s ease,box-shadow .35s ease;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -2px 0 rgba(31,52,94,.06),0 2px 3px rgba(31,52,94,.06),0 10px 0 -5px rgba(185,201,230,.55),0 22px 40px -16px rgba(31,52,94,.32),0 48px 80px -36px rgba(31,52,94,.4)!important}
.piliers .ca:hover{transform:rotateX(0) translateY(-8px);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 4px 6px rgba(31,52,94,.06),0 14px 0 -6px rgba(185,201,230,.6),0 30px 50px -18px rgba(31,52,94,.36),0 60px 90px -40px rgba(31,52,94,.45)!important}
:root[data-theme="sombre"] .piliers .ca{box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 10px 0 -5px rgba(255,255,255,.06),0 22px 40px -16px rgba(0,0,0,.6),0 48px 80px -36px rgba(0,0,0,.7)!important}
:root[data-theme="sombre"] .piliers .ca:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 14px 0 -6px rgba(255,255,255,.08),0 30px 50px -18px rgba(0,0,0,.65),0 60px 90px -40px rgba(0,0,0,.75)!important}
@media (prefers-reduced-motion:reduce){.sl,.piliers .ca{transition:none}.actus-rot .onglet::before{animation:none}}

/* Contour plus marqué sur les trois cartes piliers (Pascal 09/10) : liseré dans la couleur du produit */
.piliers .ca{border:1.5px solid rgba(15,30,61,.22)!important}
.piliers .ca.pa:nth-child(2){border-color:rgba(201,162,75,.75)!important}
.piliers .ca.pa:nth-child(3){border-color:rgba(110,134,184,.7)!important}
.piliers .ca:not(.pa){border-color:rgba(47,143,107,.6)!important}
:root[data-theme="sombre"] .piliers .ca{border-color:rgba(255,255,255,.28)!important}
:root[data-theme="sombre"] .piliers .ca:not(.pa){border-color:rgba(92,199,156,.55)!important}
:root[data-theme="sombre"] .piliers .ca.pa:nth-child(2){border-color:rgba(227,196,137,.6)!important}
:root[data-theme="sombre"] .piliers .ca.pa:nth-child(3){border-color:rgba(143,164,214,.6)!important}
.piliers .ca:nth-child(1){border-color:rgba(47,143,107,.6)!important}
:root[data-theme="sombre"] .piliers .ca:nth-child(1){border-color:rgba(92,199,156,.55)!important}

/* Accueil : en-tête « Bonjour Alexia » moins haut, les cartes remontent (Pascal 09/10) */
.tete:has(.actus-rot){padding:22px 0 26px!important;margin-bottom:22px!important}
.tete:has(.actus-rot) .fil{margin-bottom:12px}
.tete:has(.actus-rot) .etq{margin-bottom:10px!important}
.tete:has(.actus-rot) .h1{margin-bottom:8px!important}
.tete:has(.actus-rot) .hero{align-items:center}
.actus-rot{min-height:0;padding:34px 24px 16px}
.rot{min-height:146px}
.sl b{font-size:19px}

/* Titres des 3 cartes piliers plus voyants, ton « premium » (Pascal 09/10) :
   plus grands, gras, avec un fin trait de la couleur du produit dessous */
.piliers .ca .h3{font-size:27px!important;font-weight:700!important;letter-spacing:-.4px;line-height:1.15!important;position:relative;padding-bottom:10px}
.piliers .ca .h3::after{content:"";position:absolute;left:0;bottom:0;width:34px;height:2.5px;border-radius:2px;background:#2f8f6b}
.piliers .ca:nth-child(2) .h3::after{background:#C9A24B}
.piliers .ca:nth-child(3) .h3::after{background:#6E86B8}
.piliers .ca .ic{width:52px!important;height:52px!important;border-radius:14px!important;background:linear-gradient(145deg,#1B3260,#0F1E3D)!important;border:0!important;box-shadow:0 8px 16px -8px rgba(15,30,61,.55)}
.piliers .ca .ic svg{stroke:#E3C489!important;width:24px!important;height:24px!important}
:root[data-theme="sombre"] .piliers .ca .ic{background:linear-gradient(145deg,#2a3f6b,#16244A)!important}
.piliers .ca .h3{font-size:24px!important;white-space:nowrap}
.piliers .ca .ent{gap:14px}
.piliers .ca .ent .etat{flex:none}

/* ═══ .apercu-espace-style-2.css ═══ */
/* Proposition 2 « Suisse » (Pascal 09/10) : moins zoomé, tout en Inter, graisses légères, capitales espacées */
.shell{zoom:.86}
body,.h1,.h2,.h3,h1,h2,h3,.nav a,.b1,.b2,.btn,input,select,button,.sl b,.logo{font-family:'Inter',system-ui,sans-serif!important}
.h1{font-weight:300!important;font-size:46px!important;letter-spacing:-1.2px!important}
.h2,.h3{font-weight:400!important;letter-spacing:-.4px!important}
.piliers .ca .h3{font-weight:500!important;font-size:24px!important;letter-spacing:-.6px!important}
.sl b{font-weight:500!important;letter-spacing:-.3px}
.nav a{font-weight:500!important;font-size:13.5px!important}
b,strong,.tab b{font-weight:500!important}
.etq,.onglet,.tab-t,.badge-sp,.etat,.pill{text-transform:uppercase;letter-spacing:.16em!important;font-size:10px!important;font-weight:500!important}
.b1,.b2{height:40px!important;font-size:13px!important;font-weight:500!important;letter-spacing:.02em}
.ca,.tete,.side{border-radius:18px!important}

/* Pages produit plus lisibles, sans en faire trop (Pascal 09/10 : « trop plat ») */
.h1{font-weight:400!important;color:var(--titre,var(--ink))}
.h2{font-weight:400!important}
.chapo{color:var(--titre,var(--ink))!important;opacity:.82}
.ban{background:linear-gradient(135deg,rgba(201,162,75,.10),rgba(255,255,255,.55) 60%)!important;border:1px solid rgba(201,162,75,.6)!important;box-shadow:0 2px 4px rgba(31,52,94,.05),0 16px 36px -18px rgba(31,52,94,.28)!important}
.ban .t{font-weight:500!important}
.ban .t span{font-weight:400}
.ban .pas{background:#0F1E3D!important;color:#fff!important;border:0!important;font-weight:500!important}
.ban .pas span{color:#E3C489!important}
.ban .onglet{font-weight:600!important}
:root[data-theme="sombre"] .ban{background:linear-gradient(135deg,rgba(227,196,137,.10),rgba(255,255,255,.05) 60%)!important;border-color:rgba(227,196,137,.45)!important}
:root[data-theme="sombre"] .ban .pas{background:#E3C489!important;color:#0b1322!important}
:root[data-theme="sombre"] .ban .pas span{color:#0b1322!important}

/* CTA principal visible dès l'arrivée (Pascal 09/10) : « Ouvrir mon … avec OP-Invests ».
   Tant que le partenariat n'est pas signé, il reste sous cadenas, mais en bouton plein, bien visible. */
.tete .btns{flex-wrap:wrap}
.tete .verrou.plein{min-height:48px;padding:10px 22px;border-radius:999px;background:#0F1E3D!important;border:0!important;color:#fff!important;font-size:14.5px;font-weight:500;opacity:1}
.tete .verrou.plein em{background:rgba(227,196,137,.2);color:#E3C489}
:root[data-theme="sombre"] .tete .verrou.plein{background:#eef2f9!important;color:#0b1322!important}
:root[data-theme="sombre"] .tete .verrou.plein em{background:rgba(15,30,61,.12);color:#8a6a1f}

/* Menu : plus large et plus lisible (Pascal 09/10 : « trop petit ») */
.side{width:292px!important;padding-left:14px!important;padding-right:14px!important}
.side .nav a{font-size:15px!important;padding:10px 12px!important;gap:12px}
.side .nav a svg{width:19px!important;height:19px!important}
.side .nav .pill{text-transform:none!important;letter-spacing:0!important;font-size:11px!important;padding:2px 8px!important;flex:none}
.side .logo{font-size:18px!important}

/* ── AV luxembourgeoise : schéma en triangle (Pascal 09/10) ── */
.tri-g{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:28px;align-items:center}
.tri{position:relative;margin:0;aspect-ratio:640/520;border-radius:26px;background:var(--verre);border:1px solid rgba(201,162,75,.45);box-shadow:var(--ombre);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.tri svg{position:absolute;inset:0;width:100%;height:100%}
.tri-arete{font:500 13px Inter,sans-serif;fill:#A8822F;text-anchor:middle;letter-spacing:.06em;text-transform:uppercase}
.tri-s{position:absolute;width:30%;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:12px 14px;border-radius:16px;background:var(--verre-fort);border:1px solid var(--bord);box-shadow:0 10px 24px -14px rgba(15,30,61,.35)}
.tri-s b{font-size:15px;font-weight:600;color:var(--titre,var(--ink))}
.tri-s span:not(.tri-n){font-size:12px;line-height:1.45;color:var(--muted)}
.tri-n{width:26px;height:26px;border-radius:50%;background:#0F1E3D;color:#E3C489;font-size:12.5px;font-weight:600;display:grid;place-items:center;margin-bottom:2px}
.tri-s.haut{left:35%;top:1%}
.tri-s.gauche{left:1%;bottom:12%}
.tri-s.droite{right:1%;bottom:12%}
.tri-c{position:absolute;left:50%;top:56%;transform:translate(-50%,-50%);width:28%;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:16px;border-radius:50%/40%;background:#0F1E3D;color:#C9D1E1;box-shadow:0 18px 40px -16px rgba(15,30,61,.6)}
.tri-c b{font-size:18px;font-weight:600;color:#E3C489}
.tri-c span{font-size:11.5px;line-height:1.45}
.tri-savoir{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.tri-savoir li{font-size:13.5px;line-height:1.5;color:var(--txt);padding:12px 16px;border-radius:14px;background:var(--verre-fort);border:1px solid var(--bord)}
.tri-savoir b{color:var(--titre,var(--ink));font-weight:600}
:root[data-theme="sombre"] .tri-n{background:#E3C489;color:#0b1322}
:root[data-theme="sombre"] .tri-c{background:#1a2742;border:1px solid rgba(227,196,137,.4)}
:root[data-theme="sombre"] .tri-arete{fill:#E3C489}
@media (max-width:1100px){.tri-g{grid-template-columns:1fr}}
@media (max-width:700px){.tri{aspect-ratio:auto;display:flex;flex-direction:column;gap:10px;padding:16px}.tri svg{display:none}.tri-s,.tri-c{position:static;width:auto;transform:none;border-radius:16px}}
.tri-s,.tri-c{z-index:2}
.tri-s{background:#fbfcfe!important;border-color:rgba(201,162,75,.45)!important}
:root[data-theme="sombre"] .tri-s{background:#16223a!important}
.tri-s.gauche,.tri-s.droite{bottom:auto!important;top:64%}

/* CTA principal d'en-tête : même gabarit sur toutes les pages (Pascal 09/10 : « la page SCPI n'a pas la même taille ») */
.tete .b1.cta{height:48px!important;padding:0 24px!important;font-size:14.5px!important;border-radius:999px}

/* ── HARMONISATION DES EN-TÊTES (Pascal 09/10 : « quand tu changes de page, ça fait mal aux yeux ») ──
   Même hauteur d'en-tête et même titre sur toutes les pages : le contenu ne saute plus d'une page à l'autre. */
.tete{min-height:500px;box-sizing:border-box;display:flex;flex-direction:column}
.tete>.wrap{flex:1;display:flex;flex-direction:column}
.tete .fil{margin-top:0!important;margin-bottom:22px!important;min-height:43px}
.tete .hero{flex:1;align-items:center!important;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)!important}
.tete .h1,.salut .h1{font-size:40px!important;line-height:1.15!important;letter-spacing:-1px!important;margin:0 0 16px!important}
.tete .etq{margin-bottom:14px!important}
.tete .chapo{font-size:15.5px!important;line-height:1.6!important;margin:0 0 22px!important;max-width:560px}
.tete .btns{gap:10px!important}
/* les deux bannières de droite : même hauteur sur toutes les pages produit */
.tete .ban.un{min-height:150px!important}
.tete .ban.deux{min-height:110px!important}
/* titre toujours au même endroit : contenu calé en haut, en-tête d'une hauteur unique */
.tete{min-height:600px}
.tete .hero{align-items:start!important;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr)!important}
/* Simulateurs : le menu des simulateurs vit sur la ligne du fil d'Ariane, le titre reste au même endroit */
.fil .simus{margin:0 0 0 24px!important;flex-wrap:nowrap;gap:8px}
.fil .simus a{padding:8px 14px;font-size:13.5px;box-shadow:none}
/* Accueil : la ligne du haut a la même hauteur que sur les autres pages */
.tete .fil:has(.topbar){margin-bottom:22px!important;min-height:43px;align-items:center}
.tete .fil .topbar{margin:0 0 0 auto!important}
.tete:has(.actus-rot){padding-top:26px!important;padding-bottom:44px!important}
.tete:has(.actus-rot) .etq{margin-top:4px}
/* hauteur commune réduite au plus juste (accueil et pages courtes sans grand vide) */
.tete{min-height:520px}
.tete .h1,.salut .h1{font-size:36px!important}
.tete{min-height:582px}
.tete:has(.actus-rot){min-height:0!important}
/* correctif : dans l'en-tête en colonne, le contenu reprend toute la largeur (les marges automatiques le resserraient) */
.tete>.wrap{width:100%!important;margin:0!important;box-sizing:border-box}
/* Actus : la zone prend la hauteur de l'actu la plus longue, quelle que soit la largeur d'écran */
.rot{display:grid;min-height:0!important}
.sl{position:relative!important;inset:auto!important;grid-area:1/1}

/* ══ MOBILE (Pascal 09/10 : « 90 % des clients vont le faire via mobile ») ══════════════
   Une seule colonne, textes à taille de lecture (pas de dézoom), menu en tiroir, barre en bas. */
.barre-m,.voile-m{display:none}
@media (max-width:820px){
  .shell{zoom:1!important}
  body{font-size:15.5px}
  .main{padding-bottom:96px!important}
  .tete{min-height:0!important;margin:10px 10px 22px!important;width:auto!important;padding:20px 0 26px!important;border-radius:24px!important}
  .tete>.wrap{padding:0 18px!important}
  .tete .hero,.hero{grid-template-columns:1fr!important;gap:22px!important}
  .tete .h1,.salut .h1,.h1{font-size:30px!important;line-height:1.15!important}
  .tete .fil{min-height:0;flex-wrap:wrap;gap:8px}
  .fil .simus{margin:8px 0 0!important;width:100%;overflow-x:auto;flex-wrap:nowrap}
  .tete .btns{flex-direction:column;align-items:stretch}
  .tete .btns>*{width:100%;justify-content:center}
  .tete .verrou.plein{height:auto;padding:12px 18px}
  .ban .t{max-width:none!important}
  .ban.deux svg{width:70px}
  .wrap{padding:0 14px!important}
  .piliers,.une,.simple,.s-acces,.acqs,.tri-g,.conf-g,.duo,.g4,.g3,.bloc,.fin,.faq,.deuxc{grid-template-columns:1fr!important}
  .piliers .ca{transform:none!important}
  .bloc,.bande,.etapes,.oubli,.pan{padding:24px 18px!important;border-radius:22px!important}
  .actus-rot{padding:34px 18px 14px}
  /* menu de gauche → tiroir */
  .side{display:flex!important;position:fixed!important;top:0!important;left:0;bottom:0;margin:0!important;height:100%!important;width:84%!important;max-width:320px;z-index:90;border-radius:0 24px 24px 0!important;transform:translateX(-105%);transition:transform .25s ease;overflow-y:auto}
  body.menu-ouvert .side{transform:none}
  .voile-m{position:fixed;inset:0;z-index:85;background:rgba(11,19,34,.45);backdrop-filter:blur(2px)}
  body.menu-ouvert .voile-m{display:block}
  /* barre du bas */
  .barre-m{display:flex;position:fixed;left:10px;right:10px;bottom:10px;z-index:80;justify-content:space-around;padding:8px 6px calc(8px + env(safe-area-inset-bottom));border-radius:22px;background:var(--verre-fort);border:1px solid var(--bord);box-shadow:0 10px 30px -10px rgba(15,30,61,.35);backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%)}
  .barre-m a,.barre-m button{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 2px;border:0;background:none;border-radius:14px;font:500 11.5px Inter,sans-serif;color:var(--muted);text-decoration:none;cursor:pointer}
  .barre-m svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  .barre-m a.on{color:#FF5A00}
  .bascule{position:static}
  .demo{font-size:9px}
}
@media (max-width:820px){
  /* titres des cartes piliers : la pastille passe sous le titre au lieu de le serrer */
  .piliers .ca .ent{flex-wrap:wrap}
  .piliers .ca .h3{white-space:normal!important}
  /* ligne du haut de l'accueil : les petits boutons à droite, sans « Bientôt » orphelin */
  .tete .fil .topbar .btn.ghost .lbl{display:none}
}
@media (max-width:820px){
  /* le tiroir doit passer AU-DESSUS du voile : on sort le menu de l'empilement de la page */
  body.menu-ouvert .shell{position:static!important;z-index:auto!important}
  .side{z-index:95!important}
  .voile-m{z-index:90!important}
  body.menu-ouvert .side{box-shadow:0 0 50px rgba(11,19,34,.4)}
}
@media (max-width:820px){
  details.deroul{margin:0 0 12px;border-radius:20px;background:var(--verre);border:1px solid var(--bord);box-shadow:var(--ombre);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);overflow:hidden}
  details.deroul>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px;font-size:16.5px;font-weight:600;color:var(--titre,var(--ink))}
  details.deroul>summary::-webkit-details-marker{display:none}
  details.deroul>summary::after{content:"";flex:none;width:9px;height:9px;border-right:2px solid #FF5A00;border-bottom:2px solid #FF5A00;transform:rotate(45deg);margin-top:-4px;transition:transform .2s}
  details.deroul[open]>summary::after{transform:rotate(-135deg);margin-top:4px}
  details.deroul>section{margin:0!important;padding:0 14px 16px}
  details.deroul>section.bloc,details.deroul>section.bande,details.deroul>section .bloc{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
}
@media (max-width:820px){
  /* Portefeuille : les chiffres d'abord (titre, puis « en bref », puis les boutons) */
  .tete .hero:has(.synth){display:flex!important;flex-direction:column}
  .tete .hero:has(.synth)>div:first-child{display:contents}
  .tete .hero:has(.synth) .etq{order:1}.tete .hero:has(.synth) .h1{order:2}
  .tete .hero:has(.synth)>div:last-child{order:3}
  .tete .hero:has(.synth) .chapo{order:4}.tete .hero:has(.synth) .btns{order:5}.tete .hero:has(.synth) .conf{order:6}
}

/* ── Octobre Rose (Pascal 10/10/2026) : contour rose + ruban autour du logo ; disparaît avec le ruban (data-fin 2026-11-01) ── */
.logo:has(.ruban-rose){border:2px solid #F25CA8;border-radius:12px;background:#FFF5FA;padding:6px 10px 6px 6px!important;margin:0 6px 22px;width:fit-content;color:#0F1E3D}
.logo .ruban-rose{flex:none;margin-left:2px}
/* ── Offre PER (Pascal 10/10/2026, retirée seule le 01/01/2027) : pastille sous le titre « PER », dans l'espace vide avant le texte (position absolue : ni la flèche ni le texte ne bougent), pas un onglet collé au bord.
   L'onglet du premier essai, posé sur le bord haut de la carte, passait sur le cadre et le rond décoratif : on aurait dit qu'il débordait. ── */
.piliers .ca .h3 .offre-pastille{position:absolute;left:0;top:calc(100% + 12px);padding:4px 11px;border-radius:999px;background:#FF5A00;color:#fff;font-size:12px;font-weight:700;letter-spacing:0;line-height:1.3;white-space:nowrap}

/* ── Actus : logo de la société de gestion / de la SCPI, et offre PER voyante (Pascal 10/10/2026 :
   « mettre les logos des SCPI, ou pour le PER un truc un peu flashy » ; puis « j'aime pas le rose, ça fait too much » → bleu nuit et or, les couleurs de l'espace) ── */
.sl .sl-logo{position:absolute;top:0;right:0;width:52px;height:52px;object-fit:contain;padding:7px;background:#fff;border-radius:14px;box-shadow:0 4px 14px -6px rgba(15,30,61,.25)}
.sl:has(.sl-logo) b,.sl:has(.sl-logo) span:not(.badge-sp){padding-right:64px}
.sl.flash{padding:18px 140px 18px 20px;border-radius:18px;background:linear-gradient(125deg,#0F1E3D 0%,#1C3263 100%);box-shadow:0 14px 30px -14px rgba(15,30,61,.6);overflow:hidden}
.sl.flash b{color:#fff!important}
.sl.flash span:not(.badge-sp){color:rgba(255,255,255,.88)!important}
.sl.flash em{color:#E3C489!important;text-decoration:underline;text-underline-offset:3px}
.sl.flash .badge-sp{background:#FF5A00;color:#fff}
.sl.flash .gros{position:absolute;right:16px;top:50%;transform:translateY(-50%) rotate(-6deg);font-style:normal;font-weight:800;font-size:44px;letter-spacing:-1.5px;color:#E3C489;text-shadow:0 6px 18px rgba(0,0,0,.35);white-space:nowrap}
.sl.flash::before,.sl.flash::after{content:"";position:absolute;border-radius:50%;background:rgba(227,196,137,.12);pointer-events:none}
.sl.flash::before{width:160px;height:160px;right:-40px;top:-60px}
.sl.flash::after{width:90px;height:90px;right:90px;bottom:-50px}
@media (max-width:640px){.sl.flash{padding:16px 16px 64px}.sl.flash .gros{top:auto;bottom:12px;right:14px;transform:rotate(-6deg);font-size:36px}.sl .sl-logo{width:44px;height:44px;padding:6px}.sl:has(.sl-logo) b,.sl:has(.sl-logo) span:not(.badge-sp){padding-right:52px}}
/* ── Largeur sur ordinateur (Pascal 10/10/2026, relayé par la session SEA : « l'espace client prend tout
   l'ordi de gauche à droite, ça fait trop large, réduis un peu ») : l'ensemble menu + contenu limité à 1 640 px et centré ; rien ne change sous 1 500 px d'écran. ── */
@media (min-width:1500px){.shell{max-width:1640px;margin-left:auto;margin-right:auto}}
/* Pascal, 10/10/2026 : « l'espace client prend tout l'ordi de gauche à droite, c'est beaucoup trop large ».
   Sur ordinateur, l'espace entier (menu + contenu) est limité à 1440 px et centré (1 320 testé : cartes tassées) ; mobile inchangé. */
@media (min-width:821px){.shell{max-width:1440px;margin-left:auto;margin-right:auto}}