/* lp-sections.css: shared landing-page sections (10/3/26)
   .lpp-*  proof band: +35% average lift + occupancy-by-market bars (goes first, under the hero)
   .lpr-*  client results: photo cards with revenue / occupancy / nightly rate
   .lpm-*  mechanism: "Airbnb is a search engine" three-step + platforms + priced-by-demand strip
   .lpf-*  who it's for: property managers vs hosts
   Relies on the page tokens (--accent, --g*, --heading, --body) every LP already defines. */

:root{--lp-mono:'DM Mono',ui-monospace,'SF Mono',Menlo,monospace}

.lp-eyebrow{font-size:12px;font-weight:500;color:var(--g500);margin-bottom:14px;letter-spacing:.01em}
.lp-h2{font-family:var(--heading);font-weight:400;font-size:clamp(30px,4vw,42px);line-height:1.14;letter-spacing:-.02em;color:var(--black);max-width:620px}
.lp-h2 em{font-style:italic;color:var(--accent)}
.lp-lead{margin-top:18px;font-size:16px;line-height:1.65;color:var(--g600);max-width:600px}

/* ───────── Proof band ───────── */
.lpp{background:var(--g50);border-top:1px solid var(--g200);border-bottom:1px solid var(--g200);padding:clamp(48px,6vw,72px) 0}
.lpp-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(36px,6vw,72px);align-items:start}
.lpp-fig{font-size:clamp(60px,7.4vw,84px);font-weight:500;line-height:1;letter-spacing:-.045em;color:var(--black);margin:6px 0 12px}
.lpp-figlbl{font-size:16px;font-weight:500;color:var(--black);margin-bottom:18px}
.lpp-copy p{font-size:15.5px;line-height:1.65;color:var(--g600);max-width:440px}
.lpp-copy p+p{margin-top:14px}
.lpp-rule{height:1px;background:var(--g200);margin:28px 0 24px;max-width:440px}
.lpp-hosts{font-family:var(--heading);font-size:26px;font-weight:400;letter-spacing:-.015em;color:var(--black);line-height:1.2}
.lpp-hosts+p{margin-top:6px !important}
.lpp-cap{font-size:12.5px;color:var(--g500);margin-bottom:18px}
.lpp-mkt{display:grid;grid-template-columns:150px minmax(0,1fr);gap:6px 18px;padding:12px 0}
.lpp-mkt+.lpp-mkt{border-top:1px solid var(--g200)}
.lpp-name{font-size:15px;font-weight:500;color:var(--black);line-height:1.3}
.lpp-city{font-size:13px;color:var(--g500);margin-top:2px}
.lpp-bars{display:flex;flex-direction:column;gap:9px;justify-content:center}
.lpp-row{display:grid;grid-template-columns:82px minmax(0,1fr) 40px;align-items:center;gap:12px}
.lpp-who{font-size:12px;color:var(--g500)}
.lpp-track{height:10px;border-radius:2px;background:transparent;position:relative}
.lpp-fill{position:absolute;inset:0 auto 0 0;border-radius:2px;background:var(--accent)}
.lpp-row.mkt .lpp-fill{background:var(--g300)}
.lpp-pct{font-family:var(--lp-mono);font-size:12.5px;font-weight:500;color:var(--black);text-align:right}
.lpp-row.mkt .lpp-pct{color:var(--g500)}
.lpp-src{margin-top:18px;font-size:12px;line-height:1.6;color:var(--g500);max-width:520px}

