/* Load last on all pages. The flyer theme is no longer loaded. */
body.home, body.booking, body.cabanas, body.employment {
  --brand-blue: #006fb3;
  --ink: #075a91;
  --teal: var(--brand-blue);
  --muted: #496876;
  --line: #b8dbe9;
  --aqua: #e7f7ff;
  --page-sand: #fff2d7;
  --corner: 6px;
  position: relative;
  isolation: isolate;
  min-height: 100vh;
  background-color: var(--page-sand);
  background-image: linear-gradient(rgba(255,242,215,.76), rgba(255,242,215,.76)), url("assets/beach-sand-texture.webp");
  background-size: 512px 512px;
  background-position: center top;
  background-repeat: repeat;
  color: var(--ink);
}

/* Mask only the beach artwork; content and controls stay fully visible. */
.home::before, .booking::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: 46vw;
  background: url("assets/tropical-background.webp") center top / 100% auto no-repeat;
  -webkit-mask-image: linear-gradient(to bottom, #000 55%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 55%, transparent 100%);
  pointer-events: none;
}
body.home main, body.booking main { background: transparent; }
.booking main { padding-top: clamp(84px, 10vw, 140px); }
.booking aside { top: calc(var(--site-header-height, 72px) + 16px); }
header.site-header { background: #bfe7fa; border: 0; box-shadow: none; }
header.site-header.is-scrolled { background: #bfe7fa; box-shadow: 0 3px 14px rgba(0,111,179,.12); }
.site-header .brand, .site-header .brand > span, .site-header .sun,
.site-header .mobile-nav-links a { color: var(--brand-blue); }
header.site-header .navtext a,
header.site-header .navtext a[aria-current="page"], .site-header .header-work,
.site-header .menu-toggle { color: #075a91; }
.site-header .header-work { border-color: var(--brand-blue); }
.site-header .navtext a:hover, .site-header .header-work:hover { color: var(--brand-blue); background-color: var(--aqua); }

/* Preserve the established CTA color. */
.primary, header.site-header .header-cta { background: #bb4d1b; border-color: #bb4d1b; color: #fff; }
.primary:hover, header.site-header .header-cta:hover { background: #a54016; border-color: #a54016; color: #fff; }
.home .cabana-cta { background: var(--brand-blue); border-color: var(--brand-blue); color: #fff; }
.home .cabana-cta:hover { background: #005b96; border-color: #005b96; color: #fff; }
.outline-link, .secondary, .hero-tickets-link { color: var(--brand-blue); border-color: var(--brand-blue); }
.text-link, .home footer a:not(.brand), .contact-box a,
.cabana-visit a, .cabana-footer a, .application-footer a { color: var(--brand-blue); }
:is(a, button, input, select, textarea, summary):focus-visible { outline-color: var(--brand-blue); }

.home h1, .home h2, .home h3, .booking h1, .booking h2, .booking h3,
.cabanas h1, .cabanas h2, .cabanas h3, .employment h1, .employment h2,
.eyebrow, .ticket-label, .ticket-row strong, .big-price, .location-price strong,
.rental-prices dd, .group-prices strong, .cabana-rate .cabana-price { color: var(--brand-blue); }
.home .hero-sign, .booking .beach-sign strong, .booking .beach-sign span { color: #005b96; }
.home .section-heading h2 { background: transparent; border: 0; padding: 0; }
.home .section-heading > p:last-child, .address, .ticket-footnote,
.pricing-note, .contact-box p { color: var(--muted); }
body input, body select, body textarea, body .field, body .location label { color: var(--ink); }
.booking .package-cards .card p { color: var(--ink); }
body .small, body footer, body .deal-totals span, body .deal-benefits { color: var(--muted); }
.home footer .brand, .home footer .brand > span { color: var(--brand-blue); }
.beach-badge, .beach-badge.gold, .location-only-badge { background: var(--aqua); border-color: var(--line); color: var(--brand-blue); }

/* Section surfaces stay open to the sand beneath the white cards. */
.home .tickets-section, .home .rentals-section, .home .group-section,
.home .visit-section, .home .reviews-section,
footer, .home footer { background: transparent; border: 0; box-shadow: none; }
.feature-icon { color: var(--brand-blue); }
.home .location-card { background: rgba(255,255,255,.94); border-color: var(--line); }
.home .location-photos { background: var(--aqua); }
.home .location-photos img { object-fit: contain; }
.location-price, .ticket-card.featured, .quote,
.home .special-rides .vip, .application-notice { background: var(--aqua); border-color: var(--line); }
.ticket-card, .special-rides article, .rental-photo { border-color: var(--line); }
.location-tabs button { background: #fff; border-color: var(--brand-blue); color: var(--brand-blue); }
.location-tabs button[aria-selected="true"] { background: var(--brand-blue); color: #fff; }
.pricing-note a { color: var(--brand-blue); }
.contact-box { border-left-color: var(--brand-blue); }
footer > span:first-child { color: var(--brand-blue); }
footer .preview { color: var(--muted); }

/* Existing package structure, pricing, forms and timeline stay intact. */
.booking .package-cards .card { border-color: var(--line); background: #fff; }
.booking .package-cards .card.selected { border-color: var(--brand-blue); box-shadow: 0 0 0 1px var(--brand-blue); }
.booking .package-cards .card:nth-child(n) h3 { background: transparent; color: var(--brand-blue); }
.booking .package-cards .card .copy { border-color: var(--brand-blue); }
.booking .package-cards .card .popular { color: var(--brand-blue); }
.booking .package-cards .card .selection { background: #fff; color: var(--brand-blue); }
.booking .package-cards .card.selected .selection { background: var(--aqua); }
.booking .package-cards .card.selected .circle { background: var(--brand-blue); border-color: var(--brand-blue); color: #fff; }
.booking #steps .active .step-number { background: var(--brand-blue); border-color: var(--brand-blue); color: #fff; }
.booking .deal-benefits .birthday-perk, .booking .birthday-perks .birthday-perk { background: var(--aqua); border-left-color: var(--brand-blue); }
.booking .deal-tiers .current { background: var(--aqua); border-color: var(--brand-blue); }
.booking .deal-tiers .current strong, .booking .deal-savings { color: var(--brand-blue); }
.booking .notice { color: var(--ink); background: var(--aqua); border-color: var(--line); }
.booking .private-event-experience { --private-event-blue: var(--brand-blue); box-shadow: 0 6px 24px rgba(0,111,179,.08); }
.cabana-rate, .cabana-visit { border-color: var(--line); }
.availability-days label:has(input:checked) { border-color: var(--brand-blue); background: var(--aqua); }

@media (max-width: 720px) {
  .home::before, .booking::before {
    height: calc(34vw + 48px);
    background-color: #16aafa;
    background-position: center 48px;
    -webkit-mask-image: linear-gradient(to bottom, #000 65%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 65%, transparent 100%);
  }
  .booking main { padding-top: 44px; }
}