/* ════════════════════════════════════════════════════════════
   VALR IMMO — Single listing classifieds
   Port de Prototypes/proto-v1-immo.html
   Tout est scopé sous #valrimmo. Reset explicite des classes
   génériques pour neutraliser les fuites Bootstrap/Listeo.
════════════════════════════════════════════════════════════ */

html { scroll-behavior: smooth; }

#valrimmo {
  --bg: #FFFFFF;
  --bg-soft: #F7F7F8;
  --bg-subtle: #FAFAFB;
  --border: #ECECEE;
  --border-md: #DDDDE0;
  --ink: #14131F;
  --ink-soft: #3A3850;
  --ink-muted: #74738A;
  --ink-light: #ADAABF;
  --accent: #F91942;
  --accent-soft: #FEE7EC;
  --accent-hover: #E20D36;
  --green: #16A34A;
  --green-soft: #DCFCE7;
  --amber: #D97706;
  --amber-soft: #FEF3C7;
  --dpe-a:#009F6B; --dpe-b:#50BD45; --dpe-c:#B3D94B; --dpe-d:#F0DC0F;
  --dpe-e:#F0A20F; --dpe-f:#E84F3D; --dpe-g:#C4151C;
  --shadow-xs: 0 1px 2px rgba(20,19,31,.04);
  --shadow-sm: 0 1px 3px rgba(20,19,31,.06), 0 1px 2px rgba(20,19,31,.04);
  --shadow-md: 0 4px 12px rgba(20,19,31,.06), 0 2px 4px rgba(20,19,31,.04);
  --shadow-lg: 0 12px 32px rgba(20,19,31,.10), 0 4px 8px rgba(20,19,31,.04);
  --r-sm: 8px; --r: 12px; --r-lg: 16px; --r-xl: 20px; --r-pill: 999px;
  font-family: 'Raleway', system-ui, sans-serif;
  background: var(--bg-soft);
  color: var(--ink);
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: 'ss01', 'cv11';
  display: block;
}
#valrimmo *, #valrimmo *::before, #valrimmo *::after { box-sizing: border-box; margin: 0; padding: 0; }
#valrimmo img { display: block; max-width: 100%; height: auto; }
#valrimmo a { color: inherit; text-decoration: none; }
#valrimmo button { font-family: inherit; }
#valrimmo ul, #valrimmo li { list-style: none; }

/* ── Reset anti-collision (Bootstrap/Listeo définissent .container,
   .btn, .page, .modal, .row… globalement) ── */
#valrimmo .container,
#valrimmo .page,
#valrimmo .page-wrap,
#valrimmo .sidebar,
#valrimmo .hero,
#valrimmo .modal,
#valrimmo .btn,
#valrimmo .tag,
#valrimmo .sec,
#valrimmo .row,
#valrimmo .card {
  width: auto; max-width: none; min-width: 0;
  margin: 0; float: none; clear: none;
  background: none; border: 0; box-shadow: none;
}

#valrimmo .display, #valrimmo h1, #valrimmo h2, #valrimmo h3, #valrimmo .num {
  font-family: 'Poppins', 'Raleway', sans-serif; letter-spacing: -0.02em;
}
#valrimmo .mono { font-family: inherit; font-feature-settings: 'tnum'; }

/* ── HERO ── */
#valrimmo .hero {
  position: relative;
  height: 320px;
  background: #1c1b27;
  overflow: hidden;
  margin: 0 -16px 0;             /* plein écran : déborde le padding de .container */
  border-radius: 0;
}
#valrimmo .hero-track {
  position: absolute; inset: 0; display: flex; height: 100%; width: 100%;
  transition: transform .5s cubic-bezier(.22,.61,.36,1); touch-action: pan-y;
}
#valrimmo .hero-slide { min-width: 100%; height: 100%; position: relative; overflow: hidden; }
#valrimmo .hero-slide img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
#valrimmo .hero-scrim {
  position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background: rgba(20,19,31, var(--scrim, 0));
}
#valrimmo .hero-overlay {
  position: absolute; inset: 0; pointer-events: none;
  background: none;
}
#valrimmo .hero-empty {
  display: flex; align-items: center; justify-content: center;
  height: 100%; color: #56556a;
}
#valrimmo .hero-empty svg { width: 54px; height: 54px; }
#valrimmo .hero-badge {
  position: absolute; top: 14px; left: 14px; z-index: 2;
  background: rgba(255,255,255,.95); color: var(--ink);
  padding: 5px 11px; border-radius: var(--r-pill);
  font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  backdrop-filter: blur(8px); display: inline-flex; align-items: center; gap: 6px;
}
#valrimmo .hero-badge::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--accent); box-shadow: 0 0 0 3px rgba(249,25,66,.25);
}
#valrimmo .hero-counter {
  position: absolute; bottom: 14px; right: 14px; z-index: 2;
  background: rgba(20,19,31,.55); color: #fff; padding: 5px 11px;
  border-radius: var(--r-pill); font-size: 12px; font-weight: 600;
  font-family: inherit; backdrop-filter: blur(6px);
}
#valrimmo .hero-dots {
  position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%);
  z-index: 2; display: flex; gap: 4px;
}
#valrimmo .hero-dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: rgba(255,255,255,.45); transition: all .3s; cursor: pointer;
}
#valrimmo .hero-dot.active { background: #fff; width: 18px; border-radius: 3px; }
#valrimmo .hero-arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
  width: 38px; height: 38px; border-radius: 50%; border: none;
  background: rgba(255,255,255,.92); color: var(--ink); cursor: pointer;
  display: none; align-items: center; justify-content: center;
  box-shadow: 0 2px 8px rgba(0,0,0,.18); transition: transform .12s, background .15s;
}
#valrimmo .hero-arrow:hover { background: #fff; }
#valrimmo .hero-arrow:active { transform: translateY(-50%) scale(.9); }
#valrimmo .hero-arrow svg { width: 18px; height: 18px; }
#valrimmo .hero-prev { left: 12px; }
#valrimmo .hero-next { right: 12px; }
#valrimmo .hero-fav {
  position: absolute; top: 12px; right: 12px; z-index: 3;
  width: 38px; height: 38px; border-radius: 50%; border: none;
  background: rgba(255,255,255,.92); color: var(--ink); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 1px 4px rgba(0,0,0,.18); transition: transform .12s, background .18s;
}
#valrimmo .hero-fav:active { transform: scale(.92); }
#valrimmo .hero-fav svg { width: 18px; height: 18px; }
#valrimmo .hero-fav.favorited { background: var(--accent); color: #fff; }
#valrimmo .hero-fav.favorited svg { fill: currentColor; }

