
.sp-cards{grid-template-columns:repeat(4,1fr)}
.sp-cards .from{font:400 15px var(--sans);color:var(--muted);margin-top:2px}
.sp-cards .from b{font:400 26px/1 var(--serif);color:var(--ink)}
.sp-cards .cb .from{margin-top:auto;padding-top:6px}
.sp-cards .cb .more{margin-top:0}
.sp-cards .card.wide{grid-column:1/-1;flex-direction:row}
.sp-cards .card.wide .ci{flex:0 0 33%;aspect-ratio:auto;height:220px}
.sp-cards .card.wide .cb{justify-content:center;padding:28px 36px}
.sp-cards .card.wide .from{margin-top:0}
.sp-prices{display:grid;gap:18px}
.sp-prices .price-card h3{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.sp-prices .price-card h3 a{font:500 14px var(--sans);text-underline-offset:3px}
.sp-day table{min-width:0}
#included,#suites,#prices,#daycare{scroll-margin-top:140px}
@media (max-width:1100px){.sp-cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.sp-cards{grid-template-columns:1fr}.sp-cards .card.wide{flex-direction:column}.sp-cards .card.wide .ci{aspect-ratio:4/3;height:auto;flex:none}.sp-cards .card.wide .cb{padding:20px 22px 22px}}
.sp-daycare{margin:16px 0 0;font-size:15px;color:var(--ink-2)}
.sp-daycare b{color:var(--ink);font-weight:500}
/* phones: compact suite rows (photo left, name + price right) so the page scans quickly */
@media (max-width:620px){
  .sp-cards .card,.sp-cards .card.wide{flex-direction:row;align-items:stretch}
  .sp-cards .card .ci,.sp-cards .card.wide .ci{flex:0 0 112px;aspect-ratio:auto;height:auto;min-height:124px}
  .sp-cards .card .cb,.sp-cards .card.wide .cb{padding:14px 16px;gap:4px}
  .sp-cards .card .cb p{display:none}
  .sp-cards .card h3{font-size:22px}
}
