/* _excard.css - the explore page's listing card, on the listing page's
   Places to stay nearby. Lifted from _explore.css by
   scratchpad/design-2026/build-excard.py - do not edit by hand.
   The settings are the explore page's, scoped to the card's own grid so
   nothing else on the listing changes; the listing sets its own columns. */
.ex-face{--ex-cols:5;--ex-gap:23px;--ex-row:56px;--ex-shape:3/4;--ex-corner:0px;--ex-say:16px;--ex-drop:12px}
@media(max-width:1400px){.ex-face{--ex-cols:4}}
@media(max-width:1000px){.ex-face{--ex-cols:3;--ex-gap:20px}}
@media(max-width:680px){.ex-face{--ex-cols:2}}
.ex-p{display:block;position:relative;overflow:hidden;background:var(--stone);aspect-ratio:var(--ex-shape);
    border-radius:var(--ex-corner)}
.ex-p img,.ex-p video{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease),opacity .8s var(--ease);opacity:0}
.ex-p img.up,.ex-p video.up{opacity:1}
.ex-c:hover .ex-p img,.ex-c:hover .ex-p video{transform:scale(1.04)}
.ex-save{position:absolute;z-index:3;border:0;cursor:pointer;
    opacity:0;transform:translateY(-4px);transition:opacity .25s var(--ease),transform .25s var(--ease),
    background .22s,color .22s,border-color .22s}
.ex-c:hover .ex-save,.ex-save.on{opacity:1;transform:none}
.ex-save svg{display:block}
.ex-save .w{font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;line-height:1}
[data-s="s1"] .ex-save{right:10px;top:10px;display:inline-flex;align-items:center;justify-content:center;
    min-height:34px;padding:0 15px;border:1px solid var(--forest);color:var(--paper);background:var(--forest)}
[data-s="s1"] .ex-save:hover{background:var(--moss);border-color:var(--moss)}
[data-s="s1"] .ex-save.on{background:var(--paper);border-color:var(--paper);color:var(--forest)}
[data-s="s1"] .ex-save svg{display:none}
.ex-p::after{content:"";position:absolute;inset:0;z-index:1;background:rgba(65,64,66,0);transition:background .35s var(--ease);pointer-events:none}
.ex-c:hover .ex-p::after{background:rgba(65,64,66,.10)}
.ex-c{display:block}
.ex-t{display:block;margin-top:var(--ex-drop)}
.ex-t b,.ex-t i,.ex-t em,.ex-t u{display:block;font-family:var(--sans);font-size:var(--ex-say);line-height:1.4;
    letter-spacing:-.02em;font-style:normal;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ex-t b{font-weight:500;color:var(--ink)}
.ex-t i,.ex-t em,.ex-t u{font-weight:400;color:var(--ink-55)}
.ex-t .eye{display:block;font:500 9.5px var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--ink-35);margin-bottom:5px}
.ex-face .ex-t b{font-family:var(--face);font-weight:400;font-size:calc(var(--ex-say) + 3px);letter-spacing:-.005em}
.ex-grid{display:grid;grid-template-columns:repeat(var(--ex-cols),minmax(0,1fr));gap:var(--ex-row) var(--ex-gap)}
.ex-c{opacity:0;transform:translateY(10px);animation:ex-rise .6s var(--ease) forwards}
@keyframes ex-rise{to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
  .ex-c{animation:none;opacity:1;transform:none}
}
@media(prefers-reduced-motion:reduce){
  .ex-p img,.ex-p video{transition:none}
  .ex-c:hover .ex-p img,.ex-c:hover .ex-p video{transform:none}
}
