/* ============================================================
   HelvetLoc — style éditorial suisse × radar signal
   Bricolage Grotesque (display) + Hanken Grotesk (texte)
   ============================================================ */
:root {
  --paper:#F3EFE6; --paper2:#EAE4D6; --ink:#151210; --ink2:#4a4038;
  --red:#E4002B; --red-ink:#B00020; --signal:#12855f; --signal-ink:#0c5c41;
  --line:#d9d1c0; --card:#fffdf8; --shadow:0 18px 50px -24px rgba(20,18,16,.45);
  --maxw:1160px; --r:16px;
  --fdisp:"Bricolage Grotesque", Georgia, serif;
  --fbody:"Hanken Grotesk", system-ui, sans-serif;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--fbody); font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a { color:inherit; text-decoration:none; }
h1,h2,h3,h4 { font-family:var(--fdisp); font-weight:800; line-height:1.02; letter-spacing:-.02em; margin:0; }
em { font-style:normal; color:var(--red); }

/* grain overlay */
.grain { position:fixed; inset:0; pointer-events:none; z-index:9; opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E"); }

/* ---------- Header / nav ---------- */
.site-head { position:sticky; top:0; z-index:20; background:rgba(243,239,230,.82);
  backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.head-inner { max-width:var(--maxw); margin:0 auto; padding:14px 22px;
  display:flex; align-items:center; justify-content:space-between; gap:16px; }
.brand { font-family:var(--fdisp); font-weight:800; font-size:21px; letter-spacing:-.02em;
  display:inline-flex; align-items:center; gap:9px; }
.brand-ch { color:var(--red); }
.brand-mark { width:14px; height:14px; border-radius:50%; background:var(--red); position:relative; }
.brand-mark::after { content:""; position:absolute; inset:-6px; border:2px solid var(--red);
  border-radius:50%; opacity:.35; animation:pulse 2.4s ease-out infinite; }
.brand-mark.small { width:11px; height:11px; }
@keyframes pulse { 0%{transform:scale(.6);opacity:.6} 100%{transform:scale(1.5);opacity:0} }

.mainnav { display:flex; align-items:center; gap:26px; }
.mainnav a { font-weight:500; font-size:15.5px; color:var(--ink2); transition:color .15s; }
.mainnav a:hover { color:var(--ink); }
.nav-cta { background:var(--ink); color:var(--paper)!important; padding:9px 16px; border-radius:100px;
  font-weight:600; }
.nav-cta:hover { background:var(--red); }
.nav-cta.ghost { background:transparent; color:var(--ink)!important; border:1px solid var(--line); }

.lang-switch { display:inline-flex; gap:3px; align-items:center; }
.lang-switch a { font-size:13px; font-weight:700; color:var(--ink2); padding:3px 7px; border-radius:6px; }
.lang-switch a.on { background:var(--ink); color:var(--paper); }
.lang-switch a:hover { color:var(--ink); text-decoration:none; }

.burger { display:none; width:44px; height:40px; position:relative; cursor:pointer;
  background:transparent; border:0; padding:0; z-index:30; }
.burger span, .burger span::before, .burger span::after { content:""; position:absolute; left:9px;
  width:26px; height:2.5px; background:var(--ink); border-radius:2px; transition:.25s; }
.burger span { top:19px; } .burger span::before { top:-8px; } .burger span::after { top:8px; }
.burger.is-open span { background:transparent; }
.burger.is-open span::before { top:0; transform:rotate(45deg); }
.burger.is-open span::after { top:0; transform:rotate(-45deg); }

/* ---------- Buttons ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--fbody); font-weight:600; font-size:16px; padding:13px 24px; border-radius:100px;
  cursor:pointer; border:0; transition:transform .12s, box-shadow .2s, background .2s; }
.btn.primary { background:var(--red); color:#fff; box-shadow:0 10px 30px -12px var(--red); }
.btn.primary:hover { transform:translateY(-2px); box-shadow:0 16px 40px -14px var(--red); }
.btn.big { padding:16px 34px; font-size:18px; }
.btn.full { width:100%; }
.btn.link { color:var(--ink); font-weight:600; }
.btn.link:hover { color:var(--red); }
.btn.ghost { background:transparent; border:1px solid var(--line); color:var(--ink); }

main { min-height:60vh; }

/* ---------- Hero ---------- */
.hero { max-width:var(--maxw); margin:0 auto; padding:70px 22px 40px; }
.hero-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:40px; align-items:center; }
.eyebrow { display:inline-block; font-size:13px; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:var(--red-ink); background:rgba(228,0,43,.08);
  padding:6px 12px; border-radius:100px; margin-bottom:20px;
  animation:rise .7s .05s both; }
.hero h1 { font-size:clamp(38px, 6vw, 68px); animation:rise .7s .12s both; }
.lead { font-size:clamp(17px,2.1vw,21px); color:var(--ink2); max-width:37ch; margin:22px 0 28px;
  animation:rise .7s .22s both; }
.cta-row { display:flex; align-items:center; gap:22px; flex-wrap:wrap; animation:rise .7s .32s both; }
.hero-proof { display:flex; gap:34px; margin-top:42px; flex-wrap:wrap; animation:rise .7s .42s both; }
.hero-proof div b { font-family:var(--fdisp); font-size:30px; display:block; }
.hero-proof div span { font-size:14px; color:var(--ink2); }
@keyframes rise { from{opacity:0; transform:translateY(18px)} to{opacity:1; transform:none} }

/* radar */
.hero-radar { display:flex; flex-direction:column; align-items:center; gap:14px; animation:rise .8s .4s both; }
.radar { position:relative; width:min(340px,80vw); aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle at 50% 50%, #1c1814, #100d0b); overflow:hidden;
  box-shadow:var(--shadow), inset 0 0 60px rgba(0,0,0,.6); }
.radar .ring { position:absolute; border:1px solid rgba(228,0,43,.28); border-radius:50%;
  top:50%; left:50%; transform:translate(-50%,-50%); }
.ring.r1{width:32%;height:32%} .ring.r2{width:62%;height:62%} .ring.r3{width:92%;height:92%}
.radar::before,.radar::after { content:""; position:absolute; background:rgba(228,0,43,.18); }
.radar::before { left:50%; top:0; bottom:0; width:1px; } .radar::after { top:50%; left:0; right:0; height:1px; }
.sweep { position:absolute; inset:0; border-radius:50%;
  background:conic-gradient(from 0deg, rgba(228,0,43,.45), rgba(228,0,43,0) 60deg);
  animation:spin 3.4s linear infinite; }
@keyframes spin { to{transform:rotate(360deg)} }
.radar-core { position:absolute; top:50%; left:50%; width:10px; height:10px; margin:-5px;
  background:var(--red); border-radius:50%; box-shadow:0 0 16px var(--red); }
.blip { position:absolute; width:9px; height:9px; border-radius:50%; background:#ffd34d;
  box-shadow:0 0 12px #ffd34d; opacity:0; }
.blip.b1{ top:30%; left:64%; animation:blip 3.4s .4s infinite; }
.blip.b2{ top:66%; left:40%; animation:blip 3.4s 1.7s infinite; }
.blip.b3{ top:52%; left:72%; animation:blip 3.4s 2.6s infinite; }
@keyframes blip { 0%,100%{opacity:0; transform:scale(.5)} 12%{opacity:1; transform:scale(1)} 60%{opacity:0} }
.radar-caption { font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink2); }

/* ---------- Scarcity band ---------- */
.scarcity { background:var(--ink); color:var(--paper); }
.scarcity-inner { max-width:var(--maxw); margin:0 auto; padding:48px 22px; }
.scarcity-lead { font-family:var(--fdisp); font-weight:700; font-size:clamp(22px,3vw,30px);
  margin:0 0 10px; }
.scarcity-intro { font-size:15px; color:#c9bfae; max-width:640px; line-height:1.55; margin:0 0 26px; }
.scarcity-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.scarcity-stats b { font-family:var(--fdisp); font-size:clamp(28px,3.6vw,40px); color:#ff5a76;
  display:block; line-height:1; }
.scarcity-stats sup { font-size:0.4em; vertical-align:super; margin-left:1px; }
.scarcity-stats span { font-size:14px; color:#c9bfae; display:block; margin-top:8px; }
.scarcity-src { font-size:12.5px; color:#8f8574; margin:24px 0 0; }

/* ---------- Section heads ---------- */
.sec-head { display:flex; align-items:baseline; gap:16px; max-width:var(--maxw); margin:0 auto 34px;
  padding:0 22px; }
.sec-num { font-family:var(--fdisp); font-weight:800; font-size:15px; color:var(--red);
  border:1.5px solid var(--red); border-radius:100px; padding:4px 12px; flex:none; }
.sec-head h1,
.sec-head h2 { font-size:clamp(26px,3.6vw,40px); }
.sec-head.light .sec-num { color:#ff5a76; border-color:#ff5a76; }
.sec-head.light h2 { color:var(--paper); }

/* ---------- How ---------- */
.how { padding:70px 0; }
.steps { max-width:var(--maxw); margin:0 auto; padding:0 22px; display:grid;
  grid-template-columns:repeat(3,1fr); gap:22px; }
.step { background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:28px;
  position:relative; transition:transform .18s, box-shadow .18s; }
.step:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
.step-n { font-family:var(--fdisp); font-weight:800; font-size:15px; color:#fff; background:var(--red);
  width:34px; height:34px; border-radius:50%; display:grid; place-items:center; margin-bottom:16px; }
.step h3 { font-size:21px; margin-bottom:10px; }
.step p { color:var(--ink2); font-size:16px; margin:0; }
.how-note { max-width:var(--maxw); margin:34px auto 0; padding:0 22px; color:var(--ink2);
  font-size:15px; }

/* ---------- Cities ---------- */
.cities { background:var(--ink); padding:70px 0; }
.city-grid { max-width:var(--maxw); margin:0 auto; padding:0 22px; display:grid;
  grid-template-columns:repeat(3,1fr); gap:16px; }
.city { background:#1e1a16; border:1px solid #322a22; border-radius:var(--r); padding:22px 24px;
  color:var(--paper); transition:.18s; display:flex; flex-direction:column; gap:4px; }
.city:hover { background:#241f1a; border-color:var(--red); transform:translateY(-3px); }
.city b { font-family:var(--fdisp); font-size:23px; }
.city span { color:#c9bfae; font-size:14px; }
.city i { color:#ff5a76; font-style:normal; font-weight:600; font-size:14px; margin-top:8px; }

/* ---------- Why ---------- */
.why { padding:70px 0; }
.why-grid { max-width:var(--maxw); margin:0 auto; padding:0 22px; display:grid;
  grid-template-columns:repeat(2,1fr); gap:18px; }
.why-card { background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:26px 28px; }
.why-card h3 { font-size:20px; margin-bottom:8px; }
.why-card p { color:var(--ink2); font-size:16px; margin:0; }

/* ---------- Pricing ---------- */
.pricing { padding:70px 0; background:linear-gradient(180deg,var(--paper),var(--paper2)); }
.plans { max-width:var(--maxw); margin:0 auto; padding:0 22px; display:grid;
  grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch; }
.plan { background:var(--card); border:1px solid var(--line); border-radius:20px; padding:30px 26px;
  display:flex; flex-direction:column; position:relative; transition:transform .18s, box-shadow .18s; }
.plan:hover { transform:translateY(-5px); box-shadow:var(--shadow); }
.plan.featured { border:2px solid var(--red); box-shadow:var(--shadow); }
.plan-badge { position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--red);
  color:#fff; font-size:12.5px; font-weight:700; letter-spacing:.04em; padding:5px 14px; border-radius:100px; }
.plan h3 { font-size:24px; }
.price { display:flex; align-items:baseline; gap:8px; margin:12px 0 6px; }
.price b { font-family:var(--fdisp); font-size:52px; line-height:1; }
.price span { color:var(--ink2); font-size:15px; }
.plan-tag { color:var(--ink2); font-size:15px; margin:0 0 18px; }
.plan ul { list-style:none; padding:0; margin:0 0 24px; flex:1; }
.plan li { padding:9px 0 9px 26px; position:relative; font-size:15.5px; border-top:1px solid var(--line); }
.plan li::before { content:"✓"; position:absolute; left:0; color:var(--signal); font-weight:800; }
.plan li:first-child { border-top:0; }
.pricing-note { max-width:var(--maxw); margin:26px auto 0; padding:0 22px; text-align:center;
  color:var(--ink2); font-size:14px; }

/* ---------- FAQ ---------- */
.faq { padding:70px 0; }
.faq-list { max-width:820px; margin:0 auto; padding:0 22px; }
.faq details { border-bottom:1px solid var(--line); padding:6px 0; }
.faq summary { font-family:var(--fdisp); font-weight:700; font-size:18px; padding:16px 0; cursor:pointer;
  list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:"+"; color:var(--red); font-size:26px; font-family:var(--fdisp); transition:.2s; }
.faq details[open] summary::after { transform:rotate(45deg); }
.faq details p { color:var(--ink2); margin:0 0 16px; font-size:16px; }

/* ---------- Final CTA ---------- */
.final-cta { padding:20px 22px 90px; }
.final-inner { max-width:var(--maxw); margin:0 auto; background:var(--red); color:#fff;
  border-radius:28px; padding:64px 40px; text-align:center; position:relative; overflow:hidden; }
.final-inner::before { content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 80% 20%, rgba(255,255,255,.18), transparent 40%); }
.final-inner h2 { font-size:clamp(28px,4vw,44px); color:#fff; position:relative; }
.final-inner p { position:relative; margin:14px 0 28px; font-size:19px; opacity:.95; }
.final-inner .btn.primary { background:#fff; color:var(--red); box-shadow:0 14px 40px -14px rgba(0,0,0,.4); }
.final-inner .btn.primary:hover { background:var(--ink); color:#fff; }

/* ---------- Manifesto ---------- */
.manifesto { max-width:820px; margin:0 auto; padding:70px 22px 90px; }
.manifesto .sec-head { padding:0; }
.manifesto-body { margin-top:20px; }
.big-quote { font-family:var(--fdisp); font-weight:700; font-size:clamp(22px,3vw,30px);
  line-height:1.18; margin:0 0 28px; }
.manifesto-body h3 { font-size:22px; margin:34px 0 10px; }
.manifesto-body p { color:var(--ink2); font-size:17px; }
.manifesto-body .btn { margin-top:34px; }

/* ---------- Auth / forms ---------- */
.form-card { background:var(--card); border:1px solid var(--line); border-radius:20px; padding:34px;
  max-width:440px; margin:60px auto; box-shadow:var(--shadow); }
.form-card h1 { font-size:30px; margin-bottom:18px; }
label { display:block; margin:14px 0; font-size:14px; font-weight:600; color:var(--ink2); }
input, .crit-form input { display:block; width:100%; margin-top:6px; padding:12px 14px;
  background:var(--paper); border:1px solid var(--line); border-radius:12px; color:var(--ink);
  font-family:var(--fbody); font-size:16px; }
input:focus { outline:2px solid var(--red); border-color:transparent; }
.form-card .btn { width:100%; margin-top:10px; }
.muted { color:var(--ink2); } .error { color:#fff; background:var(--red); padding:12px 14px;
  border-radius:12px; font-size:15px; }
.form-card .muted { text-align:center; margin-top:16px; font-size:15px; }
.form-card a { color:var(--red-ink); font-weight:600; }

/* ---------- Dashboard ---------- */
/* L'ancien `.dash{display:grid;1fr 1.15fr}` (9 vues d'avant la refonte) restait appliqué
   sous la règle refonte et éclatait le rail + le contenu en 2 colonnes (vu par Ham le 21/08). */
.crit-list { list-style:none; padding:0; margin:0 0 12px; }
.crit-list li { display:flex; justify-content:space-between; align-items:center; gap:12px;
  padding:12px 14px; background:var(--paper); border:1px solid var(--line); border-radius:12px; margin-bottom:8px; }
.crit-detail { display:block; color:var(--ink2); font-size:13.5px; margin-top:2px; }
.crit-form .row { display:flex; gap:10px; } .crit-form .row label { flex:1; }
.crit-actions { display:flex; gap:6px; flex-shrink:0; }
.crit-paused { display:inline-block; margin-left:6px; padding:2px 8px; border-radius:20px;
  background:var(--line); color:var(--ink2); font-size:11.5px; font-weight:700; vertical-align:middle; }
.crit-cats { border:1px solid var(--line); border-radius:12px; padding:12px 14px; margin-top:12px; }
.crit-cats legend { font-size:13.5px; font-weight:600; padding:0 6px; }
label.chk { display:flex; align-items:center; gap:8px; margin-top:10px; font-size:14px; }
label.chk input[type=checkbox] { display:inline-block; width:auto; margin:0; flex-shrink:0; }
.crit-cats label.chk { display:inline-flex; margin:6px 14px 0 0; text-transform:capitalize; }
/* --- Candidature (maillon 2) --- */
.apply { max-width:820px; margin:0 auto; padding:24px 18px 60px; }
.apply-head { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; margin:12px 0 18px; }
.apply-head h1 { margin:0 0 4px; }
.apply-clock { text-align:center; padding:12px 18px; border-radius:14px; border:1px solid var(--line);
  background:var(--paper); flex-shrink:0; }
.apply-clock b { display:block; font-size:22px; line-height:1.1; }
.apply-clock span { font-size:12px; color:var(--ink2); }
.apply-clock.hot { border-color:var(--signal); }
.apply-clock.cold { opacity:.75; }
.verdict { padding:12px 16px; border-radius:12px; background:var(--paper); border:1px solid var(--line);
  font-size:15px; margin:0 0 18px; }
.verdict.v-excellent { border-left:4px solid var(--signal); }
.verdict.v-tardif, .verdict.v-probablement-trop-tard { border-left:4px solid #c0392b; }
.sent-badge { padding:10px 14px; border-radius:10px; background:var(--paper);
  border:1px solid var(--line); font-weight:600; font-size:14px; }
.warnbox { padding:14px 16px; border-radius:12px; border:1px solid var(--line);
  background:var(--paper); margin:0 0 18px; }
.warnbox ul { margin:8px 0 12px; padding-left:20px; font-size:14px; color:var(--ink2); }
.apply-lang { font-size:14px; color:var(--ink2); margin-bottom:10px; }
/* --- Mur payant (maillon 5) --- */
.lockbox { background:var(--paper); border:1px solid var(--line); border-radius:16px;
  padding:26px 28px; text-align:left; }
.lock-badge { display:inline-block; padding:4px 12px; border-radius:20px; background:var(--ink);
  color:#fff; font-size:12.5px; font-weight:700; margin-bottom:12px; }
.lockbox h1 { margin:0 0 10px; font-size:26px; }
.lock-why { font-size:16px; line-height:1.55; margin:0 0 14px; }
.contact-locked { opacity:.9; border:1px dashed var(--line); }

/* --- Visite & bail (maillon 4) --- */
.visit-cols { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px; margin-top:20px; }
.visit-col { background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:16px 18px; }
.visit-col h2 { font-size:16px; margin:0 0 10px; }
.visit-list { margin:0; padding-left:20px; font-size:14.5px; line-height:1.65; }
.visit-list li { margin-bottom:6px; }
.checkpoints { list-style:none; padding:0; margin:14px 0 0; }
.cp { background:var(--paper); border:1px solid var(--line); border-left:4px solid var(--line);
  border-radius:12px; padding:14px 16px; margin-bottom:10px; }
.cp-alert { border-left-color:#c0392b; }
.cp-warn { border-left-color:#d68910; }
.cp-info { border-left-color:var(--ink2); }
.cp-ok { border-left-color:var(--signal); }
.cp-head { display:flex; justify-content:space-between; align-items:baseline; gap:12px; flex-wrap:wrap; }
.cp-basis { font-size:12px; color:var(--ink2); font-variant:all-small-caps; letter-spacing:.03em;
  white-space:nowrap; }
.cp-detail { margin:6px 0 0; font-size:14.5px; line-height:1.55; }
.cp-action { margin:8px 0 0; font-size:14px; font-weight:600; }
.legal-note { border-top:1px solid var(--line); padding-top:12px; }

/* --- Ma course (maillon 3) --- */
.diag { padding:18px 20px; border-radius:14px; border:1px solid var(--line);
  background:var(--paper); margin:18px 0 22px; border-left:4px solid var(--ink2); }
.diag-vitesse, .diag-dossier { border-left-color:#c0392b; }
.diag-volume { border-left-color:#d68910; }
.diag-aucune { border-left-color:var(--signal); }
.diag-tag { display:inline-block; font-size:12px; font-weight:700; text-transform:uppercase;
  letter-spacing:.04em; color:var(--ink2); margin-bottom:8px; }
.diag-msg { margin:0 0 10px; font-size:16px; line-height:1.5; }
.diag-action { margin:0; font-weight:600; font-size:15px; }
.goalbar { margin:18px 0 4px; }
.goalbar-track { height:8px; border-radius:20px; background:var(--line); overflow:hidden; }
.goalbar-fill { height:100%; background:var(--signal); border-radius:20px; }
.count { display:inline-block; min-width:22px; padding:1px 8px; border-radius:20px;
  background:var(--red); color:#fff; font-size:13px; vertical-align:middle; }
.callbox { padding:16px 18px; border-radius:14px; border:1px solid var(--line);
  background:var(--paper); margin:0 0 20px; }
.callbox-head { display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; }
.recipient-name { font-weight:600; margin:0 0 10px; }
.recipient-line { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:0 0 8px; }
.rl-label { flex:0 0 110px; color:var(--ink2); font-size:13px; }
.call-btn { font-weight:600; }
.callscript { margin:10px 0 0; padding-left:22px; font-size:15px; line-height:1.6; }
.callscript li { margin-bottom:5px; }
.apply-form textarea { width:100%; margin-top:6px; padding:14px; border-radius:12px;
  border:1px solid var(--line); font:14px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;
  background:var(--paper); color:var(--ink); resize:vertical; }
.apply-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
/* Bloc « candidater par le formulaire de la régie » (le canal de 99,5 % des annonces) */
.formbox { padding:16px 18px; border-radius:14px; border:1px solid var(--line);
  background:var(--paper); margin:20px 0 0; }
.formbox-head { display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:6px; }
.fieldlist { list-style:none; margin:12px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; }
.fieldlist li { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.fieldlist li.field-long { align-items:flex-start; }
.field-label { flex:0 0 90px; color:var(--ink2); font-size:13px; }
.field-value { flex:1 1 200px; padding:8px 12px; border-radius:9px; border:1px solid var(--line);
  background:var(--bg); font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;
  color:var(--ink); overflow-wrap:anywhere; }
.warn-inline { background:#fff6e5; border:1px solid #f0d9a8; color:#8a5a00; padding:9px 12px;
  border-radius:10px; font-size:13px; margin:8px 0 0; }
.back { display:inline-block; margin-bottom:10px; font-size:14px; color:var(--ink2); text-decoration:none; }
.speed-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px; margin:14px 0 4px; }
.speed-tile { background:var(--paper); border:1px solid var(--line); border-radius:12px; padding:14px 16px; }
.speed-tile b { display:block; font-size:26px; line-height:1.1; }
.speed-tile span { color:var(--ink2); font-size:13px; }
.btn.tiny { padding:6px 12px; font-size:13px; }
.live { color:var(--signal); font-size:13px; font-weight:700; }
.matches { list-style:none; padding:0; margin:0; }
.match { padding:14px 16px; background:var(--paper); border:1px solid var(--line); border-radius:12px;
  margin-bottom:10px; transition:.15s; }
.match:hover { border-color:var(--red); }
.match-title { font-family:var(--fdisp); font-weight:700; font-size:16px; color:var(--ink); }
.match-meta { display:flex; flex-wrap:wrap; gap:10px; margin-top:6px; color:var(--ink2); font-size:13.5px; }
.match-meta .rent { color:var(--red-ink); font-weight:700; }
.match-meta .src { margin-left:auto; opacity:.6; font-family:monospace; font-size:12px; }

.dash-feed { max-width:var(--maxw); margin:0 auto 44px; padding:0 22px; }
.dash-feed h2 { font-size:24px; margin-bottom:4px; }
.muted.small { font-size:13.5px; margin:0 0 14px; }
#feed .matches { columns:2; column-gap:12px; }
#feed .match { break-inside:avoid; }
@media (max-width:720px){ #feed .matches { columns:1; } }

/* ============================================================
   Page listing par ville (marché suisse)
   ============================================================ */
.listing { max-width:1320px; margin:0 auto; padding:20px 22px 60px; }
.filters { display:flex; gap:10px; flex-wrap:wrap; align-items:center; background:var(--card);
  border:1px solid var(--line); border-radius:14px; padding:12px 14px; margin-bottom:20px; position:sticky;
  top:64px; z-index:12; }
.filters select { padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--paper);
  font-family:var(--fbody); font-size:14.5px; color:var(--ink); }
.filter-city select { font-weight:700; font-family:var(--fdisp); }
.filters .save-search { margin-left:auto; }

.listing-head { margin-bottom:18px; }
.crumb { color:var(--ink2); font-size:13.5px; margin-bottom:8px; }
.crumb a { color:var(--red-ink); }
.listing-head h1 { font-size:clamp(24px,3.2vw,34px); }
.listing-sub { color:var(--ink2); margin:8px 0 0; }
.listing-count { display:flex; align-items:center; justify-content:space-between; gap:16px;
  margin-top:14px; padding-top:12px; border-top:1px solid var(--line); flex-wrap:wrap; }
.listing-count strong { font-family:var(--fdisp); font-size:20px; }
.sortform label { display:flex; align-items:center; gap:8px; font-size:14px; color:var(--ink2); margin:0; }

.promo { display:flex; align-items:center; gap:16px; background:var(--ink); color:var(--paper);
  border-radius:14px; padding:16px 20px; margin-bottom:20px; }
.promo-ico { font-size:26px; } .promo-txt { flex:1; font-size:15px; } .promo-txt b { color:#fff; }

.browse { margin:6px 0 22px; }
.browse h2 { font-size:20px; margin-bottom:12px; }
.browse-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.browse-card { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px 18px;
  display:flex; flex-direction:column; gap:3px; transition:.16s; }
.browse-card:hover { transform:translateY(-3px); box-shadow:var(--shadow); border-color:var(--red); text-decoration:none; }
.browse-card.active { border-color:var(--red); background:#fff; }
.browse-ico { font-size:24px; }
.browse-card b { font-family:var(--fdisp); font-size:17px; }
.browse-n { color:var(--ink2); font-size:13.5px; }
.browse-clear { margin-top:10px; } .browse-clear a { color:var(--red-ink); font-weight:600; }
@media (max-width:640px){ .browse-grid{ grid-template-columns:repeat(2,1fr); } }

.listing-split { display:grid; grid-template-columns:1fr 440px; gap:20px; align-items:start; }
.grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.map-wrap { position:sticky; top:130px; }
#map { height:calc(100vh - 160px); min-height:520px; border-radius:16px; border:1px solid var(--line);
  overflow:hidden; z-index:1; }

/* Carte annonce */
.rc { background:var(--card); border:1px solid var(--line); border-radius:16px; overflow:hidden;
  display:flex; flex-direction:column; transition:transform .16s, box-shadow .16s; }
.rc:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
.rc-photo { position:relative; aspect-ratio:4/3; background:linear-gradient(135deg,#ece5d6,#ddd3bf);
  overflow:hidden; }
.rc-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.rc-noimg-ph, .rc-photo.noimg::after { display:flex; align-items:center; justify-content:center;
  height:100%; font-size:44px; opacity:.4; }
.rc-noimg-ph { position:absolute; inset:0; }
.rc-ago { position:absolute; top:10px; left:10px; background:rgba(20,18,16,.82); color:#fff;
  font-size:12px; font-weight:600; padding:4px 9px; border-radius:100px; }
.rc-fav { position:absolute; top:8px; right:8px; width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,.9); border:0; font-size:17px; cursor:pointer; color:var(--red); }
.rc-fav:hover { background:#fff; }
.rc-body { padding:14px 16px; display:flex; flex-direction:column; gap:6px; flex:1; }
.rc-title { font-size:18px; }
.rc-sub { color:var(--ink2); font-size:13.5px; margin:0; overflow:hidden; text-overflow:ellipsis;
  white-space:nowrap; }
.rc-meta { display:flex; flex-wrap:wrap; gap:6px; margin-top:2px; }
.rc-meta span { background:var(--paper2); border-radius:8px; padding:3px 9px; font-size:12.5px; color:var(--ink2); }
.rc-loc { color:var(--ink2); font-size:13px; margin:2px 0 0; }
.rc-foot { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px;
  margin-top:auto; padding-top:10px; }
.rc-price { font-family:var(--fdisp); font-weight:800; font-size:19px; }
.rc-price i { font-style:normal; font-weight:400; font-size:12.5px; color:var(--ink2); }
.rc-contact { background:var(--red); color:#fff; font-weight:600; font-size:13.5px; padding:8px 12px;
  border-radius:100px; white-space:nowrap; }
.rc-contact:hover { filter:brightness(1.08); text-decoration:none; }
.rc-contact.locked { background:var(--ink); }
.rc-apply { background:var(--paper); border:1px solid var(--line); color:var(--ink); font-weight:600;
  font-size:13.5px; padding:7px 12px; border-radius:10px; text-decoration:none; white-space:nowrap; }
.rc-apply:hover { border-color:var(--ink); text-decoration:none; }

.pager { grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:16px;
  margin-top:20px; padding-top:16px; }
.pager .pg { background:var(--ink); color:var(--paper); padding:10px 18px; border-radius:100px; font-weight:600; }
.pager .pg:hover { background:var(--red); text-decoration:none; }
.pager .pg-info { color:var(--ink2); font-weight:600; }

.rc-contactbox { margin-top:10px; padding-top:10px; border-top:1px dashed var(--line);
  display:flex; flex-direction:column; gap:4px; font-size:13px; }
.rc-contactbox .rc-cbadge { font-weight:600; }
.rc-contactbox a { color:var(--red-ink); font-weight:600; }
.rc-caddr { color:var(--ink2); }
.rc-contactbox.locked { color:var(--ink2); font-style:italic; }
.rc-contactbox.locked a { color:var(--red-ink); }

/* Pastilles de prix sur la carte */
.price-pin .pin { display:inline-block; background:#fff; border:1.5px solid var(--ink);
  color:var(--ink); font-weight:700; font-size:12px; padding:2px 7px; border-radius:100px;
  box-shadow:0 2px 6px rgba(0,0,0,.25); white-space:nowrap; transform:translate(-50%,-50%); }
.leaflet-marker-icon.price-pin { background:none; border:0; }

@media (max-width:1020px){
  .listing-split{ grid-template-columns:1fr; }
  .map-wrap{ position:static; order:-1; }
  #map{ height:340px; min-height:0; }
}
@media (max-width:640px){
  .grid{ grid-template-columns:1fr; }
  .filters{ top:56px; }
  .filters .save-search{ margin-left:0; width:100%; }
}

/* ---------- Page détail annonce (interne) ---------- */
.detail { max-width:1100px; margin:0 auto; padding:20px 22px 60px; }
/* `minmax(0,1fr)` et NON `1fr` : en Grid, `1fr` vaut `minmax(auto,1fr)` — la colonne ne peut
   jamais devenir plus étroite que son contenu. Les tuiles de la carte Leaflet imposaient donc
   une largeur minimale qui poussait toute la grille hors de l'écran. Mesuré le 17/08/2026 sur
   /logement/10370 en 1850px de large : page scrollWidth 2098 pour 1835 visibles (263 px de
   débordement), aside du prix rejetée à droite=2098 (le loyer « CHF 2'180/mois » était coupé,
   défaut vu par Ham dans son navigateur) et photo étirée à 1344x840 — elle occupait tout
   l'écran sous le menu. Avec minmax(0,…) : débordement 0, aside à 1446, photo 692x433. */
.detail-grid { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:24px; align-items:start; margin-top:12px; }
.detail-photo { border-radius:16px; overflow:hidden; border:1px solid var(--line); background:var(--paper2); aspect-ratio:16/10; }
.detail-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.detail-thumbs { display:flex; gap:8px; overflow-x:auto; padding:10px 0 4px; }
.detail-thumb { width:96px; height:72px; object-fit:cover; border-radius:8px; border:2px solid transparent;
  cursor:pointer; flex:none; transition:.15s; }
.detail-thumb:hover, .detail-thumb.on { border-color:var(--red); }
.detail-photocount { color:var(--ink2); font-size:13px; margin:4px 0 0; }
.rc-pub { color:var(--ink2); font-size:12.5px; margin:2px 0 0; }
.detail-title { font-size:clamp(22px,3vw,30px); margin:18px 0 12px; }
.detail-facts { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:18px; }
.detail-facts span { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:6px 12px; font-size:14px; }
.detail-desc { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px 22px; margin-bottom:18px; }
.detail-desc h2 { font-size:19px; margin-bottom:8px; }
.detail-desc p { color:var(--ink2); white-space:pre-line; }
.detail-map { height:320px; border-radius:16px; border:1px solid var(--line); overflow:hidden; z-index:1; }
.detail-side { position:sticky; top:130px; background:var(--card); border:1px solid var(--line); border-radius:18px; padding:22px; display:flex; flex-direction:column; gap:12px; }
.detail-price { font-family:var(--fdisp); font-weight:800; font-size:30px; }
.detail-price i { font-style:normal; font-weight:400; font-size:14px; color:var(--ink2); }
.detail-contact { display:flex; flex-direction:column; gap:8px; padding:14px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.detail-cbtn { background:var(--paper); border:1px solid var(--line); border-radius:100px; padding:10px 14px; font-weight:600; text-align:center; color:var(--ink); }
.detail-cbtn:hover { border-color:var(--red); text-decoration:none; }
.detail-source { text-align:center; color:var(--ink2); font-size:13.5px; }
.rc-title-link:hover { text-decoration:none; }
/* Même correctif qu'au-dessus : en une seule colonne aussi, `1fr` nu laisserait la carte
   Leaflet imposer sa largeur minimale et faire déborder la page sur un téléphone. */
@media (max-width:860px){ .detail-grid{ grid-template-columns:minmax(0,1fr); } .detail-side{ position:static; } }

/* ---------- Admin ---------- */
.admin { max-width:var(--maxw); margin:0 auto; padding:44px 22px; }
.admin .stats { display:flex; gap:16px; flex-wrap:wrap; margin:18px 0; }
.admin .stats div { background:var(--card); border:1px solid var(--line); border-radius:14px;
  padding:16px 22px; min-width:130px; }
.admin .stats strong { font-family:var(--fdisp); font-size:26px; display:block; color:var(--red); }
.admin .stats span { color:var(--ink2); font-size:13px; }
.health { width:100%; border-collapse:collapse; margin-top:18px; font-size:14px; background:var(--card);
  border-radius:12px; overflow:hidden; }
.health th, .health td { text-align:left; padding:10px 12px; border-bottom:1px solid var(--line); }
.health th { background:var(--paper2); font-family:var(--fdisp); }
.health .status { font-family:monospace; font-size:12px; color:var(--ink2); }
.health tr.ko .status { color:var(--red-ink); }
.scan-result { background:var(--ink); color:var(--paper); border-radius:12px; padding:12px;
  min-height:20px; font-size:13px; overflow-x:auto; margin-top:12px; }

/* ---------- Footer ---------- */
.site-foot { background:var(--ink); color:var(--paper); margin-top:40px; }
.foot-inner { max-width:var(--maxw); margin:0 auto; padding:56px 22px 30px; display:grid;
  grid-template-columns:1.4fr 2fr; gap:40px; }
.foot-brand strong { font-family:var(--fdisp); font-size:20px; display:inline-block; margin-left:8px; }
.foot-brand p { color:#c9bfae; font-size:15px; max-width:34ch; margin:14px 0 0; }
.foot-cols { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.foot-cols h4 { font-size:14px; letter-spacing:.08em; text-transform:uppercase; color:#8f8574;
  margin-bottom:12px; font-family:var(--fbody); font-weight:700; }
.foot-cols a { display:block; color:#e6ddcd; font-size:15px; padding:5px 0; }
.foot-cols a:hover { color:var(--red); }
.foot-legal { max-width:var(--maxw); margin:0 auto; padding:20px 22px 40px; border-top:1px solid #2a231d;
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; color:#8f8574; font-size:13px; }

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:900px){
  .hero-grid{ grid-template-columns:1fr; } .hero-radar{ order:-1; }
  .scarcity-stats{ grid-template-columns:repeat(2,1fr); }
  .steps,.plans,.city-grid{ grid-template-columns:1fr; }
  .why-grid{ grid-template-columns:1fr; }
  .foot-inner{ grid-template-columns:1fr; }
}
@media (max-width:720px){
  .burger{ display:block; }
  .mainnav{ position:fixed; inset:64px 0 auto 0; flex-direction:column; align-items:stretch;
    gap:0; background:var(--paper); border-bottom:1px solid var(--line); padding:8px 0;
    transform:translateY(-140%); transition:transform .3s ease; box-shadow:var(--shadow);
    max-height:calc(100vh - 64px); overflow-y:auto; }
  .mainnav.open{ transform:none; }
  .mainnav a{ padding:15px 24px; border-top:1px solid var(--line); font-size:17px; }
  .mainnav .nav-cta{ margin:12px 24px; text-align:center; }
  .crit-form .row{ flex-direction:column; }
  .foot-cols{ grid-template-columns:repeat(2,1fr); }
  .final-inner{ padding:44px 24px; }
}
@media (prefers-reduced-motion:reduce){
  *{ animation:none!important; scroll-behavior:auto; }
}

/* ============ Espace membre : profil locataire + dossier suisse ============ */
.account { max-width:var(--maxw); margin:0 auto; padding:38px 22px 80px; }
.acc-head { display:flex; justify-content:space-between; align-items:flex-end; gap:24px;
  flex-wrap:wrap; margin-bottom:22px; }
.acc-head h1 { font-family:var(--fdisp); font-size:clamp(26px,4vw,38px); margin:0 0 6px; }
.acc-head .muted { max-width:52ch; margin:0; }
.acc-tabs { display:flex; gap:6px; flex-wrap:wrap; }
.acc-tabs a { font-size:14px; font-weight:600; color:var(--ink2); padding:8px 14px;
  border:1px solid var(--line); border-radius:100px; background:var(--card); }
.acc-tabs a.on { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.acc-tabs a:hover { text-decoration:none; color:var(--ink); }

.flash { padding:12px 16px; border-radius:12px; font-weight:600; margin-bottom:20px; }
.flash.ok { background:rgba(18,133,95,.12); color:var(--signal-ink); border:1px solid rgba(18,133,95,.3); }

/* Jauge de solidité */
.gauge-card { background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  padding:22px 24px; margin-bottom:26px; box-shadow:var(--shadow); }
.gauge-top { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:10px; }
.gauge-top strong { font-family:var(--fdisp); font-size:19px; }
.gauge-pct { font-weight:800; font-size:20px; color:var(--signal-ink); }
.gauge-bar { height:12px; background:var(--paper2); border-radius:100px; overflow:hidden; }
.gauge-bar span { display:block; height:100%; background:linear-gradient(90deg,var(--signal),#1aa877);
  border-radius:100px; transition:width .5s; }
.gauge-sections { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:8px; margin-top:16px; }
.gseg { display:flex; justify-content:space-between; align-items:center; gap:8px;
  padding:9px 12px; border-radius:10px; font-size:13px; font-weight:600; border:1px solid var(--line); }
.gseg:hover { text-decoration:none; }
.gseg-pct { font-weight:800; }
.gseg.full { background:rgba(18,133,95,.12); color:var(--signal-ink); border-color:rgba(18,133,95,.3); }
.gseg.mid { background:var(--card); color:var(--ink2); }
.gseg.low { background:rgba(228,0,43,.06); color:var(--red-ink); border-color:rgba(228,0,43,.2); }

/* Formulaire profil */
.profile-form fieldset { border:1px solid var(--line); border-radius:var(--r); padding:18px 22px 22px;
  margin:0 0 18px; background:var(--card); }
.profile-form legend { font-family:var(--fdisp); font-weight:700; font-size:16px; padding:0 8px; }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:2px 22px; }
.grid2 label.wide { grid-column:1 / -1; }
.grid2 label.check { display:flex; align-items:center; gap:9px; font-weight:600; color:var(--ink);
  margin:16px 0 8px; }
.grid2 label.check input { width:auto; margin:0; }
.profile-form select, .profile-form textarea, .quiz-form input { font:inherit; }
.form-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:8px; }
@media (max-width:640px){ .grid2 { grid-template-columns:1fr; } .acc-head { align-items:flex-start; } }

/* Dossier suisse : quiz + checklist */
.quiz { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin-bottom:18px; }
.quiz-q { border:1px solid var(--line); border-radius:var(--r); padding:16px 18px; background:var(--card); }
.quiz-q legend { font-weight:700; font-size:14px; padding:0 6px; }
.radios { display:flex; flex-direction:column; gap:8px; margin-top:8px; }
.radio { display:flex; align-items:center; gap:9px; font-weight:500; color:var(--ink2);
  padding:8px 12px; border:1px solid var(--line); border-radius:10px; cursor:pointer; margin:0; }
.radio input { width:auto; margin:0; }
.radio.sel { border-color:var(--ink); background:var(--paper2); color:var(--ink); font-weight:600; }

.dossier-progress { background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  padding:18px 22px; margin:24px 0 18px; }
.checklist { list-style:none; padding:0; margin:0 0 18px; }
.checklist li { display:flex; gap:14px; align-items:flex-start; padding:16px 0; border-top:1px solid var(--line); }
.checklist li.done { opacity:.72; }
.ck-box { padding-top:2px; }
.ck-box input[type=checkbox] { width:20px; height:20px; }
.ck-dot { display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px;
  border-radius:50%; border:2px solid var(--line); font-size:12px; color:#fff; }
.ck-dot.on { background:var(--signal); border-color:var(--signal); }
.ck-body strong { display:block; font-size:15.5px; }
.ck-body .req { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
  color:var(--red-ink); margin-left:8px; }
.ck-body .opt { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
  color:var(--ink2); margin-left:8px; }
.ck-hint { display:block; color:var(--ink2); font-size:14px; margin-top:3px; }

/* ============ Dashboard à registre de widgets ============ */
.view-nav { display:flex; gap:6px; flex-wrap:wrap; margin:0 0 22px; }
.view-nav a { font-size:13.5px; font-weight:600; color:var(--ink2); padding:7px 13px;
  border:1px solid var(--line); border-radius:100px; background:var(--card); }
.view-nav a.on { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.view-nav a:hover { text-decoration:none; color:var(--ink); }

.widget-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px; }
.widget { background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  padding:18px 20px; display:flex; flex-direction:column; }
.widget.w-latent, .widget.w-locked, .widget.w-empty { opacity:.9; }
.w-head { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:12px; }
.w-head h3 { font-family:var(--fdisp); font-size:16px; margin:0; }
.w-badge { font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.05em;
  padding:3px 8px; border-radius:100px; white-space:nowrap; }
.w-badge.ok { background:rgba(18,133,95,.14); color:var(--signal-ink); }
.w-badge.todo { background:var(--paper2); color:var(--ink2); }
.w-badge.soon { background:rgba(20,90,180,.12); color:#12559b; }
.w-badge.lock { background:rgba(190,120,0,.14); color:#8a5a00; }
.w-badge.err { background:rgba(228,0,43,.12); color:var(--red-ink); }
.w-note { color:var(--ink2); font-size:14px; margin:0; }
.w-ok { color:var(--signal-ink); font-size:14px; margin:0; }
.w-issues { list-style:none; padding:0; margin:0; font-size:14px; color:var(--red-ink); }
.w-issues li { padding:4px 0; }
.w-check, .w-alerts, .w-listings { list-style:none; padding:0; margin:6px 0; font-size:14px; }
.w-check li, .w-alerts li, .w-listings li { padding:5px 0; display:flex; gap:8px; align-items:baseline; }
.w-check li.done { opacity:.6; }
.gauge-mini { margin-bottom:10px; }
.gauge-sections.small { display:flex; flex-wrap:wrap; gap:5px; margin:10px 0; }
.gauge-sections.small .gseg { font-size:11px; padding:4px 8px; }
.countdown strong { font-size:26px; font-family:var(--fdisp); color:var(--signal-ink); }
.ref-code { font-family:var(--fdisp); font-size:20px; letter-spacing:.1em; }
.btn.tiny { font-size:13px; padding:6px 12px; margin-top:8px; align-self:flex-start; }

/* Explorer les modules */
.legend { font-size:13px; color:var(--ink2); margin:0 0 20px; }
.cat-title { font-family:var(--fdisp); font-size:20px; margin:26px 0 12px; }
.module-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:12px; }
.module-card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px 16px;
  display:flex; flex-direction:column; gap:6px; }
.module-card.not-eligible { opacity:.62; }
.mc-head { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.mc-head strong { font-size:14.5px; }
.mc-desc { font-size:13px; color:var(--ink2); margin:0; flex:1; }
.mc-note { font-size:12px; color:#8a5a00; margin:0; }
.mc-foot { display:flex; justify-content:space-between; align-items:center; margin-top:4px; }
.mc-view { text-transform:uppercase; letter-spacing:.05em; font-size:11px; }
.mc-toggle { margin:0; }
.mc-toggle .btn.tiny { margin-top:0; }

/* Candidatures : pipeline & suivi */
.pipeline { display:flex; gap:10px; overflow-x:auto; padding-bottom:6px; }
.pl-col { flex:0 0 140px; background:var(--paper2); border-radius:10px; padding:8px 10px; }
.pl-head { font-size:12px; font-weight:700; margin-bottom:6px; display:flex; justify-content:space-between; }
.pl-count { background:var(--ink); color:var(--paper); border-radius:100px; padding:0 7px; font-size:11px; }
.pl-col ul { list-style:none; padding:0; margin:0; font-size:12.5px; }
.pl-col li { padding:4px 0; border-top:1px solid var(--line); }
.nba-action strong { font-size:16px; }
.follow-box { margin-top:8px; }
.follow-box select { width:100%; }

/* Marché local */
.mkt-scope { font-weight:600; margin:0 0 8px; }
.mkt-median { display:flex; justify-content:space-between; align-items:baseline;
  padding:8px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-bottom:6px; }
.mkt-median strong { font-family:var(--fdisp); font-size:22px; color:var(--signal-ink); }

/* Bouton favori sur les cartes d'annonces */
.rc-favform { margin:8px 0 0; }
.rc-fav { display:inline-block; font-size:13px; font-weight:600; padding:6px 12px; border-radius:100px;
  border:1px solid var(--line); background:var(--card); color:var(--ink); cursor:pointer; }
.rc-fav:hover { border-color:var(--ink); text-decoration:none; }
.rc-fav.on { background:rgba(228,0,43,.1); color:var(--red-ink); border-color:rgba(228,0,43,.3); }

/* Pages légales */
.legal-page .legal-sections { color:var(--ink2); font-size:15.5px; line-height:1.9; padding-left:20px; }
.legal-page .legal-sections li { padding:2px 0; }

/* À propos — bande de chiffres réels (E-E-A-T entité) */
.about-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin:22px 0 30px;
  padding:22px; background:var(--card); border:1px solid var(--line); border-radius:var(--r); }
.about-stats b { font-family:var(--fdisp); font-size:30px; display:block; color:var(--ink); }
.about-stats span { font-size:13.5px; color:var(--ink2); }
.about-editor { margin-top:18px; }
.legal-dl { display:grid; grid-template-columns:auto 1fr; gap:6px 18px; font-size:15.5px; margin:0 0 14px; }
.legal-dl dt { color:var(--ink2); font-weight:600; }
.legal-dl dd { margin:0; }
@media (max-width:640px){ .about-stats{ grid-template-columns:repeat(2,1fr);} }

/* Pages légales — contenu rédigé */
.legal-block { max-width:760px; }
.legal-h { font-family:var(--fdisp); font-size:18px; margin:22px 0 6px; }
.legal-block p { color:var(--ink2); font-size:15.5px; line-height:1.7; margin:0 0 4px; }
.legal-updated { margin-top:28px; padding-top:14px; border-top:1px solid var(--line); }

/* ---------- Envoyer mon dossier (PDF + liens de partage) ---------- */
.send-dossier { margin-top:38px; padding:26px; background:var(--card); border:1px solid var(--line);
  border-radius:var(--r); box-shadow:var(--shadow); }
.send-dossier h2 { font-size:22px; margin-bottom:4px; }
.send-dossier > .muted { margin:0 0 18px; }
.send-actions { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:20px; }
.share-new { display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.share-input { flex:1; min-width:260px; font:inherit; font-size:14px; padding:8px 12px;
  border:1px solid var(--line); border-radius:10px; background:var(--paper); color:var(--ink2); }
.share-form { display:flex; flex-wrap:wrap; align-items:flex-end; gap:14px;
  padding:16px 0 6px; border-top:1px solid var(--line); }
.share-form label { display:flex; flex-direction:column; gap:5px; font-weight:600; font-size:14.5px; }
.share-form input, .share-form select { font:inherit; font-size:15px; padding:10px 12px;
  border:1px solid var(--line); border-radius:10px; background:var(--paper); min-width:180px; }
.share-form input[name="recipient"] { min-width:320px; }
.share-table { width:100%; border-collapse:collapse; margin-top:18px; font-size:15px; }
.share-table th { text-align:left; font-size:12px; text-transform:uppercase; letter-spacing:.1em;
  color:var(--ink2); font-weight:600; padding:0 10px 8px 0; border-bottom:1px solid var(--line); }
.share-table td { padding:11px 10px 11px 0; border-bottom:1px solid var(--line); vertical-align:top; }
.share-table tr.off { opacity:.55; }
.share-table strong { display:block; }
.share-table form { margin:0; }
.pill { display:inline-block; font-size:12.5px; font-weight:600; padding:3px 11px; border-radius:100px;
  border:1px solid var(--line); color:var(--ink2); white-space:nowrap; }
.pill.on { background:rgba(18,133,95,.12); border-color:rgba(18,133,95,.3); color:var(--signal-ink); }
@media (max-width:640px) {
  .share-form input[name="recipient"] { min-width:0; width:100%; }
  .share-form label { width:100%; }
  .share-table thead { display:none; }
  .share-table td { display:block; border:0; padding:2px 0; }
  .share-table tr { display:block; padding:12px 0; border-bottom:1px solid var(--line); }
}
.w-shares { list-style:none; margin:0 0 10px; padding:0; display:flex; flex-direction:column; gap:7px; }
.w-shares li { display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:14.5px; }
.w-share-to { font-weight:600; }
.flash.warn { background:rgba(228,0,43,.08); color:var(--red-ink); border:1px solid rgba(228,0,43,.25); }

/* ---------- Tarifs (page dediee) + abonnement ---------- */
.pricing-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:18px;
  margin-top:8px; }
.price-card { position:relative; background:var(--card); border:1px solid var(--line);
  border-radius:var(--r); padding:26px 24px; box-shadow:var(--shadow);
  display:flex; flex-direction:column; gap:10px; }
.price-card.featured { border-color:var(--red); border-width:2px; }
.price-tag { position:absolute; top:-12px; left:22px; background:var(--red); color:#fff;
  font-size:12.5px; font-weight:700; padding:3px 12px; border-radius:100px; }
.price-card h2 { font-size:24px; }
.price-pitch { color:var(--ink2); margin:0; }
.price-amount { font-family:var(--fdisp); font-weight:800; font-size:40px; letter-spacing:-.02em; }
.price-amount small { font-size:15px; font-weight:500; color:var(--ink2); font-family:var(--fbody); }
.price-features { list-style:none; margin:0 0 8px; padding:0; display:flex; flex-direction:column;
  gap:7px; flex:1; }
.price-features li { padding-left:22px; position:relative; font-size:15px; }
.price-features li::before { content:"✓"; position:absolute; left:0; color:var(--signal); font-weight:700; }
.btn.current { cursor:default; opacity:.7; }
/* Demande expresse d'exécution immédiate, cochée avant de payer (cf. billing / CGV art. 5).
   Elle doit se LIRE, pas se subir : texte à taille normale, case alignée sur la 1re ligne. */
.price-consent { display:flex; gap:9px; align-items:flex-start; margin:4px 0 12px;
  font-size:13.5px; line-height:1.45; color:var(--muted); cursor:pointer; text-align:left; }
.price-consent input { margin-top:3px; flex:none; width:16px; height:16px; accent-color:var(--signal); }
.sub-card { background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  padding:26px; box-shadow:var(--shadow); display:flex; flex-direction:column; gap:14px;
  max-width:560px; }
.sub-status h2 { font-size:26px; margin:8px 0 2px; }
.fresh { color:var(--red-ink); font-weight:700; }


/* --- Auto-remplissage du formulaire de la régie (Turbo) ------------------- */
.autofill { margin-top: 18px; padding: 14px 16px; border: 1px solid var(--line, #e3e0da);
  border-radius: 10px; background: #fbfaf8; }
.autofill-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.plan-chip { display: inline-block; padding: 1px 8px; border-radius: 999px;
  background: #d81e28; color: #fff; font-size: 11px; letter-spacing: .04em;
  text-transform: uppercase; vertical-align: middle; }
.autofill-drag { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin: 10px 0; }
.autofill-teaser { margin-top: 16px; padding-top: 12px; border-top: 1px dashed var(--line, #e3e0da); }
.autofill-revoke { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--line, #e3e0da); }

/* ═══ REFONTE ESPACE MEMBRE (21/08/2026) — 5 vues du parcours ═══════════════
   Signature : le CHRONO — l'âge de chaque annonce, badge pillule 3 états.
   Tokens du site (papier/encre/rouge suisse), aucun hex nouveau hors ambre chrono. */

.dash{max-width:var(--maxw);margin:0 auto;padding:18px 20px 60px}

/* Rail de navigation : le parcours en 5 arrêts, sticky, item actif souligné rouge. */
/* top = hauteur réelle du header sticky (posée par nav.js), sinon il se superpose au header. */
.dash-rail{display:flex;gap:4px;overflow-x:auto;position:sticky;top:var(--headh,80px);z-index:19;
  background:color-mix(in srgb, var(--paper) 92%, transparent);backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);margin:0 -20px 22px;padding:6px 20px}
.dash-rail a{display:flex;align-items:center;gap:7px;white-space:nowrap;
  padding:10px 14px;border-radius:10px;font-weight:600;color:var(--ink2);
  text-decoration:none;border-bottom:3px solid transparent;transition:background .18s}
.dash-rail a:hover{background:var(--paper2)}
.dash-rail a.on{color:var(--ink);border-bottom-color:var(--red);border-radius:10px 10px 0 0}
.rail-badge{min-width:21px;height:21px;padding:0 6px;border-radius:11px;background:var(--red);
  color:#fff;font-size:.72rem;font-weight:700;display:inline-flex;align-items:center;
  justify-content:center;font-family:var(--fbody)}

.dash-hello h1{font-family:var(--fdisp);font-size:clamp(1.6rem,3vw,2.2rem);margin:6px 0 2px}
.dash-hello.slim{margin-bottom:14px}

/* Bandeau radar : le produit est VIVANT. */
.radar-band{display:flex;align-items:center;justify-content:space-between;gap:14px;
  background:var(--ink);color:var(--paper);border-radius:var(--r);padding:16px 20px;
  margin:16px 0;flex-wrap:wrap;box-shadow:var(--shadow)}
.radar-band .btn.ghost{border-color:color-mix(in srgb, var(--paper) 40%, transparent);color:var(--paper)}
.radar-live{display:flex;align-items:center;gap:14px}
.radar-live strong{font-family:var(--fdisp);letter-spacing:.02em}
.radar-live p{margin:2px 0 0;font-size:.92rem;opacity:.85}
.pulse{width:12px;height:12px;border-radius:50%;background:#3ddc84;flex:none;
  box-shadow:0 0 0 0 rgba(61,220,132,.55);animation:hlpulse 1.8s infinite}
.pulse.small{width:8px;height:8px;display:inline-block;margin-right:5px}
@keyframes hlpulse{70%{box-shadow:0 0 0 9px rgba(61,220,132,0)}100%{box-shadow:0 0 0 0 rgba(61,220,132,0)}}

/* Compteurs : gros chiffre display, carte cliquable. */
.dstat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:16px 0}
.dstat{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:18px 20px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;
  gap:4px;box-shadow:var(--shadow);transition:transform .18s, border-color .18s}
a.dstat:hover{transform:translateY(-2px);border-color:var(--red)}
.dstat-k{font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}
.dstat-v{font-family:var(--fdisp);font-size:2.6rem;line-height:1;font-weight:700}
.dstat-v.small{font-size:1.7rem}
.dstat-hint{font-size:.85rem;color:var(--ink2)}

/* Carte générique de l'espace membre. */
.dcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:20px 22px;margin:14px 0;box-shadow:var(--shadow)}
.dcard.vide{text-align:center;padding:34px 22px}

/* Badge chrono — LA signature. fresh<1h · warm<24h · old ensuite. */
.age-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:999px;
  font-size:.78rem;font-weight:700;font-family:var(--fbody)}
.age-badge.fresh{background:#e2f4ec;color:var(--signal-ink)}
.age-badge.warm{background:#fff6e5;color:#8a5a00}
.age-badge.old{background:#fdeaea;color:var(--red-ink)}

/* Prochaine action (GPS). */
.next-action{border-left:4px solid var(--red)}
.na-eyebrow{font-size:.75rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--red-ink)}
.na-txt{font-family:var(--fdisp);font-size:1.25rem;margin:6px 0}
.na-listing{display:inline-flex;gap:8px;align-items:center;color:var(--ink);font-weight:600}
.na-status{font-size:.75rem;background:var(--paper2);border-radius:999px;padding:2px 9px}

/* Feuille de route cochable. */
.rm-head{display:flex;align-items:baseline;justify-content:space-between}
.rm-head h2{font-family:var(--fdisp);margin:0}
.rm-count{font-weight:700;color:var(--signal-ink)}
.rm-list{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:2px}
.rm-list li{display:flex;align-items:center;gap:12px;padding:9px 6px;border-radius:10px}
.rm-list li:not(.done):hover{background:var(--paper2)}
.rm-check{width:24px;height:24px;flex:none;border-radius:50%;border:2px solid var(--line);
  display:inline-flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:800;
  color:#fff;transition:background .2s, border-color .2s}
.rm-list li.done .rm-check{background:var(--signal);border-color:var(--signal)}
.rm-list li.done .rm-txt{color:var(--ink2);text-decoration:line-through;text-decoration-thickness:1px}
a.rm-txt{color:var(--ink);font-weight:600;text-decoration:none}
a.rm-txt:hover{color:var(--red-ink)}

/* Blocs outils par moment du parcours. */
.dtools{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.dt-title{font-size:.8rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink2);margin:0 0 10px}
.dt-link{display:block;padding:8px 0;color:var(--ink);font-weight:600;text-decoration:none;
  border-bottom:1px solid var(--line)}
.dt-link:last-child{border-bottom:none}
.dt-link:hover{color:var(--red-ink)}

/* Mes alertes : héro compteur + cartes. */
.radar-hero{display:flex;align-items:center;gap:22px;background:var(--ink);color:var(--paper);
  border-radius:var(--r);padding:22px 26px;margin:14px 0;flex-wrap:wrap;box-shadow:var(--shadow)}
.rh-num{font-family:var(--fdisp);font-size:3.4rem;font-weight:700;line-height:1}
.rh-body p{margin:3px 0 0;opacity:.8;font-size:.9rem}
.rh-quota{margin-left:auto;text-align:right}
.rh-quota-k{display:block;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;opacity:.7}
.rh-quota-v{font-family:var(--fdisp);font-size:1.5rem;font-weight:700}
.alert-cards{display:flex;flex-direction:column;gap:12px}
.alert-card.paused{opacity:.62}
.ac-head{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.ac-live{font-size:.78rem;font-weight:700;color:var(--signal-ink)}
.ac-head h3{margin:4px 0 2px;font-family:var(--fdisp)}
.ac-crits{margin:0;color:var(--ink2);font-size:.9rem}
.ac-tags{margin:8px 0 0;display:flex;gap:6px;flex-wrap:wrap}
.tag{background:var(--paper2);border-radius:999px;padding:2px 10px;font-size:.78rem;font-weight:600}
.ac-count{text-align:center;flex:none}
.ac-count-v{display:block;font-family:var(--fdisp);font-size:2.1rem;font-weight:700;line-height:1}
.ac-count-k{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}
.ac-actions{display:flex;gap:8px;margin-top:12px}
.btn.danger{color:var(--red-ink)}

/* Annonces : grille de cartes existantes (_card) surmontées du badge chrono. */
.annonce-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.annonce-cell{position:relative;display:flex;flex-direction:column;gap:6px}
.annonce-cell>.age-badge{position:absolute;top:10px;left:10px;z-index:3;
  box-shadow:0 2px 8px rgba(20,18,16,.25)}
.dstat.static{cursor:default}

/* Candidatures : sections du pipeline. */
.pipe-section{margin:22px 0}
.ps-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.ps-head h2{font-family:var(--fdisp);margin:0;font-size:1.25rem}
.ps-count{background:var(--paper2);border-radius:999px;padding:1px 10px;font-size:.85rem;font-weight:700}
.ps-next{margin:0;font-size:.88rem}
.pipe-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-top:10px}
.pipe-card{margin:0;display:flex;flex-direction:column;gap:8px}
.pc-title{font-weight:700;color:var(--ink);text-decoration:none;font-family:var(--fdisp)}
.pc-title:hover{color:var(--red-ink)}
.pc-meta{margin:0;color:var(--ink2);font-size:.9rem}
.pc-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}

/* Dossier : jauge annulaire (conic-gradient, --pct). */
.dossier-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.gauge-card{display:flex;align-items:center;gap:20px}
.gauge{--pct:0;width:110px;height:110px;flex:none;border-radius:50%;
  background:conic-gradient(var(--signal) calc(var(--pct)*1%), var(--paper2) 0);
  display:flex;align-items:center;justify-content:center;position:relative}
.gauge::before{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--card)}
.gauge-v{position:relative;font-family:var(--fdisp);font-size:1.7rem;font-weight:800}
.gauge-v i{font-style:normal;font-size:.9rem}
.gauge-side h2{font-family:var(--fdisp);margin:0 0 4px;font-size:1.15rem}
.gauge-label{margin:0 0 10px;color:var(--ink2)}
.doc-list{list-style:none;margin:0 0 10px;padding:0}
.doc-list li{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px dashed var(--line)}
.doc-dot{width:9px;height:9px;border-radius:50%;background:var(--red);flex:none}
.doc-ok{color:var(--signal-ink);font-weight:700}

@media (max-width:640px){
  .radar-band,.radar-hero{padding:14px 16px}
  .rh-quota{margin-left:0;text-align:left}
  .dstat-v{font-size:2.1rem}
}
@media (prefers-reduced-motion:reduce){
  .pulse{animation:none}
  .dstat,.dash-rail a{transition:none}
}
/* ═══ fin refonte espace membre ═════════════════════════════════════════════ */

/* ── Bandeau de consentement (23/08/2026) ───────────────────────────────────
   Volontairement en `position:fixed` bas d'ecran plutot qu'en modale plein
   ecran : il ne doit ni masquer le contenu, ni bloquer un visiteur qui ne
   repond pas. `hidden` suffit a le cacher (l'attribut HTML, pas une classe :
   un element seulement transparent resterait cliquable et volerait les clics). */
.consent {
  position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 9999;
  display: flex; flex-wrap: wrap; gap: 1rem; align-items: center;
  justify-content: space-between;
  max-width: 60rem; margin: 0 auto; padding: 1rem 1.25rem;
  background: #fff; color: #14202e;
  border: 1px solid #d9e2ec; border-radius: 12px;
  box-shadow: 0 8px 30px rgba(16, 32, 52, .18);
  font-size: .93rem; line-height: 1.45;
}
.consent[hidden] { display: none; }
.consent-txt { flex: 1 1 22rem; min-width: 0; }
.consent-txt p { margin: .25rem 0 0; }
.consent-btns { display: flex; gap: .6rem; flex-wrap: wrap; }
.consent .btn { white-space: nowrap; }
.consent .btn.ghost { background: transparent; color: #14202e; border: 1px solid #c7d3e0; }
@media (max-width: 560px) {
  .consent { flex-direction: column; align-items: stretch; }
  .consent-btns { justify-content: flex-end; }
}

/* ---------- Tunnel d'inscription (23/08/2026) ---------- */
/* Un écran = une question. Le visiteur voit toujours où il en est et ce qu'il gagne
   (le compteur de correspondances, mesuré sur nos annonces réelles). */
.tunnel { max-width:560px; margin:48px auto 80px; padding:0 20px; }
.tn-progress { display:flex; gap:6px; margin-bottom:14px; }
.tn-dot { flex:1; height:4px; border-radius:4px; background:var(--line); }
.tn-dot.done { background:var(--red); }
.tn-dot.now { background:var(--red); box-shadow:0 0 0 3px rgba(228,0,43,.18); }
.tn-step { font-size:13px; font-weight:700; color:var(--ink2); letter-spacing:.04em;
  text-transform:uppercase; margin-bottom:10px; }
.tunnel h1 { font-size:32px; line-height:1.2; margin-bottom:10px; }
.tn-sub { font-size:16px; margin-bottom:26px; }
.tn-legend { font-size:14px; font-weight:700; color:var(--ink2); margin:22px 0 10px; }

/* Pastilles cliquables : la case native est masquée mais reste focusable au clavier.
   Le clic passe par le <label>, donc toute la pastille est une cible, pas seulement
   le carré de 13px (règle #21 : cliquabilité, pas seulement affichage). */
.tn-chips { display:flex; flex-wrap:wrap; gap:9px; }
.tn-chip { display:inline-flex; margin:0; cursor:pointer; }
.tn-chip input { position:absolute; opacity:0; width:1px; height:1px; margin:0; }
.tn-chip span { display:inline-flex; align-items:center; gap:6px; padding:11px 16px;
  background:var(--paper); border:1.5px solid var(--line); border-radius:999px;
  font-size:15px; font-weight:600; color:var(--ink); transition:.12s; }
.tn-chip span em { font-style:normal; font-size:12.5px; font-weight:700; color:var(--ink2); }
.tn-chip:hover span { border-color:var(--ink2); }
.tn-chip input:checked + span { border-color:var(--red); background:rgba(228,0,43,.07);
  color:var(--red-ink); }
.tn-chip input:focus-visible + span { outline:2px solid var(--red); outline-offset:2px; }
.tn-chip input:checked + span em { color:var(--red-ink); }

/* Cartes de profil : même mécanique, format bloc. */
.tn-cards { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:10px; }
.tn-card { display:block; margin:0; cursor:pointer; }
.tn-card input { position:absolute; opacity:0; width:1px; height:1px; }
.tn-card-t { display:block; padding:16px; background:var(--paper);
  border:1.5px solid var(--line); border-radius:14px; font-size:15.5px; font-weight:600;
  text-align:center; transition:.12s; }
.tn-card:hover .tn-card-t { border-color:var(--ink2); }
.tn-card input:checked + .tn-card-t { border-color:var(--red);
  background:rgba(228,0,43,.07); color:var(--red-ink); }
.tn-card input:focus-visible + .tn-card-t { outline:2px solid var(--red); outline-offset:2px; }

.tn-row { display:flex; gap:12px; } .tn-row label { flex:1; }
.tn-hint { font-size:14px; margin-top:4px; }
.tn-market { padding:12px 14px; background:var(--paper); border:1px solid var(--line);
  border-radius:12px; font-size:14.5px; color:var(--ink2); margin-bottom:18px; }
.tn-count { margin-top:22px; padding:12px 14px; border-radius:12px; font-size:15px;
  font-weight:600; background:rgba(228,0,43,.07); color:var(--red-ink); }
.tn-recap { padding:16px; background:var(--paper); border:1px solid var(--line);
  border-radius:14px; margin-bottom:20px; }
.tn-recap ul { list-style:none; padding:0; margin:0; }
.tn-recap li { font-size:15.5px; font-weight:600; padding:3px 0; }
.tn-nav { display:flex; gap:10px; align-items:center; margin-top:26px; }
.tn-nav .btn { flex:1; justify-content:center; }
.tn-nav .btn.ghost { flex:0 0 auto; background:transparent; border:1.5px solid var(--line);
  color:var(--ink2); }
@media (max-width:520px) { .tunnel h1 { font-size:26px; } .tn-row { flex-direction:column; } }

/* ---------- Landing : piliers, 4 maquettes animées, comparatif (23/08/2026) ---------- */
/* Aligné sur la dissection du modèle NL (rapport veille-renthunter-landing-20260823) :
   3 piliers sous le pli, 4 étapes qui MONTRENT le produit, comparatif à 2 colonnes.
   Zéro image : tout est en CSS, donc rien à charger et rien à traduire dans un fichier binaire. */

/* --- 3 piliers --- */
.pillars { max-width:1160px; margin:0 auto; padding:56px 24px 8px;
  display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; }
.pillar { background:var(--card); border:1px solid var(--line); border-radius:18px;
  padding:26px 24px; box-shadow:var(--shadow); }
.pillar .pill-ico { font-size:26px; display:block; margin-bottom:12px; }
.pillar h3 { font-size:19px; margin-bottom:8px; }
.pillar p { color:var(--ink2); font-size:15px; line-height:1.5; }

/* --- « Comment ça marche » : 4 étapes + maquettes --- */
.how4 { max-width:1160px; margin:0 auto; padding:64px 24px; }
.steps4 { display:flex; flex-direction:column; gap:56px; margin-top:36px; }
.s4 { display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center; }
.s4.rev .s4-txt { order:2; } .s4.rev .s4-mock { order:1; }
.s4-k { font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--red); }
.s4-txt h3 { font-size:26px; margin:8px 0 10px; line-height:1.2; }
.s4-txt p { color:var(--ink2); font-size:16px; line-height:1.55; }

/* Le cadre des maquettes */
.s4-mock { display:flex; justify-content:center; }
.mk { position:relative; border-radius:18px; overflow:hidden; }
.mk.browser { width:100%; max-width:400px; background:#fff; border:1px solid var(--line);
  box-shadow:var(--shadow); padding-bottom:16px; }
.mk-bar { display:flex; gap:6px; padding:12px 14px; background:var(--paper2);
  border-bottom:1px solid var(--line); }
.mk-bar i { width:10px; height:10px; border-radius:50%; background:#ccbfa8; }
.mk-scan { display:flex; align-items:center; gap:8px; padding:14px 16px 8px; font-size:13px;
  font-weight:700; color:var(--ink2); }
.dot-live { width:8px; height:8px; border-radius:50%; background:var(--signal);
  box-shadow:0 0 0 0 rgba(18,133,95,.5); animation:pulseDot 1.8s infinite; }
@keyframes pulseDot { 0%{box-shadow:0 0 0 0 rgba(18,133,95,.5)} 70%{box-shadow:0 0 0 8px rgba(18,133,95,0)} 100%{box-shadow:0 0 0 0 rgba(18,133,95,0)} }
.mk-tag { margin-left:auto; background:rgba(228,0,43,.1); color:var(--red-ink);
  font-size:11px; padding:3px 8px; border-radius:20px; }
.mk-card { margin:8px 16px 0; padding:12px 14px; background:var(--paper); border-radius:10px;
  display:flex; align-items:center; gap:10px; opacity:0; transform:translateX(22px);
  animation:slideIn .5s forwards; }
.mk-card.d2 { animation-delay:.18s; } .mk-card.d3 { animation-delay:.36s; }
.mk-card b { flex:1; height:8px; border-radius:6px; background:#d9d1c0; }
.mk-card span { font-size:11px; color:var(--ink2); }
.mk-card em { font-style:normal; font-size:10px; font-weight:700; background:var(--signal);
  color:#fff; padding:2px 7px; border-radius:20px; }
@keyframes slideIn { to{opacity:1; transform:translateX(0)} }

.mk.phone { width:210px; height:300px; background:#0f1720; border:6px solid #0f1720;
  border-radius:32px; box-shadow:var(--shadow); padding:14px 12px; }
.mk-notch { width:70px; height:16px; background:#0f1720; border-radius:0 0 12px 12px;
  margin:-14px auto 12px; }
.mk-push { background:#fff; border-radius:12px; padding:10px 12px; margin-bottom:8px;
  opacity:0; transform:translateY(-14px); animation:dropIn .5s forwards; }
.mk-push.d2 { animation-delay:.5s; } .mk-push.d3 { animation-delay:1s; }
.mk-push b { display:block; font-size:12.5px; }
.mk-push span { font-size:11px; color:var(--ink2); }
@keyframes dropIn { to{opacity:1; transform:translateY(0)} }
.mk-file { background:#fff; border-radius:14px; padding:16px; text-align:center; margin-top:60px; }
.mk-check { display:inline-flex; width:34px; height:34px; border-radius:50%; background:var(--signal);
  color:#fff; align-items:center; justify-content:center; font-weight:700; margin-bottom:8px; }
.mk-file b { display:block; font-size:14px; } .mk-file span { font-size:11.5px; color:var(--ink2); }
.mk-cursor { position:absolute; right:40px; bottom:40px; width:16px; height:16px;
  border-left:2px solid var(--ink); border-top:2px solid var(--ink); transform:rotate(-45deg);
  animation:tap 1.6s infinite; }
@keyframes tap { 0%,100%{transform:rotate(-45deg) translate(0,0)} 50%{transform:rotate(-45deg) translate(-4px,-4px)} }
.mk-row { display:flex; align-items:center; gap:10px; margin:8px 16px 0; padding:11px 14px;
  background:var(--paper); border-radius:10px; }
.mk-row b { flex:1; height:8px; border-radius:6px; background:#d9d1c0; }
.mk-st { font-size:11px; font-weight:700; color:var(--ink2); padding:3px 9px; border-radius:20px;
  background:var(--paper2); }
.mk-st.ok { background:var(--signal); color:#fff; }

/* --- Comparatif --- */
.vs { max-width:900px; margin:0 auto; padding:24px 24px 64px; }
.vs-table { margin-top:28px; border:1px solid var(--line); border-radius:18px; overflow:hidden;
  background:var(--card); box-shadow:var(--shadow); }
.vs-head, .vs-row { display:grid; grid-template-columns:1.1fr 1fr 1fr; }
.vs-head { background:var(--ink); color:var(--paper); font-weight:700; font-size:14px; }
.vs-head span { padding:14px 16px; }
.vs-h-us { background:var(--red); }
.vs-row { border-top:1px solid var(--line); font-size:14.5px; }
.vs-row span { padding:14px 16px; }
.vs-r { font-weight:700; }
.vs-hand { color:var(--ink2); }
.vs-us { background:rgba(228,0,43,.05); font-weight:600; }
.vs-us::before { content:"✓ "; color:var(--signal); font-weight:800; }

@media (max-width:820px) {
  .pillars { grid-template-columns:1fr; }
  .s4, .s4.rev .s4-txt, .s4.rev .s4-mock { grid-template-columns:1fr; order:0; }
  .s4 { gap:20px; }
  .vs-head span:first-child { display:none; }
  .vs-head { grid-template-columns:1fr 1fr; }
  .vs-row { grid-template-columns:1fr; }
  .vs-r { background:var(--paper2); }
  .vs-hand::before { content:"✗ "; color:var(--red-ink); font-weight:800; }
}

@media (prefers-reduced-motion:reduce) {
  .mk-card, .mk-push { animation:none; opacity:1; transform:none; }
  .mk-cursor, .dot-live { animation:none; }
}

/* ---------- Cadenas AVANT le clic sur les fonctions payantes (23/08/2026) ---------- */
/* 2e capture de Ham : un lien verrouillé doit se voir, pas se découvrir au mur. */
.dt-link.locked { display:flex; align-items:center; justify-content:space-between; gap:10px;
  color:var(--ink2); }
.dt-link.locked:hover { color:var(--ink); }
.dt-lock { flex-shrink:0; font-size:11px; font-weight:700; letter-spacing:.02em;
  padding:3px 9px; border-radius:20px; background:var(--paper2); color:var(--red-ink);
  text-transform:capitalize; }

/* ---------- Moteur de liste : diagnostic de volume + carte floutée (23/08/2026) ---------- */
.vol-diag { margin:10px 0 0; padding:10px 14px; border-radius:12px; font-size:14px;
  font-weight:600; }
.vol-faible { background:rgba(228,0,43,.07); color:var(--red-ink); }
.vol-sain { background:rgba(18,133,95,.09); color:var(--signal-ink); }
.vol-eleve { background:var(--paper2); color:var(--ink2); }

/* La carte floutée rejoue le manque dans la grille : de vraies lignes floutées derrière,
   un appel à créer l'alerte devant. Jamais en tête de grille (règle #21). */
.teaser-card { position:relative; overflow:hidden; min-height:260px; border:1px solid var(--line);
  border-radius:16px; background:var(--card); }
.teaser-blur { filter:blur(7px); padding:14px; opacity:.55; }
.tb-img { display:block; height:130px; border-radius:10px; background:linear-gradient(120deg,var(--paper2),var(--line)); }
.tb-l1, .tb-l2 { display:block; height:12px; border-radius:6px; background:var(--paper2); margin-top:12px; }
.tb-l2 { width:60%; }
.teaser-over { position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; text-align:center; gap:8px; padding:22px;
  background:linear-gradient(180deg, rgba(255,253,248,.72), rgba(255,253,248,.94)); }
.teaser-over .tb-lock { font-size:24px; }
.teaser-over b { font-size:17px; }
.teaser-over p { font-size:14px; color:var(--ink2); line-height:1.45; max-width:34ch; }
.teaser-over .btn { margin-top:6px; }

/* ---------- Prose SEO + maillage villes proches sur les pages ville (23/08/2026) ---------- */
.city-prose { max-width:1160px; margin:8px auto 0; padding:36px 24px 8px; }
.cp-text { font-size:16px; line-height:1.7; color:var(--ink2); max-width:70ch; }
.cp-nearby { margin-top:30px; }
.cp-nearby h2 { font-size:20px; margin-bottom:6px; }
.cp-links { display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }
.cp-city { padding:9px 16px; background:var(--card); border:1px solid var(--line);
  border-radius:999px; font-weight:600; font-size:15px; color:var(--ink); }
.cp-city:hover { border-color:var(--red); color:var(--red-ink); text-decoration:none; }

/* --- Tableaux chiffrés des guides (08/09/2026) ------------------------------------- */
/* Le seul contenu du site qui publie NOTRE mesure du marché. Il doit rester lisible sur
   un téléphone : le tableau défile horizontalement dans son propre conteneur plutôt que
   d'élargir la page — un guide se lit surtout dans le train, en cherchant un logement. */
.guide-table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; margin:14px 0 26px; }
.guide-table { width:100%; border-collapse:collapse; font-size:14.5px; background:var(--card);
  border-radius:12px; overflow:hidden; min-width:460px; }
.guide-table th, .guide-table td { text-align:left; padding:10px 14px;
  border-bottom:1px solid var(--line); white-space:nowrap; }
.guide-table th { background:var(--paper2); font-family:var(--fdisp); font-size:13px;
  text-transform:uppercase; letter-spacing:.06em; color:var(--ink2); }
.guide-table td:first-child { font-weight:600; }
.guide-table tbody tr:last-child td { border-bottom:none; }
.guide-table a { color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line); }
.guide-table a:hover { color:var(--red-ink); border-color:var(--red); }
.guide-body h3 { font-size:18px; margin:26px 0 0; }
