/* Accueil Encore louable : même grammaire que les landings « verdict » (Mona Sans semi-gras serré, écrin de recherche,
   étiquettes tamponnées, cartes 24 px, bandeaux en dégradé), avec le rouge comme couleur primaire. */
:root{
  --bg:#ffffff; --fg:#1d1013; --muted:#f5f5f4; --muted-fg:#64748b; --border:#e7e5e4; --card:#ffffff;
  --primary:#ffc400; --primary-fg:#1d1013; --primary-800:#e6ad00; --primary-900:#7a5200; --primary-400:#ffd84d; --primary-100:#fff1bf; --primary-50:#fffaeb; --primary-text:#a15c00; --primary-title:#b37a00; --bad:#dc2626;
  --alt-bg:#0c0a09; --alt-fg:#fafaf9; --alt-muted:#292524; --alt-muted-fg:#a8a29e; --alt-primary:#ffd84d;
  --ok:#15803d; --ok-bg:#dcfce7; --warn:#b45309; --warn-bg:#fef3c7;
  --font:"Mona Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --d1:1.875rem; --d2:1.5rem; --d3:1.5rem; --d5:1.25rem; --d6:1.125rem; --t-sm:.875rem; --t-xs:.75rem; --t-base:1rem; --t-lg:1rem;
  --r-xl:.75rem; --r-2xl:1rem; --r-3xl:1.5rem;
  color-scheme:light;
}
@media (min-width:1024px){:root{--d1:2.25rem;--d2:1.875rem}}
@media (min-width:1280px){:root{--d1:3rem;--d2:2.25rem;--d3:1.875rem;--d6:1.25rem;--t-sm:1rem;--t-xs:.875rem}}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font);font-size:var(--t-base);line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%}
:focus-visible{outline:3px solid color-mix(in oklab,var(--primary) 55%,transparent);outline-offset:2px;border-radius:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.h1,.h2,.h3,.h5,.h6{font-weight:600;letter-spacing:-.025em;line-height:1.2;margin:0;text-wrap:balance}
.h1{font-size:var(--d1)}.h2{font-size:var(--d2)}.h3{font-size:var(--d3)}.h5{font-size:var(--d5)}.h6{font-size:var(--d6)}
.lab{font-weight:600}.lab-sm{font-weight:600;font-size:var(--t-sm)}.lab-xs{font-weight:600;font-size:var(--t-xs)}.lab-lg{font-weight:600;font-size:var(--t-lg)}
.b-sm{font-size:var(--t-sm)}.b-xs{font-size:var(--t-xs)}.cap{font-size:.75rem}
.muted{color:var(--muted-fg)}.red{color:var(--primary-title)}
.lab-sm.red,.b-sm .red{color:var(--primary-text)}
p{margin:0}
.section{display:flex;flex-direction:column;gap:2rem;padding:3rem 1rem}
.section.alt{background:var(--muted)}
@media (min-width:1024px){.section{padding:5rem 5rem;gap:3rem}}
.inner{width:100%;max-width:80rem;margin-inline:auto}
.center{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.5rem;max-width:42rem;margin-inline:auto}
.heads{display:flex;flex-direction:column;gap:.5rem}

/* étiquette tamponnée */
.stamp{position:relative;display:inline-flex;align-items:center;justify-content:center;height:2.5rem;padding:.5rem .625rem;color:var(--primary)}
.stamp svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.stamp svg path{fill:currentColor;stroke:var(--border);vector-effect:non-scaling-stroke}
.stamp span{position:relative;display:flex;align-items:center;gap:.375rem;transform:rotate(-1.5deg);font-weight:600;color:var(--primary-fg)}
.stamp.light{color:#fff}.stamp.light span{color:var(--fg)}
.stamp.light span i{width:.5rem;height:.5rem;border-radius:50%;background:var(--primary);box-shadow:0 0 0 3px var(--primary-100)}

/* en-tête */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;height:3.5rem;background:var(--bg);padding-inline:1rem}
@media (min-width:768px){.top{height:4rem}}
@media (min-width:1024px){.top{height:4.5rem;padding-inline:5rem}}
.top-in{max-width:80rem;margin-inline:auto;height:100%;display:flex;align-items:center;gap:1.5rem}
.logo{display:inline-flex;align-items:flex-start;text-decoration:none;font-weight:700;font-size:1.375rem;letter-spacing:-.04em;color:var(--fg);line-height:1}
.logo span{font-weight:500;color:var(--muted-fg);margin-right:.18em}
.logo i{width:.32em;height:.32em;border-radius:50%;margin-left:.06em;background:var(--primary);box-shadow:0 0 0 .08em var(--primary-100)}
.menu{display:none;flex:1;gap:.25rem;list-style:none;margin:0;padding:0}
.menu a{display:block;padding:.5rem;border-radius:.5rem;font-size:.875rem;font-weight:500;text-decoration:none;transition:background .15s}
.menu a:hover{background:var(--muted)}
@media (min-width:1024px){.menu{display:flex}}
.top-cta{margin-left:auto;display:flex;gap:.5rem}

/* boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:0;border-radius:var(--r-xl);font:600 .9375rem/1 var(--font);padding:.75rem 1.125rem;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .15s,transform .15s,box-shadow .15s}
.btn svg{width:1.125rem;height:1.125rem}
.btn-p{background:var(--primary);color:var(--primary-fg)}
.btn-p:hover{background:var(--primary-800)}
.btn-o{background:var(--bg);color:var(--fg);border:1px solid var(--border)}
.btn-o:hover{background:var(--muted)}
.btn-lg{padding:.9rem 1.25rem;font-size:1rem}

/* hero */
.hero{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;gap:2rem;padding:2.5rem 1rem 0}
@media (min-width:1024px){.hero{padding:4rem 5rem 0;gap:3rem}}
.hero .center{max-width:48rem}
.h1 .mark{display:inline-block;width:.42em;height:.42em;border-radius:50%;background:var(--primary);box-shadow:0 0 0 .09em var(--primary-100);margin-left:.08em;vertical-align:.55em}
.searchwrap{width:100%;max-width:36rem;display:flex;flex-direction:column;align-items:center;gap:.5rem}
.search{position:relative;width:100%}
.search-box{display:flex;flex-direction:column;gap:.375rem;width:100%;background:var(--muted);border-radius:var(--r-2xl);padding:.375rem}
@media (min-width:640px){.search-box{flex-direction:row;align-items:center}}
.field{position:relative;display:flex;align-items:center;flex:1;min-width:0;background:var(--bg);border:1px solid var(--border);border-radius:var(--r-xl);transition:border-color .15s,box-shadow .15s}
.field:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in oklab,var(--primary) 18%,transparent)}
.field svg{position:absolute;left:.75rem;width:1rem;height:1rem;color:var(--muted-fg)}
.field input{width:100%;min-width:0;border:0;background:transparent;padding:.75rem .75rem .75rem 2.25rem;font:400 1rem/1.2 var(--font);color:var(--fg);outline:none}
.field input::placeholder{color:var(--muted-fg)}
.search-box .btn{width:100%}
@media (min-width:640px){.search-box .btn{width:auto}}
.results{position:absolute;left:0;right:0;top:calc(100% + .5rem);z-index:30;background:var(--bg);border:1px solid var(--border);border-radius:var(--r-2xl);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;padding:.375rem;list-style:none;margin:0;text-align:left;max-height:22rem;overflow:auto}
.results li{display:flex;justify-content:space-between;gap:.75rem;padding:.65rem .8rem;border-radius:.6rem;cursor:pointer}
.results li[aria-selected="true"],.results li:hover{background:var(--muted)}
.r-a{font-weight:600}.r-m{font-size:.8125rem;color:var(--muted-fg);white-space:nowrap}.results .empty{color:var(--muted-fg);cursor:default}
.covers{display:flex;flex-direction:column;align-items:center;gap:.5rem;color:var(--muted-fg)}
@media (min-width:640px){.covers{flex-direction:row}}
.covers .ic{display:flex;gap:.5rem}.covers svg{width:1.25rem;height:1.25rem}
.badges{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}
.badge{display:inline-flex;align-items:center;gap:.25rem;height:1.5rem;padding:.25rem .5rem;border-radius:var(--r-xl);font-size:.75rem;background:var(--ok-bg);color:var(--ok)}
.badge svg{width:.875rem;height:.875rem}
.badge.r{background:var(--primary-100);color:var(--primary-900)}

