@charset "UTF-8";
/* ============================================================================
   The walk.

   The Estate page argues that there are not four venues, there is one property.
   The map says it at a glance; the six places follow it as full-width rows,
   photograph and words side by side, alternating, in the order a weekend walks
   them.

   The first version held a survey plan sticky beside a single column of steps
   and animated the plan on each step's scroll timeline. When the plan was
   replaced with the illustrated map, the map left the grid and the steps were
   left in half the width with nothing beside them, still carrying parallax and
   dead timeline rules. That is what made the scroll below the map feel wrong;
   it is all gone. The rows scroll as plain page content.
   ========================================================================== */

.walk{position:relative}
.park-stage{margin:clamp(1.6rem,4vw,2.6rem) 0 0}

/* ----------------------------------------------------------- the places */
.places{list-style:none;margin:clamp(2.5rem,7vw,5rem) 0 0;padding:0;
  display:flex;flex-direction:column;gap:clamp(2.5rem,7vw,5rem)}
.place{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  gap:clamp(1.5rem,4.5vw,4rem);align-items:center}
.place:nth-child(odd) .place-photo{order:2}
.place-photo{display:block;overflow:hidden;border-radius:var(--round,20px);
  box-shadow:0 30px 70px rgba(52,55,47,.14);background:var(--cream)}
.place-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;
  transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.place-photo:hover img,.place-photo:focus-visible img{transform:scale(1.04)}
.place-photo:focus-visible{outline:2px solid var(--sage);outline-offset:6px}
.place-text{display:flex;flex-direction:column;gap:.85rem;align-items:flex-start}
.place-text h3{font-family:var(--display);font-weight:300;
  font-size:clamp(1.9rem,3.8vw,2.8rem);line-height:1.08}
.place-text p{font-size:.98rem;color:var(--ink-soft)}
.place-text .btn{margin-top:.4rem}
.place-dist{font-size:.72rem!important;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  display:inline-block;background:var(--sage);border-radius:999px;padding:.4rem .75rem}
.place-link{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .3s}
.place-link:hover,.place-link:focus-visible{border-bottom-color:var(--sage);outline:none}

/* Arrival has no photograph of its own: the gate is in the drawing above. */
.place-arrival{grid-template-columns:minmax(0,1fr)}
.place-arrival .place-text{background:var(--paper);border-radius:var(--round-lg,28px);
  padding:clamp(1.6rem,4vw,2.6rem);box-shadow:0 14px 34px rgba(52,55,47,.07);max-width:46rem}

@media (max-width:760px){
  .place{grid-template-columns:minmax(0,1fr)}
  .place:nth-child(odd) .place-photo{order:0}
}

/* ----------------------------------------------------------- a place page
   The facts about a place, as a list that reads at a glance -- what it is,
   what it holds, who it sleeps. And a strip at the foot that walks you to the
   next place on the property rather than dropping you at a footer. */
.facts{
  list-style:none;margin:1.6rem 0 0;padding:0;
  display:grid;gap:0 clamp(1.5rem,4vw,3rem);grid-template-columns:1fr 1fr;
  border-top:1px solid var(--line);max-width:46rem;
}
.facts li{padding:.85rem 0;border-bottom:1px solid var(--line-soft);font-size:.95rem}
.facts li span{display:block;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
  font-weight:600;color:var(--label);margin-bottom:.15rem}
@media (max-width:560px){.facts{grid-template-columns:1fr}}
.credit{font-size:.78rem;color:var(--ink-faint);margin-top:1rem}

.onward{
  display:grid;gap:1rem;grid-template-columns:1fr auto 1fr;align-items:center;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:1.4rem 0;margin-top:var(--gap);
}
.onward a{text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:.2rem}
.onward a span{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--label);font-weight:600}
.onward a b{font-family:var(--display);font-weight:400;font-size:1.35rem;line-height:1.15}
.onward a:hover b,.onward a:focus-visible b{color:var(--accent)}
.onward .next{text-align:right;align-items:flex-end}
.onward .up{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);
  text-decoration:none;padding:.35rem 0;border-bottom:1px solid var(--line)}
@media (max-width:560px){.onward{grid-template-columns:1fr;text-align:left}.onward .next{align-items:flex-start;text-align:left}}

/* ------------------------------------------------------------ the places
   One compact card per space, no order and no itinerary: on a phone the
   whole set is a short scroll rather than six long rows (2026-09-15 call). */
.spots{list-style:none;margin:clamp(1.6rem,4vw,2.6rem) 0 0;padding:0;
  display:grid;gap:clamp(.9rem,2vw,1.4rem);grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr))}
.spot-link{display:flex;flex-direction:column;height:100%;text-decoration:none;color:var(--deep);
  background:var(--paper);border-radius:var(--round,20px);overflow:hidden;
  box-shadow:0 14px 34px rgba(52,55,47,.07);transition:transform .35s ease,box-shadow .35s ease}
.spot-link:hover,.spot-link:focus-visible{transform:translateY(-3px);box-shadow:0 24px 50px rgba(52,55,47,.13)}
.spot-link:focus-visible{outline:2px solid var(--deep);outline-offset:3px}
.spot-photo{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--cream)}
.spot-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.spot-link:hover .spot-photo img{transform:scale(1.04)}
.spot-text{display:flex;flex-direction:column;gap:.35rem;padding:1rem 1.1rem 1.2rem}
.spot-name{font-family:var(--display);font-size:1.6rem;line-height:1.1}
.spot-line{font-size:.92rem;color:var(--ink-soft)}
/* phones: photo beside the words, so five places fit in about two screens */
@media (max-width:560px){
  .spots{grid-template-columns:minmax(0,1fr);gap:.7rem}
  .spot-link{flex-direction:row;align-items:stretch}
  .spot-photo{flex:0 0 38%;aspect-ratio:auto;min-height:7.5rem}
  .spot-text{padding:.8rem .9rem;justify-content:center}
  .spot-name{font-size:1.35rem}
  .spot-line{font-size:.88rem}
}
/* Seven places: four and three reads better than five and two. */
@media (min-width:1100px){.spots{grid-template-columns:repeat(4,minmax(0,1fr))}.spot-name{font-size:1.45rem}}