/* ── PAGE BODY ── */
#valrimmo .page { position: relative; background: var(--bg-soft); padding: 0 0 32px; }
#valrimmo .container { padding: 0 16px; }
#valrimmo .reveal {
  opacity: 0; transform: translateY(16px);
  transition: opacity .55s cubic-bezier(.22,.61,.36,1), transform .55s cubic-bezier(.22,.61,.36,1);
}
#valrimmo .reveal.in { opacity: 1; transform: none; }

/* ── Back link ── */
#valrimmo .back-link {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12.5px; font-weight: 600; color: var(--ink-muted);
  margin-bottom: 12px; transition: color .15s;
}
#valrimmo .back-link:hover { color: var(--accent); }
#valrimmo .back-link svg { width: 14px; height: 14px; }

/* ── Title block ── */
#valrimmo .title-block { padding: 2px 0 18px; }
#valrimmo .tag-row { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
#valrimmo .tag {
  font-size: 11px; font-weight: 600; padding: 4px 10px; border-radius: var(--r-pill);
  letter-spacing: .02em; display: inline-flex; align-items: center; gap: 5px;
  text-decoration: none; transition: filter .15s;
}
#valrimmo a.tag:hover { filter: brightness(.95); }
#valrimmo .tag svg { width: 11px; height: 11px; }
#valrimmo .tag.accent { background: var(--accent-soft); color: var(--accent); }
#valrimmo .tag.outline { background: #fff; color: var(--ink-soft); border: 1px solid var(--border); }
#valrimmo .tag.dark { background: var(--ink); color: #fff; }
#valrimmo h1.property-title {
  font-size: 22px; font-weight: 600; line-height: 1.15; color: var(--ink); margin-bottom: 6px;
}
#valrimmo .title-meta {
  display: flex; align-items: center; gap: 6px; color: var(--ink-muted); font-size: 13.5px;
}
#valrimmo .title-meta svg { width: 14px; height: 14px; color: var(--accent); flex-shrink: 0; }
#valrimmo .title-meta strong { color: var(--ink-soft); font-weight: 600; }

/* ── Price card ── */
#valrimmo .price-card {
  background: var(--ink); color: #fff; border-radius: var(--r-lg); padding: 16px;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin-bottom: 18px; box-shadow: var(--shadow-md); position: relative; overflow: hidden;
}
#valrimmo .price-card::after {
  content: ""; position: absolute; right: -30px; top: -30px;
  width: 120px; height: 120px; border-radius: 50%;
  background: radial-gradient(circle, rgba(249,25,66,.25), transparent 70%); pointer-events: none;
}
#valrimmo .price-amt {
  font-family: 'Poppins', sans-serif; font-size: 26px; font-weight: 700;
  letter-spacing: -0.025em; line-height: 1;
}
#valrimmo .price-sub { font-size: 11px; color: rgba(255,255,255,.55); margin-top: 5px; letter-spacing: .02em; }
#valrimmo .price-cta {
  position: relative; background: var(--accent); color: #fff; border: none;
  border-radius: var(--r); padding: 12px 16px; font-size: 13.5px; font-weight: 600;
  display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
  transition: transform .12s; box-shadow: 0 6px 18px rgba(249,25,66,.4); white-space: nowrap;
}
#valrimmo .price-cta:active { transform: scale(.96); }
#valrimmo .price-cta svg { width: 15px; height: 15px; }

