/* Booking pages. Loads after base.css and booked.css, which supply the header,
   hero grid, "bring" list and the card. The Cal.com booker sits in its own
   full-width card so it can show event details, month and times side by side,
   the way slategtm.com embeds it. */
.hero{padding:32px 0 0}
/* Compact intro so the calendar card starts above the fold on a laptop. */
.hero-grid{grid-template-columns:minmax(0,6fr) minmax(320px,6fr);gap:40px;margin-bottom:28px;align-items:start}
.hero h1{font-size:clamp(32px,3.4vw,42px);margin-bottom:10px}
.hero .lead{font-size:18px;margin-bottom:14px}
.hero .partner-note{margin-top:0;font-size:15px}
.hero .bring-title{font-size:18px}
.hero .bring{max-width:none}
.hero .bring li{padding:9px 0;font-size:15px;line-height:1.4}
.booking-card{padding:12px;margin-bottom:64px}
.embed-shell{position:relative;min-height:560px}
#cal-inline{width:100%}
.embed-shell iframe{display:block;width:100%;border:0}
.fallback{position:absolute;top:40px;left:0;right:0;text-align:center;pointer-events:none;color:var(--muted);font-size:15px}
.loaded .fallback{display:none}
.booking-card+.cal-note{margin:-48px 0 64px;max-width:none;text-align:center}
.booking-footer{padding-top:24px}
.booking-footer .legal-links{padding-top:0}
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;gap:24px;margin-bottom:28px}
  .booking-card{max-width:none}
}
@media (max-width:640px){
  .booking-card{padding:6px;margin-bottom:48px}
  .booking-card+.cal-note{margin:-36px 0 48px}
}