/* ───────── Client results ───────── */
.lpr{padding:clamp(56px,7vw,88px) 0}
.lpr-carousel{position:relative;width:100%;overflow-x:auto;overflow-y:hidden;margin-top:40px;padding:2px 0;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.lpr-carousel::-webkit-scrollbar{display:none}
.lpr-track{display:flex;align-items:stretch;width:max-content}
.lpr-card{width:340px;flex-shrink:0;margin-right:20px;border:1px solid var(--g200);border-radius:12px;overflow:hidden;background:#fff;display:flex;flex-direction:column}
.lpr-photo{aspect-ratio:4/3;background:var(--g100);overflow:hidden}
.lpr-photo img{width:100%;height:100%;object-fit:cover}
.lpr-body{padding:18px 18px 20px;display:flex;flex-direction:column;flex:1}
.lpr-pill{align-self:flex-start;font-size:11.5px;color:var(--g600);border:1px solid var(--g200);border-radius:100px;padding:4px 11px;margin-bottom:12px;background:#fff}
.lpr-name{font-family:var(--heading);font-size:21px;font-weight:400;letter-spacing:-.015em;line-height:1.2;color:var(--black)}
.lpr-meta{font-size:13px;color:var(--g500);margin-top:4px}
.lpr-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0 14px}
.lpr-lbl{font-size:11.5px;color:var(--g500);margin-bottom:5px}
.lpr-val{font-family:var(--lp-mono);font-size:19px;font-weight:500;color:var(--black);letter-spacing:-.01em;line-height:1.15}
.lpr-delta{font-size:11px;line-height:1.4;color:var(--g500);margin-top:5px}
.lpr-delta.up{color:var(--accent)}
.lpr-foot{margin-top:auto;font-size:12px;line-height:1.55;color:var(--g500)}
.lpr-src{margin-top:22px;font-size:12px;color:var(--g500)}

/* ───────── Mechanism ───────── */
.lpm{padding:clamp(56px,7vw,88px) 0}
.lpm-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:44px}
.lpm-col{border-top:2px solid var(--accent);padding-top:18px}
.lpm-n{font-size:12px;color:var(--accent);margin-bottom:6px}
.lpm-col h3{font-family:var(--heading);font-size:23px;font-weight:400;letter-spacing:-.015em;color:var(--black);margin-bottom:10px}
.lpm-col>p{font-size:15.5px;line-height:1.6;color:var(--g600)}
.lpm-col ul{margin:16px 0 0 16px;display:flex;flex-direction:column;gap:6px}
.lpm-col li{font-size:13px;line-height:1.5;color:var(--g600)}
.lpm-plat{margin-top:44px;border-top:1px solid var(--g200);border-bottom:1px solid var(--g200);padding:16px 0;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.lpm-plat p{font-size:13px;color:var(--g500)}
.lpm-logos{display:flex;align-items:center;gap:26px}
.lpm-logos img{height:22px;width:auto}
.lpm-logos img.bk{height:17px}
.lpm-demand{margin-top:36px;background:var(--g100);border-radius:12px;padding:clamp(22px,3vw,28px);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:center}
.lpm-demand h3{font-family:var(--heading);font-size:20px;font-weight:400;color:var(--black);margin-bottom:8px}
.lpm-demand p{font-size:15px;line-height:1.6;color:var(--g600);max-width:400px}
.lpm-days{display:grid;grid-template-columns:repeat(5,68px);gap:8px}
.lpm-day{background:#fff;border:1px solid var(--g200);border-radius:8px;text-align:center;padding:12px 4px}
.lpm-dow{font-size:11px;color:var(--g500)}
.lpm-rate{font-size:17px;font-weight:500;color:var(--black);margin:4px 0 2px}
.lpm-rank{font-family:var(--lp-mono);font-size:10.5px;color:var(--accent)}
.lpm-rank.sell{color:var(--terra)}

/* ───────── Who it's for ───────── */
.lpf{padding:clamp(56px,7vw,88px) 0}
.lpf-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:40px}
.lpf-card{border:1px solid var(--g200);border-radius:12px;padding:clamp(22px,3vw,30px);background:#fff}
.lpf-card h3{font-family:var(--heading);font-size:22px;font-weight:400;color:var(--black)}
.lpf-sub{font-size:13px;line-height:1.5;color:var(--g500);margin-top:4px}
.lpf-list{list-style:none;margin-top:22px;display:flex;flex-direction:column;gap:16px}
.lpf-list li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px}
.lpf-list svg{margin-top:4px;color:var(--accent)}
.lpf-list b{display:block;font-weight:500;font-size:15.5px;color:var(--black);line-height:1.4}
.lpf-list span{display:block;font-size:13.5px;line-height:1.6;color:var(--g600);margin-top:3px}

@media (max-width:960px){
  .lpp-grid{grid-template-columns:1fr}
  .lpm-demand{grid-template-columns:1fr}
}
@media (max-width:720px){
  .lpm-cols,.lpf-grid{grid-template-columns:1fr}
  .lpr-carousel{margin-top:28px;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
  .lpr-card{width:300px;margin-right:14px}
  .lpr-body{padding:16px 16px 18px}
  .lpr-name{font-size:20px}
  .lpr-stats{gap:8px;margin:16px 0 12px}
  .lpr-val{font-size:17px}
  .lpr-lbl,.lpr-pill{font-size:12px}
  .lpr-delta{font-size:12px}
  .lpm-dow,.lpm-rank{font-size:12px}
  .lpr-photo{aspect-ratio:16/10}
  /* proof band: compact so the giveaway is not three screens down */
  .lpp-fig{font-size:64px;margin:4px 0 8px}
  .lpp-figlbl{margin-bottom:12px}
  .lpp-copy p{font-size:15px}
  .lpp-rule{margin:22px 0 18px}
  .lpp-hosts{font-size:23px}
  .lpp-cap{margin-bottom:8px}
  .lpp-mkt{gap:6px;padding:10px 0}
  .lpp-mkt>div:first-child{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
  .lpp-name{font-size:14.5px}
  .lpp-city{font-size:12.5px;margin-top:0}
  .lpp-bars{gap:6px}
  .lpp-track{height:8px}
  .lpp-src{margin-top:12px;font-size:12px}
  /* mechanism + audience: tighter type on phones */
  .lpm-cols{margin-top:32px}
  .lpm-col h3{font-size:21px;margin-bottom:8px}
  .lpm-col>p{font-size:15px}
  .lpm-col ul{margin-top:12px}
  .lpm-plat{margin-top:32px;flex-direction:column;align-items:flex-start;gap:12px}
  .lpm-demand{margin-top:24px;gap:18px}
  .lpm-demand p{font-size:14.5px}
  .lpf-grid{margin-top:28px;gap:14px}
  .lpf-list{gap:14px;margin-top:18px}
  .lpf-list b{font-size:15px}
  .lpf-list span{font-size:13.5px}
  .lp-lead{font-size:15.5px;margin-top:14px}
  .lpm-cols{gap:32px}
  .lpp-mkt{grid-template-columns:1fr;gap:8px}
  .lpp-row{grid-template-columns:74px minmax(0,1fr) 38px}
  .lpm-days{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
  .lpm-rate{font-size:15px}
  .lpm-logos{gap:20px}
}
@media (prefers-reduced-motion:reduce){
  .lpr-carousel{mask-image:none;-webkit-mask-image:none}
  .lpr-track{padding:0 20px}
  .lpr-card[data-clone]{display:none}
}