/* ── Barre prix collante (mobile) ── */
#valrimmo .pricebar {
  position: relative; z-index: 9000;
  margin: 0 -16px 16px;
  padding: 10px 16px;
  background: #fff; border-bottom: 1px solid var(--border);
  box-shadow: 0 4px 14px rgba(20,19,31,.08);
}
#valrimmo .pricebar-body { display: flex; align-items: center; gap: 12px; }
#valrimmo .pricebar.is-stuck {
  position: fixed; top: 0; left: 0; right: 0; margin: 0;
}
#valrimmo .pricebar-info { flex: 1; min-width: 0; }
#valrimmo .pricebar-amt {
  font-family: 'Poppins', sans-serif; font-size: 21px; font-weight: 700;
  color: var(--ink); letter-spacing: -0.02em; line-height: 1.1;
}
#valrimmo .pricebar-sub {
  font-size: 11px; color: var(--ink-muted); margin-top: 2px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#valrimmo .pricebar-actions { display: flex; gap: 8px; flex-shrink: 0; }
#valrimmo .pricebar-btn {
  height: 44px; border: none; border-radius: var(--r);
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  font-size: 14px; font-weight: 600; cursor: pointer; text-decoration: none;
}
#valrimmo .pricebar-btn.call { width: 44px; background: var(--green); color: #fff; }
#valrimmo .pricebar-btn.call svg { width: 18px; height: 18px; }
#valrimmo .pricebar-btn.contact {
  padding: 0 18px; background: var(--accent); color: #fff;
  box-shadow: 0 4px 12px rgba(249,25,66,.35);
}
#valrimmo .pricebar-btn.contact svg { width: 15px; height: 15px; }

/* ── Specs grid ── */
#valrimmo .specs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 24px; }
#valrimmo .spec {
  background: #fff; border: 1px solid var(--border); border-radius: var(--r);
  padding: 12px 8px; display: flex; flex-direction: column; align-items: flex-start;
  gap: 6px; box-shadow: var(--shadow-xs);
}
#valrimmo .spec-ico {
  width: 28px; height: 28px; border-radius: 8px; background: var(--bg-soft);
  display: flex; align-items: center; justify-content: center; color: var(--ink-soft);
}
#valrimmo .spec-ico svg { width: 16px; height: 16px; }
#valrimmo .spec-val {
  font-family: 'Poppins', sans-serif; font-size: 15px; font-weight: 600;
  line-height: 1; color: var(--ink); letter-spacing: -0.015em;
}
#valrimmo .spec-lab { font-size: 11px; color: var(--ink-muted); letter-spacing: .02em; }
#valrimmo .spec.danger .spec-ico { background: rgba(232,79,61,.1); color: var(--dpe-f); }
#valrimmo .spec.danger .spec-val { color: var(--dpe-f); }

/* ── Section heading ── */
#valrimmo .sec { margin-bottom: 26px; scroll-margin-top: 100px; }
#valrimmo .sec-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
#valrimmo .sec-title {
  font-family: 'Poppins', sans-serif; font-size: 17px; font-weight: 600;
  color: var(--ink); letter-spacing: -0.02em;
}
#valrimmo .sec-link { font-size: 12.5px; color: var(--accent); font-weight: 600; }

/* ── Highlights ── */
#valrimmo .highlights { display: flex; flex-direction: column; gap: 8px; }
#valrimmo .hl {
  display: flex; gap: 12px; background: #fff; border: 1px solid var(--border);
  border-radius: var(--r); padding: 12px 14px; box-shadow: var(--shadow-xs);
}
#valrimmo .hl-ico {
  width: 32px; height: 32px; border-radius: 8px; background: var(--accent-soft);
  color: var(--accent); display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
#valrimmo .hl-ico svg { width: 16px; height: 16px; }
#valrimmo .hl-txt { font-size: 13.5px; color: var(--ink-soft); line-height: 1.5; }
#valrimmo .hl-txt strong { color: var(--ink); font-weight: 600; }

/* ── Description ── */
#valrimmo .desc-quote {
  font-family: 'Poppins', sans-serif; font-size: 17px; font-weight: 500; font-style: italic;
  color: var(--accent); line-height: 1.35; letter-spacing: -0.01em; margin-bottom: 16px;
  padding-left: 14px; border-left: 2px solid var(--accent);
}
#valrimmo .desc-body {
  font-size: 14px; color: var(--ink-soft); line-height: 1.4; overflow: hidden; position: relative;
}
#valrimmo .desc-body.collapsed { max-height: 300px; }
#valrimmo .desc-body p + p { margin-top: 10px; }
#valrimmo .desc-body p { margin: 0; line-height: 1.4; }
#valrimmo .desc-fade {
  position: absolute; bottom: 0; left: 0; right: 0; height: 50px;
  background: linear-gradient(to bottom, transparent, var(--bg-soft)); pointer-events: none;
}
#valrimmo .desc-body.expanded .desc-fade { display: none; }
#valrimmo .desc-btn {
  margin-top: 12px; background: none; border: 1px solid var(--border-md);
  border-radius: var(--r-pill); color: var(--ink); font-size: 13px; font-weight: 500;
  padding: 7px 14px; cursor: pointer; display: inline-flex; align-items: center; gap: 5px;
  transition: background .15s;
}
#valrimmo .desc-btn:hover { background: var(--bg-soft); }
#valrimmo .desc-btn svg { width: 13px; height: 13px; transition: transform .25s; }
#valrimmo .desc-btn.open svg { transform: rotate(180deg); }

