/* S156: Our Listings. Only listings.html and listings/*.html load this file.
   Generated pages: tools/site/build_listings.py. Longhand padding only (the
   `padding` shorthand on anything holding a .wrap zeroes the gutter). */

.lst-top{padding-top:var(--navclear);padding-bottom:0}
.lst-top .crumb{color:var(--ink-45)}
.lst-top .crumb a{color:var(--ink-70)}
.lst-top .eyebrow{color:var(--sand-ink);display:block;margin-bottom:12px}
.lst-top h1{font-size:clamp(2.3rem,4.6vw,3.9rem);line-height:1.02}
.lst-city{font-size:1.08rem;color:var(--ink-70);margin-top:8px}
.lst-lede{max-width:62ch;font-size:1.12rem;color:var(--ink-70);margin-top:16px;padding-bottom:clamp(26px,3vw,40px)}
.lst-status{color:var(--teal)}

.lst-head{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap;margin-bottom:24px}
.lst-price{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.lst-price>b{font-family:"Fraunces",Georgia,serif;font-weight:400;font-size:clamp(2rem,3.6vw,2.9rem);line-height:1;color:var(--ink)}
.lst-price>span{font-size:14px;color:var(--ink-45)}
.lst-price>span a{color:var(--teal);border-bottom:1px solid currentColor}
.lst-price>.lst-oh,.lst-oh{color:#F2ECE1;font-size:12.5px}
.lst-oh{display:inline-block;background:var(--teal);color:#F2ECE1;font-size:12.5px;font-weight:600;letter-spacing:.06em;padding-top:7px;padding-bottom:7px;padding-left:12px;padding-right:12px;border-radius:10px;margin-top:4px}

/* mosaic: one big, four small */
.lst-mosaic{position:relative;display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:repeat(2,minmax(0,1fr));gap:8px;aspect-ratio:2.35/1;border-radius:16px;overflow:hidden}
.lst-tile{display:block;border:0;background:var(--paper-2);cursor:zoom-in;overflow:hidden;min-height:0}
.lst-tile.t0{grid-row:1/3}
.lst-tile picture,.lst-tile img{display:block;width:100%;height:100%}
.lst-tile img{object-fit:cover;transition:transform 1.2s var(--ease)}
.lst-tile:hover img{transform:scale(1.035)}
.lst-all{position:absolute;right:16px;bottom:16px;border:0;cursor:pointer;background:rgba(250,246,238,.94);color:var(--ink);font-family:"Satoshi";font-weight:600;font-size:14px;padding-top:11px;padding-bottom:11px;padding-left:18px;padding-right:18px;border-radius:12px;box-shadow:0 8px 30px rgba(12,20,20,.18)}
.lst-all:hover{background:#fff}

.lst-facts{display:flex;flex-wrap:wrap;gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:22px}
.lst-facts>div{flex:1 1 0;min-width:110px;padding-top:16px;padding-bottom:16px;padding-left:4px;padding-right:12px}
.lst-facts>div+div{border-left:1px solid var(--line-soft);padding-left:18px}
.lst-facts b{display:block;font-family:"Fraunces",Georgia,serif;font-weight:400;font-size:1.7rem;line-height:1.1}
.lst-facts span{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-45);font-weight:600}
.lst-facts.sm{margin-top:14px;margin-bottom:14px}
.lst-facts.sm>div{min-width:70px;padding-top:10px;padding-bottom:10px}
.lst-facts.sm b{font-size:1.25rem}
.lst-facts.sm span{font-size:10.5px}

/* body */
.lst-body{padding-top:clamp(36px,4.4vw,60px);padding-bottom:clamp(42px,5.4vw,72px);display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:clamp(30px,5vw,70px);align-items:start}
.lst-main{min-width:0}
.lst-h{font-size:clamp(1.8rem,3vw,2.5rem);margin-bottom:18px;line-height:1.08}
.lst-h em{font-style:italic;color:var(--teal)}
.lst-h2{font-size:clamp(1.45rem,2.2vw,1.9rem);margin-top:clamp(36px,4vw,54px);margin-bottom:16px;scroll-margin-top:100px}
.lst-about p{text-align:left}
.lst-hl{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px 26px}
.lst-hl li{position:relative;padding-left:22px;color:var(--ink-70)}
.lst-hl li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--sand)}
.lst-details{display:grid;gap:26px}
.lst-dgroup h3{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--sand-ink);font-weight:600;margin-bottom:6px}
.lst-dgroup dl>div{display:grid;grid-template-columns:190px minmax(0,1fr);gap:16px;border-bottom:1px solid var(--line-soft);padding-top:10px;padding-bottom:10px;font-size:15px}
.lst-dgroup dt{color:var(--ink-45)}
.lst-dgroup dd{color:var(--ink)}
.lst-note{font-size:14px;color:var(--ink-45);margin-top:14px}

