
:root{
  --purple-50:#F2EEFE; --purple-100:#E1D9FC; --purple-300:#A99BF1;
  --purple-500:#6B4FE6; --purple-600:#5B3FD6; --purple-700:#4B30C0;
  --green:#10B981; --green-text:#047857; --teal:#0B8A8A;
  --ink:#1A1A1F; --ink-2:#3A3A42; --muted:#6B6B76; --line:#E7E7EE;
  --bg:#FFFFFF; --bg-soft:#F8F8FB;
  --gray-900:#0F0F14;
  --gray-800:#1A1A1F; --gray-700:#2D2D35; --gray-600:#4B4B55; --gray-500:#6B6B75;
  --gray-400:#9B9BA5; --gray-300:#C9C9D1; --gray-200:#E5E5EB; --gray-100:#F2F2F5; --gray-50:#F8F8FB;
  --r-card:12px; --r-pill:999px; --r-feat:20px;
  --sh-rest:0 1px 2px rgba(15,15,20,.05), 0 8px 24px rgba(15,15,20,.07);
  --sh-lift:0 2px 6px rgba(15,15,20,.07), 0 18px 44px rgba(15,15,20,.14);
  --hero-bg:radial-gradient(120% 90% at 80% -10%, var(--purple-50) 0%, #fff 60%);
  --maxw:1200px;
}
[data-intensity="restrained"]{ --hero-bg:#fff; }
[data-intensity="bold"]{ --hero-bg:radial-gradient(130% 100% at 78% -20%, var(--purple-100) 0%, var(--purple-50) 42%, #fff 80%); }

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:Inter, system-ui, -apple-system, sans-serif;
  letter-spacing:-.01em; line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{ letter-spacing:-.025em; line-height:1.05; margin:0; text-wrap:balance; }
p{ margin:0; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 20px; }

/* ---------- buttons ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font:inherit; font-weight:600; letter-spacing:-.01em; cursor:pointer;
  border:none; border-radius:var(--r-pill); padding:13px 20px; font-size:15px;
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease, color .2s ease; }
.btn:active{ transform:translateY(1px); }
.btn-primary{ background:var(--purple-500); color:#fff; box-shadow:0 6px 18px rgba(107,79,230,.28); }
.btn-primary:hover{ background:var(--purple-600); box-shadow:0 10px 26px rgba(107,79,230,.36); }
.btn-dark{ background:var(--ink); color:#fff; }
.btn-dark:hover{ background:#000; box-shadow:var(--sh-lift); }
.btn-ghost{ background:transparent; color:var(--ink); border:1.5px solid var(--line); }
.btn-ghost:hover{ border-color:var(--ink); }
.btn.full{ width:100%; }
.btn.lg{ padding:16px 22px; font-size:16px; }

.link-arrow{ display:inline-flex; align-items:center; gap:7px; font-weight:600; color:var(--purple-600);
  transition:gap .15s ease; }
.link-arrow:hover{ gap:11px; }
.link-arrow.plain{ color:var(--ink-2); }

/* ---------- logo + segmented toggle ---------- */
.logo{ display:inline-flex; align-items:center; gap:9px; }
.bullseye{ border-radius:50%; border:3px solid var(--purple-500); display:grid; place-items:center; flex:none; }
.bullseye-dot{ background:var(--purple-500); border-radius:50%; }
.wordmark{ font-weight:700; font-size:23px; letter-spacing:-.04em; color:var(--ink); }

.seg{ display:inline-flex; background:var(--gray-100); border-radius:var(--r-pill); padding:4px; gap:2px; }
.seg-btn{ border:none; background-color:transparent; cursor:pointer; font:inherit;
  font-weight:600; color:var(--gray-500); border-radius:var(--r-pill);
  transition:color .2s ease, background-color .2s ease; white-space:nowrap; }
.seg-btn:hover:not(.on){ color:var(--ink); }
.seg-btn.on{ background-color:var(--ink); color:#fff; box-shadow:0 1px 2px rgba(15,15,20,.18); }
.seg-btn:focus{ outline:none; }
.seg-btn:focus-visible{ outline:2px solid var(--purple-300); outline-offset:2px; }
.seg-md .seg-btn{ padding:9px 22px; font-size:15px; }
.seg-sm .seg-btn{ padding:6px 15px; font-size:13.5px; }

/* ---------- header ---------- */
.site-header{ position:sticky; top:0; z-index:50; background:rgba(255,255,255,.86);
  backdrop-filter:saturate(160%) blur(14px); border-bottom:1px solid var(--line); }
.header-row{ display:flex; align-items:center; justify-content:space-between; gap:16px; height:64px; }
.header-left{ display:flex; align-items:center; gap:16px; }
.header-toggle{ display:none; }
.header-nav{ display:none; align-items:center; gap:6px; }
.header-nav a:not(.btn){ padding:8px 12px; font-weight:500; font-size:14.5px; color:var(--ink-2); border-radius:8px; }
.header-nav a:not(.btn):hover{ color:var(--ink); background:var(--bg-soft); }
.header-nav .btn{ padding:9px 16px; font-size:14px; }
.header-burger{ background:none; border:none; cursor:pointer; color:var(--ink); padding:6px; display:flex; }
.mobile-menu{ display:flex; flex-direction:column; gap:4px; padding-bottom:16px; padding-top:4px; }
.mobile-menu a:not(.btn){ padding:12px 4px; font-weight:600; border-bottom:1px solid var(--line); }
.mobile-menu .btn{ margin-top:10px; }

/* ---------- hero ---------- */
.hero{ position:relative; background:var(--hero-bg); overflow:hidden; padding:42px 0 230px; }
.hero-grid{ position:relative; z-index:2; display:flex; flex-direction:column; gap:26px; }
.eyebrow{ display:inline-block; font-size:12.5px; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--purple-600); margin-bottom:14px; }
.hero-title{ font-size:clamp(38px, 11vw, 62px); font-weight:800; }
.hero-title .hl{ color:var(--purple-500); }
.hero-sub{ margin-top:16px; font-size:clamp(13px,2.3vw,14.5px); color:var(--ink-2); max-width:38ch;
  border-left:3px solid var(--purple-300); padding-left:14px; }
.hero-proof{ display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:22px; }
.hero-proof span{ display:inline-flex; align-items:center; gap:7px; font-size:14px; font-weight:600; color:var(--ink-2); }
.hero-proof svg{ color:var(--green); }

/* search card */
.search-card{ background:#fff; border:1px solid var(--line); border-radius:var(--r-feat);
  box-shadow:var(--sh-rest); padding:22px; display:flex; flex-direction:column; gap:18px; }
.card-toggle{ display:flex; }
.card-toggle .seg{ width:100%; }
.card-toggle .seg-btn{ flex:1; }
.field label{ display:block; font-weight:700; font-size:14px; margin-bottom:9px; color:var(--ink); }
.field-2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.text-input{ display:flex; align-items:center; gap:9px; border:1.5px solid var(--line); border-radius:11px;
  padding:13px 14px; background:var(--bg-soft); transition:border-color .15s ease, background .15s ease; }
.text-input:focus-within{ border-color:var(--purple-500); background:#fff; }
.text-input svg{ color:var(--muted); flex:none; }
.text-input input{ border:none; background:none; outline:none; font:inherit; font-weight:600; width:100%; color:var(--ink); }
.text-input.sm{ padding:11px 12px; }
.adorn{ color:var(--muted); font-weight:700; }
.adorn.r{ font-size:13px; }
.price-row{ display:flex; align-items:center; gap:9px; }
.price-row .text-input{ flex:1; }
.dash{ color:var(--muted); }
.field-head{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:12px; }
.field-head label{ margin-bottom:0; }
.range-val{ font-weight:700; font-size:14px; color:var(--purple-700); white-space:nowrap; }
.range-unit{ color:var(--muted); font-weight:600; }
.range{ position:relative; height:26px; margin:2px 2px 0; }
.range-track{ position:absolute; top:11px; left:0; right:0; height:4px; background:var(--purple-100); border-radius:2px; }
.range-fill{ position:absolute; top:11px; height:4px; background:var(--purple-500); border-radius:2px; }
.range input[type=range]{ position:absolute; top:0; left:0; width:100%; height:26px; margin:0; background:none;
  pointer-events:none; -webkit-appearance:none; appearance:none; }
.range input[type=range]::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; pointer-events:auto;
  width:22px; height:22px; border-radius:50%; background:#fff; border:1.5px solid var(--purple-500);
  box-shadow:0 2px 6px rgba(15,15,20,.22); cursor:grab; margin-top:0; }
.range input[type=range]::-webkit-slider-thumb:active{ cursor:grabbing; }
.range input[type=range]::-moz-range-thumb{ pointer-events:auto; width:22px; height:22px; border-radius:50%;
  background:#fff; border:1.5px solid var(--purple-500); box-shadow:0 2px 6px rgba(15,15,20,.22); cursor:grab; }
.range input[type=range]::-webkit-slider-runnable-track{ background:none; }
.range input[type=range]::-moz-range-track{ background:none; }
.opt-row{ display:flex; gap:8px; }
.opt{ flex:1; border:1.5px solid var(--line); background:var(--bg-soft); border-radius:10px; padding:11px 4px;
  font:inherit; font-weight:600; font-size:14px; cursor:pointer; color:var(--ink-2);
  transition:all .15s ease; }
.opt:hover{ border-color:var(--purple-300); }
.opt.on{ background:var(--purple-500); border-color:var(--purple-500); color:#fff; }
.card-foot{ display:flex; align-items:center; justify-content:center; gap:8px; font-size:12.5px; font-weight:600; color:var(--muted); margin-top:2px; }
.card-foot .live-dot{ flex:none; }
/* progressive search: desktop always shows filters, hides the expander */
.card-filters-inner{ display:flex; flex-direction:column; gap:18px; }
.card-morefilters{ display:none; }

/* ── Location multi-select dropdown (ported verbatim from the map) ── */
.dbz-search-loc{ position:relative; flex-shrink:0; }
.dbz-search-trigger{ display:flex; align-items:center; gap:8px; height:40px; padding:0 6px 0 14px;
  background:var(--gray-50); border:1px solid var(--gray-100); border-radius:999px; width:300px;
  cursor:pointer; color:var(--gray-700); font:inherit; text-align:left; transition:background .12s, border-color .12s; }
.dbz-search-trigger:hover{ border-color:var(--gray-300); }
.dbz-search-trigger.is-open{ background:#fff; border-color:var(--purple-300); box-shadow:0 1px 3px rgba(107,79,230,.1); }
.dbz-search-ph{ flex:1; font-size:14px; font-weight:500; color:var(--gray-500); }
.dbz-search-trigger-icon{ width:28px; height:28px; border-radius:50%; display:flex; align-items:center;
  justify-content:center; color:var(--purple-600); background:transparent; flex-shrink:0; margin-left:auto; }
.dbz-search-trigger.is-open .dbz-search-trigger-icon{ color:var(--purple-700); }
.dbz-search-chips{ display:flex; align-items:center; gap:4px; flex:1; min-width:0; overflow:hidden; }
.dbz-search-chip{ display:inline-flex; align-items:center; gap:4px; padding:2px 4px 2px 10px;
  background:var(--purple-50); color:var(--purple-700); border-radius:999px; font-size:12.5px; font-weight:600; white-space:nowrap; flex-shrink:0; }
.dbz-search-x{ display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px;
  border-radius:50%; color:var(--purple-700); font-size:14px; line-height:1; cursor:pointer; transition:background .12s; }
.dbz-search-x:hover{ background:rgba(107,79,230,.15); }
.dbz-search-more{ font-size:12.5px; font-weight:600; color:var(--purple-700); flex-shrink:0; }
.dbz-search-pop{ position:absolute; top:calc(100% + 8px); left:0; z-index:100; width:360px; max-width:92vw;
  background:#fff; border:1px solid var(--gray-100); border-radius:14px;
  box-shadow:0 4px 12px rgba(15,15,20,.08), 0 16px 40px rgba(15,15,20,.18); padding:8px; max-height:360px;
  overflow-y:auto; scrollbar-width:thin; scrollbar-color:var(--gray-300) transparent;
  animation:dbz-pop-in .15s cubic-bezier(.32,.72,0,1); }
.dbz-search-tagline{ font-size:12.5px; font-weight:600; color:var(--purple-700); padding:8px 14px 12px; letter-spacing:-.005em; }
.dbz-search-row{ display:flex; align-items:center; gap:12px; width:100%; padding:10px 12px; background:transparent;
  border:0; border-radius:10px; cursor:pointer; text-align:left; transition:background .12s; }
.dbz-search-row:hover{ background:var(--gray-50); }
.dbz-search-row.is-on{ background:var(--purple-50); }
.dbz-search-check{ width:20px; height:20px; border:1.5px solid var(--gray-300); border-radius:5px; display:flex;
  align-items:center; justify-content:center; flex-shrink:0; color:#fff; background:#fff; transition:background .12s, border-color .12s; }
.dbz-search-row.is-on .dbz-search-check{ background:var(--purple-500); border-color:var(--purple-500); }
.dbz-search-label{ display:flex; flex-direction:column; gap:1px; min-width:0; }
.dbz-search-label-main{ font-size:14px; font-weight:500; color:var(--gray-900); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dbz-search-label-sub{ font-size:12px; color:var(--gray-500); }
.dbz-search-row.is-on .dbz-search-label-main{ color:var(--purple-700); font-weight:600; }
.dbz-search-divider{ height:1px; background:var(--gray-100); margin:6px 8px; }
@keyframes dbz-pop-in{ from{ opacity:0; transform:translateY(-6px); } to{ opacity:1; transform:translateY(0); } }
/* fit the dropdown to the search card */
.card-loc, .card-loc .dbz-search-trigger{ width:100%; }
.card-loc .dbz-search-trigger{ height:48px; padding:0 8px 0 14px; }
.card-loc .dbz-search-pop{ width:100%; min-width:280px; }

/* skyline */
.skyline{ position:absolute; left:50%; transform:translateX(-50%); bottom:0; width:100%; max-width:1500px;
  z-index:1; pointer-events:none; line-height:0; }
.skyline-svg{ display:block; width:100%; height:auto; }
[data-intensity="bold"] .skyline-svg{ filter:saturate(1.18) brightness(.93); }

/* ---------- trust strip ---------- */
.trust{ background:var(--ink); color:#fff; }
.trust-row{ display:flex; flex-direction:column; gap:16px; padding-top:22px; padding-bottom:22px; }
.trust-label{ font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--purple-300); }
.trust-items{ display:grid; gap:16px; }
.trust-item{ display:flex; align-items:center; gap:13px; }
.trust-ico{ width:40px; height:40px; flex:none; border-radius:11px; display:grid; place-items:center;
  background:rgba(169,155,241,.18); color:var(--purple-300); }
.trust-item strong{ display:block; font-size:15px; }
.trust-item span{ font-size:13.5px; color:rgba(255,255,255,.62); }

/* ---------- section scaffolding ---------- */
.section{ padding:56px 0; }
.section-soft{ background:var(--bg-soft); }
.kicker{ display:inline-block; font-size:12.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--purple-600); margin-bottom:11px; }
.kicker.on-tint{ color:var(--purple-700); }
.section-head{ display:flex; flex-direction:column; gap:18px; margin-bottom:26px; }
.section-head h2{ font-size:clamp(27px,7vw,40px); font-weight:800; }
.head-actions{ display:flex; align-items:center; justify-content:space-between; gap:14px; }
.rail-nav{ display:flex; gap:8px; }
.rail-nav button{ width:44px; height:44px; border-radius:50%; border:1.5px solid var(--line); background:#fff;
  cursor:pointer; display:grid; place-items:center; color:var(--ink); transition:all .15s ease; }
.rail-nav button:hover{ border-color:var(--ink); box-shadow:var(--sh-rest); }
.desktop-only{ display:none; }

/* ---------- photo placeholders ---------- */
.photo{ position:relative; border-radius:var(--r-card); overflow:hidden; background:var(--purple-100); }
.photo image-slot{ position:absolute; inset:0; width:100%; height:100%; display:block; z-index:0; }
.photo-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; z-index:0; }
.photo-stripes{ position:absolute; inset:0; background-image:repeating-linear-gradient(135deg, rgba(255,255,255,.16) 0 2px, transparent 2px 13px); }
.photo-purple{ background:linear-gradient(145deg,#7d63ec,#4b30c0); }
.photo-teal{ background:linear-gradient(145deg,#15a3a3,#076b6b); }
.photo-blue{ background:linear-gradient(145deg,#5b8def,#2f5fc0); }
.photo-amber{ background:linear-gradient(145deg,#f2c890,#e0a25a); }
.photo-neutral{ background:linear-gradient(145deg,#cfcfd9,#a7a7b4); }
.photo-tag{ position:absolute; bottom:10px; right:10px; z-index:3; font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:10px; letter-spacing:.02em; color:rgba(255,255,255,.85); background:rgba(15,15,20,.32);
  padding:3px 8px; border-radius:6px; backdrop-filter:blur(2px); }

/* ---------- value block ---------- */
.value{ padding:56px 0; }
.value-head{ max-width:62ch; margin-bottom:28px; }
.value-head h2{ font-size:clamp(26px,6.6vw,38px); font-weight:800; }
.value-head .hl{ color:var(--purple-500); }
.value-head p{ margin-top:14px; color:var(--ink-2); font-size:15px; }
.value-grid{ display:grid; gap:16px; }
.value-card.big{ background:var(--purple-50); border-radius:var(--r-feat); overflow:hidden; display:flex; flex-direction:column; }
.vc-body{ padding:26px; }
.vc-body h3{ font-size:23px; font-weight:800; }
.vc-body p{ margin:12px 0 18px; color:var(--ink-2); }
.vc-photo{ min-height:200px; }
.map-chip{ position:absolute; top:14px; right:14px; z-index:3; display:inline-flex; align-items:center; gap:7px;
  background:#fff; color:var(--purple-700); font-weight:700; font-size:12px; letter-spacing:.08em; padding:6px 11px; border-radius:var(--r-pill); }
.live-dot{ width:8px; height:8px; border-radius:50%; background:var(--purple-500); box-shadow:0 0 0 0 rgba(107,79,230,.5); animation:pulse 1.8s infinite; }
.live-dot.green{ background:var(--green); box-shadow:0 0 0 0 rgba(16,185,129,.5); }
@keyframes pulse{ 70%{ box-shadow:0 0 0 8px rgba(107,79,230,0);} 100%{ box-shadow:0 0 0 0 rgba(107,79,230,0);} }
.value-stats{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.stat{ background:#fff; border:1px solid var(--line); border-radius:var(--r-card); padding:18px; }
.stat strong{ display:block; font-size:30px; font-weight:800; letter-spacing:-.03em; }
.stat span{ font-size:13.5px; color:var(--muted); }
.verified-stat{ grid-column:1 / -1; display:flex; flex-direction:column; gap:8px; }
.vbadge{ align-self:flex-start; display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700;
  color:var(--green-text); background:rgba(16,185,129,.12); padding:5px 10px; border-radius:var(--r-pill); }

/* ── Statement / market-comparison section ── */
.value-statement{ background:radial-gradient(120% 90% at 50% -18%, #271c46 0%, #16111f 40%, var(--gray-900) 78%);
  color:#fff; padding:72px 0; }
.stmt-head{ max-width:780px; }
.stmt-head .kicker{ color:var(--purple-300); }
.stmt-head h2{ font-size:clamp(31px,6.6vw,54px); font-weight:800; letter-spacing:-.03em; line-height:1.02; }
.stmt-head h2 .hl{ color:var(--purple-300); }
.stmt-head .stmt-sub{ margin-top:18px; color:rgba(255,255,255,.66); font-size:clamp(15px,3.6vw,18px); max-width:58ch; }
.cmp-grid{ display:grid; gap:14px; margin:34px 0 16px; grid-template-columns:1fr; }
.cmp-card{ background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.09); border-radius:16px; padding:22px; display:flex; flex-direction:column; }
.cmp-src{ font-size:13px; font-weight:600; color:rgba(255,255,255,.5); }
.cmp-gap{ font-size:23px; font-weight:800; letter-spacing:-.02em; margin:6px 0 10px; color:#fff; }
.cmp-note{ font-size:14px; line-height:1.55; color:rgba(255,255,255,.62); }
.cmp-cov{ display:flex; flex-wrap:wrap; gap:8px; margin-top:15px; }
.cmp-card .cmp-cov{ margin-top:auto; padding-top:16px; }
.cov-pill{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; padding:5px 11px; border-radius:var(--r-pill); }
.cov-pill.on{ background:rgba(16,185,129,.16); color:#6ee7b7; }
.cov-pill.off{ background:rgba(255,255,255,.05); color:rgba(255,255,255,.38); }
.cov-pill.off .cov-x{ font-size:14px; line-height:1; }
.cmp-answer{ position:relative; background:linear-gradient(135deg,var(--purple-600),var(--purple-700)); border-radius:20px;
  padding:30px; overflow:hidden; box-shadow:0 18px 50px rgba(75,48,192,.4); }
.cmp-answer .ans-main{ position:relative; z-index:1; }
.cmp-answer .cmp-src{ color:rgba(255,255,255,.85); display:inline-flex; align-items:center; gap:8px; }
.ans-dot{ width:8px; height:8px; border-radius:50%; background:#fff; box-shadow:0 0 0 0 rgba(255,255,255,.6); animation:pulse 1.8s infinite; }
.cmp-answer h3{ font-size:clamp(22px,4.2vw,33px); font-weight:800; letter-spacing:-.025em; margin:9px 0 13px; color:#fff; max-width:22ch; }
.cmp-answer p{ color:rgba(255,255,255,.86); font-size:15.5px; line-height:1.6; max-width:60ch; }
.cmp-answer .cmp-cov .cov-pill.on{ background:rgba(255,255,255,.2); color:#fff; }
.ans-cta{ display:inline-flex; align-items:center; gap:8px; margin-top:20px; background:#fff; color:var(--purple-700);
  font-weight:700; font-size:15px; padding:13px 22px; border-radius:var(--r-pill); transition:transform .15s ease, box-shadow .2s ease; }
.ans-cta:hover{ transform:translateY(-1px); box-shadow:0 10px 26px rgba(0,0,0,.25); }
.stmt-stats{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-top:26px; }
.stmt-stat{ background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.09); border-radius:14px; padding:18px; display:flex; flex-direction:column; justify-content:space-between; gap:10px; min-height:118px; }
.stmt-stat strong{ display:block; font-size:28px; font-weight:800; letter-spacing:-.02em; }
.stmt-stat span{ font-size:13px; color:rgba(255,255,255,.55); }
.stmt-stat.is-text strong{ font-size:19px; line-height:1.18; letter-spacing:-.01em; }
.stmt-stat.verified{ gap:10px; }
.stmt-stat.verified .vbadge{ background:rgba(16,185,129,.18); color:#6ee7b7; }
@media(min-width:760px){
  .cmp-grid{ grid-template-columns:repeat(3,1fr); }
  .cmp-answer{ display:flex; align-items:center; gap:34px; padding:40px; }
  .cmp-answer .ans-main{ flex:1; }
  .ans-cta{ margin-top:0; flex:none; }
  .stmt-stats{ grid-template-columns:repeat(4,1fr); }
}

/* ---------- neighborhoods rail ---------- */
.rail{ display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding:4px 4px 14px;
  margin:0 -4px; scrollbar-width:none; }
.rail::-webkit-scrollbar{ display:none; }
.hood-card{ flex:0 0 78%; max-width:300px; scroll-snap-align:start; }
.hood-card .photo{ aspect-ratio:3/4; }
.hood-card .photo::after{ content:""; position:absolute; inset:0; z-index:2;
  background:linear-gradient(180deg, rgba(15,15,20,0) 38%, rgba(15,15,20,.72) 100%); }
.hood-overlay{ position:absolute; z-index:3; left:0; right:0; bottom:0; padding:18px; color:#fff; }
.hood-blurb{ font-size:13px; color:rgba(255,255,255,.82); }
.hood-count{ display:inline-flex; align-items:center; gap:7px; font-size:13.5px; font-weight:600; color:rgba(255,255,255,.95); }
.hood-live-dot{ width:7px; height:7px; border-radius:50%; background:#34d399; box-shadow:0 0 0 0 rgba(52,211,153,.6); animation:pulse 1.8s infinite; }
.hood-overlay h3{ font-size:25px; font-weight:800; margin:3px 0 8px; }
/* Always-visible CTA (Revisions 6/10 Misc: "static" = shown at all times, not
   hover-revealed). The old opacity:0 + hover reveal hid it entirely on touch,
   where there is no hover — so "View rentals" never appeared on phones. */
.hood-cta{ display:inline-flex; align-items:center; gap:6px; font-weight:600; font-size:14px; }
.hood-card:hover .photo{ box-shadow:var(--sh-lift); }

/* ---------- buildings bento ---------- */
.bento{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.bldg-card .photo{ aspect-ratio:1/1; transition:transform .2s ease; }
.bldg-card.feature{ grid-column:1 / -1; }
.bldg-card.feature .photo{ aspect-ratio:16/10; }
.bldg-card .photo::after{ content:""; position:absolute; inset:0; z-index:2;
  background:linear-gradient(180deg, rgba(15,15,20,.05) 30%, rgba(15,15,20,.7) 100%); }
.bldg-overlay{ position:absolute; inset:0; z-index:3; padding:16px; display:flex; flex-direction:column; justify-content:space-between; color:#fff; }
.type-chip{ align-self:flex-start; font-size:11.5px; font-weight:700; background:rgba(255,255,255,.92); color:var(--ink);
  padding:4px 10px; border-radius:var(--r-pill); }
.type-chip.teal{ background:var(--teal); color:#fff; }
.bldg-text h3{ font-size:19px; font-weight:800; }
.bldg-card.feature .bldg-text h3{ font-size:30px; }
.bldg-meta{ font-size:12.5px; color:rgba(255,255,255,.82); }
.bldg-card:hover .photo{ transform:translateY(-3px); box-shadow:var(--sh-lift); }
/* Feature tile is a big square (desktop) / 16:10 (mobile). The featured photo must
   COVER it — fill the box and crop the overflow, never letterbox or stretch
   (client 6/17). That needs a source tall enough to cover the square without
   upscaling, so the featured building carries a portrait crop (Optima Signature,
   768x1152). */
.bldg-card.feature .photo-img{ object-fit:cover; z-index:1; }

/* ---------- expert help ---------- */
.expert-card{ background:linear-gradient(135deg,#FBEFD9,#F8E4C6); border-radius:var(--r-feat); overflow:hidden;
  display:flex; flex-direction:column; }
.expert-body{ padding:30px 24px; }
.expert-body h2{ font-size:clamp(25px,6.2vw,34px); font-weight:800; }
.expert-body p{ margin:14px 0 22px; color:#5c4a32; font-size:16px; }
.expert-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; }
.expert-list{ list-style:none; padding:0; margin:24px 0 0; display:grid; gap:10px; }
.expert-list li{ display:flex; align-items:center; gap:9px; font-weight:600; font-size:14.5px; color:#4a3c28; }
.expert-list svg{ color:var(--green-text); flex:none; }

/* ── Just-verified listing cards ── */
.jv-dot{ display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--green); margin-right:7px;
  box-shadow:0 0 0 0 rgba(16,185,129,.5); animation:pulse 1.8s infinite; vertical-align:middle; }
.lst-rail .lst-card{ flex:0 0 82%; max-width:320px; scroll-snap-align:start; }
.lst-card{ background:#fff; border:1px solid var(--line); border-radius:var(--r-card); overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease; }
.lst-card:hover{ transform:translateY(-3px); box-shadow:var(--sh-lift); }
.lst-photo{ position:relative; aspect-ratio:4/3; }
/* ≤640px serves the hm crop (390x211 — see App\Lib\Img::picture). The box takes
   the crop's own aspect so the image resizes 1:1 with the card width — no
   object-fit cover-zoom, which is what read as blur on phones. */
@media (max-width:640px){ .lst-photo{ aspect-ratio:390/211; } }
.lst-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
/* "Just verified" in-card photo carousel — same .dbz-cc contract as the map
   cards (map-cards.js); arrows fade in on card hover, always shown on touch. */
.dbz-cc{ position:absolute; inset:0; overflow:hidden; }
.dbz-cc img{ width:100%; height:100%; object-fit:cover; display:block; position:absolute; inset:0; }
.dbz-cc-arrow{ position:absolute; top:50%; transform:translateY(-50%); width:28px; height:28px; border:0;
  border-radius:50%; background:rgba(255,255,255,.92); color:var(--ink); cursor:pointer;
  display:flex; align-items:center; justify-content:center; opacity:0;
  transition:opacity .15s, background .12s; box-shadow:0 1px 3px rgba(0,0,0,.15), 0 2px 6px rgba(0,0,0,.12); z-index:2; }
.dbz-cc-l{ left:8px; }
.dbz-cc-r{ right:8px; }
.lst-card:hover .dbz-cc-arrow{ opacity:1; }
.dbz-cc-arrow:hover{ background:#fff; }
@media (hover:none){ .dbz-cc-arrow{ opacity:.9; } }
.dbz-cc-dots{ position:absolute; bottom:8px; left:50%; transform:translateX(-50%); display:flex; gap:5px; z-index:2; pointer-events:none; }
.dbz-cc-dots span{ width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.55);
  box-shadow:0 0 0 .5px rgba(0,0,0,.18); transition:background .15s; }
.dbz-cc-dots span.is-on{ background:#fff; box-shadow:0 0 0 .5px rgba(0,0,0,.18), 0 1px 2px rgba(0,0,0,.18); }
.lst-verified{ position:absolute; top:10px; left:10px; z-index:2; display:inline-flex; align-items:center; gap:5px;
  background:#fff; color:var(--green-text); font-size:11.5px; font-weight:700; padding:5px 9px; border-radius:var(--r-pill); box-shadow:var(--sh-rest); }
.lst-verified svg{ color:var(--green); }
.lst-type{ position:absolute; bottom:10px; left:10px; z-index:2; font-size:11px; font-weight:700; color:var(--ink);
  background:rgba(255,255,255,.92); padding:4px 9px; border-radius:var(--r-pill); }
.lst-type.teal{ background:var(--teal); color:#fff; }
.lst-body{ padding:14px 16px 16px; }
.lst-price{ font-size:21px; font-weight:800; letter-spacing:-.02em; color:var(--ink); }
.lst-price span{ font-size:13px; font-weight:600; color:var(--muted); }
.lst-specs{ font-size:13.5px; color:var(--ink-2); margin-top:3px; }
.lst-hood{ display:flex; align-items:center; gap:5px; font-size:13px; color:var(--muted); margin-top:9px; }
.lst-hood svg{ color:var(--purple-500); }

/* ── Email alert opt-in band ── */
.alert-card{ background:linear-gradient(135deg, var(--purple-700), var(--purple-500)); border-radius:var(--r-feat);
  padding:34px 26px; color:#fff; box-shadow:0 20px 50px rgba(75,48,192,.32); }
.alert-copy .kicker{ color:#fff; opacity:.85; }
.alert-copy h2{ font-size:clamp(25px,5.6vw,34px); font-weight:800; letter-spacing:-.025em; }
.alert-copy p{ margin-top:12px; color:rgba(255,255,255,.86); font-size:15.5px; max-width:54ch; }
.alert-form{ margin-top:22px; }
.alert-fields{ display:flex; flex-direction:column; gap:12px; }
.alert-field{ display:block; }
.alert-field > span{ display:block; font-size:12.5px; font-weight:700; color:rgba(255,255,255,.8); margin-bottom:7px; }
.alert-select{ position:relative; }
.alert-select select{ -webkit-appearance:none; appearance:none; width:100%; border:none; border-radius:11px;
  padding:14px 40px 14px 15px; font:inherit; font-weight:600; color:var(--ink); background:#fff; cursor:pointer; }
.alert-select svg{ position:absolute; right:14px; top:50%; transform:translateY(-50%); color:var(--muted); pointer-events:none; }
.alert-field input{ width:100%; border:none; border-radius:11px; padding:14px 15px; font:inherit; font-weight:600;
  color:var(--ink); background:#fff; outline:none; }
.alert-field input::placeholder{ color:var(--muted); font-weight:500; }
.alert-form .btn{ background:var(--ink); }
.alert-form .btn:hover{ background:#000; }
.alert-fine{ display:flex; align-items:center; gap:7px; margin-top:14px; font-size:12.5px; color:rgba(255,255,255,.78); }
.alert-fine svg{ color:#fff; flex:none; }
.alert-success{ text-align:center; padding:8px 0; }
.alert-success .xm-check{ background:rgba(255,255,255,.18); color:#fff; }
.alert-success h2{ font-size:clamp(24px,5.4vw,32px); font-weight:800; }
.alert-success p{ margin:12px auto 0; color:rgba(255,255,255,.88); max-width:48ch; }
.alert-success .btn{ margin-top:20px; background:#fff; color:var(--purple-700); }
/* Preview chrome (mobile/desktop) */
.preview-fab{ position:fixed; left:16px; bottom:16px; z-index:1300; display:flex; gap:2px; background:var(--ink);
  border-radius:999px; padding:4px; box-shadow:0 10px 30px rgba(0,0,0,.32); }
.preview-fab button{ border:none; background:none; color:rgba(255,255,255,.72); font:inherit; font-weight:600;
  font-size:13px; padding:8px 14px; border-radius:999px; cursor:pointer; display:inline-flex; align-items:center; gap:7px; transition:color .15s ease; }
.preview-fab button:hover:not(.on){ color:#fff; }
.preview-fab button.on{ background:#fff; color:var(--ink); }
.preview-stage{ position:fixed; inset:0; z-index:1200; background:radial-gradient(120% 90% at 50% 0%, #221b3a, #131019);
  display:grid; place-items:center; padding:28px 16px; animation:xm-fade .18s ease; }
.preview-phone{ position:relative; width:390px; max-width:94vw; height:min(844px,88vh); background:#0b0b10;
  border-radius:46px; padding:13px; box-shadow:0 40px 90px rgba(0,0,0,.55), inset 0 0 0 2px rgba(255,255,255,.06); }
.preview-notch{ position:absolute; top:20px; left:50%; transform:translateX(-50%); width:120px; height:26px;
  background:#0b0b10; border-radius:0 0 16px 16px; z-index:2; }
.preview-phone iframe{ width:100%; height:100%; border:none; border-radius:34px; background:#fff; display:block; }
/* How it works — inline expand */
.how-toggle{ background:none; border:none; cursor:pointer; font:inherit; font-weight:600; font-size:15px;
  color:var(--purple-700); display:inline-flex; align-items:center; gap:6px; padding:6px 4px; }
.how-toggle svg{ transition:transform .25s ease; }
.how-toggle.is-open svg{ transform:rotate(180deg); }
.how-panel{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s ease; }
.how-inner{ overflow:hidden; }
.how-steps{ list-style:none; margin:18px 0 0; padding:0; display:grid; gap:14px; }
.how-steps li{ display:flex; gap:13px; align-items:flex-start; }
.how-num{ flex:none; width:28px; height:28px; border-radius:50%; background:var(--purple-500); color:#fff;
  font-weight:700; font-size:14px; display:grid; place-items:center; }
.how-steps strong{ display:block; font-size:15.5px; color:var(--ink); }
.how-steps li > div span{ font-size:14px; color:#5c4a32; }
/* Talk-to-an-expert modal */
.xm-overlay{ position:fixed; inset:0; z-index:1000; background:rgba(15,15,20,.55); backdrop-filter:blur(3px);
  display:grid; place-items:center; padding:20px; animation:xm-fade .15s ease; }
@keyframes xm-fade{ from{ opacity:0; } to{ opacity:1; } }
.xm-modal{ position:relative; width:100%; max-width:430px; background:#fff; border-radius:20px; padding:30px;
  box-shadow:0 24px 60px rgba(15,15,20,.32); animation:dbz-pop-in .2s cubic-bezier(.32,.72,0,1); }
.xm-close{ position:absolute; top:14px; right:14px; width:34px; height:34px; border-radius:50%; border:none;
  background:var(--bg-soft); cursor:pointer; font-size:20px; line-height:1; color:var(--muted); }
.xm-close:hover{ background:var(--line); color:var(--ink); }
.xm-title{ font-size:24px; font-weight:800; letter-spacing:-.02em; margin:8px 0 8px; }
.xm-sub{ color:var(--ink-2); font-size:15px; line-height:1.5; margin-bottom:18px; }
.xm-field{ display:block; margin-bottom:12px; }
.xm-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.xm-field > span{ display:block; font-weight:700; font-size:13px; margin-bottom:7px; }
.xm-field input{ width:100%; border:1.5px solid var(--line); border-radius:11px; padding:13px 14px; font:inherit;
  font-weight:600; background:var(--bg-soft); outline:none; transition:border-color .15s ease, background .15s ease; }
.xm-field input:focus{ border-color:var(--purple-500); background:#fff; }
.xm-or{ display:flex; align-items:center; gap:10px; color:var(--muted); font-size:12.5px; margin:2px 0 12px; }
.xm-or::before, .xm-or::after{ content:""; flex:1; height:1px; background:var(--line); }
.btn.is-disabled{ opacity:.45; pointer-events:none; }
.xm-modal .btn.full{ margin-top:6px; }
.xm-fine{ font-size:11.5px; color:var(--muted); margin-top:12px; text-align:center; line-height:1.4; }
.xm-success{ text-align:center; padding:6px 0; }
.xm-check{ display:grid; place-items:center; width:62px; height:62px; border-radius:50%;
  background:rgba(16,185,129,.14); color:var(--green-text); margin:0 auto 16px; }
.xm-success .btn{ margin-top:20px; }
.expert-photo{ min-height:240px; }
.expert-photo .photo-img{ object-position:center top; }
.expert-badge{ position:absolute; bottom:14px; left:14px; z-index:3; display:inline-flex; align-items:center; gap:7px;
  background:#fff; color:var(--ink); font-weight:700; font-size:12.5px; padding:7px 12px; border-radius:var(--r-pill); box-shadow:var(--sh-rest); }

/* ---------- faq ---------- */
.faq-wrap{ max-width:820px; }
.faq-head{ text-align:center; margin-bottom:28px; }
.faq-head h2{ font-size:clamp(26px,7vw,40px); font-weight:800; }
.faq-list{ display:flex; flex-direction:column; gap:12px; }
.faq-item{ background:#fff; border:1px solid var(--line); border-radius:var(--r-card); transition:box-shadow .2s ease, border-color .2s ease; }
.faq-item.open{ box-shadow:var(--sh-rest); border-color:var(--purple-300); }
.faq-q{ width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px;
  background:none; border:none; cursor:pointer; font:inherit; font-weight:700; font-size:16.5px; color:var(--ink);
  text-align:left; padding:20px; }
.faq-ico{ flex:none; color:var(--purple-500); transition:transform .25s ease; }
.faq-item.open .faq-ico{ transform:rotate(180deg); }
.faq-a{ display:grid; transition:grid-template-rows .28s ease; }
.faq-a-inner{ overflow:hidden; }
.faq-a p{ padding:0 20px 20px; color:var(--ink-2); font-size:15.5px; }
.faq-cta{ display:flex; margin:28px auto 0; width:fit-content; }

/* ---------- blogs ---------- */
.blog-grid{ display:grid; gap:18px; }
.blog-card{ background:#fff; border:1px solid var(--line); border-radius:var(--r-card); overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease; }
.blog-card:hover{ transform:translateY(-3px); box-shadow:var(--sh-lift); }
.blog-photo{ aspect-ratio:16/10; border-radius:0; }
.blog-body{ padding:18px; }
.blog-cat{ font-size:13px; color:var(--muted); }
.blog-body h3{ font-size:18.5px; font-weight:700; margin:6px 0 14px; line-height:1.25; }
.blog-read{ display:inline-flex; align-items:center; gap:6px; font-weight:600; font-size:14px; color:var(--purple-600); }
.mobile-cta{ display:flex; width:fit-content; margin:26px auto 0; }

/* ---------- footer ---------- */
.site-footer{ background:var(--gray-900); color:#fff; padding:48px 0 26px; }
.footer-grid{ display:flex; flex-direction:column; gap:34px; }
.footer-brand{ max-width:360px; }
.footer-brand .wordmark{ color:#fff; }
.eho{ display:flex; align-items:center; gap:10px; font-size:11px; font-weight:700; letter-spacing:.04em;
  text-transform:uppercase; line-height:1.1; color:rgba(255,255,255,.86); margin-bottom:18px; }
.eho-mark{ width:38px; height:38px; border:2px solid rgba(255,255,255,.86); border-radius:7px; display:grid; place-items:center; flex:none; }
.footer-brand p{ margin:14px 0 18px; color:rgba(255,255,255,.6); font-size:14.5px; }
.footer-cols{ display:grid; grid-template-columns:1fr 1fr; gap:28px 20px; }
.fcol h4{ font-size:13px; letter-spacing:.04em; text-transform:uppercase; color:rgba(255,255,255,.5); margin-bottom:14px; font-weight:700; }
.fcol a{ display:block; padding:6px 0; color:rgba(255,255,255,.82); font-size:14.5px; }
.fcol a:hover{ color:#fff; }
.footer-bar{ display:flex; flex-direction:column; gap:14px; margin-top:34px; padding-top:22px;
  border-top:1px solid rgba(255,255,255,.12); color:rgba(255,255,255,.5); font-size:13px; }
.footer-social{ display:flex; gap:10px; }
.footer-social a{ width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.08); display:grid; place-items:center;
  color:rgba(255,255,255,.8); font-weight:700; font-size:14px; }
.footer-social a:hover{ background:var(--purple-500); color:#fff; }

/* ---------- responsive ---------- */
@media(min-width:560px){
  .trust-items{ grid-template-columns:repeat(3,1fr); }
  .blog-grid{ grid-template-columns:1fr 1fr; }
  .hood-card{ flex-basis:48%; }
}
@media(min-width:768px){
  .header-toggle{ display:block; }
  .header-nav{ display:flex; }
  .header-burger{ display:none; }
  .trust-row{ flex-direction:row; align-items:center; gap:28px; }
  .trust-label{ flex:none; }
  .trust-items{ flex:1; }
  .section-head{ flex-direction:row; align-items:flex-end; justify-content:space-between; }
  .head-actions{ justify-content:flex-end; }
  .desktop-only{ display:inline-flex; }
  .mobile-cta{ display:none; }
  .value-grid{ grid-template-columns:1.3fr 1fr; align-items:stretch; }
  .value-card.big{ flex-direction:row; align-items:stretch; }
  .vc-body{ flex:1; display:flex; flex-direction:column; justify-content:center; padding:34px; }
  .vc-photo{ flex:0 0 42%; min-height:auto; }
  .blog-grid{ grid-template-columns:repeat(3,1fr); }
  .lst-rail .lst-card{ flex-basis:46%; }
  .alert-card{ padding:46px; display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; }
  .alert-form{ margin-top:0; }
  .alert-fields{ flex-direction:row; flex-wrap:wrap; align-items:flex-end; }
  .alert-fields .alert-field:nth-child(1){ flex:1 1 46%; }
  .alert-fields .alert-field:nth-child(2){ flex:1 1 46%; }
  .alert-form .btn{ flex:1 1 100%; }
  .bento{ grid-template-columns:repeat(3,1fr); grid-auto-rows:1fr; }
  .bldg-card.feature{ grid-column:span 2; grid-row:span 2; }
  .bldg-card.feature .photo{ aspect-ratio:auto; height:100%; }
  .expert-card{ flex-direction:row; align-items:stretch; }
  .expert-body{ flex:1; padding:44px; display:flex; flex-direction:column; justify-content:center; }
  .expert-photo{ flex:0 0 42%; min-height:auto; }
  .footer-grid{ flex-direction:row; justify-content:space-between; }
  .footer-cols{ grid-template-columns:repeat(3,auto); gap:60px; }
  .footer-bar{ flex-direction:row; align-items:center; justify-content:space-between; }
}
@media(min-width:960px){
  .hero{ padding:60px 0 260px; }
  .hero-grid{ flex-direction:row; align-items:flex-start; gap:48px; }
  .hero-copy{ flex:1.05; padding-top:14px; }
  .search-card{ flex:0 0 400px; }
  .hero-title{ font-size:clamp(54px,5.2vw,66px); }
}
@media(min-width:1040px){
  .lst-rail .lst-card{ flex-basis:300px; }
}
/* ===== Mobile-only layer (phones ≤767px) — desktop is untouched ===== */
/* Back-to-top button (rendered only on mobile via JS) */
.back-top{ position:fixed; right:14px; bottom:16px; z-index:1150; width:46px; height:46px; border-radius:50%;
  border:1px solid var(--line); background:#fff; color:var(--ink); display:grid; place-items:center; cursor:pointer;
  box-shadow:0 10px 28px rgba(15,15,20,.22); opacity:0; transform:translateY(10px); pointer-events:none;
  transition:opacity .2s ease, transform .2s ease; }
.back-top.show{ opacity:1; transform:none; pointer-events:auto; }
.back-top:hover{ border-color:var(--ink); }
@media (max-width:767px){
  .preview-fab{ display:none; }
  /* full team visible on mobile (match image ratio, no side crop) */
  .expert-photo{ aspect-ratio:16/9; min-height:0; }

  /* compact hero — bring the search CTA toward the fold */
  .hero{ padding:20px 0 180px; }
  .hero-grid{ gap:16px; }
  .hero-title{ font-size:clamp(31px,8.4vw,40px); }
  .hero-sub{ margin-top:12px; }
  .eyebrow{ font-size:11px; letter-spacing:.08em; margin-bottom:10px; }
  .hero-sub{ margin-top:14px; }
  .hero-proof{ gap:7px 14px; margin-top:18px; }
  .search-card{ padding:18px; gap:14px; border-radius:18px; }
  /* progressive search on mobile: smoothly expand beds/price behind an expander */
  .card-filters{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s ease; }
  .card-filters.open{ grid-template-rows:1fr; }
  .card-filters-inner{ overflow:hidden; gap:14px; }
  .card-morefilters{ display:flex; align-items:center; justify-content:space-between; width:100%;
    background:var(--gray-50); border:1px solid var(--gray-100); border-radius:11px; padding:13px 15px;
    font:inherit; font-weight:700; font-size:14px; color:var(--ink); cursor:pointer; }
  .card-morefilters svg{ color:var(--muted); transition:transform .2s ease; }
  .card-morefilters.is-open svg{ transform:rotate(180deg); }
  /* stack Bedrooms / Bathrooms on the buy card so pills breathe */
  .field-2{ grid-template-columns:1fr; gap:16px; }

  /* touch-friendly price slider */
  .range{ height:36px; }
  .range-track, .range-fill{ top:16px; }
  .range input[type=range]::-webkit-slider-thumb{ width:30px; height:30px; }
  .range input[type=range]::-moz-range-thumb{ width:30px; height:30px; }

  /* swipeable comparison cards */
  .cmp-grid{ grid-auto-flow:column; grid-template-columns:none; grid-auto-columns:80%; overflow-x:auto;
    scroll-snap-type:x mandatory; gap:12px; margin:34px -20px 16px; padding:0 20px 8px; scrollbar-width:none; }
  .cmp-grid::-webkit-scrollbar{ display:none; }
  .cmp-card{ scroll-snap-align:start; }

  /* tighten the purple answer card on mobile */
  .cmp-answer{ padding:24px 22px; border-radius:18px; }
  .cmp-answer h3{ font-size:20px; margin:8px 0 11px; }
  .cmp-answer p{ font-size:14.5px; line-height:1.55; }
  .cmp-answer .cmp-cov{ gap:8px; margin-top:16px; }
  .cmp-answer .cov-pill{ font-size:12px; padding:6px 13px; }
  .ans-cta{ width:100%; justify-content:center; margin-top:18px; padding:14px 20px; }

  /* one-up building tiles */
  .bento{ grid-template-columns:1fr; }
  .bldg-card .photo{ aspect-ratio:16/10; }

  /* full-width stat tiles so they breathe (fixes condensed badge) */
  .stmt-stats{ display:none; }

  /* tame oversized section text on mobile */
  .stmt-head h2{ font-size:clamp(25px,6.6vw,32px); }
  .value-statement{ padding:54px 0; }
  .stmt-head .kicker{ font-size:11px; letter-spacing:.08em; margin-bottom:14px; }
  .stmt-head .stmt-sub{ font-size:14px; }
  .expert-body p{ font-size:14.5px; line-height:1.55; }

  /* a little more breathing room */
  .section{ padding:46px 0; }
}