/* ── Travaux ── */
#valrimmo .travaux {
  background: linear-gradient(135deg, rgba(254,231,236,.6), rgba(254,231,236,.2));
  border: 1px solid rgba(249,25,66,.15); border-radius: var(--r-lg);
  padding: 16px; display: flex; gap: 14px;
}
#valrimmo .travaux-ico {
  width: 36px; height: 36px; border-radius: 10px; background: var(--accent); color: #fff;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
#valrimmo .travaux-ico svg { width: 18px; height: 18px; }
#valrimmo .travaux-h {
  font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 8px;
}
#valrimmo .travaux-list { font-size: 13.5px; color: var(--ink); font-weight: 500; margin-bottom: 8px; }
#valrimmo .travaux-pos {
  font-size: 12.5px; color: var(--green); display: flex; align-items: center; gap: 5px; font-weight: 500;
}
#valrimmo .travaux-pos svg { width: 13px; height: 13px; flex-shrink: 0; }

/* ── Georisques ── */
/* .geor → single-shared.css */

/* ── Map ── */
#valrimmo .map-card {
  background: #fff; border: 1px solid var(--border); border-radius: var(--r-lg);
  overflow: hidden; box-shadow: var(--shadow-xs);
}
#valrimmo .map-frame { height: 200px; position: relative; background: var(--bg-soft); }
#valrimmo .map-frame iframe { width: 100%; height: 100%; border: 0; display: block; }
#valrimmo .map-pill {
  position: absolute; top: 10px; left: 10px; background: #fff; padding: 5px 10px;
  border-radius: var(--r-pill); font-size: 11.5px; font-weight: 600;
  display: flex; align-items: center; gap: 5px; box-shadow: var(--shadow-sm);
}
#valrimmo .map-pill svg { width: 12px; height: 12px; color: var(--accent); }
/* ── Commodités à proximité ── */
#valrimmo .nearby-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px;
}
#valrimmo .nearby-item {
  display: flex; align-items: center; gap: 10px;
  background: #fff; border: 1px solid var(--border); border-radius: var(--r);
  padding: 10px 12px; box-shadow: var(--shadow-xs); color: inherit;
  transition: transform .12s, box-shadow .15s;
}
#valrimmo .nearby-item:hover { box-shadow: var(--shadow-md); }
#valrimmo .nearby-item:active { transform: scale(.98); }
#valrimmo .nearby-ico {
  width: 38px; height: 38px; border-radius: 10px; flex-shrink: 0; color: #fff;
  display: flex; align-items: center; justify-content: center;
}
#valrimmo .nearby-ico svg { width: 19px; height: 19px; }
#valrimmo .nearby-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
#valrimmo .nearby-name {
  font-size: 13px; font-weight: 600; color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#valrimmo .nearby-cat { font-size: 11px; color: var(--ink-muted); }