/* payment calculator */
.lst-calc{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);background:var(--card);border-radius:14px;overflow:hidden}
.lst-calc-in{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding-top:22px;padding-bottom:22px;padding-left:22px;padding-right:22px}
.lst-calc-in .field{margin:0}
.lst-calc-out{background:var(--teal-deep);color:#F2ECE1;padding-top:24px;padding-bottom:24px;padding-left:26px;padding-right:26px;display:flex;flex-direction:column;justify-content:center;gap:4px}
.lst-calc-out>span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:600}
.lst-calc-out>b{font-family:"Fraunces",Georgia,serif;font-weight:400;font-size:2.6rem;line-height:1.1}
.lst-calc-out small{font-size:13.5px;color:rgba(242,236,225,.72)}
.lst-calc-out p{font-size:13px;line-height:1.55;color:rgba(242,236,225,.68);margin-top:12px}

/* side card */
.lst-side{position:sticky;top:96px}
.lst-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding-top:24px;padding-bottom:24px;padding-left:24px;padding-right:24px;box-shadow:0 24px 60px rgba(12,20,20,.07)}
.lst-card h2{font-size:1.55rem;margin-top:18px;margin-bottom:6px}
.lst-card>p{font-size:14.5px;color:var(--ink-70);margin-bottom:14px}
.lst-card .field{margin-bottom:12px}
.lst-card .field input,.lst-card .field select,.lst-card .field textarea{padding-top:11px;padding-bottom:11px;font-size:15px}
.lst-card .btn{width:100%;justify-content:center}
.lst-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lst-agent{display:flex;gap:14px;align-items:center;padding-bottom:18px;border-bottom:1px solid var(--line-soft)}
.lst-agent img{width:64px;height:64px;border-radius:50%;object-fit:cover;object-position:50% 8%;flex:none}
.lst-agent b{display:block;font-weight:600}
.lst-agent span{display:block;font-size:13.5px;color:var(--ink-45)}
.lst-agent a{display:block;font-size:14.5px;color:var(--teal);font-weight:600;margin-top:2px}
.lst-fine{font-size:12px;line-height:1.55;color:var(--ink-45);margin-top:10px}
.lst-fine a{border-bottom:1px solid currentColor}
.lst-call{margin-top:12px}

/* all photos */
.lst-photos{background:var(--paper-2)}
.lst-photos .lst-h2{margin-top:0}
.lst-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.lst-grid button{border:0;background:var(--paper);cursor:zoom-in;aspect-ratio:3/2;overflow:hidden;border-radius:8px;padding:0}
.lst-grid img,.lst-grid picture{display:block;width:100%;height:100%}
.lst-grid img{object-fit:cover;transition:transform 1s var(--ease)}
.lst-grid button:hover img{transform:scale(1.04)}