/* scène photo / thermique */
.scene{position:relative;margin-top:-1rem;isolation:isolate;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 26%,#000 88%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 26%,#000 88%,transparent 100%)}
.scene-bg{position:absolute;inset:-40px;z-index:0;background:center/cover no-repeat;filter:blur(26px) saturate(1.05);opacity:.7}
.frame{position:relative;z-index:1;margin-inline:auto;max-width:97.5rem;aspect-ratio:2/1;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);cursor:ew-resize;touch-action:pan-y}
.frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;user-select:none;-webkit-user-drag:none}
.frame .th{position:absolute;inset:0;clip-path:inset(0 0 0 var(--x,62%))}
.divider{position:absolute;top:0;bottom:0;left:var(--x,62%);width:2px;z-index:3;transform:translateX(-1px);background:linear-gradient(180deg,transparent,#ffe58a 18%,#fff 50%,#ffe58a 82%,transparent);box-shadow:0 0 18px 3px rgba(255,196,0,.8),0 0 2px #fff}
.divider .handle{position:absolute;top:66%;left:50%;width:2.75rem;height:2.75rem;transform:translate(-50%,-50%);border-radius:50%;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.25);display:grid;place-items:center;color:var(--fg)}
.divider .handle svg{width:1.25rem;height:1.25rem}
.hud{position:absolute;z-index:2;transform:translate(-50%,-50%);pointer-events:none}
.hud .ring{display:block;width:3.75rem;height:3.75rem;border:1.5px solid rgba(255,255,255,.9);border-radius:8px}
.hud .tag{position:absolute;left:calc(100% + 8px);top:0;white-space:nowrap;font-size:.75rem;font-weight:600;color:var(--primary-fg);background:var(--primary);padding:.3rem .5rem;border-radius:.4rem;transform:rotate(-2deg)}
.side{position:absolute;bottom:13%;z-index:3;font-weight:600;font-size:.8125rem;padding:.45rem .75rem;border-radius:var(--r-xl);pointer-events:none}
.side.l{left:12%;background:#fff;color:var(--fg)}.side.r{right:12%;background:var(--primary);color:#fff;transform:rotate(-1.5deg)}
.wipe{position:absolute;inset:0;z-index:5;width:100%;height:100%;opacity:0;margin:0;cursor:ew-resize}
@media (max-width:760px){.frame{aspect-ratio:4/3;-webkit-mask-image:none;mask-image:none}.frame img{object-position:58% 50%}.hud .tag{display:none}.hud .ring{width:2.5rem;height:2.5rem}.side.l{left:5%}.side.r{right:5%}}

/* étapes illustrées */
.grid3{display:grid;grid-template-columns:1fr;gap:2rem;width:100%}
@media (min-width:768px){.grid3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.step{display:flex;flex-direction:column;gap:1rem}
.step .num{font-weight:600;font-size:var(--t-sm);color:var(--primary-text)}
.step .t{font-weight:600;font-size:var(--t-sm)}
.step .d{font-size:var(--t-sm);color:var(--muted-fg);text-wrap:balance}
.ill{position:relative;aspect-ratio:1/1;border-radius:var(--r-3xl);overflow:hidden;background:radial-gradient(60% 55% at 70% 20%,#fff1d6 0%,transparent 70%),radial-gradient(70% 60% at 20% 90%,#fff1bf 0%,transparent 70%),linear-gradient(180deg,#fffaf5,#fff);display:grid;place-items:center}
.pill{position:absolute;display:inline-flex;align-items:center;gap:.4rem;font-weight:600;font-size:.8125rem;padding:.45rem .7rem;border-radius:.6rem;background:var(--primary);color:var(--primary-fg);box-shadow:0 8px 20px -8px rgba(161,92,0,.55);transform:rotate(-3deg);white-space:nowrap}
.pill.ok{background:var(--ok-bg);color:var(--ok);box-shadow:0 6px 16px -8px rgba(21,128,61,.5);transform:rotate(-1deg)}
.pill svg{width:.95rem;height:.95rem}
.mock-input{position:absolute;left:12%;right:16%;top:30%;display:flex;align-items:center;gap:.5rem;background:#fff;border:1px solid var(--border);border-radius:.75rem;padding:.7rem .8rem;font-size:.8125rem;color:var(--fg);box-shadow:0 10px 24px -14px rgba(0,0,0,.25)}
.mock-input svg{width:.95rem;height:.95rem;color:var(--muted-fg)}
.mock-photo{position:absolute;left:12%;right:12%;top:48%;bottom:9%;border-radius:1rem;overflow:hidden;box-shadow:0 18px 40px -16px rgba(0,0,0,.35);border:3px solid #fff}
.mock-photo img{width:100%;height:100%;object-fit:cover}
.phone{position:relative;width:58%;height:88%;margin-top:18%;border-radius:1.75rem 1.75rem 0 0;background:#111;padding:.45rem .45rem 0;box-shadow:0 24px 50px -20px rgba(0,0,0,.45)}
.phone-in{height:100%;border-radius:1.4rem 1.4rem 0 0;background:#fff;padding:1.4rem .75rem .5rem;display:flex;flex-direction:column;gap:.5rem;overflow:hidden}
.phone-in .lg{font-weight:700;font-size:.8rem;letter-spacing:-.03em;text-align:center}
.phone-in .tt{font-weight:600;font-size:.78rem;text-align:center;line-height:1.25}
.bar{height:.3rem;border-radius:99px;background:var(--muted);overflow:hidden}.bar i{display:block;height:100%;width:72%;background:var(--primary);border-radius:99px;animation:load 2.6s ease-in-out infinite alternate}
@keyframes load{from{width:35%}to{width:88%}}
.chk{display:flex;justify-content:space-between;gap:.4rem;font-size:.62rem;padding:.4rem .5rem;border-radius:.45rem;background:var(--muted)}
.chk b{font-weight:600}.chk.r{background:#fef2f2;color:#991b1b}.chk.y{background:var(--warn-bg);color:var(--warn)}.chk.g{background:var(--ok-bg);color:var(--ok)}
.vcard{position:absolute;left:10%;right:10%;top:16%;background:#fff;border:1px solid var(--border);border-radius:1.1rem;padding:1rem;display:flex;flex-direction:column;gap:.6rem;box-shadow:0 20px 44px -18px rgba(0,0,0,.3)}
.vcard .k{display:flex;align-items:center;gap:.35rem;font-size:.66rem;font-weight:600;letter-spacing:.06em;color:var(--primary-text)}
.vcard .k svg{width:.9rem;height:.9rem}
.vcard .w{display:flex;align-items:center;justify-content:space-between;font-weight:600;font-size:1.35rem;letter-spacing:-.03em}
.vcard .w i{width:.55rem;height:.55rem;border-radius:50%;background:var(--bad)}
.vcard .s{font-size:.7rem;color:var(--muted-fg);line-height:1.4}
.trio{display:flex;align-items:center;gap:.35rem}
.trio em{font-style:normal;color:var(--muted-fg);font-size:.75rem}

/* étiquettes DPE */
.L{display:inline-grid;place-items:center;min-width:1.6rem;height:1.45rem;padding-inline:.35rem;border-radius:.4rem;font-weight:700;font-size:.8rem;color:#fff}
.L-A{background:#00976a}.L-B{background:#3fae4f}.L-C{background:#8cc152;color:#13210c}.L-D{background:#f2e01c;color:#2a2600}.L-E{background:#f2b31a;color:#2b1d00}.L-F{background:#ea7d2c}.L-G{background:#d5281f}

/* items à icône */
.grid4{display:grid;grid-template-columns:1fr;gap:1rem;width:100%}
@media (min-width:768px){.grid4{grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem}}
@media (min-width:1024px){.grid4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.item{display:flex;gap:.75rem;align-items:flex-start}
.item>svg{flex:none;width:1.25rem;height:1.25rem;margin-top:.15rem;color:var(--fg)}
.item .t{font-weight:600;font-size:var(--t-sm)}
.item .d{font-size:var(--t-sm);color:var(--muted-fg);text-wrap:balance}

/* bandeau dégradé */
.banner{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--r-3xl);background:linear-gradient(86deg,var(--primary-800) 0%,var(--primary) 100%);color:var(--fg);padding:1.5rem;display:flex;flex-direction:column;align-items:center;gap:1.5rem;text-align:center}
@media (min-width:1024px){.banner{padding:3rem}}
.banner .sym{border-color:#1d1013!important;position:absolute;top:50%;left:-2.5rem;z-index:-1;width:17.5rem;height:17.5rem;border-radius:50%;transform:translateY(-50%) rotate(12deg);border:2.2rem solid #fff;opacity:.12}
.banner .grain,.band .grain{position:absolute;inset:0;z-index:-1;opacity:.35;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .18 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.banner .tag{display:inline-flex;align-items:center;height:1.5rem;padding:.25rem .5rem;border-radius:var(--r-xl);font-size:.75rem;background:rgba(29,16,19,.1);color:var(--fg)}
.banner .search-box{background:rgba(29,16,19,.08)}
.banner .btn-p{background:var(--fg);color:#fff}.banner .btn-p:hover{background:#000}
.checks{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 1.5rem}
.checks span{display:inline-flex;align-items:center;gap:.5rem;font-size:var(--t-sm)}
.checks svg{width:1.25rem;height:1.25rem}

/* exemple de fiche */
.split{display:grid;grid-template-columns:1fr;gap:2rem;align-items:center}
@media (min-width:1024px){.split{grid-template-columns:1fr 1fr;gap:3rem}}
.split .txt{display:flex;flex-direction:column;align-items:flex-start;gap:1.5rem}
.glow-top{position:absolute;inset:0 0 auto 0;height:34rem;background:linear-gradient(180deg,var(--primary-50),transparent);pointer-events:none}
.browser{width:100%;border-radius:1.25rem;border:1px solid var(--border);background:#fafaf9;box-shadow:0 30px 60px -30px rgba(0,0,0,.35);overflow:hidden}
.browser .bar-top{display:flex;align-items:center;gap:.75rem;padding:.8rem 1rem;background:#fff;border-bottom:1px solid var(--border)}
.dots{display:flex;gap:.4rem}.dots i{width:.7rem;height:.7rem;border-radius:50%;background:#ef4444}.dots i:nth-child(2){background:#f59e0b}.dots i:nth-child(3){background:#22c55e}
.url{flex:1;display:flex;align-items:center;gap:.4rem;background:var(--muted);border-radius:.6rem;padding:.4rem .7rem;font-size:.8rem;color:var(--muted-fg);overflow:hidden;white-space:nowrap}
.url svg{width:.8rem;height:.8rem;flex:none}
.rep{padding:1rem;display:grid;gap:.8rem}
.rep-h{display:flex;justify-content:space-between;align-items:center;gap:1rem;background:#fff;border:1px solid var(--border);border-radius:1rem;padding:1rem 1.1rem}
.rep-h b{display:block;font-weight:600;font-size:1.3rem;letter-spacing:-.03em}
.rep-h span{font-size:.85rem;color:var(--muted-fg)}
.rep-h em{font-style:normal;font-weight:600;font-size:.8rem;color:#991b1b;background:#fef2f2;padding:.4rem .7rem;border-radius:99px;white-space:nowrap}
.rep-m{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.rep-m .ph{border-radius:1rem;overflow:hidden;border:4px solid #fff;box-shadow:0 10px 24px -14px rgba(0,0,0,.35);min-height:9rem}
.rep-m .ph img{width:100%;height:100%;object-fit:cover;display:block}
.rep-m .vcard{position:static;box-shadow:none}
.cats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem}
.cats span{display:flex;align-items:center;gap:.45rem;background:#fff;border:1px solid var(--border);border-radius:.7rem;padding:.5rem .6rem;font-weight:600;font-size:.78rem;white-space:nowrap;overflow:hidden}
.cats i{flex:none;width:.5rem;height:.5rem;border-radius:50%;background:var(--ok)}.cats i.r{background:var(--bad)}.cats i.y{background:#f59e0b}
@media (max-width:560px){.cats{grid-template-columns:repeat(2,minmax(0,1fr))}.rep-m{grid-template-columns:1fr}}

/* offres */
.plans{display:grid;grid-template-columns:1fr;gap:1.5rem;width:100%;max-width:48rem;margin-inline:auto}
@media (min-width:768px){.plans{grid-template-columns:1fr 1fr}}
.plan{display:flex;flex-direction:column;gap:1.25rem;background:var(--card);border-radius:var(--r-3xl);padding:1.5rem;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;border:1px solid transparent}
.plan.hl{border:2px solid var(--primary)}
.plan .row{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem}
.plan .pb{white-space:nowrap;flex:none;display:inline-flex;height:1.5rem;align-items:center;padding:.25rem .5rem;border-radius:var(--r-xl);font-size:.75rem;background:var(--primary);color:var(--primary-fg)}
.plan ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.plan li{display:flex;gap:.5rem;font-size:var(--t-sm)}
.plan li svg{flex:none;width:1.25rem;height:1.25rem;color:var(--primary-text)}
.plan .btn{width:100%}

/* chiffres */
.band{position:relative;isolation:isolate;overflow:hidden;color:var(--alt-fg)}
.band .bgr{position:absolute;inset:0;z-index:-2;background:radial-gradient(100% 100% at 50% 100%,var(--primary-400) 0%,var(--primary-900) 50%,var(--alt-muted) 100%)}
.band.top-glow .bgr{background:radial-gradient(100% 50% at 50% 0%,var(--primary-400) 0%,var(--primary-900) 50%,var(--alt-muted) 100%)}
.figs{display:grid;grid-template-columns:1fr;gap:2rem;text-align:center}
@media (min-width:768px){.figs{grid-template-columns:repeat(3,minmax(0,1fr))}}
.figs .h2{color:var(--alt-primary)}
.figs p.b-sm{color:var(--alt-fg)}

/* villes */
.cities{display:grid;grid-template-columns:1fr;gap:.75rem;width:100%}
@media (min-width:640px){.cities{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.cities{grid-template-columns:repeat(4,minmax(0,1fr))}}
.city{display:flex;flex-direction:column;gap:.5rem;background:var(--bg);border-radius:var(--r-3xl);padding:1rem 1.1rem;text-decoration:none;transition:transform .15s,box-shadow .15s}
.city:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0000001a}
.city .k{display:flex;align-items:center;gap:.4rem;font-size:.75rem;color:var(--muted-fg)}
.city .k i{width:.5rem;height:.5rem;border-radius:50%;background:var(--primary)}
.city b{font-weight:600;font-size:1.05rem}
.city span{font-size:var(--t-sm);color:var(--muted-fg)}

/* FAQ */
.faq{width:100%;max-width:56rem;margin-inline:auto;border:1px solid var(--border);border-radius:var(--r-xl);overflow:clip;padding-inline:1.25rem}
.faq details{border-bottom:1px solid var(--border)}.faq details:last-child{border-bottom:0}
.faq summary{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;padding:1.25rem 0;font-weight:600;font-size:var(--t-lg);cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{flex:none;width:1rem;height:1rem;color:var(--muted-fg);margin-top:.2rem;transition:transform .2s}
.faq details[open] summary svg{transform:rotate(180deg)}
.faq details p{padding-bottom:1.25rem;font-size:var(--t-sm);color:var(--muted-fg);max-width:70ch}

/* final */
.final .h1{color:var(--alt-fg)}.final .h1 .red{color:var(--primary)}
.final .muted{color:var(--alt-muted-fg)}
.final .search-box{background:var(--alt-bg)}
.final .field{background:#fff}
.final .tiny{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 1rem}
.final .tiny span{display:inline-flex;align-items:center;gap:.25rem;font-size:.75rem;color:var(--alt-primary)}
.final .tiny svg{width:.8rem;height:.8rem}

/* pied de page */
.foot{position:relative;background:var(--alt-muted);color:var(--alt-fg);padding:3rem 1rem 2rem}
@media (min-width:1024px){.foot{padding:3rem 5rem 2rem}}
.foot-grid{max-width:80rem;margin-inline:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem 2rem}
@media (min-width:1024px){.foot-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:3rem 2rem}}
.foot h4{margin:0 0 1rem;font-weight:400;font-size:.75rem;text-transform:uppercase;color:var(--alt-muted-fg);letter-spacing:.04em}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem;font-weight:600;font-size:.875rem}
.foot a{text-decoration:none;transition:color .15s}.foot a:hover{color:var(--alt-primary)}
.foot-bot{max-width:80rem;margin:2.5rem auto 0;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1.5rem}
.neon{font-weight:700;font-size:2.25rem;letter-spacing:-.04em;color:#fff;text-shadow:0 0 1px #fca5a5,0 0 6px rgba(220,38,38,.9),0 0 18px rgba(220,38,38,.6)}
.neon span{font-weight:500;color:#fecaca}
.legal{display:flex;flex-wrap:wrap;gap:1rem;font-size:.75rem;color:var(--alt-muted-fg)}
.legal a{font-weight:600}

/* apparition */
.rise{animation:rise .7s cubic-bezier(.2,.8,.2,1) both}.d1{animation-delay:.08s}.d2{animation-delay:.16s}.d3{animation-delay:.24s}
@keyframes rise{from{transform:translateY(12px)}to{transform:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media (max-width:640px){.top-cta .btn-o{display:none}.top-cta .btn{padding:.6rem .8rem;font-size:.85rem}.logo{font-size:1.2rem}.hero{padding-top:1.75rem}}

/* étiquettes DPE posées sur la vue thermique */
.hud .tag{display:inline-flex;align-items:center;gap:.4rem;color:#fff;background:rgba(15,10,12,.72);transform:none;padding:.3rem .5rem .3rem .3rem}
.hud .tag .L{min-width:1.5rem;height:1.4rem;font-size:.8rem}
.dpe{position:absolute;z-index:2;transform:translate(-50%,-50%);pointer-events:none}
.dpe .L{min-width:1.9rem;height:1.75rem;font-size:.95rem;border-radius:.45rem;box-shadow:0 0 0 2px rgba(255,255,255,.85),0 6px 14px -4px rgba(0,0,0,.5)}
@media (max-width:760px){.dpe .L{min-width:1.4rem;height:1.3rem;font-size:.75rem}}

/* logo : horizontal sur mobile, empilé à partir de 768 px (comme les landings de référence) */
.logo img{display:block;height:auto}
.logo .logo-h{width:9.6rem}.logo .logo-v{display:none;width:5.3rem}
@media (min-width:768px){.logo .logo-h{display:none}.logo .logo-v{display:block}}
.neon-logo{width:100%;max-width:15.5rem;height:auto;filter:drop-shadow(0 0 1px #ffe58a) drop-shadow(0 0 4px rgba(255,196,0,.85)) drop-shadow(0 0 10px rgba(255,196,0,.5))}

/* titre : première ligne d'un seul tenant, clé du logo en exposant (comme le symbole après le titre des landings de référence) */
.hero .center{max-width:56rem}
.h1-key{display:none;width:.66em;height:.66em;margin-left:.02em;vertical-align:.62em}
@media (min-width:768px){.h1 .l1{white-space:nowrap}.h1-key{display:inline-block}}

/* compte à rebours de la pastille */
.cd{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}

.figs .cd{font-size:clamp(1.5rem,2.6vw,2.25rem);white-space:nowrap;font-variant-numeric:tabular-nums}

.logo .logo-hd{display:block;width:4.6rem;height:auto}
@media (min-width:1024px){.logo .logo-hd{width:5.4rem}}

/* hero plus compact : textes plus petits pour remonter l'illustration dans le premier écran */
.hero{padding-top:1.5rem;gap:1.25rem}
@media (min-width:1024px){.hero{padding-top:2rem;gap:1.5rem}}
.hero .center{gap:.9rem}
.hero .h1{font-size:clamp(1.6rem,3vw,2.4rem)}
.hero p.muted{font-size:.95rem}
.hero .stamp{height:2.1rem;font-size:.875rem}
.hero .covers{font-size:.8125rem}.hero .covers svg{width:1rem;height:1rem}
.hero .search-box .btn{padding:.7rem 1rem;font-size:.9375rem}
.hero .field input{padding-block:.6rem}
.scene{margin-top:-1.75rem}

/* étiquettes « Inlouable » de la vue thermique, plus grandes */
.hud .ring{width:4.5rem;height:4.5rem;border-width:2px;border-radius:10px}
.hud .tag{font-size:1rem;padding:.45rem .75rem .45rem .45rem;gap:.55rem;border-radius:.6rem;left:calc(100% + 10px)}
.hud .tag .L{min-width:2rem;height:1.85rem;font-size:1.05rem;border-radius:.45rem}
@media (max-width:760px){.hud .tag{display:inline-flex;font-size:.75rem;padding:.3rem .5rem .3rem .3rem}.hud .tag .L{min-width:1.4rem;height:1.3rem;font-size:.8rem}.hud .ring{width:2.6rem;height:2.6rem}}

[hidden]{display:none!important}

/* ===== Mobile natif ===== */
html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
@media (max-width:760px){
  .hud.flip .tag{left:auto;right:calc(100% + 6px)}
  .rep-h{flex-direction:column;align-items:flex-start;gap:.6rem}
  .search-box input{font-size:16px}
  .btn{min-height:44px}
  .top{position:sticky;top:0;padding-top:env(safe-area-inset-top,0px)}
}
@media (hover:none){.btn:active,.city:active,a:active{transform:scale(.98)}}
/* la liste de suggestions d'adresses passe au-dessus de l'illustration (l'animation .rise crée une couche à part) */
.searchwrap{position:relative;z-index:20}