/* ── DPE ── */
#valrimmo .dpe-card {
  background: #fff; border: 1px solid var(--border); border-radius: var(--r-lg);
  padding: 18px; box-shadow: var(--shadow-xs);
}
#valrimmo .dpe-tabs {
  display: flex; gap: 4px; padding: 3px; background: var(--bg-soft);
  border-radius: var(--r-pill); margin-bottom: 16px;
}
#valrimmo .dpe-tab {
  flex: 1; border: none; background: transparent; font-size: 12.5px; font-weight: 600;
  padding: 7px 12px; border-radius: var(--r-pill); color: var(--ink-muted);
  cursor: pointer; transition: all .2s;
}
#valrimmo .dpe-tab.active { background: #fff; color: var(--ink); box-shadow: var(--shadow-xs); }
#valrimmo .dpe-panel { display: none; }
#valrimmo .dpe-panel.active { display: block; }
#valrimmo .dpe-letters { display: flex; gap: 4px; margin-bottom: 14px; }
#valrimmo .dpe-letter {
  flex: 1; height: 38px; border-radius: 6px; display: flex; align-items: center;
  justify-content: center; color: #fff; font-family: 'Poppins', sans-serif;
  font-weight: 600; font-size: 13px; opacity: .25; position: relative; transition: all .3s;
}
#valrimmo .dpe-letter.la { background: var(--dpe-a); }
#valrimmo .dpe-letter.lb { background: var(--dpe-b); }
#valrimmo .dpe-letter.lc { background: var(--dpe-c); }
#valrimmo .dpe-letter.ld { background: var(--dpe-d); color: #5a4a00; }
#valrimmo .dpe-letter.le { background: var(--dpe-e); }
#valrimmo .dpe-letter.lf { background: var(--dpe-f); }
#valrimmo .dpe-letter.lg { background: var(--dpe-g); }
#valrimmo .dpe-letter.active {
  opacity: 1; height: 46px; margin-top: -4px; font-size: 16px;
  box-shadow: 0 6px 16px rgba(20,19,31,.22);
}
#valrimmo .dpe-letter.active::after {
  content: ""; position: absolute; bottom: -5px; left: 50%; transform: translateX(-50%);
  width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent;
  border-top: 5px solid; color: var(--dpe-current, var(--dpe-f));
}
#valrimmo .dpe-stats {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
  padding-top: 14px; border-top: 1px solid var(--border);
}
#valrimmo .dpe-stat-lab { font-size: 11px; color: var(--ink-muted); letter-spacing: .02em; margin-bottom: 4px; }
#valrimmo .dpe-stat-val {
  font-family: 'Poppins', sans-serif; font-size: 17px; font-weight: 600;
  color: var(--ink); letter-spacing: -0.02em;
}
#valrimmo .dpe-stat-val span { font-size: 12px; color: var(--ink-muted); font-weight: 500; }
#valrimmo .dpe-note {
  margin-top: 14px; padding: 10px 12px; background: var(--bg-soft);
  border-radius: var(--r-sm); font-size: 12px; color: var(--ink-soft);
  display: flex; gap: 8px; line-height: 1.5;
}
#valrimmo .dpe-note svg { width: 14px; height: 14px; color: var(--ink-muted); flex-shrink: 0; margin-top: 2px; }
#valrimmo .dpe-note--good { background: rgba(22,163,74,.08); }
#valrimmo .dpe-note--good svg { color: var(--green); }
#valrimmo .dpe-note--mid { background: rgba(217,119,6,.08); }
#valrimmo .dpe-note--mid svg { color: var(--amber); }
#valrimmo .dpe-note--bad { background: rgba(232,79,61,.08); }
#valrimmo .dpe-note--bad svg { color: var(--dpe-f); }

/* .calc, .calc-*, input[type=range] → single-shared.css */

/* ── Comparator ── */
#valrimmo .compare {
  background: #fff; border: 1px solid var(--border); border-radius: var(--r-lg);
  overflow: hidden; box-shadow: var(--shadow-xs);
}
#valrimmo .compare-head { display: grid; grid-template-columns: 1fr 1fr; background: var(--bg-soft); border-bottom: 1px solid var(--border); }
#valrimmo .compare-col { padding: 12px; border-right: 1px solid var(--border); }
#valrimmo .compare-col:last-child { border-right: none; }
#valrimmo .compare-col.current { background: #fff; position: relative; }
#valrimmo .compare-col.current::before {
  content: "Ce bien"; position: absolute; top: 6px; right: 8px;
  background: var(--accent); color: #fff; font-size: 9px; font-weight: 700;
  padding: 2px 7px; border-radius: var(--r-pill); letter-spacing: .06em; text-transform: uppercase;
}
#valrimmo .compare-col-img {
  width: 100%; aspect-ratio: 16/10; border-radius: 8px; background: var(--border);
  overflow: hidden; margin-bottom: 8px;
}
#valrimmo .compare-col-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
#valrimmo .compare-col-title {
  font-family: 'Poppins', sans-serif; font-size: 13px; font-weight: 600; color: var(--ink);
  margin-bottom: 4px; line-height: 1.2; letter-spacing: -0.01em;
}
#valrimmo .compare-col-loc { font-size: 11px; color: var(--ink-muted); margin-bottom: 6px; }
#valrimmo .compare-col-price { font-family: 'Poppins', sans-serif; font-size: 14px; font-weight: 700; color: var(--ink); }
#valrimmo .compare-rows { display: flex; flex-direction: column; }
#valrimmo .compare-row {
  display: grid; grid-template-columns: 1fr 88px 1fr; align-items: center;
  border-bottom: 1px solid var(--border); padding: 10px 12px; font-family: inherit;
}
#valrimmo .compare-row:last-child { border-bottom: none; }
#valrimmo .compare-row-lab {
  text-align: center; font-size: 10.5px; font-family: 'Raleway', sans-serif;
  color: var(--ink-muted); font-weight: 500; letter-spacing: .04em; text-transform: uppercase;
}
#valrimmo .compare-cell { font-size: 13px; font-weight: 600; color: var(--ink); text-align: center; }
#valrimmo .compare-cell.left { text-align: right; padding-right: 4px; }
#valrimmo .compare-cell.right { text-align: left; padding-left: 4px; }
#valrimmo .compare-cell.better { color: var(--green); }
#valrimmo .compare-cell.worse { color: var(--ink-muted); }
#valrimmo .compare-cell.danger { color: var(--dpe-f); }