/* lightbox */
.lst-lb{position:fixed;inset:0;z-index:100;background:rgba(8,14,14,.95);display:flex;align-items:center;justify-content:center}
.lst-lb[hidden]{display:none}
.lst-lb figure{max-width:min(92vw,1600px);max-height:88vh;display:flex;flex-direction:column;align-items:center;gap:12px}
.lst-lb img{max-width:100%;max-height:80vh;object-fit:contain}
.lst-lb figcaption{color:rgba(242,236,225,.78);font-size:14px;text-align:center}
.lst-lb button{position:absolute;border:0;background:rgba(242,236,225,.12);color:#F2ECE1;cursor:pointer;border-radius:50%;width:52px;height:52px;font-size:30px;line-height:1;display:flex;align-items:center;justify-content:center}
.lst-lb button:hover{background:rgba(242,236,225,.24)}
.lb-x{top:18px;right:18px}
.lb-p{left:18px;top:50%;transform:translateY(-50%)}
.lb-n{right:18px;top:50%;transform:translateY(-50%)}
body.lb-open{overflow:hidden}

/* hub cards */
.lst-cards{display:grid;gap:28px}
.lst-cardlink{display:grid;grid-template-columns:1.25fr 1fr;background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:box-shadow .5s var(--ease),transform .5s var(--ease)}
.lst-cardlink:hover{box-shadow:0 30px 70px rgba(12,20,20,.12);transform:translateY(-3px)}
.lst-cardlink .im{position:relative;min-height:320px}
.lst-cardlink .im picture,.lst-cardlink .im img{position:absolute;inset:0;width:100%;height:100%}
.lst-cardlink .im img{object-fit:cover}
.lst-flag{position:absolute;left:16px;top:16px;background:var(--teal);color:#F2ECE1;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding-top:7px;padding-bottom:7px;padding-left:12px;padding-right:12px;border-radius:10px}
.lst-cardlink .tx{padding-top:clamp(22px,3vw,36px);padding-bottom:clamp(22px,3vw,36px);padding-left:clamp(22px,3vw,36px);padding-right:clamp(22px,3vw,36px);display:flex;flex-direction:column;align-items:flex-start}
.lst-cprice{font-family:"Fraunces",Georgia,serif;font-weight:400;font-size:2.2rem;line-height:1}
.lst-cardlink h2{font-size:1.6rem;margin-top:12px}
.lst-cardlink .tx>p{color:var(--ink-70);font-size:15px}
.lst-cardlink .lst-facts{align-self:stretch}
.lst-go{margin-top:auto;padding-top:18px;color:var(--teal);font-weight:600}
.lst-more{display:flex;justify-content:space-between;align-items:center;gap:26px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:30px;padding-bottom:30px}
.lst-more h2{font-size:1.6rem;margin-bottom:6px}
.lst-more p{color:var(--ink-70);max-width:56ch}
.lst-morebtns{display:flex;gap:12px;flex-wrap:wrap}

@media(max-width:1000px){
  .lst-body{grid-template-columns:1fr}
  .lst-side{position:static}
  .lst-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lst-calc{grid-template-columns:1fr}
}
@media(max-width:820px){
  .lst-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:auto;aspect-ratio:auto}
  .lst-tile.t0{grid-column:1/3;grid-row:auto;aspect-ratio:3/2}
  .lst-tile.t1,.lst-tile.t2{aspect-ratio:3/2}
  .lst-tile.t3,.lst-tile.t4{display:none}
  .lst-price{text-align:left;align-items:flex-start}
  .lst-cardlink{grid-template-columns:1fr}
  .lst-cardlink .im{min-height:0;aspect-ratio:3/2}
}
@media(max-width:640px){
  .lst-facts>div{flex:1 1 30%;min-width:0}
  .lst-facts>div:nth-child(4){border-left:0;padding-left:4px}
  .lst-hl{grid-template-columns:1fr}
  .lst-dgroup dl>div{grid-template-columns:130px minmax(0,1fr)}
  .lst-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lst-calc-in{grid-template-columns:1fr 1fr}
  .lst-lb .lb-p,.lst-lb .lb-n{top:auto;bottom:18px;transform:none}
  .lst-mosaic{border-radius:12px}
}
.lst-cards{padding-bottom:clamp(30px,4vw,48px)}

/* S160: "Pending in N days" banner on a listing page (build_listings.py won_banner) */
.lst-won{display:flex;align-items:center;justify-content:space-between;gap:32px;background:var(--teal-deep);color:var(--paper);border-radius:18px;padding-top:30px;padding-bottom:30px;padding-left:34px;padding-right:34px;margin-bottom:22px;position:relative;overflow:hidden}
.lst-won::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 120% at 88% 50%,rgba(231,182,114,.28),transparent 65%)}
.lst-won-tx{position:relative;z-index:1;max-width:60ch}
.lst-won-k{display:inline-block;background:var(--gold);color:var(--teal-deep);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;padding-top:6px;padding-bottom:6px;padding-left:12px;padding-right:12px;border-radius:10px;margin-bottom:14px}
.lst-won-h{font-family:"Fraunces",Georgia,serif;font-weight:400;font-size:clamp(2rem,4.2vw,3.4rem);line-height:1.02;letter-spacing:-.02em;margin:0 0 12px}
.lst-won-h em{color:var(--gold)}
.lst-won-p{font-size:16px;line-height:1.55;color:rgba(242,236,225,.82);margin:0 0 18px}
.lst-won-n{position:relative;z-index:1;flex:0 0 auto;text-align:center;display:flex;flex-direction:column;align-items:center}
.lst-won-n b{font-family:"Fraunces",Georgia,serif;font-weight:300;font-size:clamp(6rem,12vw,10rem);line-height:.85;color:var(--gold)}
.lst-won-n span{font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(242,236,225,.75);margin-top:8px}
.lst-won .btn-fill{background:var(--gold);border-color:var(--gold);color:var(--teal-deep)}
.lst-won .btn-fill:hover{background:var(--paper);border-color:var(--paper)}
.lst-flag.won{background:var(--gold);color:var(--teal-deep)}
@media(max-width:640px){
.lst-won{padding-top:24px;padding-bottom:24px;padding-left:22px;padding-right:22px}
.lst-won-n{display:none}
}
