/* Retain the original photo hero and its responsive gap before the resort. */
#main > .resort-reference-section{
  margin-block:0;
  padding-block:var(--gap) 0;
}
/* Center the remaining sections with compact space around their content. */
#main > .reserve-together,
#main > .cft-wrap,
#main > .sec,
#main > .stay-ride{
  display:flex;flex-direction:column;justify-content:center;
  min-height:85vh;min-height:85svh;
  margin-block:0;
  padding-block:calc(var(--gap) / 2);
}
#main > .resort-reference-section > .shell,
#main > .reserve-together > .shell,
#main > .sec > .shell,
#main > .stay-ride > .shell{
  width:100%;flex:none;
}
#main > .cft-wrap > .cft{flex:none;}
body > .fcomp{
  min-height:max(808px,85vh);min-height:max(808px,85svh);
}
/* The enclosing .sec already supplies the gap above the location details. */
#main > .sec > .contact{
  margin-top:0;
}
/* The last section is not centred in an 85vh box: that left its slack below the panel as dead
   space above the footer. It keeps a full --gap above the panel and nothing below, so the panel
   sits the same distance from the footer as the home page's closing band does. */
#main > .stay-ride{
  min-height:0;
  padding-block:var(--gap) 0;
}

/* Match the gap between the Rates page's cart and rental composition frames.
   Its desktop spacing subtracts both artwork insets from 1.5 times --gap. */
#main > .reserve-together{
  --rates-content-width:calc(min(var(--shell),100vw) - 2 * clamp(20px,4vw,44px));
  --rates-cart-width:calc(var(--rates-content-width) / .914474);
  --rates-rental-width:calc(var(--rates-content-width) / .90072);
  justify-content:flex-start;
  padding-top:calc(var(--gap) * 1.5 - .061002 * var(--rates-cart-width) - .03828 * var(--rates-rental-width));
  padding-bottom:calc(var(--gap) / 2 + 32px);
  overflow-x:clip;
}
/* Add breathing room between the resort artwork and the booking cards. */
#main > .resort-reference-section + .reserve-together{
  margin-top:clamp(32px,4vw,56px);
}
@media(max-width:900px){
  #main > .reserve-together{
    padding-top:calc(var(--gap) + clamp(48px,11vw,78px));
  }
}
/* Live booking content uses the same shell gutters as the town section. */
#main > .reserve-together .reserve-reference{
  width:100%;max-width:none;margin:0;
}

/* Align the town copy and glass strip with the homepage's .shell content edges.
   The artwork frame includes a 5.502% left inset around its 94.32% content width. */
@media(min-width:901px){
  .cft__copy{left:5.502%;}
  .cft__body{padding-left:0;}
  .cft__pill{left:0;}
  .cft__glass{left:5.502%;width:94.32%;}
  /* The office-hours block is gone from this page's strip (the hours live in Find us below),
     so the three steps share the strip evenly, with a little more room inside each. */
  .cft__glass{grid-template-columns:repeat(3,minmax(0,1fr));}
  .cft__step{padding-inline:clamp(16px,2.2cqw,28px);}
}
@media(max-width:900px){
  /* stacked: the last step no longer has the office block under it, so it drops the divider */
  .cft__step:last-child{border-bottom:0;padding-bottom:0;}
  .cft{padding-inline:clamp(20px,4vw,44px);}
  .cft__art{margin-inline:calc(-1 * clamp(20px,4vw,44px));}
}