/* ── Agency ── */
#valrimmo .agency {
  background: #fff; border: 1px solid var(--border); border-radius: var(--r-lg);
  padding: 16px; box-shadow: var(--shadow-xs);
}
#valrimmo .agency-head { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; }
#valrimmo .agency-logo {
  width: 52px; height: 52px; border-radius: 10px; object-fit: contain;
  border: 1px solid var(--border); background: var(--bg-soft); padding: 4px; flex-shrink: 0;
}
#valrimmo .agency-name {
  font-family: 'Poppins', sans-serif; font-size: 14.5px; font-weight: 600;
  color: var(--ink); letter-spacing: -0.01em;
}
#valrimmo .agency-addr { font-size: 12px; color: var(--ink-muted); margin-top: 2px; }
#valrimmo .agency-ref { font-size: 11px; color: var(--ink-light); font-family: inherit; margin-top: 4px; }
#valrimmo .agency-btns { display: flex; gap: 8px; }
#valrimmo .btn {
  flex: 1; border: none; border-radius: var(--r); padding: 11px; font-size: 13.5px;
  font-weight: 600; cursor: pointer; display: inline-flex; align-items: center;
  justify-content: center; gap: 6px; text-decoration: none; transition: transform .12s, filter .15s;
}
#valrimmo .btn:active { transform: scale(.97); }
#valrimmo .btn svg { width: 15px; height: 15px; }
#valrimmo .btn-primary { background: var(--accent); color: #fff; }
#valrimmo .btn-secondary { background: var(--bg-soft); color: var(--ink); }
#valrimmo .btn-secondary:hover { background: var(--border); }
#valrimmo .btn-success { background: var(--green); color: #fff; }

/* .profiles, .profile* → single-shared.css */

/* ── Similar ── */
#valrimmo .similars {
  display: flex; gap: 10px; overflow-x: auto; scrollbar-width: none;
  margin: 0 -16px; padding: 4px 16px 8px; scroll-snap-type: x mandatory;
}
#valrimmo .similars::-webkit-scrollbar { display: none; }
#valrimmo .sim {
  flex: 0 0 240px; background: #fff; border: 1px solid var(--border); border-radius: var(--r);
  overflow: hidden; box-shadow: var(--shadow-xs);
  color: inherit; display: block; scroll-snap-align: center;
  transition: transform .22s cubic-bezier(.22,.61,.36,1), box-shadow .22s, border-color .22s;
}
#valrimmo .sim:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--border-md); }
#valrimmo .sim:active { transform: translateY(-1px) scale(.99); }
#valrimmo .sim-img {
  width: 100%; height: 130px; background: var(--border); position: relative;
  display: flex; align-items: flex-end; justify-content: flex-start; padding: 10px;
  overflow: hidden;
}
#valrimmo .sim-img img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  transition: transform .45s cubic-bezier(.22,.61,.36,1);
}
#valrimmo .sim:hover .sim-img img { transform: scale(1.06); }
#valrimmo .sim-img-tag {
  position: relative; background: rgba(20,19,31,.8); color: #fff; font-size: 10px;
  font-weight: 600; padding: 3px 8px; border-radius: var(--r-pill); letter-spacing: .03em;
}
#valrimmo .sim-body { padding: 12px; }
#valrimmo .sim-loc {
  font-size: 10.5px; color: var(--ink-muted); letter-spacing: .04em;
  text-transform: uppercase; font-weight: 600; margin-bottom: 4px;
}
#valrimmo .sim-title {
  font-family: 'Poppins', sans-serif; font-size: 13.5px; font-weight: 600; color: var(--ink);
  line-height: 1.25; margin-bottom: 5px; letter-spacing: -0.01em;
}
#valrimmo .sim-specs { font-family: inherit; font-size: 11px; color: var(--ink-muted); margin-bottom: 8px; }
#valrimmo .sim-price-row { display: flex; align-items: baseline; justify-content: space-between; }
#valrimmo .sim-price {
  font-family: 'Poppins', sans-serif; font-size: 15px; font-weight: 700; color: var(--ink); letter-spacing: -0.02em;
}
#valrimmo .sim-cmp {
  font-size: 10.5px; color: var(--accent); font-weight: 600;
  display: inline-flex; align-items: center; gap: 3px;
  border: 1px solid var(--accent-soft); background: var(--accent-soft);
  padding: 4px 8px; border-radius: var(--r-pill); cursor: pointer;
  transition: background .15s, color .15s;
}
#valrimmo .sim-cmp:hover { background: #fde0e6; }
#valrimmo .sim-cmp.active { background: var(--accent); color: #fff; }
#valrimmo .sim-cmp svg { width: 10px; height: 10px; }

/* ── Similars : navigation desktop ── */
#valrimmo .similars-wrap { position: relative; }
#valrimmo .similars-nav {
  position: absolute; top: 57px; width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid var(--border); background: #fff; cursor: pointer; color: var(--ink);
  display: none; align-items: center; justify-content: center;
  box-shadow: var(--shadow-md); z-index: 2; transition: transform .12s;
}
#valrimmo .similars-nav:active { transform: scale(.9); }
#valrimmo .similars-nav svg { width: 16px; height: 16px; }
#valrimmo .similars-prev { left: -8px; }
#valrimmo .similars-next { right: -8px; }

