/* Homepage: photo hero with search, then rows of real homes. Loaded after site.css and app.css. */
.home-hero{position:relative;min-height:clamp(357px,47.6vh,510px);display:flex;align-items:center;overflow:hidden;background:#13201B;color:#fff}
/* First-party art: the 3D plan of a home built from one walkthrough, on its own dark ground, right of the search. */
.home-hero-img{position:absolute;top:0;right:0;width:min(78%,1100px);height:100%;object-fit:cover;object-position:62% 50%;display:block}
.home-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#13201B 0%,rgba(19,32,27,.82) 34%,rgba(19,32,27,0) 62%);pointer-events:none}
.home-hero-inner{position:relative;z-index:1;width:100%;padding-block:clamp(36px,6vw,64px)}
.home-hero h1{margin:0 0 clamp(18px,2.4vw,26px);color:#fff;font-size:clamp(38px,5.2vw,70px);line-height:1.02;letter-spacing:-.015em;text-shadow:0 2px 28px rgba(8,20,28,.35)}
.home-search{width:min(100%,560px);display:grid;gap:10px}
.home-modes{display:inline-flex;justify-self:start;padding:4px;border-radius:999px;background:rgba(255,255,255,.94);box-shadow:0 8px 28px -12px rgba(8,20,28,.5)}
.home-modes button{min-height:40px;padding:0 20px;border:0;border-radius:999px;background:transparent;color:var(--muted);font:650 15px/1 "Inter Tight",sans-serif;cursor:pointer}
.home-modes button[aria-pressed="true"]{background:var(--forest);color:var(--paper)}
.home-modes button:focus-visible,.home-search-field button:focus-visible{outline:3px solid #fff;outline-offset:2px}
.home-search-field{display:flex;align-items:center;gap:6px;padding:7px 7px 7px 20px;border-radius:16px;background:#fff;box-shadow:0 14px 40px -14px rgba(8,20,28,.6)}
.home-search-field input{flex:1;min-width:0;height:44px;border:0;outline:0;background:transparent;color:var(--ink);font:500 17px/1.2 "Inter Tight",sans-serif}
.home-search-field input::-webkit-search-cancel-button{display:none}
/* The field is always white, so focus needs a mark of its own. */
.home-search-field:focus-within{box-shadow:0 0 0 3px var(--forest),0 0 0 6px #fff,0 14px 40px -14px rgba(8,20,28,.6)}
.mc-room{display:inline-block;margin-right:6px;padding:1px 7px;border-radius:6px;background:var(--forest);color:var(--paper);font-size:12px;font-weight:700}
.mc-meta:has(.mc-room){display:flex;align-items:center}
.home-search-field button{flex:none;width:48px;height:48px;display:grid;place-items:center;border:0;border-radius:12px;background:var(--forest);cursor:pointer}
.home-search-field svg{width:22px;height:22px;fill:none;stroke:var(--paper);stroke-width:2.2;stroke-linecap:round}

.rails{padding:clamp(28px,4vw,48px) 0 clamp(40px,6vw,80px)}
.rail{margin-bottom:clamp(30px,4vw,48px)}
.rail[hidden]{display:none}
.rail-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:14px}
.rail-head h2{margin:0;font-size:clamp(23px,2.5vw,30px);line-height:1.15;letter-spacing:-.03em}
.rail-sub{margin:4px 0 0;font-size:14.5px;color:var(--muted)}
.rail-sub:empty{display:none}
.rail-nav{display:flex;align-items:center;gap:8px;flex:none}
.rail-all{margin-right:6px;font-weight:600;font-size:15px}
.rail-arrow{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:#fff;color:var(--ink);font-size:24px;line-height:1;cursor:pointer}
.rail-arrow:disabled{opacity:.35;cursor:default}
.rail-arrow:focus-visible,.rail-row:focus-visible{outline:3px solid var(--forest);outline-offset:3px}
.rail-row{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 3 * 20px) / 4);gap:20px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding:2px 2px 6px;margin:-2px}
.rail-row::-webkit-scrollbar{display:none}
.rail-row>*{scroll-snap-align:start;min-width:0}
.rail-row .sk{aspect-ratio:4/3;border-radius:var(--card-r);background:linear-gradient(100deg,var(--paper-2) 40%,#F4F1E9 50%,var(--paper-2) 60%) 0 0/300% 100%;animation:sk 1.4s linear infinite}
.rail-row>.empty-state{grid-column:1/-1;grid-auto-columns:auto}
@media (max-width:1100px){.rail-row{grid-auto-columns:calc((100% - 2 * 16px) / 2.6);gap:16px}}
@media (max-width:700px){
  .home-hero{min-height:374px;align-items:flex-end}
  .home-hero-img{width:100%;height:62%;object-position:50% 40%}
  .home-hero::after{background:linear-gradient(0deg,#13201B 0%,#13201B 42%,rgba(19,32,27,0) 70%)}
  .home-hero-inner{padding-block:28px 34px}
  .home-search-field input{font-size:16px}
  .rail-nav .rail-arrow{display:none}
  .rail-row{grid-auto-columns:264px;gap:12px;margin:0 calc(-1 * var(--gutter));padding:2px var(--gutter) 6px;scroll-padding:0 var(--gutter)}
}
@media (prefers-reduced-motion:reduce){.rail-row .sk{animation:none}}
.places{padding:clamp(18px,3vw,36px) 0 clamp(48px,7vw,96px)}
.places-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:20px}
.places h1{max-width:18ch;font-size:clamp(34px,4vw,54px);line-height:1.04;letter-spacing:-.045em}
.places-where{margin:10px 0 0;min-height:21px;font-size:15.5px;line-height:21px;font-weight:600;color:var(--muted);transition:opacity .4s var(--ease)}
.places-where:empty{opacity:0}
.places-where b{color:var(--ink);font-weight:700}
.places-search{flex:0 0 300px;display:flex;flex-direction:column;gap:7px;margin:0}
.places-search label{font-size:13px;font-weight:650;color:var(--muted)}
.places-search .search{flex:none;min-width:0}
.places-search input::-webkit-search-cancel-button{display:none}
.places .sample-note{display:inline-flex;margin:0 0 18px;font-size:13.5px;padding:8px 13px}

.places-row{display:grid;grid-template-columns:repeat(var(--desktop-columns,4),minmax(0,1fr));gap:22px 20px}
.places-row :is(.car,.mc-photo){box-shadow:0 3px 12px -7px rgba(15,42,34,.2)}
.places-row[hidden]{display:none}
.places-row .sk{aspect-ratio:4/3;border-radius:var(--card-r);background:linear-gradient(100deg,var(--paper-2) 40%,#F4F1E9 50%,var(--paper-2) 60%) 0 0/300% 100%;animation:sk 1.4s linear infinite}
@keyframes sk{to{background-position:-150% 0}}
.places-row .card{opacity:0;transform:translateY(14px);animation:cardIn .7s var(--ease) forwards;animation-delay:calc(var(--i,0) * 70ms)}
@keyframes cardIn{to{opacity:1;transform:none}}
.places-all{margin:16px 0 0;text-align:right}
.places-all:empty{display:none}
.places-all .link{position:relative;display:inline-flex;align-items:baseline;gap:7px;max-width:100%;background:none}
.places-all .link::after{content:"";position:absolute;inset:auto 0 0;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform 220ms ease-out}
.places-all-label{display:grid;text-align:left}
.places-all-label>span,.places-all-label::after{grid-area:1/1}
/* The hidden bold copy reserves the final width throughout the weight transition. */
.places-all-label::after{content:attr(data-label);font-weight:800;visibility:hidden}
.places-all-label>span{font-weight:600;transition:font-weight 220ms ease-out}
.places-all-arrow{transition:transform 220ms ease-out}
.places-all .link:is(:hover,:focus-visible) .places-all-label>span{font-weight:800}
.places-all .link:is(:hover,:focus-visible) .places-all-arrow{transform:translateX(3px)}
.places-all .link:is(:hover,:focus-visible)::after{transform:scaleX(1)}

.places .speed-tour-entry,.places .speed-tour-entry *{cursor:pointer}
.places .speed-tour-entry{transition:background-color 220ms ease-out,border-color 220ms ease-out,box-shadow 220ms ease-out}
.places .speed-tour-entry:is(:hover,:focus-visible){background-color:var(--forest);border-color:rgba(221,245,138,.5);box-shadow:0 6px 20px -8px rgba(15,42,34,.4)}
.places .speed-tour-entry:focus-visible{outline:3px solid var(--forest);outline-offset:4px}


.hostbar{margin-top:clamp(22px,3vw,32px);display:flex;align-items:center;gap:16px;background:var(--forest);color:var(--paper);border-radius:22px;padding:12px 12px 12px 24px}
.hostbar p{margin:0;flex:1;font-size:16px;line-height:1.4;color:rgba(247,245,239,.78)}
.hostbar p b{color:var(--paper);font-weight:700}

/* Rent / Buy, only rendered once both exist */
.mode{display:inline-flex;padding:3px;border-radius:100px;background:var(--paper-2);margin-bottom:14px}
.mode button{border:0;background:transparent;font:650 14px/1 "Inter Tight",sans-serif;color:var(--muted);padding:8px 16px;border-radius:100px;cursor:pointer}
.mode button[aria-pressed="true"]{background:#fff;color:var(--ink);box-shadow:0 2px 8px -4px rgba(23,35,31,.35)}

@media (min-width:701px){.places-row[data-count="1"]{max-width:380px;margin-inline:auto}}
@media (min-width:701px) and (max-width:1100px){.places-row{grid-template-columns:repeat(var(--tablet-columns,2),minmax(0,1fr))}.places-row>:last-child:nth-child(3){grid-column:1/-1;width:calc((100% - 20px)/2);justify-self:center}}
@media (max-width:700px){
  .places-head{flex-direction:column;align-items:stretch;gap:14px;margin-bottom:12px}
  .places h1{font-size:36px}
  .places-search{flex:none;gap:5px}
  .places .sample-note{margin-bottom:14px}
  /* one horizontal swipe on phones: no photo carousel inside the scroller */
  .places-row{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--gutter);margin:0 calc(-1 * var(--gutter));padding:0 var(--gutter) 4px;scrollbar-width:none}
  .places-row::-webkit-scrollbar{display:none}
  .places-row>*{flex:0 0 264px;scroll-snap-align:start}
  .places .sample-note .more{display:none}
  .places-where{margin-top:8px}
  .places-row .card .track{overflow:hidden}
  .places-row .card .dots,.places-row .card .nav-btn{display:none}
  .places-all{text-align:left}
  .hostbar{flex-direction:column;align-items:stretch;text-align:left;padding:18px;gap:14px}
}
@media (prefers-reduced-motion:reduce){.places-row .card{animation:none;opacity:1;transform:none}.places-row .sk{animation:none}}

/* Nearby public listings, using only photos supplied by the listing. */
.mcard{display:flex;flex-direction:column;min-width:0;color:inherit;text-decoration:none;border-radius:16px;transition:transform .2s ease}
.mcard:hover{transform:translateY(-3px)}
.mcard:focus-visible{outline:3px solid var(--forest);outline-offset:5px}
.mc-photo{position:relative;aspect-ratio:4/3;border-radius:16px;overflow:hidden;background:var(--paper-2)}
.mc-placeholder{position:absolute;inset:0;display:grid;place-items:center;color:#8B968D}
.mc-placeholder svg{width:42px;height:42px}
.mc-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mc-sample{position:absolute;left:10px;top:10px;z-index:1;padding:4px 10px;border-radius:999px;background:#fff;color:var(--forest);font-size:12.5px;font-weight:700}
.mc-body{padding:12px 2px 2px;display:grid;gap:3px}
.mc-price{font-size:23px;line-height:1.25;font-weight:750;letter-spacing:-.025em}
.mc-price small{font-size:13px;font-weight:500;letter-spacing:0;color:var(--muted)}
.mc-meta,.mc-place{font-size:14px;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-meta{color:var(--ink)}
.mc-place{color:var(--muted)}
.hero .hd{font-size:clamp(42px,5vw,72px)}
.hero .sub{max-width:28ch;margin:20px 0 26px;font-size:18px}
@media (prefers-reduced-motion:reduce){.mcard{transition:none}.mcard:hover{transform:none}}
@media (prefers-reduced-motion:reduce){
  .places .speed-tour-entry,.places-all .link::after,.places-all-label>span,.places-all-arrow{transition:none}
}

/* Speed Tour sits as a compact button left of "See more nearby". */
.places-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:20px}
.places-foot .speed-tour-entry{flex:0 1 auto;width:auto;max-width:440px;min-height:0;margin:0;padding:12px 14px 12px 16px;gap:14px;border-radius:16px}
.places-foot .speed-tour-entry .entry-copy{flex:0 1 auto}
.places-foot .speed-tour-entry .entry-arrow{margin-left:6px}
.places-foot .places-all{margin:0;flex:none}
@media (max-width:640px){.places-foot{flex-direction:column;align-items:stretch}.places-foot .speed-tour-entry{max-width:none}}
@media (max-width:700px){.places-search .search input{font-size:16px}}