/* .share-row, .share-btn → single-shared.css */

/* .modal, .modal-*, .form-* → single-shared.css */

/* ── Sidebar (desktop) ── */
#valrimmo .sidebar { display: none; }
#valrimmo .sb-card {
  background: #fff; border: 1px solid var(--border); border-radius: var(--r-lg);
  padding: 18px; box-shadow: var(--shadow-xs); flex: 0 0 auto;
}
#valrimmo .sb-card-title {
  font-size: 11px; font-weight: 700; color: var(--ink-muted); letter-spacing: .08em;
  text-transform: uppercase; margin-bottom: 14px;
}
#valrimmo .sb-price { background: var(--ink); color: #fff; position: relative; overflow: hidden; isolation: isolate; }
#valrimmo .sb-price > * { z-index: 1; }
#valrimmo .sb-price::after {
  content: ""; position: absolute; right: -50px; top: -50px; width: 160px; height: 160px;
  border-radius: 50%; background: radial-gradient(circle, rgba(249,25,66,.28), transparent 70%);
  pointer-events: none; z-index: 0;
}
#valrimmo .sb-price-amt {
  font-family: 'Poppins', sans-serif; font-size: 30px; font-weight: 700;
  letter-spacing: -0.03em; line-height: 1; position: relative;
}
#valrimmo .sb-price-amt .eu { font-size: 20px; opacity: .65; font-weight: 500; }
#valrimmo .sb-price-sub { font-size: 11.5px; color: rgba(255,255,255,.5); margin-top: 6px; letter-spacing: .02em; position: relative; }
#valrimmo .sb-cta-primary {
  width: 100%; background: var(--accent); color: #fff; border: none; border-radius: var(--r);
  padding: 13px; font-size: 14px; font-weight: 600; cursor: pointer; margin-top: 18px;
  display: flex; align-items: center; justify-content: center; gap: 7px;
  box-shadow: 0 6px 18px rgba(249,25,66,.4); transition: transform .12s; position: relative;
}
#valrimmo .sb-cta-primary:hover { transform: translateY(-1px); }
#valrimmo .sb-cta-primary svg { width: 16px; height: 16px; }
#valrimmo .sb-cta-secondary {
  width: 100%; background: rgba(255,255,255,.08); color: #fff; border: 1px solid rgba(255,255,255,.16);
  border-radius: var(--r); padding: 11px; font-size: 13.5px; font-weight: 600; cursor: pointer;
  margin-top: 8px; text-decoration: none; display: flex; align-items: center;
  justify-content: center; gap: 7px; transition: background .15s; position: relative;
}
#valrimmo .sb-cta-secondary:hover { background: rgba(255,255,255,.14); }
#valrimmo .sb-cta-secondary svg { width: 15px; height: 15px; }
#valrimmo .sb-action-row { display: flex; gap: 8px; margin-top: 12px; position: relative; }
#valrimmo .sb-action-btn {
  flex: 1; background: rgba(255,255,255,.06); color: rgba(255,255,255,.75);
  border: 1px solid rgba(255,255,255,.12); border-radius: var(--r-sm); padding: 8px;
  font-size: 11.5px; font-weight: 600; cursor: pointer; display: flex; align-items: center;
  justify-content: center; gap: 5px; transition: background .15s, color .15s, border-color .15s;
}
#valrimmo .sb-action-btn:hover { background: rgba(255,255,255,.14); color: #fff; }
#valrimmo .sb-action-btn.active { background: var(--accent); color: #fff; border-color: var(--accent); }
#valrimmo .sb-action-btn.active svg { fill: currentColor; }
#valrimmo .sb-action-btn svg { width: 13px; height: 13px; }
#valrimmo .sb-mensualite {
  display: block; text-decoration: none; color: inherit;
  background: linear-gradient(135deg, var(--accent-soft) 0%, #fff 65%);
  border-color: rgba(249,25,66,.18); transition: transform .15s, box-shadow .15s;
}
#valrimmo .sb-mensualite:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); }
#valrimmo .sb-m-label {
  font-size: 10.5px; color: var(--ink-muted); letter-spacing: .08em;
  text-transform: uppercase; font-weight: 600; margin-bottom: 8px;
}
#valrimmo .sb-m-amt {
  font-family: 'Poppins', sans-serif; font-size: 26px; font-weight: 700;
  color: var(--ink); letter-spacing: -0.025em; line-height: 1;
}
#valrimmo .sb-m-amt .per { font-size: 13px; color: var(--ink-muted); font-weight: 500; letter-spacing: 0; }
#valrimmo .sb-m-link {
  font-size: 12px; color: var(--accent); font-weight: 600; margin-top: 12px;
  display: flex; align-items: center; gap: 5px;
}
#valrimmo .sb-m-link svg { width: 12px; height: 12px; transition: transform .15s; }
#valrimmo .sb-mensualite:hover .sb-m-link svg { transform: translateX(3px); }
#valrimmo .sb-specs-list { display: flex; flex-direction: column; }
#valrimmo .sb-specs-row {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 9px 0; border-bottom: 1px solid var(--border);
}
#valrimmo .sb-specs-row:last-child { border-bottom: none; padding-bottom: 0; }
#valrimmo .sb-specs-row:first-child { padding-top: 0; }
#valrimmo .sb-specs-row > span:first-child { color: var(--ink-muted); font-size: 12px; letter-spacing: .02em; }
#valrimmo .sb-specs-row > span:last-child {
  font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 13.5px;
  color: var(--ink); letter-spacing: -0.01em;
}
#valrimmo .sb-specs-row.danger > span:last-child { color: var(--dpe-f); }
#valrimmo .sb-agency-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
#valrimmo .sb-agency-logo {
  width: 44px; height: 44px; border-radius: 9px; object-fit: contain;
  border: 1px solid var(--border); background: var(--bg-soft); padding: 3px; flex-shrink: 0;
}
#valrimmo .sb-agency-name {
  font-family: 'Poppins', sans-serif; font-size: 13.5px; font-weight: 600;
  color: var(--ink); letter-spacing: -0.01em; line-height: 1.2;
}
#valrimmo .sb-agency-addr { font-size: 11px; color: var(--ink-muted); margin-top: 3px; }
#valrimmo .sb-agency-btns { display: flex; flex-direction: column; gap: 8px; }
#valrimmo .sb-tel-btn {
  background: var(--green); color: #fff; border-radius: var(--r); padding: 11px;
  text-decoration: none; font-size: 13.5px; font-weight: 600; display: flex;
  align-items: center; justify-content: center; gap: 7px; transition: opacity .15s;
}
#valrimmo .sb-tel-btn:hover { opacity: .9; }
#valrimmo .sb-tel-btn svg { width: 15px; height: 15px; }
#valrimmo .sb-msg-btn {
  background: var(--bg-soft); color: var(--ink); border: 1px solid var(--border-md);
  border-radius: var(--r); padding: 10px; font-size: 13px; font-weight: 600; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 6px; transition: background .15s;
}
#valrimmo .sb-msg-btn:hover { background: var(--border); }
#valrimmo .sb-msg-btn svg { width: 14px; height: 14px; }
#valrimmo .sb-dpe-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 14px; }
#valrimmo .sb-dpe-title { font-family: 'Poppins', sans-serif; font-size: 13px; font-weight: 600; color: var(--ink); letter-spacing: -0.01em; }
#valrimmo .sb-dpe-tag { font-size: 10.5px; color: var(--ink-muted); font-weight: 500; letter-spacing: .03em; }
#valrimmo .sb-dpe-grid { display: grid; grid-template-columns: 62px 1fr; gap: 14px; align-items: center; }
#valrimmo .sb-dpe-letter {
  width: 62px; height: 62px; color: #fff; display: flex; align-items: center;
  justify-content: center; font-family: 'Poppins', sans-serif; font-size: 30px; font-weight: 700;
  border-radius: 10px; box-shadow: 0 4px 14px rgba(20,19,31,.22); letter-spacing: -0.02em;
}
#valrimmo .sb-dpe-conso { font-family: inherit; font-size: 13px; font-weight: 600; color: var(--ink); }
#valrimmo .sb-dpe-charges { font-size: 11.5px; color: var(--ink-muted); margin-top: 4px; }
#valrimmo .sb-dpe-bar { display: flex; gap: 2px; align-items: center; margin-top: 14px; }
#valrimmo .sb-dpe-bar > div { flex: 1; height: 5px; border-radius: 2px; opacity: .25; }
#valrimmo .sb-dpe-bar > div.active { opacity: 1; height: 9px; }

/* ════════════ DESKTOP — 2 colonnes (≥1024px) ════════════ */
@media (min-width: 1024px) {
  #valrimmo .page-wrap {
    max-width: 1360px; margin: 0 auto; padding: 28px 0 0;
    display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 36px; align-items: start;
  }
  #valrimmo .container { padding: 0; min-width: 0; }
  #valrimmo .page { padding-bottom: 32px; }
  #valrimmo .hero { height: 460px; margin: 0 0 18px; border-radius: var(--r-lg); }
  #valrimmo .hero-fav { display: none; }
  #valrimmo .hero-arrow { display: flex; }
  #valrimmo .similars { margin: 0; padding-left: 0; padding-right: 0; }
  #valrimmo .similars-nav { display: flex; }
  #valrimmo .sb-price { position: sticky; top: 16px; z-index: 2; }
  /* .profiles wrap desktop → single-shared.css */
  #valrimmo .sidebar { display: flex; flex-direction: column; gap: 14px; align-self: stretch; padding-right: 2px; }
  #valrimmo [data-mobile] { display: none !important; }
  #valrimmo h1.property-title { font-size: 30px; }
  #valrimmo .sec-title { font-size: 19px; }
}