:root {
  --green-dark: #070a22;
  --green: #0b1030;
  --green-mid: #1c2458;
  --gold: #d4af37;
  --gold-light: #f4dfa0;
  --cream: #e8dcb8;
  --text-body: #2a2a24;
  --bg-page: #faf7f0;
  --card-bg: #ffffff;
  --border: #e2dcc8;
  --max-width: 1100px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html {
  overflow-anchor: none;
}

body {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  background: var(--bg-page);
  color: var(--text-body);
  line-height: 1.6;
}

img { max-width: 100%; display: block; }

a { color: inherit; text-decoration: none; }

.wrap {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 24px;
}

/* Header / Nav */
header.site-header {
  background: var(--green-dark);
  border-bottom: 2px solid var(--gold);
  position: sticky;
  top: 0;
  z-index: 100;
}

.nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 24px;
  max-width: var(--max-width);
  margin: 0 auto;
  gap: 20px;
}

.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.brand img {
  height: 44px;
  width: 44px;
  border-radius: 50%;
}

.brand span {
  color: var(--gold-light);
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  white-space: nowrap;
}

nav.main-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 22px;
  font-size: 0.92rem;
  letter-spacing: 0.3px;
}

nav.main-nav a {
  color: #cfc6a8;
  padding: 6px 0;
  border-bottom: 2px solid transparent;
  transition: color 0.15s, border-color 0.15s;
}

nav.main-nav a:hover,
nav.main-nav a.active {
  color: var(--gold-light);
  border-color: var(--gold);
}

nav.main-nav a.shop-link {
  color: var(--gold);
  font-weight: 700;
}

.icon-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--gold) !important;
  border: none !important;
  padding: 0 !important;
}

.icon-link svg {
  width: 20px;
  height: 20px;
  transition: opacity 0.15s;
}

.icon-link:hover svg {
  opacity: 0.75;
}

footer .icon-link {
  color: var(--gold-light);
}

.youtube-link,
footer .youtube-link {
  color: #ff0000 !important;
}

.nav-actions {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-left: auto;
}

/* Hero */
.hero {
  background: linear-gradient(180deg, var(--green-mid) 0%, var(--green) 55%, var(--green-dark) 100%);
}

.hero img.hero-banner {
  display: block;
  width: 100%;
  height: auto;
}

/* Page hero (category pages) */
.page-hero {
  background: linear-gradient(180deg, var(--green-mid) 0%, var(--green-dark) 100%);
  color: var(--cream);
  padding: 56px 24px 44px;
  text-align: center;
  border-bottom: 3px solid var(--gold);
}

.page-hero .eyebrow {
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: 3px;
  font-size: 0.78rem;
  margin-bottom: 10px;
}

.page-hero h1 {
  font-size: 2.4rem;
  color: var(--gold-light);
  margin-bottom: 10px;
}

.page-hero p.tagline {
  color: #cfc6a8;
  font-size: 1.02rem;
  max-width: 640px;
  margin: 0 auto;
}

/* Section headings */
.section-heading {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 48px 0 22px;
}

.section-heading h2 {
  color: var(--green);
  font-size: 1.5rem;
  white-space: nowrap;
}

.section-heading .rule {
  flex: 1;
  height: 1px;
  background: var(--border);
}

/* Post card / article */
.post-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 20px 22px;
}

.post-card-cover {
  width: 100%;
  height: 190px;
  object-fit: cover;
  border-radius: 4px;
  margin-bottom: 16px;
}

.post-card .byline {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.82rem;
  color: #8a8265;
}

.avatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--gold);
  color: var(--green-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 700;
  font-size: 0.85rem;
  overflow: hidden;
  flex-shrink: 0;
}
.avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.post-card h3 {
  font-size: 1.35rem;
  color: var(--green);
  margin-bottom: 10px;
}

.post-card h3 a:hover { color: var(--gold); }

.post-detail-title { color: var(--green); }

.post-card p { color: #33375e; }

.category-pill {
  display: inline-block;
  background: var(--green);
  color: var(--gold-light);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 999px;
  margin-bottom: 12px;
}

/* Category tiles (home) */
.category-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 14px;
  margin: 24px 0 48px;
}

@media (max-width: 780px) {
  .category-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.category-tile {
  background: var(--green-dark);
  border: 1px solid var(--green-mid);
  border-radius: 6px;
  padding: 22px 18px;
  text-align: center;
  transition: border-color 0.15s, transform 0.15s;
}

.category-tile:hover {
  border-color: var(--gold);
  transform: translateY(-2px);
}

.category-tile .icon { font-size: 1.6rem; margin-bottom: 8px; }
.category-tile span.label {
  color: var(--gold-light);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.88rem;
  letter-spacing: 0.4px;
}

/* About page */
.about-content {
  padding: 44px 0 70px;
  max-width: 760px;
  margin: 0 auto;
}

.about-content p {
  font-size: 1.08rem;
  margin-bottom: 18px;
}

/* Main content padding */
main { padding-bottom: 20px; }
.posts-feed {
  padding: 10px 0 50px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
  gap: 26px 24px;
  align-items: start;
}

/* Footer */
footer.site-footer {
  background: var(--green-dark);
  color: #a89f80;
  padding: 56px 24px 36px;
  margin-top: 64px;
}

footer .footer-inner {
  max-width: var(--max-width);
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 24px;
}

footer .footer-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}

footer .footer-brand img {
  height: 36px;
  width: 36px;
  border-radius: 50%;
}

footer .footer-brand span {
  color: var(--gold-light);
  font-weight: 700;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

footer nav {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
}

footer nav a:hover { color: var(--gold-light); }

footer nav .subscribe-trigger { color: inherit; padding: 0; }
footer nav .subscribe-trigger:hover { color: var(--gold-light); }

footer .disclaimer {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  color: var(--cream);
  max-width: var(--max-width);
  margin: 24px auto 0;
  border-top: 1px solid #1e3a30;
  padding-top: 16px;
}

@media (max-width: 720px) {
  .nav-inner { flex-direction: column; align-items: flex-start; gap: 12px; }
  nav.main-nav { gap: 14px; }
  .page-hero h1 { font-size: 1.8rem; }
}

/* Cart icon + badge */
.cart-link { position: relative; }

.cart-count {
  position: absolute;
  top: -8px;
  right: -12px;
  background: var(--gold);
  color: var(--green-dark);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.65rem;
  font-weight: 700;
  border-radius: 999px;
  padding: 1px 5px;
  min-width: 16px;
  text-align: center;
  line-height: 1.4;
}

/* Shop category pills */
.shop-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 28px;
}

.shop-pill {
  display: inline-block;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 6px 16px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  color: var(--green);
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.shop-pill:hover,
.shop-pill.active {
  background: var(--green);
  color: var(--gold-light);
  border-color: var(--green);
}

/* Product grid */
.product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr));
  gap: 24px;
  padding-bottom: 60px;
}

.product-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
  transition: transform 0.15s, box-shadow 0.15s;
}

.product-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(11, 16, 48, 0.12);
}

.product-card-media {
  position: relative;
  display: block;
}

.product-card-cover {
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
}

.product-card-cover--empty {
  background: var(--bg-page);
}

.sold-out-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: var(--green-dark);
  color: var(--gold-light);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 999px;
}

.product-card h3 {
  font-size: 1.05rem;
  color: var(--green);
  padding: 14px 16px 4px;
}

.product-card h3 a:hover { color: var(--gold); }

.product-price {
  padding: 0 16px 16px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 700;
  color: var(--text-body);
  display: flex;
  gap: 8px;
  align-items: baseline;
}

.compare-price {
  text-decoration: line-through;
  color: #a89f80;
  font-weight: 400;
  font-size: 0.9em;
}

/* Product detail page */
.pdp-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  padding: 8px 0 60px;
}

@media (max-width: 780px) {
  .pdp-grid { grid-template-columns: 1fr; gap: 28px; }
}

.pdp-media img#pdp-main-image {
  width: 100%;
  /* The last unreserved image on the site. Product photos come from the Wix
     catalog at whatever size they were uploaded, so the box had no height until
     one decoded and the price, the variant pickers and Add to Cart all jumped
     down the page as it landed — on the one page where a misplaced tap costs
     money.

     Square, because that is the shape the shop grid already crops its covers to
     and what merch photography is nearly always shot at. `contain` rather than
     `cover` so an off-ratio photo letterboxes instead of losing its edges: this
     is the view where somebody is deciding whether to buy the thing, and a
     cropped print is worse than a small margin. */
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background: rgba(0, 0, 0, 0.15);
  border-radius: 6px;
  border: 1px solid var(--border);
}

.pdp-thumbs {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}

.pdp-thumb {
  width: 60px;
  height: 60px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid var(--border);
  cursor: pointer;
  opacity: 0.7;
}

.pdp-thumb:hover,
.pdp-thumb.active {
  opacity: 1;
  border-color: var(--gold);
}

.pdp-info h1 {
  font-size: 1.9rem;
  color: var(--green);
  margin-bottom: 12px;
}

.pdp-price {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--text-body);
  display: flex;
  gap: 10px;
  align-items: baseline;
  margin-bottom: 10px;
}

.pdp-stock {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  font-weight: 700;
  margin-bottom: 16px;
  min-height: 1.2em;
}

.pdp-stock.in-stock { color: var(--green-mid); }
.pdp-stock.out-of-stock { color: #b3372c; }

.pdp-description {
  color: #33375e;
  margin-bottom: 24px;
  line-height: 1.7;
}

.pdp-option-group { margin-bottom: 20px; }

.pdp-option-label {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--green);
  margin-bottom: 8px;
}

.pdp-option-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.option-choice {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  border: 1px solid var(--border);
  background: var(--card-bg);
  padding: 8px 16px;
  border-radius: 4px;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}

.option-choice:hover { border-color: var(--gold); }

.option-choice.selected {
  background: var(--green);
  color: var(--gold-light);
  border-color: var(--green);
}

.option-choice.disabled,
.option-choice:disabled {
  text-decoration: line-through;
  color: #b0a888;
  cursor: not-allowed;
  opacity: 0.6;
}

.pdp-text-input {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.9rem;
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: 4px;
  width: 100%;
  max-width: 320px;
}

.btn-primary {
  display: inline-block;
  background: var(--gold);
  color: var(--green-dark);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 700;
  font-size: 0.95rem;
  border: none;
  border-radius: 4px;
  padding: 12px 28px;
  cursor: pointer;
  transition: background 0.15s;
  text-decoration: none;
}

.btn-primary:hover:not(:disabled) { background: var(--gold-light); }

.btn-primary:disabled {
  background: var(--border);
  color: #a89f80;
  cursor: not-allowed;
}

.pdp-message {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  margin-top: 12px;
  min-height: 1.2em;
}

.pdp-message.success { color: var(--green-mid); font-weight: 700; }
.pdp-message.error { color: #b3372c; font-weight: 700; }

/* Cart page */
.cart-lines {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-bottom: 32px;
}

.cart-line {
  display: flex;
  gap: 16px;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 14px;
  background: var(--card-bg);
}

.cart-line-img {
  width: 84px;
  height: 84px;
  object-fit: cover;
  border-radius: 4px;
  flex-shrink: 0;
}

.cart-line-img--empty { background: var(--bg-page); }

.cart-line-info { flex: 1; min-width: 0; }

.cart-line-name {
  font-weight: 700;
  color: var(--green);
  margin-bottom: 4px;
}

.cart-line-desc {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.8rem;
  color: #8a8265;
  margin-bottom: 4px;
}

.cart-line-unavailable {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.8rem;
  color: #b3372c;
  font-weight: 700;
  margin-bottom: 4px;
}

.cart-line-price {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 700;
  display: flex;
  gap: 8px;
  align-items: baseline;
}

.cart-line-controls {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  flex-shrink: 0;
}

.cart-qty-input {
  width: 56px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: 4px;
  text-align: center;
}

.cart-remove-btn {
  background: none;
  border: none;
  color: #8a8265;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.8rem;
  text-decoration: underline;
  cursor: pointer;
  padding: 0;
}

.cart-remove-btn:hover { color: #b3372c; }

.cart-summary {
  border-top: 2px solid var(--border);
  padding-top: 24px;
}

.cart-subtotal {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 1.1rem;
  margin-bottom: 16px;
}

.cart-empty {
  text-align: center;
  padding: 40px 0;
  color: #8a8265;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

.cart-empty p { margin-bottom: 18px; }

/* Subscribe modal */
button.subscribe-trigger {
  font: inherit;
  background: none;
  border: none;
  cursor: pointer;
}

/* The header trigger, which was an 82x21px bare text button sitting between the
   YouTube icon and "Shop" — indistinguishable from a nav link, and under half
   the 44px minimum tap target. Scoped to .header-icons rather than written into
   the base rule above, so the footer variant and any other placement keep the
   styling they already have. */
.header-icons button.subscribe-trigger {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.72rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: var(--gold-light);
  background: rgba(212, 175, 55, 0.09);
  border: 1px solid var(--gold);
  border-radius: 3px;
  padding: 0 14px;
  /* Height, not padding: it's what makes the tap target a promise rather than
     a side effect of the font size. */
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  transition: background 0.15s ease, color 0.15s ease;
}

.header-icons button.subscribe-trigger:hover,
.header-icons button.subscribe-trigger:focus-visible {
  background: var(--gold);
  color: var(--green-dark);
}

/* Below this the header crowds, so the visual weight comes down but the tap
   target does not — 44px is a thumb, and it doesn't get smaller on a phone. */
@media (max-width: 700px) {
  .header-icons button.subscribe-trigger {
    min-height: 44px;
    padding: 0 12px;
    font-size: 0.68rem;
  }
}

.subscribe-modal[hidden] { display: none; }

.subscribe-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.subscribe-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 10, 34, 0.7);
}

.subscribe-modal-panel {
  position: relative;
  background: var(--bg-page);
  border: 1px solid var(--gold);
  border-radius: 8px;
  max-width: 420px;
  width: calc(100% - 40px);
  padding: 36px 32px;
  text-align: center;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);
}

.subscribe-modal-panel h3 {
  color: var(--green);
  font-size: 1.4rem;
  margin-bottom: 10px;
}

.subscribe-modal-panel p {
  color: #5c5744;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.9rem;
  margin-bottom: 20px;
}

.subscribe-modal-close {
  position: absolute;
  top: 10px;
  right: 14px;
  background: none;
  border: none;
  font-size: 1.5rem;
  line-height: 1;
  color: #8a8265;
  cursor: pointer;
}

.subscribe-modal-close:hover { color: var(--green); }

#subscribe-form {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
}

#subscribe-email {
  flex: 1;
  min-width: 180px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.95rem;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 4px;
}

/* Homepage layout: Trivia promo + main column + Crowd Calendar sidebar */
.home-layout {
  display: grid;
  grid-template-columns: 260px 1fr 300px;
  gap: 32px;
  align-items: start;
}

@media (max-width: 1100px) {
  .home-layout {
    grid-template-columns: 220px 1fr 260px;
    gap: 24px;
  }
}

.home-main { min-width: 0; }

.trivia-promo-sidebar { position: sticky; top: 90px; margin-top: 48px; }

.trivia-promo-card {
  background: var(--green-dark);
  border: 1px solid var(--green-mid);
  border-radius: 8px;
  padding: 28px 20px;
  text-align: center;
}

.trivia-promo-icon { font-size: 2.2rem; margin-bottom: 10px; }

.trivia-promo-heading {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--gold-light);
  font-size: 1.2rem;
  margin-bottom: 10px;
}

.trivia-promo-text {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  color: #cfc6a8;
  margin-bottom: 20px;
  line-height: 1.5;
}

.trivia-promo-btn {
  display: block;
  width: 100%;
  text-align: center;
  padding: 12px 16px;
  font-size: 0.9rem;
}

@media (max-width: 900px) {
  .trivia-promo-sidebar { position: static; }
}

.crowd-calendar-sidebar {
  position: sticky;
  top: 90px;
  margin-top: 48px;
}

.crowd-calendar-heading {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--green);
  font-size: 1.1rem;
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--gold);
}

.crowd-calendar-grid {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.crowd-calendar-thumb {
  display: block;
  width: 100%;
  max-width: 300px;
  min-width: 280px;
  margin: 0 auto;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
  background: var(--card-bg);
  cursor: zoom-in;
  transition: border-color 0.15s, transform 0.15s;
}

.crowd-calendar-thumb:hover {
  border-color: var(--gold);
  transform: translateY(-2px);
}

.crowd-calendar-thumb img {
  width: 100%;
  display: block;
}

@media (max-width: 900px) {
  .home-layout {
    grid-template-columns: 1fr;
  }

  .crowd-calendar-sidebar {
    position: static;
  }

  .crowd-calendar-heading {
    margin-top: 8px;
  }

  .crowd-calendar-grid {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }

  .crowd-calendar-thumb {
    width: 45%;
    min-width: 140px;
  }
}

/* Lightbox */
.lightbox-modal[hidden] { display: none; }

.lightbox-modal {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 10, 34, 0.85);
}

.lightbox-panel {
  position: relative;
  max-width: 90vw;
  max-height: 90vh;
}

.lightbox-panel img {
  max-width: 90vw;
  max-height: 90vh;
  display: block;
  border-radius: 6px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
}

.lightbox-close {
  position: absolute;
  top: -38px;
  right: 0;
  background: none;
  border: none;
  color: var(--gold-light);
  font-size: 2rem;
  line-height: 1;
  cursor: pointer;
}

.lightbox-close:hover { color: var(--gold); }

/* Trivia game */
.trivia-card {
  background: var(--card-bg);
  border-radius: 14px;
  box-shadow: 0 12px 34px rgba(11, 16, 48, 0.12);
  padding: 40px 36px;
}

@media (max-width: 600px) {
  .trivia-card { padding: 28px 20px; }
}

.trivia-panel { text-align: center; }

.trivia-category-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

@media (max-width: 560px) {
  .trivia-category-grid { grid-template-columns: 1fr; }
}

.trivia-category-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  background: var(--bg-page);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 28px 18px;
  cursor: pointer;
  transition: border-color 0.15s, transform 0.15s, box-shadow 0.15s;
}

.trivia-category-card:hover {
  border-color: var(--gold);
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(11, 16, 48, 0.12);
}

.trivia-category-icon { font-size: 2.4rem; line-height: 0; }
.trivia-category-icon svg {
  width: 42px;
  height: 42px;
  color: var(--gold);
}
body.home-v2 .trivia-category-icon svg { color: var(--wood-gold); }

.trivia-category-title {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--green);
}

.trivia-category-sub {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  color: #8a8265;
}

.trivia-progress-bar {
  height: 6px;
  background: var(--border);
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: 18px;
}

.trivia-progress-fill {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, var(--green-mid), var(--gold));
  border-radius: 999px;
  transition: width 0.25s ease;
}

.trivia-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.82rem;
  color: #8a8265;
  margin-bottom: 20px;
}

.trivia-score-pill {
  background: var(--green);
  color: var(--gold-light);
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 0.78rem;
}

.trivia-question {
  color: var(--green);
  font-size: 1.35rem;
  margin-bottom: 24px;
  line-height: 1.4;
  text-align: left;
}

.trivia-choices {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 24px;
}

.trivia-choice {
  display: flex;
  align-items: center;
  gap: 14px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 1rem;
  text-align: left;
  padding: 14px 18px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-page);
  color: var(--text-body);
  cursor: pointer;
  transition: border-color 0.15s, transform 0.15s, box-shadow 0.15s, background 0.15s;
}

.trivia-choice:hover:not(:disabled) {
  border-color: var(--gold);
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(11, 16, 48, 0.1);
}

.trivia-choice:disabled { cursor: default; }

.trivia-choice-letter {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--green);
  color: var(--gold-light);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.8rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}

.trivia-choice.correct {
  background: #e4f3ea;
  border-color: var(--green-mid);
  color: var(--green-mid);
  font-weight: 700;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(28, 36, 88, 0.15);
}

.trivia-choice.correct .trivia-choice-letter { background: var(--green-mid); color: #fff; }

.trivia-choice.incorrect {
  background: #fbe9e7;
  border-color: #b3372c;
  color: #b3372c;
  font-weight: 700;
}

.trivia-choice.incorrect .trivia-choice-letter { background: #b3372c; color: #fff; }

.trivia-next-btn { width: 100%; }

.trivia-score-ring {
  width: 140px;
  height: 140px;
  border-radius: 50%;
  margin: 8px auto 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  background: conic-gradient(var(--border) 0deg, var(--border) 360deg);
}

.trivia-score-ring::before {
  content: "";
  position: absolute;
  inset: 10px;
  border-radius: 50%;
  background: var(--card-bg);
}

.trivia-final-score {
  position: relative;
  z-index: 1;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 1.7rem;
  font-weight: 700;
  color: var(--green);
}

.trivia-message {
  font-size: 1.15rem;
  color: var(--green);
  margin-bottom: 28px;
}

.trivia-results-actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 28px;
}

.trivia-secondary-btn {
  display: inline-block;
  background: none;
  border: 1px solid var(--border);
  color: var(--green);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 700;
  font-size: 0.95rem;
  border-radius: 999px;
  padding: 12px 24px;
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s;
}

.trivia-secondary-btn:hover {
  border-color: var(--gold);
  color: var(--gold);
}

.trivia-share {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
}

.trivia-share textarea {
  width: 100%;
  max-width: 480px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  resize: none;
  color: #5c5744;
}

#subscribe-form .btn-primary { flex-shrink: 0; }

/* ==========================================================================
   HOME V2 — wood-plank redesign. Scoped to body.home-v2 so other pages
   (still on the green theme) are completely unaffected.
   ========================================================================== */
body.home-v2 {
  --wood-bg: #070a22;
  --wood-panel: rgba(11, 16, 48, 0.6);
  --wood-panel-solid: #0b1030;
  --wood-border: #1c2458;
  --wood-gold: #d4af37;
  --wood-gold-dim: #8b6508;
  --wood-cream: #e4d7c5;
  --wood-cream-dim: #b9a98f;
  background: var(--wood-bg);
  color: var(--wood-cream);
}

header.home-v2-header {
  background: var(--wood-panel-solid);
  border-bottom: none;
  box-shadow: 0 4px 15px rgba(0,0,0,0.6);
  position: sticky;
  top: 0;
  z-index: 200;
}
.pinned-banner {
  display: block;
  position: relative;
  width: 100%;
  line-height: 0;
  background: #0b1030;
  overflow: hidden;
}
.pinned-banner img {
  display: block;
  width: 100%;
  height: clamp(60px, 6.4vw, 90px);
  object-fit: contain;
  object-position: center center;
  animation: banner-breathe 14s ease-in-out infinite;
  transform-origin: center;
}

/* Ambient motion layered on top of the banner artwork -- the image itself
   is never touched, this is purely a CSS overlay so brand assets used
   elsewhere (social, etc.) stay pixel-identical to what's on the site. */
.pinned-banner::before {
  content: "";
  position: absolute;
  left: 50.7%;
  top: 30%;
  width: 10%;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 244, 214, 0.85) 0%, rgba(212, 175, 55, 0.5) 35%, rgba(212, 175, 55, 0) 72%);
  filter: blur(2px);
  z-index: 1;
  animation: banner-glow-breathe 5.5s ease-in-out infinite;
  pointer-events: none;
}
.pinned-banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(75deg,
    transparent 40%,
    rgba(255, 255, 255, 0.30) 49%,
    rgba(255, 244, 214, 0.45) 50%,
    rgba(255, 255, 255, 0.30) 51%,
    transparent 60%);
  background-size: 300% 100%;
  background-position: 200% 0;
  mix-blend-mode: overlay;
  z-index: 2;
  animation: banner-sweep 7s ease-in-out infinite;
  animation-delay: 2s;
  pointer-events: none;
}
@keyframes banner-breathe {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.018); }
}
@keyframes banner-glow-breathe {
  0%, 100% { opacity: 0.35; transform: translate(-50%, -50%) scale(0.92); }
  50%      { opacity: 0.85; transform: translate(-50%, -50%) scale(1.12); }
}
@keyframes banner-sweep {
  0%, 30%, 100% { background-position: 200% 0; }
  55%           { background-position: -60% 0; }
}
@media (prefers-reduced-motion: reduce) {
  .pinned-banner img,
  .pinned-banner::before,
  .pinned-banner::after {
    animation: none !important;
  }
}
.home-v2-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 18px;
  background: #0a0e28;
  border-top: 1px solid #3a4275;
  padding: 8px 24px;
}
.home-v2-nav a,
.home-v2-nav button {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.82rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--wood-cream);
  background: none;
  border: none;
  cursor: pointer;
}
.home-v2-nav a:hover,
.home-v2-nav button:hover { color: var(--wood-gold); }
.home-v2-nav a.active { color: var(--wood-gold); }
.home-v2-nav .header-icons { display: flex; align-items: center; gap: 14px; }
.home-v2-nav svg { width: 18px; height: 18px; }
.home-v2-nav .cart-count {
  background: var(--wood-gold-dim); color: #fff; font-size: .65rem;
  padding: 1px 5px; border-radius: 8px; margin-left: 4px;
}

/* On a touch screen the whole header nav had tap targets of 15 to 24 pixels.
   The rows LOOK generously spaced on a phone, but the space is gap on the flex
   container, not padding on the links — so the tappable box is exactly the
   height of the text and a thumb aimed between "Home" and "News" hits nothing.
   The cart was an 18x18 target. Apple's floor is 44, Google's is 48.

   Fixing it costs no vertical space: the row gap becomes padding on the links,
   so each row is the same height it was and the whole of it is now tappable.
   Subscribe already had this because somebody fixed it once, in isolation.

   Keyed on (hover: none) rather than a width, because this is about fingers.
   A tablet in landscape is wide and still has no mouse. */
@media (hover: none), (max-width: 700px) {
  .home-v2-nav { gap: 0 18px; padding: 0 16px 4px; }
  .home-v2-nav > a,
  .home-v2-nav .nav-dropdown-toggle {
    padding: 15px 6px;
    display: inline-flex;
    align-items: center;
  }
  .home-v2-nav .header-icons { gap: 4px; }
  .home-v2-nav .header-icons > a,
  .home-v2-nav .header-icons > button:not(.subscribe-trigger) {
    min-width: 44px; min-height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
  }
}

/* iOS Safari zooms the whole page when you focus a field whose text is under
   16px, and it does not zoom back out. It is in HANDOFF.md as a gotcha and it
   was fixed once, on the subscribe form, by hand. Every other field on the site
   still did it: the dining search, the crowd-calendar park picker, every date
   and number on both planners, the trackers, the recipe filters. Twenty-nine
   field types across fourteen pages.

   The exclusions matter. Checkbox, radio and range don't take text, so they
   don't trigger the zoom and forcing 16px on them does nothing but change
   their size. They get the 44px target and not the font size.

   Fixing this in one rule rather than page by page is the point — the by-hand
   version is how it ended up applied to exactly one form. */
@media (hover: none), (max-width: 700px) {
  /* Prefixed with body.home-v2 to outrank the per-component rules that set
     their own font-size — .planner-select, .wait-sort-select and friends are
     single classes, and a bare `select` loses to every one of them. This is
     the escalation the stylesheet already uses elsewhere, and it beats
     !important, which would then have to be fought the next time too. */
  body.home-v2 input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),
  body.home-v2 select,
  body.home-v2 textarea {
    font-size: 16px;
  }
  body.home-v2 input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  body.home-v2 select,
  body.home-v2 textarea {
    min-height: 44px;
    /* A <select> is as wide as its longest option. Raising the font size to 16
       therefore made two of them wider than a 320px phone — "All Locations /
       Magic Kingdom / ..." went from fitting to overflowing by 31px. Clamping
       is the fix; the label truncates rather than the page scrolling. */
    max-width: 100%;
  }

  /* Twenty button classes sat between 30 and 42px — every filter chip, both
     reset buttons, Refresh on the wait times, the month arrows on the crowd
     calendar. Each was fine on its own and none of them was 44. One rule
     rather than twenty, for the same reason as the fields above. */
  body.home-v2 button,
  body.home-v2 [role="button"] {
    min-height: 44px;
  }
}

/* --- Header nav dropdowns --- */
.nav-dropdown { position: relative; }
.nav-dropdown-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.nav-dropdown-toggle.active { color: var(--wood-gold); }
.nav-caret {
  font-size: 0.65rem;
  transition: transform 0.15s ease;
}
.nav-dropdown.open .nav-caret { transform: rotate(180deg); }
.nav-dropdown-menu {
  display: none;
  position: absolute;
  top: calc(100% + 12px);
  left: 50%;
  transform: translateX(-50%);
  flex-direction: column;
  min-width: 190px;
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.6);
  padding: 8px 0;
  z-index: 210;
}
/* Invisible bridge over the 12px gap above the menu -- without this, moving
   the cursor from the nav button down to the menu crosses dead space with
   nothing to hover, so :hover drops and the menu closes before you reach it. */
.nav-dropdown-menu::before {
  content: "";
  position: absolute;
  top: -12px;
  left: 0;
  right: 0;
  height: 12px;
}
.nav-dropdown.open .nav-dropdown-menu { display: flex; }
.nav-dropdown-menu a {
  padding: 9px 18px;
  text-align: left;
  white-space: nowrap;
}
.nav-dropdown-menu a:hover { background: rgba(255,255,255,0.06); }

/* Menu items sat at 39px — close enough to look fine and not close enough.
   This has to come after the rule above, not in the touch block further up:
   same specificity, and the later one wins. It did, and the fix silently
   did nothing until the measurement said so. */
@media (hover: none), (max-width: 700px) {
  .nav-dropdown-menu a { padding: 13px 18px; }
}
@media (hover: hover) {
  .nav-dropdown:hover .nav-dropdown-menu { display: flex; }
  .nav-dropdown:hover .nav-caret { transform: rotate(180deg); }
}

/* --- Video hero: full-bleed autoplay background video, below the header --- */
.video-hero {
  position: relative;
  width: 100%;
  min-height: clamp(420px, 70vh, 720px);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #0a1d16;
  border-bottom: 4px solid #1c2458;
}
.video-hero-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  z-index: 0;
}
.video-hero-color-grade {
  position: absolute;
  inset: 0;
  background: var(--green-mid);
  mix-blend-mode: color;
  opacity: 0.55;
  z-index: 1;
}
.video-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(7, 10, 34,0.25) 0%, rgba(7, 10, 34,0.6) 100%);
  z-index: 2;
}
@media (prefers-reduced-motion: reduce) {
  .video-hero-bg { display: none; }
}
.adventure-plaque {
  position: relative;
  z-index: 3;
  display: inline-block;
  background: linear-gradient(135deg, #2a2a2a 0%, #171717 100%);
  border: 3px solid #8e6f43;
  border-radius: 6px;
  padding: 25px 40px;
  text-align: center;
  box-shadow:
    0 10px 30px rgba(0, 0, 0, 0.8),
    inset 0 0 15px rgba(0, 0, 0, 0.6);
  max-width: 500px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
.adventure-plaque::before {
  content: '';
  position: absolute;
  top: 4px;
  left: 4px;
  right: 4px;
  bottom: 4px;
  border: 1px solid rgba(142, 111, 67, 0.3);
  pointer-events: none;
}
/* Transparent variant: text floats directly on the video, no card chrome */
.adventure-plaque--transparent {
  background: none;
  border: none;
  box-shadow: none;
  padding: 20px 40px;
}
.adventure-plaque--transparent::before { display: none; }
.adventure-plaque--transparent .plaque-title {
  font-size: 2.1rem;
  text-shadow: 0 2px 10px rgba(0,0,0,0.9), 0 0 40px rgba(0,0,0,0.6);
}
.adventure-plaque--transparent .plaque-subtitle {
  color: #e8dcb8;
  text-shadow: 0 1px 6px rgba(0,0,0,0.9);
}
.adventure-plaque--transparent .plaque-btn {
  background: rgba(11, 16, 48, 0.45);
  backdrop-filter: blur(3px);
  border: 1px solid var(--wood-gold);
}
.adventure-plaque--transparent .plaque-btn:hover {
  background: rgba(11, 16, 48, 0.7);
}
.plaque-title {
  color: var(--wood-gold);
  font-size: 1.6rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  margin: 0 0 5px 0;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
}
.plaque-subtitle {
  color: #bfa88f;
  font-size: 0.85rem;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: bold;
  letter-spacing: 1px;
  margin: 0 0 20px 0;
  text-transform: uppercase;
}
.plaque-btn {
  display: inline-block;
  background: linear-gradient(to bottom, #a38052 0%, #6e512d 100%);
  border: 1px solid #d4af37;
  border-radius: 4px;
  color: #ffffff;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 10px 24px;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(0,0,0,0.4);
  transition: all 0.2s ease-in-out;
}
.plaque-btn:hover {
  background: linear-gradient(to bottom, #bfa88f 0%, #8e6f43 100%);
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(0,0,0,0.5);
}

/* --- Main 3-column wood layout --- */
.main-wrapper {
  max-width: 1400px;
  margin: 56px auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 1fr 1.2fr 1fr;
  gap: 38px;
}
@media (max-width: 1024px) {
  .main-wrapper { grid-template-columns: 1fr; }
}

.content-box {
  background: var(--wood-panel);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  padding: 28px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.5);
}
.box-title {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 1.1rem;
  text-transform: uppercase;
  color: #e9c46a;
  border-bottom: 2px solid #3a4275;
  padding-bottom: 8px;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.box-title::before { content: '♦'; color: var(--wood-gold-dim); }

/* Everything below the fold starts invisible and fades in as it scrolls into
   view. That is a nice effect and a terrible default: on the homepage the
   revealed sections ARE the page, so anything that stops the reveal from
   running leaves a hero and then nothing.

   It doesn't take JavaScript being switched off. initScrollReveal() shares a
   module block with the nav dropdowns and the video widget, and if any import
   in that block throws at evaluation time the whole block never runs — one
   unrelated error and the site is blank below the header, with no console the
   owner is watching.

   Three guards, because they fail in different ways:

   1. `.js` is set by a one-line inline script in the head. Scripting off, and
      the rule never applies — the content is simply there. Inline rather than a
      module because it must be immune to the failures it guards against, and it
      must run before first paint or the fade would flash.
   2. initScrollReveal() gets its own <script type="module"> block, so a sibling
      module throwing can't take it down with it.
   3. If that block still doesn't run — the file 404s, the connection drops
      mid-load — nothing above helps, so the hidden state carries an animation
      that reveals it anyway after three seconds. initScrollReveal() adds
      `reveal-armed` as its first statement, which cancels the animation long
      before its delay elapses, so a working page never sees it. */
.js .reveal-on-scroll {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.js:not(.reveal-armed) .reveal-on-scroll {
  animation: reveal-failsafe 0.5s ease 3s forwards;
}
@keyframes reveal-failsafe {
  to { opacity: 1; transform: none; }
}
.js .reveal-on-scroll.is-visible {
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .js .reveal-on-scroll {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .js:not(.reveal-armed) .reveal-on-scroll { animation: none; }
}

.news-item {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 20px;
  padding-bottom: 15px;
  border-bottom: 1px solid rgba(58, 66, 117, 0.3);
}
.news-item:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.news-thumb {
  display: block;
  width: 100%;
  height: 140px;
  background-color: #0f1540;
  border-radius: 3px;
  overflow: hidden;
  position: relative;
}
.news-thumb img { width: 100%; height: 100%; object-fit: cover; }
.thumb-placeholder {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
}
.thumb-placeholder svg { width: 34px; height: 34px; color: #3a4275; }
.news-thumb .badge {
  position: absolute;
  top: 8px;
  left: 8px;
  background: var(--wood-gold-dim);
  color: #fff;
  font-size: 0.65rem;
  font-weight: bold;
  padding: 2px 6px;
  text-transform: uppercase;
  border-radius: 2px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  z-index: 2;
}
.news-title {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.95rem;
  font-weight: bold;
  line-height: 1.3;
  margin-top: 5px;
  color: var(--wood-cream);
  text-decoration: none;
}
.news-title:hover { color: var(--wood-gold); }
.news-meta { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.75rem; color: var(--wood-cream-dim); }

.featured-video {
  background: #000;
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: 4px;
  margin-bottom: 15px;
  border: 1px solid #3a4275;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--wood-cream-dim);
  text-decoration: none;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.9rem;
  text-align: center;
  padding: 20px;
}
.featured-video:hover { color: var(--wood-gold); }

.merch-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15px;
  margin-top: 15px;
}
.merch-card {
  background: rgba(10, 14, 40, 0.8);
  border: 1px solid #2a3470;
  border-radius: 4px;
  padding: 10px;
  text-align: center;
  text-decoration: none;
  display: block;
}
.merch-img-slot {
  width: 100%;
  height: 100px;
  background: #0f1540;
  border-radius: 3px;
  margin-bottom: 8px;
  overflow: hidden;
}
.merch-card h4 {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  color: var(--wood-cream);
  font-weight: normal;
}

.cruise-block { margin-bottom: 25px; }

.trivia-box {
  background: linear-gradient(rgba(28, 36, 88, 0.9), rgba(11, 16, 48, 0.95));
  border: 1px solid #8e6f43;
  border-radius: 4px;
  padding: 15px;
}
.trivia-option {
  background: rgba(255,255,255,0.05);
  border: 1px solid #3a4275;
  padding: 10px;
  margin-block: 8px;
  border-radius: 4px;
  font-size: 0.85rem;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream);
}

.history-box {
  background: linear-gradient(rgba(28, 36, 88, 0.9), rgba(11, 16, 48, 0.95));
  border: 1px solid #8e6f43;
  border-radius: 4px;
  padding: 15px;
  margin-top: 20px;
}
.history-label {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: bold;
  font-size: 0.9rem;
  color: #fff;
  margin: 0 0 10px;
}
.history-item {
  display: flex;
  gap: 10px;
  align-items: baseline;
  margin-bottom: 8px;
}
.history-item:last-child { margin-bottom: 0; }
.history-year {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 0.85rem;
  font-weight: bold;
  flex-shrink: 0;
}
.history-text {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.82rem;
  line-height: 1.4;
}

body.home-v2 .site-footer {
  background: #070a22;
  border-top: 2px solid var(--wood-border);
}
body.home-v2 .site-footer .footer-brand span,
body.home-v2 .site-footer nav a { color: var(--wood-cream-dim); }
body.home-v2 .site-footer nav a:hover { color: var(--wood-gold); }
body.home-v2 .disclaimer { color: #6e5b4f; }

/* --- box-title / cta-box headings: match the banner's display font --- */
.box-title, .plaque-title {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
}

/* --- hero cruise ship image, linked, below the CTA box --- */
.hero-cruise-link {
  display: block;
  margin-top: 12px;
  max-width: 260px;
  width: 100%;
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid #3a4275;
  box-shadow: 0 6px 16px rgba(0,0,0,0.6);
}
.hero-cruise-link img { width: 100%; height: auto; display: block; transition: transform .3s ease; }
.hero-cruise-link:hover img { transform: scale(1.04); }

/* --- YT Log: red YouTube badge + text --- */
.featured-video {
  flex-direction: column;
  gap: 10px;
}
.featured-video .yt-icon {
  width: 56px;
  height: 40px;
  color: #fff;
  background: #FF0000;
  border-radius: 8px;
  padding: 8px;
}
.featured-video span { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; }

.featured-video.has-thumb {
  padding: 0;
  position: relative;
  overflow: hidden;
  display: block;
}
.featured-video .yt-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.featured-video .yt-play-badge {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 56px;
  height: 40px;
  color: #fff;
  background: rgba(255, 0, 0, 0.9);
  border-radius: 8px;
  padding: 8px;
  transition: background 0.15s;
}
.featured-video.has-thumb:hover .yt-play-badge { background: #FF0000; }
.featured-video .yt-video-title {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 26px 12px 10px;
  background: linear-gradient(to top, rgba(0,0,0,0.88), rgba(0,0,0,0));
  color: #fff;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.82rem;
  font-weight: 600;
  text-align: left;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.yt-subscribe-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: auto;
  background: #FF0000;
  color: #fff;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 700;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  padding: 5px 12px;
  border-radius: 999px;
  text-decoration: none;
  transition: background 0.15s;
  flex-shrink: 0;
}
.yt-subscribe-btn svg { width: 13px; height: 13px; }
.yt-subscribe-btn:hover { background: #cc0000; }

/* --- Footer brand: linked logo + email subscribe button, stacked --- */
body.home-v2 .footer-brand {
  flex-direction: column;
  align-items: flex-start;
}
.footer-brand-link {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  margin-bottom: 14px;
}
.footer-brand-link img {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: rgba(10, 14, 40, 0.85);
  object-fit: contain;
  padding: 6px;
  box-sizing: border-box;
}
button.subscribe-trigger.footer-email-btn {
  background: linear-gradient(var(--wood-gold), #b8860b);
  color: #0a0e28;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: bold;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 10px 18px;
  border: 1px solid var(--wood-gold);
  border-radius: 3px;
  cursor: pointer;
}
button.subscribe-trigger.footer-email-btn:hover { background: linear-gradient(#e9c46a, var(--wood-gold)); }

.footer-social { display: flex; align-items: center; gap: 14px; }
.footer-social .icon-link svg { width: 20px; height: 20px; color: var(--wood-cream-dim); }
.footer-social .icon-link:hover svg { color: var(--wood-gold); }

/* ==========================================================================
   HOME V2 THEME — SUBPAGES. Applies the wood-plank look (used only on the
   homepage above) to the category/shop/cart/trivia/about/post pages, which
   keep their original header/main/footer structure but get body.home-v2
   plus a wood-styled page-hero. Scoped to body.home-v2 so nothing here
   touches the actual homepage layout above.
   ========================================================================== */

/* Subpage hero (category eyebrow/title banner) */
body.home-v2 .page-hero {
  background: linear-gradient(180deg, #0f1540 0%, var(--wood-bg) 100%);
  border-bottom: 3px solid var(--wood-gold-dim);
}
body.home-v2 .page-hero {
  padding: 64px 24px 56px;
}
body.home-v2 .page-hero .eyebrow {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  letter-spacing: 3.5px;
}
body.home-v2 .page-hero h1 {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
}
body.home-v2 .page-hero p.tagline { color: var(--wood-cream-dim); }

/* Section headings */
body.home-v2 .section-heading h2 {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  letter-spacing: 0.5px;
}
body.home-v2 .section-heading .rule { background: var(--wood-border); }

/* Post feed cards (category pages) */
body.home-v2 .posts-feed {
  padding-top: 40px;
  gap: 30px 24px;
}
body.home-v2 .post-card {
  background: var(--wood-panel-solid);
  border-color: var(--wood-border);
  padding: 24px 26px;
}
body.home-v2 .post-card .byline { color: var(--wood-cream-dim); }
body.home-v2 .post-card h3 {
  font-family: 'Cinzel', Georgia, serif;
  font-size: 1.2rem;
  letter-spacing: 0.2px;
  line-height: 1.35;
  color: var(--wood-gold);
}
body.home-v2 .post-card h3 a:hover { color: var(--wood-cream); }
body.home-v2 .post-card p { color: var(--wood-cream-dim); }
body.home-v2 .category-pill {
  background: var(--wood-gold-dim);
  color: #0a0e28;
  letter-spacing: 1px;
}

/* About page */
body.home-v2 .about-content p { color: var(--wood-cream-dim); }

/* The three questions the About page holds itself to. Set apart from the prose
   because they are a standard being stated, not a sentence being continued —
   and .about-content had no list styling at all, so left as a plain <ul> they
   would have inherited the browser's default bullets and margins in the middle
   of a typeset page. */
.about-standards {
  list-style: none;
  margin: 0 0 22px;
  padding: 0;
  display: grid;
  gap: 10px;
}
.about-standards li {
  position: relative;
  padding-left: 26px;
  font-size: 1.08rem;
  font-style: italic;
  color: var(--wood-cream);
}
.about-standards li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 0.62em;
  width: 8px;
  height: 8px;
  border: 1.5px solid var(--wood-gold);
  transform: rotate(45deg);
}
body.home-v2 .about-standards li { color: var(--wood-cream); }

/* Shop pills + product grid */
body.home-v2 .shop-pill {
  border-color: var(--wood-border);
  color: var(--wood-cream-dim);
}
body.home-v2 .shop-pill:hover,
body.home-v2 .shop-pill.active {
  background: var(--wood-gold-dim);
  color: #0a0e28;
  border-color: var(--wood-gold-dim);
}
body.home-v2 .product-card {
  background: var(--wood-panel-solid);
  border-color: var(--wood-border);
}
body.home-v2 .product-card-cover--empty { background: var(--wood-bg); }
body.home-v2 .product-card h3 { color: var(--wood-gold); }
body.home-v2 .product-card h3 a:hover { color: var(--wood-cream); }
body.home-v2 .product-price { color: var(--wood-cream); }
body.home-v2 .compare-price { color: var(--wood-cream-dim); }

/* Product detail page */
body.home-v2 .pdp-media img#pdp-main-image,
body.home-v2 .pdp-thumb { border-color: var(--wood-border); }
body.home-v2 .pdp-info h1 { color: var(--wood-gold); }
body.home-v2 .pdp-price { color: var(--wood-cream); }
body.home-v2 .pdp-stock.in-stock { color: #6fbf8f; }
body.home-v2 .pdp-description { color: var(--wood-cream-dim); }
body.home-v2 .pdp-option-label { color: var(--wood-cream); }
body.home-v2 .option-choice {
  background: var(--wood-panel-solid);
  border-color: var(--wood-border);
  color: var(--wood-cream);
}
body.home-v2 .option-choice.selected {
  background: var(--wood-gold-dim);
  color: #0a0e28;
  border-color: var(--wood-gold-dim);
}
body.home-v2 .option-choice.disabled,
body.home-v2 .option-choice:disabled { color: var(--wood-cream-dim); }
body.home-v2 .pdp-text-input {
  background: var(--wood-panel-solid);
  border-color: var(--wood-border);
  color: var(--wood-cream);
}

/* Cart page */
body.home-v2 .cart-line {
  background: var(--wood-panel-solid);
  border-color: var(--wood-border);
}
body.home-v2 .cart-line-img--empty { background: var(--wood-bg); }
body.home-v2 .cart-line-name { color: var(--wood-gold); }
body.home-v2 .cart-line-desc { color: var(--wood-cream-dim); }
body.home-v2 .cart-line-price { color: var(--wood-cream); }
body.home-v2 .cart-qty-input {
  background: var(--wood-panel-solid);
  border-color: var(--wood-border);
  color: var(--wood-cream);
}
body.home-v2 .cart-remove-btn { color: var(--wood-cream-dim); }
body.home-v2 .cart-summary { border-color: var(--wood-border); }
body.home-v2 .cart-subtotal { color: var(--wood-cream); }
body.home-v2 .cart-empty { color: var(--wood-cream-dim); }

/* Subscribe modal (opened from header/footer button on any page) */
body.home-v2 .subscribe-modal-panel { background: var(--wood-panel-solid); }
body.home-v2 .subscribe-modal-panel h3 { color: var(--wood-gold); }
body.home-v2 .subscribe-modal-panel p { color: var(--wood-cream-dim); }
body.home-v2 .subscribe-modal-close { color: var(--wood-cream-dim); }
body.home-v2 .subscribe-modal-close:hover { color: var(--wood-gold); }
body.home-v2 #subscribe-email {
  background: var(--wood-bg);
  border-color: var(--wood-border);
  color: var(--wood-cream);
}

/* Trivia game */
body.home-v2 .trivia-card { background: var(--wood-panel-solid); }
body.home-v2 .trivia-category-card {
  background: var(--wood-panel);
  border-color: var(--wood-border);
}
body.home-v2 .trivia-category-title { color: var(--wood-gold); }
body.home-v2 .trivia-category-sub { color: var(--wood-cream-dim); }
body.home-v2 .trivia-progress-bar { background: var(--wood-border); }
body.home-v2 .trivia-meta { color: var(--wood-cream-dim); }
body.home-v2 .trivia-score-pill {
  background: var(--wood-gold-dim);
  color: #0a0e28;
}
body.home-v2 .trivia-question { color: var(--wood-cream); }
body.home-v2 .trivia-choice {
  background: var(--wood-panel-solid);
  border-color: var(--wood-border);
  color: var(--wood-cream);
}
body.home-v2 .trivia-choice:hover:not(:disabled) { border-color: var(--wood-gold); }
body.home-v2 .trivia-choice-letter { background: var(--wood-gold-dim); color: #0a0e28; }
body.home-v2 .trivia-score-ring::before { background: var(--wood-panel-solid); }
body.home-v2 .trivia-final-score,
body.home-v2 .trivia-message { color: var(--wood-gold); }
body.home-v2 .trivia-secondary-btn {
  border-color: var(--wood-border);
  color: var(--wood-cream);
}
body.home-v2 .trivia-secondary-btn:hover { border-color: var(--wood-gold); color: var(--wood-gold); }
body.home-v2 .trivia-share textarea {
  background: var(--wood-panel-solid);
  border-color: var(--wood-border);
  color: var(--wood-cream);
}

/* Post detail page */
body.home-v2 .post-detail-title { color: var(--wood-gold); }
body.home-v2 .post-body h2, body.home-v2 .post-body h3 { color: var(--wood-gold); }
body.home-v2 .post-body a { color: var(--wood-gold); }

/* --- Rules & Policy Tracker --- */
.rules-hero {
  background: var(--wood-panel-solid);
  border-bottom: 4px solid #1c2458;
  padding: 40px 24px 32px;
  text-align: center;
}
.rules-hero-title {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.9rem;
  margin: 0 0 10px;
}
.rules-hero-sub {
  color: var(--wood-cream-dim);
  font-size: 0.95rem;
  max-width: 640px;
  margin: 0 auto 26px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
.rules-search-bar { max-width: 560px; margin: 0 auto 18px; }
.rules-search-bar input {
  width: 100%;
  padding: 13px 18px;
  font-size: 0.95rem;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  background: rgba(0,0,0,0.35);
  border: 2px solid var(--wood-border);
  border-radius: 4px;
  color: var(--wood-cream);
  box-sizing: border-box;
}
.rules-search-bar input::placeholder { color: var(--wood-cream-dim); }
.rules-search-bar input:focus { outline: none; border-color: var(--wood-gold); }

.rules-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 14px;
}
.rules-filter-group { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
.rules-filter-chip {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--wood-cream-dim);
  background: rgba(0,0,0,0.3);
  border: 1px solid var(--wood-border);
  border-radius: 20px;
  padding: 7px 16px;
  cursor: pointer;
}
.rules-filter-chip:hover { color: var(--wood-cream); }
.rules-filter-chip.active {
  background: linear-gradient(var(--wood-gold), #b8860b);
  border-color: var(--wood-gold);
  color: #0a0e28;
}
.rules-category-select {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--wood-cream);
  background: rgba(0,0,0,0.3);
  border: 1px solid var(--wood-border);
  border-radius: 20px;
  padding: 7px 14px;
  cursor: pointer;
}

.rules-main { max-width: 1100px; margin: 0 auto; padding: 30px 24px 70px; }
.rules-count {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.85rem;
  margin: 0 0 20px;
}
.rules-results {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
  gap: 20px;
}
.rule-card {
  background: var(--wood-panel);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  padding: 20px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.5);
  display: flex;
  flex-direction: column;
}
.rule-card-tags { display: flex; gap: 8px; margin-bottom: 10px; }
.rule-tag {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.65rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 3px 9px;
  border-radius: 2px;
}
.rule-tag-park { color: #0a0e28; }
.rule-tag-disney { background: #9fc9e8; }
.rule-tag-universal { background: #b7d99b; }
.rule-tag-category { background: var(--wood-gold-dim); color: #fff; }
.rule-card-title {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.05rem;
  margin: 0 0 8px;
}
.rule-card-summary {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: #e9c46a;
  font-size: 0.85rem;
  font-weight: bold;
  margin: 0 0 10px;
  line-height: 1.4;
}
.rule-card-details {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.82rem;
  line-height: 1.5;
  margin: 0 0 14px;
  flex-grow: 1;
}
.rule-card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid rgba(58, 66, 117,0.4);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.72rem;
}
.rule-card-footer a { color: var(--wood-gold); text-decoration: none; }
.rule-card-footer a:hover { text-decoration: underline; }
.rule-verified { color: var(--wood-cream-dim); }

/* --- Live Wait Times --- */
.wait-hero {
  background: var(--wood-panel-solid);
  border-bottom: 4px solid #1c2458;
  padding: 40px 24px 32px;
  text-align: center;
}
.wait-hero-title {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.9rem;
  margin: 0 0 10px;
}
.wait-hero-sub {
  color: var(--wood-cream-dim);
  font-size: 0.95rem;
  max-width: 640px;
  margin: 0 auto;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

.wait-main { max-width: 1000px; margin: 0 auto; padding: 30px 24px 70px; }

.wait-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-bottom: 26px;
}
.wait-tab {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  background: var(--wood-panel);
  border: 1px solid var(--wood-border);
  border-radius: 6px;
  padding: 8px 16px;
  cursor: pointer;
  color: var(--wood-cream-dim);
}
.wait-tab-resort {
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  opacity: 0.75;
}
.wait-tab-name { font-size: 0.85rem; font-weight: bold; }
.wait-tab:hover { border-color: var(--wood-gold); color: var(--wood-cream); }
.wait-tab.active {
  background: linear-gradient(var(--wood-gold), #b8860b);
  border-color: var(--wood-gold);
  color: #0a0e28;
}

.wait-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--wood-border);
}
.wait-status {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.85rem;
}
.wait-status strong { color: var(--wood-gold); }
.wait-toolbar-actions { display: flex; gap: 10px; align-items: center; }
.wait-sort-select, .wait-refresh-btn {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  background: rgba(0,0,0,0.3);
  border: 1px solid var(--wood-border);
  border-radius: 20px;
  padding: 7px 14px;
  color: var(--wood-cream);
  cursor: pointer;
}
.wait-refresh-btn:hover { border-color: var(--wood-gold); color: var(--wood-gold); }

.wait-results { display: flex; flex-direction: column; gap: 10px; }
.wait-empty {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.9rem;
  text-align: center;
  padding: 30px 0;
}
.wait-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  background: var(--wood-panel);
  border: 1px solid var(--wood-border);
  border-left: 4px solid var(--wood-border);
  border-radius: 4px;
  padding: 12px 16px;
}
.wait-row-low { border-left-color: #6fae6f; }
.wait-row-medium { border-left-color: #d4af37; }
.wait-row-high { border-left-color: #c0503f; }
.wait-row-closed { border-left-color: #4a4a4a; opacity: 0.65; }

.wait-row-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.wait-ride-name {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 0.98rem;
}
.wait-ride-land {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.wait-row-time { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex-shrink: 0; }
.wait-badge {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: bold;
  font-size: 0.85rem;
  padding: 3px 12px;
  border-radius: 20px;
  white-space: nowrap;
}
.wait-badge-low { background: rgba(111,174,111,0.2); color: #8fd18f; }
.wait-badge-medium { background: rgba(212,175,55,0.2); color: var(--wood-gold); }
.wait-badge-high { background: rgba(192,80,63,0.2); color: #e08a7a; }
.wait-badge-closed { background: rgba(74,74,74,0.3); color: #999; }
.wait-updated {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.68rem;
  color: var(--wood-cream-dim);
}

.wait-disclaimer {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.75rem;
  color: var(--wood-cream-dim);
  text-align: center;
  margin-top: 30px;
}
.wait-disclaimer a { color: var(--wood-gold); }

/* --- Packing List / Trip Planner --- */
.pack-hero {
  background: var(--wood-panel-solid);
  border-bottom: 4px solid #1c2458;
  padding: 40px 24px 32px;
  text-align: center;
}
.pack-hero-title {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.9rem;
  margin: 0 0 10px;
}
.pack-hero-sub {
  color: var(--wood-cream-dim);
  font-size: 0.95rem;
  max-width: 640px;
  margin: 0 auto;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

.pack-main { max-width: 900px; margin: 0 auto; padding: 30px 24px 70px; }

.pack-form {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 16px;
  background: var(--wood-panel);
  border: 1px solid var(--wood-border);
  border-radius: 6px;
  padding: 20px;
  margin-bottom: 24px;
}
.pack-field { display: flex; flex-direction: column; gap: 6px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; }
.pack-field label {
  font-size: 0.72rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--wood-cream-dim);
}
.pack-field input[type="number"],
.pack-field select {
  padding: 9px 12px;
  font-size: 0.9rem;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  background: rgba(0,0,0,0.35);
  border: 2px solid var(--wood-border);
  border-radius: 4px;
  color: var(--wood-cream);
}
.pack-field-checkbox { flex-direction: row; align-items: center; }
.pack-field-checkbox label { text-transform: none; font-size: 0.85rem; color: var(--wood-cream); display: flex; align-items: center; gap: 8px; }
.pack-submit-btn {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  background: linear-gradient(var(--wood-gold), #b8860b);
  border: 1px solid var(--wood-gold);
  border-radius: 20px;
  padding: 11px 24px;
  color: #0a0e28;
  cursor: pointer;
}
.pack-submit-btn:hover { filter: brightness(1.08); }

.pack-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--wood-border);
}
.pack-toolbar.pack-hidden { display: none; }
.pack-progress {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-gold);
  font-weight: bold;
  font-size: 0.9rem;
}
.pack-toolbar-actions { display: flex; gap: 10px; }
.pack-toolbar-btn {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  background: rgba(0,0,0,0.3);
  border: 1px solid var(--wood-border);
  border-radius: 20px;
  padding: 7px 14px;
  color: var(--wood-cream);
  cursor: pointer;
}
.pack-toolbar-btn:hover { border-color: var(--wood-gold); color: var(--wood-gold); }

.pack-results {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr));
  gap: 20px;
}
.pack-category {
  background: var(--wood-panel);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  padding: 18px 20px;
}
.pack-category-title {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1rem;
  margin: 0 0 12px;
  border-bottom: 1px solid rgba(58, 66, 117,0.4);
  padding-bottom: 8px;
}
.pack-item-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.pack-item label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  color: var(--wood-cream);
  cursor: pointer;
  line-height: 1.4;
}
.pack-item input[type="checkbox"] { margin-top: 3px; accent-color: var(--wood-gold); flex-shrink: 0; }
.pack-item-checked label { color: var(--wood-cream-dim); text-decoration: line-through; }

.print-brand { display: none; }

@media print {
  .site-header, .pack-form, .pack-toolbar, .site-footer { display: none; }
  body.home-v2 { background: #fff; color: #000; }
  .pack-category { break-inside: avoid; border-color: #999; }
  .pack-category-title { color: #000; }
  .pack-item label, .pack-item-checked label { color: #000; }
  .pack-main { padding-bottom: 50px; }

  .print-brand {
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
    font-size: 10px;
    letter-spacing: 0.03em;
    color: #444;
    background: #fff;
    border-top: 1px solid #999;
    padding: 6px 0;
  }
  .print-brand strong { color: #000; }
}

/* --- Hidden Mickey Checklist --- */
.mickey-hero {
  background: var(--wood-panel-solid);
  border-bottom: 4px solid #1c2458;
  padding: 56px 24px 44px;
  text-align: center;
}
.mickey-hero-title {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.9rem;
  margin: 0 0 10px;
}
.mickey-hero-sub {
  color: var(--wood-cream-dim);
  font-size: 0.95rem;
  max-width: 640px;
  margin: 0 auto 26px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
.mickey-search-bar { max-width: 560px; margin: 0 auto 18px; }
.mickey-search-bar input {
  width: 100%;
  padding: 13px 18px;
  font-size: 0.95rem;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  background: rgba(0,0,0,0.35);
  border: 2px solid var(--wood-border);
  border-radius: 4px;
  color: var(--wood-cream);
  box-sizing: border-box;
}
.mickey-search-bar input::placeholder { color: var(--wood-cream-dim); }
.mickey-search-bar input:focus { outline: none; border-color: var(--wood-gold); }

.mickey-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 14px;
}
.mickey-filter-group { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
.mickey-filter-chip {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--wood-cream-dim);
  background: rgba(0,0,0,0.3);
  border: 1px solid var(--wood-border);
  border-radius: 20px;
  padding: 7px 16px;
  cursor: pointer;
}
.mickey-filter-chip:hover { color: var(--wood-cream); }
.mickey-filter-chip.active {
  background: linear-gradient(var(--wood-gold), #b8860b);
  border-color: var(--wood-gold);
  color: #0a0e28;
}
.mickey-location-select,
.mickey-difficulty-select,
.mickey-select {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--wood-cream);
  background: rgba(0,0,0,0.3);
  border: 1px solid var(--wood-border);
  border-radius: 20px;
  padding: 7px 14px;
  cursor: pointer;
}

.mickey-main { max-width: 1100px; margin: 0 auto; padding: 44px 24px 80px; }
.mickey-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.mickey-progress {
  height: 8px;
  background: rgba(0,0,0,0.35);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 20px;
}
.mickey-progress-fill {
  height: 100%;
  background: var(--wood-gold);
  border-radius: 4px;
  transition: width 0.35s ease;
}
.mickey-count {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.85rem;
}
.mickey-reset-btn {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  background: rgba(0,0,0,0.3);
  border: 1px solid var(--wood-border);
  border-radius: 20px;
  padding: 7px 14px;
  color: var(--wood-cream);
  cursor: pointer;
}
.mickey-reset-btn:hover { border-color: var(--wood-gold); color: var(--wood-gold); }

.mickey-results {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
  gap: 20px;
}
.mickey-card {
  background: var(--wood-panel);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  padding: 20px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.5);
  display: flex;
  flex-direction: column;
}
.mickey-card-found { border-color: var(--wood-gold); }
.mickey-card-tags { display: flex; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.mickey-tag {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.65rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 3px 9px;
  border-radius: 2px;
}
.mickey-tag-park { background: #9fc9e8; color: #0a0e28; }
.mickey-tag-difficulty { color: #0a0e28; }
.mickey-tag-easy { background: #8fd18f; }
.mickey-tag-medium { background: var(--wood-gold-dim); color: #fff; }
.mickey-tag-hard { background: #e08a7a; }
.mickey-card-title {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.05rem;
  margin: 0 0 4px;
}
.mickey-card-land {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-gold);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin: 0 0 10px;
}
.mickey-card-clue {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.85rem;
  line-height: 1.5;
  margin: 0 0 14px;
  flex-grow: 1;
}
.mickey-found-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.82rem;
  font-weight: bold;
  color: var(--wood-cream);
  cursor: pointer;
  padding-top: 12px;
  border-top: 1px solid rgba(58, 66, 117,0.4);
}
.mickey-found-toggle input { accent-color: var(--wood-gold); }
.mickey-card-found .mickey-found-toggle { color: var(--wood-gold); }

.mickey-disclaimer {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.75rem;
  color: var(--wood-cream-dim);
  text-align: center;
  margin-top: 30px;
}

/* --- Merch Watch --- */
.merch-watch-hero {
  background: var(--wood-panel-solid);
  border-bottom: 4px solid #1c2458;
  padding: 40px 24px 32px;
  text-align: center;
}
.merch-watch-hero-title {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.9rem;
  margin: 0 0 10px;
}
.merch-watch-hero-sub {
  color: var(--wood-cream-dim);
  font-size: 0.95rem;
  max-width: 640px;
  margin: 0 auto 20px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
.merch-watch-search-bar { max-width: 560px; margin: 0 auto 14px; }
.merch-watch-search-bar input {
  width: 100%;
  padding: 13px 18px;
  font-size: 0.95rem;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  background: rgba(0,0,0,0.35);
  border: 2px solid var(--wood-border);
  border-radius: 4px;
  color: var(--wood-cream);
  box-sizing: border-box;
}
.merch-watch-search-bar input::placeholder { color: var(--wood-cream-dim); }
.merch-watch-search-bar input:focus { outline: none; border-color: var(--wood-gold); }
.merch-watch-category-select {
  display: block;
  margin: 0 auto;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--wood-cream);
  background: rgba(0,0,0,0.3);
  border: 1px solid var(--wood-border);
  border-radius: 20px;
  padding: 7px 14px;
  cursor: pointer;
}

.merch-watch-main { max-width: 1100px; margin: 0 auto; padding: 30px 24px 70px; }
/* Sat straight on the site's map background, whose engraved lettering runs
   right through it — the one paragraph on this page that is a legal
   requirement was the hardest thing on it to read. On a panel now, like the
   crowd calendar's controls, for the same reason. */
.merch-watch-disclosure {
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border);
  border-left: 3px solid var(--wood-gold-dim);
  border-radius: 6px;
  padding: 14px 18px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: #cabca6;
  font-size: 0.82rem;
  line-height: 1.55;
  margin: 0 0 16px;
}
/* Same background problem as the disclosure above it, one line further down. */
.merch-watch-count {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.85rem;
  margin: 0 0 20px;
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border);
  border-radius: 6px;
  padding: 9px 14px;
}
.merch-watch-results {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
  gap: 20px;
}
/* The card was padded on the outside, which left nowhere for a full-bleed
   image to sit. Padding moved to the body so the tile can reach the edges. */
.merch-watch-card {
  background: var(--wood-panel);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.5);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
/* Category artwork, not the product. aria-hidden and alt="" because it says
   nothing the category chip below it doesn't already say — announcing
   "Ears & Costume" twice to a screen reader is noise, not information. */
.merch-watch-card-tile {
  display: block; width: 100%; height: auto; aspect-ratio: 4 / 3;
  object-fit: cover;
  border-bottom: 1px solid var(--wood-border);
}
.merch-watch-card-body {
  padding: 18px 20px 20px;
  display: flex; flex-direction: column; flex: 1;
}
.merch-watch-card-tags { display: flex; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.merch-watch-tag {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.65rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 3px 9px;
  border-radius: 2px;
}
.merch-watch-tag-category { background: var(--wood-gold-dim); color: #fff; }
.merch-watch-tag-brand { background: #9fc9e8; color: #0a0e28; }
.merch-watch-card-title {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.02rem;
  margin: 0 0 8px;
}
.merch-watch-card-blurb {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.85rem;
  line-height: 1.5;
  margin: 0 0 16px;
  flex-grow: 1;
}
.merch-watch-buy-btn {
  display: inline-block;
  text-align: center;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.82rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  background: linear-gradient(var(--wood-gold), #b8860b);
  border: 1px solid var(--wood-gold);
  border-radius: 20px;
  padding: 9px 18px;
  color: #0a0e28;
  text-decoration: none;
}
.merch-watch-buy-btn:hover { filter: brightness(1.08); }

/* ==========================================================================
   ATTRACTION GUIDES — dedicated ride guide pages per attraction, plus the hub
   ========================================================================== */

/* Hub page: park groups + card grid */
.attraction-park-group { margin-bottom: 48px; }
.attraction-park-heading {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1.4rem;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--wood-border);
}
.attraction-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr));
  gap: 20px;
}
.attraction-card {
  display: block;
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-border);
  border-radius: 6px;
  overflow: hidden;
  text-decoration: none;
  transition: transform 0.15s, border-color 0.15s;
}
.attraction-card:hover { transform: translateY(-2px); border-color: var(--wood-gold); }
.attraction-card-thumb { width: 100%; height: 150px; background: var(--wood-bg); }
.attraction-card-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.attraction-card-placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #0f1540, var(--wood-bg));
}
.attraction-card-body { padding: 14px 16px; }
.attraction-card-land {
  display: block;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--wood-gold-dim);
  margin-bottom: 6px;
}
.attraction-card-body h3 {
  font-family: 'Cinzel', Georgia, serif;
  font-size: 1.05rem;
  color: var(--wood-cream);
  margin: 0;
}

/* Detail page: hero + two-column layout */
/* RESERVE THE HERO'S SPACE BEFORE THE PHOTO ARRIVES
   This was `max-height`, which reserves nothing: a max only caps a height the
   box already has, and an <img> of unknown intrinsic size gives its parent a
   height of zero until it decodes. So every one of the 105 record pages laid
   out with no hero, then shoved the whole article down by up to 440px when the
   photo landed — a large Cumulative Layout Shift on the site's most numerous
   pages, and it happens on the slow connections where it's most annoying.

   The usual fix is width/height attributes on the <img>, but that isn't the
   right tool here and the numbers aren't knowable: the heroes are hosted on
   Wikimedia and Wix and their intrinsic sizes all differ. It's also unnecessary
   — `object-fit: cover` means the photo's own aspect ratio has no bearing on
   layout, the container crops to fit. So a reserved height on the container is
   not an estimate of the image; it is exactly the space the image will occupy,
   whatever file ends up in it.

   clamp() keeps it a band rather than a fixed slab: ~38vw between a 220px floor
   on a phone and the same 440px ceiling it had on a desktop, so nothing about
   the current look changes above 1160px. */
.attraction-hero {
  position: relative;
  width: 100%;
  height: clamp(220px, 38vw, 440px);
  overflow: hidden;
  background: var(--wood-bg);
}
.attraction-hero-img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Creative Commons photos require visible attribution — same treatment as
   .resort-hero-credit on the resort, event and Universal hotel pages. */
.attraction-hero-credit {
  position: absolute;
  right: 10px;
  bottom: 10px;
  background: rgba(11, 16, 48, 0.65);
  color: var(--wood-cream-dim);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.7rem;
  padding: 4px 10px;
  border-radius: 4px;
  line-height: 1.3;
}
.attraction-hero-placeholder {
  width: 100%;
  /* Fills the height its container now reserves, so a record with no photo
     yet shows one gradient band rather than a short panel above a strip of
     bare background. */
  height: 100%;
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #0f1540, var(--wood-bg));
  border-bottom: 3px solid var(--wood-border);
  padding: 24px;
}
.attraction-hero-placeholder span {
  color: var(--wood-cream-dim);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  text-align: center;
  max-width: 420px;
}

.attraction-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 40px;
  padding: 40px 24px 60px;
  align-items: start;
}
@media (max-width: 900px) {
  .attraction-layout { grid-template-columns: 1fr; }
}

.attraction-breadcrumb {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.8rem;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--wood-gold-dim);
  margin-bottom: 8px;
}
.attraction-title {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 2rem;
  margin-bottom: 24px;
}
.attraction-section-heading {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.3rem;
  margin: 32px 0 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--wood-border);
}
.attraction-main p { color: var(--wood-cream-dim); line-height: 1.7; margin-bottom: 14px; }
.attraction-tips { padding-left: 20px; margin: 0; }
.attraction-tips li { color: var(--wood-cream-dim); line-height: 1.7; margin-bottom: 10px; }

.attraction-sidebar { position: sticky; top: 90px; }
.logbook-stats-card {
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-gold-dim);
  border-radius: 6px;
  padding: 20px;
}
.logbook-stats-title {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--wood-border);
}
.logbook-stat {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(58, 66, 117, 0.3);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
}
.logbook-stat:last-child { border-bottom: none; }
.logbook-stat-label { color: var(--wood-cream-dim); }

/* --- WDW Dining Guide --- */
.dining-hero {
  background: var(--wood-panel-solid);
  border-bottom: 4px solid #1c2458;
  padding: 56px 24px 44px;
  text-align: center;
}
.dining-hero-title {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.9rem;
  margin: 0 0 10px;
}
.dining-hero-sub {
  color: var(--wood-cream-dim);
  font-size: 0.95rem;
  max-width: 640px;
  margin: 0 auto 18px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
.dining-disclaimer {
  max-width: 640px;
  margin: 0 auto 26px;
  color: var(--wood-gold-dim);
  font-size: 0.78rem;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  line-height: 1.5;
}
/* --- Shared page-hero notice (reused across feature pages) --- */
.section-notice {
  max-width: 640px;
  margin: 0 auto 26px;
  color: var(--wood-gold-dim);
  font-size: 0.78rem;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  line-height: 1.5;
}

.dining-search-bar { max-width: 560px; margin: 0 auto 18px; }
.dining-search-bar input {
  width: 100%;
  padding: 13px 18px;
  font-size: 0.95rem;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  background: rgba(0,0,0,0.35);
  border: 2px solid var(--wood-border);
  border-radius: 4px;
  color: var(--wood-cream);
  box-sizing: border-box;
}
.dining-search-bar input::placeholder { color: var(--wood-cream-dim); }
.dining-search-bar input:focus { outline: none; border-color: var(--wood-gold); }

.dining-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 14px;
}
.dining-filter-group { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
.dining-filter-chip {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--wood-cream-dim);
  background: rgba(0,0,0,0.3);
  border: 1px solid var(--wood-border);
  border-radius: 20px;
  padding: 7px 16px;
  cursor: pointer;
}
.dining-filter-chip:hover { color: var(--wood-cream); }
.dining-filter-chip.active {
  background: linear-gradient(var(--wood-gold), #b8860b);
  border-color: var(--wood-gold);
  color: #0a0e28;
}
.dining-char-toggle {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--wood-cream-dim);
  background: rgba(0,0,0,0.3);
  border: 1px solid var(--wood-border);
  border-radius: 20px;
  padding: 7px 16px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.dining-char-toggle:hover { color: var(--wood-cream); }
.dining-char-toggle.active {
  background: linear-gradient(var(--wood-gold), #b8860b);
  border-color: var(--wood-gold);
  color: #0a0e28;
}

.dining-main { max-width: 1100px; margin: 0 auto; padding: 44px 24px 80px; }
.dining-count {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.85rem;
  margin: 0 0 20px;
}
.dining-results { display: flex; flex-direction: column; gap: 14px; }
.dining-card {
  background: var(--wood-panel);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.5);
  overflow: hidden;
}
.dining-card-summary {
  padding: 18px 20px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}
.dining-card-summary:hover { background: rgba(255,255,255,0.03); }
.dining-card-photo {
  flex-shrink: 0;
  width: 130px;
  height: 88px;
  border-radius: 3px;
  overflow: hidden;
  border: 1px solid var(--wood-border);
}
.dining-card-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media (max-width: 560px) {
  .dining-card-photo { display: none; }
}
.dining-card-main { flex: 1; min-width: 0; }
.dining-card-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.dining-tag {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.62rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 3px 9px;
  border-radius: 2px;
  background: rgba(0,0,0,0.3);
  color: var(--wood-cream-dim);
  border: 1px solid var(--wood-border);
  white-space: nowrap;
}
/* nowrap keeps a two-word tag on one line, which is what it is for. But the
   Universal guide has location tags like "Universal's Endless Summer Resort —
   Dockside Inn and Suites", and on a phone that is 384px of unbreakable text
   in a 239px card: it ran 42px past the right edge of the screen and the end
   of the hotel name was simply cut off. The parent is overflow:visible, so
   nothing scrolled and nothing warned. Let long ones wrap where there isn't
   room; the short ones are unaffected because they still fit on one line. */
@media (max-width: 700px) {
  .dining-tag { white-space: normal; }
}
.dining-tag-park { background: var(--wood-gold-dim); color: #fff; border-color: transparent; }
.dining-tag-char { background: #9c3b3b; color: #fff; border-color: transparent; }
.dining-card-name {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.1rem;
  margin: 0 0 6px;
}
.dining-card-location {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.8rem;
  margin: 0;
}
.dining-card-pricing {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  flex-shrink: 0;
  text-align: right;
}
.dining-price-row {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.75rem;
  color: var(--wood-cream-dim);
  white-space: nowrap;
}
.dining-price-tier { color: var(--wood-gold); font-weight: bold; }
.dining-card-chevron {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-gold-dim);
  font-size: 0.8rem;
  margin-left: 8px;
  flex-shrink: 0;
  transition: transform 0.15s ease;
}
.dining-card.expanded .dining-card-chevron { transform: rotate(180deg); }

.dining-card-menu {
  border-top: 1px solid var(--wood-border);
  padding: 18px 20px 22px;
  background: rgba(0,0,0,0.2);
}
.dining-menu-loading {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.85rem;
}
.dining-menu-meal-title {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1.35rem;
  letter-spacing: 0.3px;
  margin: 34px 0 6px;
}
.dining-menu-meal-title:first-child { margin-top: 4px; }
.dining-menu-category-title {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.72rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 22px 0 4px;
  padding-top: 18px;
  border-top: 1px dashed var(--wood-border);
}
.dining-menu-category-title:first-of-type { border-top: none; padding-top: 0; margin-top: 10px; }
.dining-menu-item {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 18px;
  padding: 10px 0;
}
.dining-menu-item-text { flex: 1; min-width: 0; }
.dining-menu-item-name {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream);
  font-size: 0.92rem;
  font-weight: bold;
  margin: 0 0 3px;
}
.dining-menu-item-desc {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.8rem;
  line-height: 1.45;
  margin: 0;
}
.dining-menu-item-price {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-gold);
  font-size: 0.88rem;
  font-weight: bold;
  white-space: nowrap;
  flex-shrink: 0;
}
.logbook-stat-value { color: var(--wood-cream); font-weight: 700; text-align: right; }

/* ==========================================================================
   RESORT HOTELS — dedicated resort guide pages per resort, plus the hub
   ========================================================================== */

/* Hub page: category groups + card grid */
.resort-category-group { margin-bottom: 48px; }
.resort-category-heading {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1.4rem;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--wood-border);
}
.resort-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr));
  gap: 20px;
}
.resort-card {
  display: block;
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-border);
  border-radius: 6px;
  overflow: hidden;
  text-decoration: none;
  transition: transform 0.15s, border-color 0.15s;
}
.resort-card:hover { transform: translateY(-2px); border-color: var(--wood-gold); }
.resort-card-thumb { position: relative; width: 100%; height: 150px; background: var(--wood-bg); }
.resort-card-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.resort-card-placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #0f1540, var(--wood-bg));
}
.resort-coming-soon-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: var(--wood-gold);
  color: #0f1540;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.3px;
  padding: 4px 10px;
  border-radius: 4px;
}
.resort-card-coming-soon { opacity: 0.92; }
.universal-express-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  background: #0e4d92;
  color: #fff;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.3px;
  padding: 4px 10px;
  border-radius: 4px;
}
.resort-card-body { padding: 14px 16px; }
.resort-card-area {
  display: block;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--wood-gold-dim);
  margin-bottom: 6px;
}
.resort-card-body h3 {
  font-family: 'Cinzel', Georgia, serif;
  font-size: 1.05rem;
  color: var(--wood-cream);
  margin: 0;
}

/* Detail page: hero + two-column layout */
/* Same reserved band as .attraction-hero — see the note there for why this is a
   height and not width/height attributes on the <img>. This one carries the
   resort, event and Universal hotel heroes, so it covers the other 55 records. */
.resort-hero {
  position: relative;
  width: 100%;
  height: clamp(220px, 38vw, 440px);
  overflow: hidden;
  background: var(--wood-bg);
}
.resort-hero-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.resort-hero-credit {
  position: absolute;
  right: 10px;
  bottom: 10px;
  background: rgba(11, 16, 48, 0.65);
  color: var(--wood-cream-dim);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.7rem;
  padding: 4px 10px;
  border-radius: 4px;
  line-height: 1.3;
}
.resort-hero-placeholder {
  width: 100%;
  /* Fills the height its container now reserves, so a record with no photo
     yet shows one gradient band rather than a short panel above a strip of
     bare background. */
  height: 100%;
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #0f1540, var(--wood-bg));
  border-bottom: 3px solid var(--wood-border);
  padding: 24px;
}
.resort-hero-placeholder span {
  color: var(--wood-cream-dim);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  text-align: center;
  max-width: 420px;
}

.resort-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 40px;
  padding: 40px 24px 60px;
  align-items: start;
}
@media (max-width: 900px) {
  .resort-layout { grid-template-columns: 1fr; }
}

.resort-breadcrumb {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.8rem;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--wood-gold-dim);
  margin-bottom: 8px;
}
.resort-title {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 2rem;
  margin-bottom: 24px;
}
.resort-section-heading {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.3rem;
  margin: 32px 0 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--wood-border);
}
.resort-main p { color: var(--wood-cream-dim); line-height: 1.7; margin-bottom: 14px; }
.resort-tips { padding-left: 20px; margin: 0; }
.resort-tips li { color: var(--wood-cream-dim); line-height: 1.7; margin-bottom: 10px; }

.resort-sidebar { position: sticky; top: 90px; }

/* Cross-linked dining list on a resort's detail page */
.resort-dining-heading {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.05rem;
  margin: 20px 0 12px;
}
.resort-dining-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(200px, 100%), 1fr));
  gap: 10px;
  margin-bottom: 10px;
}
.resort-dining-card {
  display: block;
  background: var(--wood-panel);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  padding: 10px 14px;
  text-decoration: none;
}
.resort-dining-card:hover { border-color: var(--wood-gold); }
.resort-dining-name {
  display: block;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  font-weight: bold;
  color: var(--wood-cream);
}
.resort-dining-meta {
  display: block;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.72rem;
  color: var(--wood-gold-dim);
  margin-top: 2px;
}
.resort-dining-note {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  color: var(--wood-cream-dim);
}
.resort-dining-note a { color: var(--wood-gold); }

.resort-browse-heading {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1.5rem;
  margin: 0 0 24px;
  text-align: center;
}

/* --- Resort Matchmaker quiz --- */
.matchmaker-section {
  background: var(--wood-panel-solid);
  border-bottom: 3px solid #1c2458;
  padding: 40px 24px 50px;
}
.matchmaker-intro { text-align: center; max-width: 640px; margin: 0 auto 30px; }
.matchmaker-title {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1.7rem;
  margin: 0 0 10px;
}
.matchmaker-sub {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.95rem;
  line-height: 1.6;
}
.matchmaker-questions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap: 24px;
  max-width: 1000px;
  margin: 0 auto 28px;
}
.matchmaker-question-title {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 0.95rem;
  margin: 0 0 12px;
}
.matchmaker-options { display: flex; flex-wrap: wrap; gap: 8px; }
.matchmaker-option {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  font-weight: bold;
  color: var(--wood-cream-dim);
  background: rgba(0,0,0,0.3);
  border: 1px solid var(--wood-border);
  border-radius: 20px;
  padding: 8px 16px;
  cursor: pointer;
}
.matchmaker-option:hover { color: var(--wood-cream); }
.matchmaker-option.active {
  background: linear-gradient(var(--wood-gold), #b8860b);
  border-color: var(--wood-gold);
  color: #0a0e28;
}
.matchmaker-option-neutral { opacity: 0.75; }
.matchmaker-submit {
  display: block;
  margin: 0 auto;
}
.matchmaker-submit:disabled { opacity: 0.4; cursor: not-allowed; }
.matchmaker-results { max-width: 1000px; margin: 36px auto 0; }
.matchmaker-results-title {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1.2rem;
  text-align: center;
  margin: 0 0 20px;
}
.resort-match-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap: 20px;
}
.resort-match-card {
  display: block;
  background: var(--wood-panel);
  border: 1px solid var(--wood-gold-dim);
  border-radius: 6px;
  overflow: hidden;
  text-decoration: none;
  transition: transform 0.15s;
}
.resort-match-card:hover { transform: translateY(-2px); }
.resort-match-thumb { width: 100%; height: 140px; background: var(--wood-bg); }
.resort-match-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.resort-match-body { padding: 14px 16px; }
.resort-match-score { color: var(--wood-gold); font-size: 0.9rem; letter-spacing: 2px; }
.resort-match-body h3 {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.05rem;
  margin: 6px 0 4px;
}
.resort-match-body p {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.78rem;
  margin: 0;
}

/* ==========================================================================
   REFURBISHMENT / CLOSURES & CONSTRUCTION TRACKER
   ========================================================================== */
.tracker-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
  gap: 22px;
}
.tracker-card {
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-border);
  border-radius: 6px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.tracker-card-thumb {
  position: relative;
  width: 100%;
  height: 170px;
  background: var(--wood-bg);
}
.tracker-card-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tracker-badge {
  position: absolute;
  bottom: 10px;
  left: 10px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.3px;
  padding: 4px 10px;
  border-radius: 4px;
  color: #fff;
}
.tracker-badge-closure { background: #9a3324; }
.tracker-badge-construction { background: #0e6b3e; }
.tracker-company-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.3px;
  padding: 4px 10px;
  border-radius: 4px;
  color: #0f1540;
  background: var(--wood-gold);
}
.tracker-company-universal { background: #0e4d92; color: #fff; }
.tracker-card-body { padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.tracker-card-location {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--wood-gold-dim);
}
.tracker-card-name {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-cream);
  font-size: 1.1rem;
  margin: 0;
}
.tracker-card-desc {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.85rem;
  line-height: 1.5;
  margin: 0;
}
.tracker-card-dates {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  color: var(--wood-cream-dim);
  border-top: 1px solid var(--wood-border);
  padding-top: 8px;
  margin-top: 2px;
}
.tracker-card-dates strong { color: var(--wood-cream); }
.tracker-source-link {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.72rem;
  color: var(--wood-gold-dim);
  text-decoration: none;
  margin-top: auto;
}

/* --- Homepage "Parks" section --- */
.parks-section {
  max-width: 1400px;
  margin: 0 auto;
  padding: 70px 24px;
  text-align: center;
}
.tagline-divider {
  max-width: 700px;
  margin: 0 auto;
  padding: 10px 24px 60px;
  text-align: center;
}
.tagline-divider p {
  font-family: 'Cinzel', Georgia, serif;
  font-style: italic;
  font-size: 1.15rem;
  color: var(--wood-cream);
  letter-spacing: 0.3px;
  margin: 0;
}
.tagline-divider .compass-mark {
  display: block;
  width: 150px;
  height: 150px;
  margin: 8px auto 0;
}
.parks-section .box-title {
  justify-content: center;
  border-bottom: none;
  font-size: 1.6rem;
  margin-bottom: 6px;
}
.parks-section .box-title::before,
.parks-section .box-title::after { content: '♦'; color: var(--wood-gold-dim); }
.parks-subtitle {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.95rem;
  margin: 0 0 30px;
}
.parks-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
  gap: 24px;
}
/* auto-fit COLLAPSES the tracks it doesn't fill and hands the space to what's
   left, so a row holding one card gives that card the entire width. The video
   row expects three; when the channel's last ten uploads were nine Shorts and
   one real video it got one, and that card rendered 1,217px wide with its
   thumbnail cropped to a strip. Capping the card is enough — three cards land
   at ~390px so they never reach this, and every breakpoint behaves as before.
   auto-fill instead of auto-fit would have reshaped the row at every width. */
#recent-videos-grid .park-card { max-width: 420px; }
.park-card {
  display: flex;
  flex-direction: column;
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  overflow: hidden;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(0,0,0,0.5);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.park-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 18px rgba(0,0,0,0.6);
}
.park-card-img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
}
.park-card-placeholder {
  width: 100%;
  height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--wood-bg);
}
.park-card-placeholder svg { width: 40px; height: 40px; color: var(--wood-gold-dim); }
.park-card-thumb { position: relative; }
.park-card-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 56px;
  height: 40px;
  color: #fff;
  background: rgba(255, 0, 0, 0.9);
  border-radius: 8px;
  padding: 8px;
  box-sizing: border-box;
  transition: background 0.15s;
  pointer-events: none;
}
.park-card:hover .park-card-play { background: #FF0000; }
.park-card-label {
  padding: 14px 12px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 1.02rem;
  color: var(--wood-gold);
  text-align: center;
}
.park-card-label .coming-soon {
  display: block;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.68rem;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--wood-cream-dim);
  margin-top: 3px;
}
.tracker-source-link:hover { color: var(--wood-gold); text-decoration: underline; }

/* --- Pinned latest-video widget --- */
.pinned-video-widget {
  display: none;
  position: fixed;
  bottom: 24px;
  right: 20px;
  width: 260px;
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-gold-dim);
  border-radius: 6px;
  box-shadow: 0 8px 22px rgba(0,0,0,0.6);
  z-index: 150;
  opacity: 0;
  transform: translateX(12px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}
.pinned-video-widget.is-visible {
  display: block;
  opacity: 1;
  transform: translateX(0);
}
.pinned-video-close {
  position: absolute;
  top: -10px;
  right: -10px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--wood-gold-dim);
  color: #fff;
  border: 2px solid var(--wood-bg);
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
.pinned-video-close:hover { background: var(--wood-gold); color: var(--wood-bg); }
.pinned-video-link {
  display: block;
  text-decoration: none;
  position: relative;
}
.pinned-video-thumb {
  display: block;
  width: 100%;
  height: 146px;
  object-fit: cover;
  border-radius: 6px 6px 0 0;
}
.pinned-video-play {
  position: absolute;
  top: 55px;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  height: 40px;
  color: #fff;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.7));
  pointer-events: none;
}
.pinned-video-label {
  display: block;
  padding: 8px 12px 0;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.68rem;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--wood-gold-dim);
}
.pinned-video-title {
  display: block;
  padding: 3px 12px 12px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.88rem;
  line-height: 1.3;
  color: var(--wood-cream);
}
@media (max-width: 900px) {
  .pinned-video-widget { display: none !important; }
}

/* --- Park Recipes --- */
.recipes-wrap { padding: 20px 0 60px; }
.recipe-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr));
  gap: 26px;
}
.recipe-card {
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-border);
  border-top: 3px solid var(--wood-gold-dim);
  border-radius: 4px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.5);
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.recipe-card:hover, .recipe-card:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 8px 18px rgba(0,0,0,0.6);
  outline: none;
}
.recipe-card-summary { padding: 22px 24px; }
.recipe-card-badges { display: flex; gap: 6px; margin-bottom: 12px; }
.recipe-badge {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.62rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 3px 9px;
  border-radius: 2px;
  background: rgba(0,0,0,0.3);
  color: var(--wood-cream-dim);
  border: 1px solid var(--wood-border);
}
.recipe-badge-park { background: var(--wood-gold-dim); color: #0a0e28; border-color: transparent; }
.recipe-card-name {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1.3rem;
  margin: 0 0 6px;
}
.recipe-card-inspired {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-style: italic;
  color: var(--wood-cream-dim);
  font-size: 0.82rem;
  margin: 0 0 12px;
}
.recipe-card-intro {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.88rem;
  line-height: 1.55;
  margin: 0 0 16px;
}
.recipe-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  color: var(--wood-cream-dim);
  border-top: 1px dashed var(--wood-border);
  border-bottom: 1px dashed var(--wood-border);
  padding: 10px 0;
  margin-bottom: 16px;
}
.recipe-card-meta strong { color: var(--wood-cream); }
.recipe-toggle {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  font-weight: bold;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--wood-gold);
  background: none;
  border: 1px solid var(--wood-gold-dim);
  border-radius: 3px;
  padding: 8px 16px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: background 0.15s, color 0.15s;
}
.recipe-toggle:hover { background: var(--wood-gold-dim); color: #0a0e28; }
body.recipe-modal-open { overflow: hidden; }
.recipe-modal-root {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.recipe-modal-root[hidden] { display: none; }
.recipe-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.75);
}
.recipe-modal {
  position: relative;
  width: 100%;
  max-width: 880px;
  max-height: 90vh;
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-gold-dim);
  border-top: 4px solid var(--wood-gold);
  border-radius: 6px;
  box-shadow: 0 16px 48px rgba(0,0,0,0.8);
  display: flex;
}
.recipe-modal-scroll {
  overflow-y: auto;
  padding: 34px 38px 40px;
  width: 100%;
}
.recipe-modal-close {
  position: absolute;
  top: -14px;
  right: -14px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--wood-gold);
  color: #0a0e28;
  border: 2px solid var(--wood-bg);
  font-size: 1.3rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
.recipe-modal-close:hover { background: var(--wood-cream); }
.recipe-modal-name {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1.9rem;
  line-height: 1.25;
  margin: 0 0 6px;
}
.recipe-modal-intro {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.95rem;
  line-height: 1.6;
  margin: 0 0 16px;
}
.recipe-modal-columns {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 30px;
  margin-top: 20px;
}
.recipe-modal .recipe-ingredients,
.recipe-modal .recipe-steps {
  font-size: 0.92rem;
  line-height: 1.7;
}
@media (max-width: 640px) {
  .recipe-modal-root { padding: 12px; }
  .recipe-modal-scroll { padding: 26px 22px 30px; }
  .recipe-modal-columns { grid-template-columns: 1fr; gap: 20px; }
  .recipe-modal-close { top: 8px; right: 8px; }
}
.recipe-detail-col h4 {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  margin: 0 0 10px;
}
.recipe-ingredients, .recipe-steps {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.82rem;
  line-height: 1.6;
  margin: 0;
  padding-left: 18px;
}
.recipe-ingredients li, .recipe-steps li { margin-bottom: 6px; }
.recipe-steps { padding-left: 20px; }

/* --- Trip calculators --- */
.calc-wrap { padding: 44px 0 80px; }
.calc-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 30px;
  align-items: start;
}
@media (max-width: 860px) { .calc-grid { grid-template-columns: 1fr; } }
.calc-panel {
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-border);
  border-top: 3px solid var(--wood-gold-dim);
  border-radius: 4px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.5);
  padding: 28px 30px 32px;
}
.calc-panel-title {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1.25rem;
  margin: 0 0 22px;
}
.calc-field { margin-bottom: 24px; }
.calc-field:last-child { margin-bottom: 0; }
.calc-field label {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.88rem;
  font-weight: bold;
  color: var(--wood-cream);
  margin-bottom: 10px;
}
.calc-field output {
  color: var(--wood-gold);
  font-size: 1rem;
  white-space: nowrap;
}
.calc-field input[type="number"] {
  width: 110px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 1rem;
  font-weight: bold;
  color: var(--wood-cream);
  background: rgba(0,0,0,0.3);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  padding: 9px 12px;
}
.calc-field input[type="number"]:focus { outline: none; border-color: var(--wood-gold); }
.calc-field input[type="range"] {
  width: 100%;
  accent-color: #d4af37;
  cursor: pointer;
}
.calc-hint {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.76rem;
  line-height: 1.5;
  color: var(--wood-cream-dim);
  margin: 8px 0 0;
}
.calc-stat {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  padding: 13px 0;
  border-bottom: 1px dashed var(--wood-border);
}
.calc-stat-label {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  color: var(--wood-cream-dim);
}
.calc-stat-value {
  font-family: 'Cinzel', Georgia, serif;
  font-size: 1.5rem;
  color: var(--wood-gold);
  white-space: nowrap;
}
.calc-verdict {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.9rem;
  line-height: 1.6;
  color: var(--wood-cream);
  border-radius: 4px;
  border: 1px solid var(--wood-border);
  border-left-width: 4px;
  padding: 16px 18px;
  margin-top: 22px;
}
.calc-verdict strong { font-family: 'Cinzel', Georgia, serif; letter-spacing: 0.3px; }
.calc-verdict-good { border-left-color: #4c9a5f; }
.calc-verdict-good strong { color: #7fd196; }
.calc-verdict-mid { border-left-color: #d4af37; }
.calc-verdict-mid strong { color: var(--wood-gold); }
.calc-verdict-bad { border-left-color: #9c3b3b; }
.calc-verdict-bad strong { color: #e08a8a; }
.calc-methodology {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.76rem;
  line-height: 1.55;
  color: var(--wood-cream-dim);
  border-top: 1px solid var(--wood-border);
  padding-top: 14px;
  margin: 20px 0 0;
}
.calc-disclaimer {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  line-height: 1.55;
  color: var(--wood-cream-dim);
  text-align: center;
  max-width: 720px;
  margin: 34px auto 0;
}

/* --- LOGGED date stamp on article headers --- */
.post-detail-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.log-stamp {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.72rem;
  font-weight: bold;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #c05f4e;
  border: 2px solid #c05f4e;
  border-radius: 3px;
  padding: 5px 12px;
  transform: rotate(-2.5deg);
  opacity: 0.85;
  white-space: nowrap;
  box-shadow: inset 0 0 4px rgba(192, 95, 78, 0.25);
}

/* --- Epic Universe / pillar guide page --- */
.guide-wrap { max-width: 820px; padding: 40px 0 70px; }
.guide-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr));
  gap: 14px;
  margin-bottom: 34px;
}
.guide-fact {
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  padding: 14px 16px;
  text-align: center;
}
.guide-fact-label {
  display: block;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.68rem;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--wood-cream-dim);
  margin-bottom: 5px;
}
.guide-fact-value {
  display: block;
  font-family: 'Cinzel', Georgia, serif;
  font-size: 1.05rem;
  color: var(--wood-gold);
}
.guide-toc {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  background: var(--wood-panel);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  padding: 14px 20px;
  margin-bottom: 44px;
}
.guide-toc-label {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.72rem;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--wood-cream-dim);
}
.guide-toc a {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  color: var(--wood-gold);
  border-bottom: 1px solid transparent;
}
.guide-toc a:hover { border-bottom-color: var(--wood-gold); }
.guide-section {
  margin-bottom: 52px;
  scroll-margin-top: 90px;
}
.guide-section h2 {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1.7rem;
  line-height: 1.25;
  margin: 0 0 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--wood-border);
}
.guide-section h3 {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.82rem;
  font-weight: bold;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--wood-cream-dim);
  margin: 26px 0 10px;
}
.guide-section p {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 1.02rem;
  line-height: 1.75;
  color: var(--wood-cream);
  margin: 0 0 16px;
}
.guide-section ul, .guide-section ol {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 1.02rem;
  line-height: 1.7;
  color: var(--wood-cream);
  margin: 0 0 16px;
  padding-left: 22px;
}
.guide-section li { margin-bottom: 12px; }
.guide-section strong { color: var(--wood-gold); }
.guide-section a { color: #e0b64a; border-bottom: 1px solid rgba(224,182,74,0.4); }
.guide-section a:hover { border-bottom-color: #e0b64a; }
.guide-photo {
  width: 100%;
  height: 300px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid var(--wood-border);
  margin-bottom: 20px;
}
.guide-rank-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--wood-border);
  padding-bottom: 12px;
  margin-bottom: 18px;
}
.guide-rank-header h2 { border: none; padding: 0; margin: 0; }
.guide-rank-note {
  font-style: italic;
  color: var(--wood-cream-dim) !important;
  font-size: 0.95rem !important;
}
.guide-ranked-list { counter-reset: rank; padding-left: 0 !important; list-style: none; }
.guide-ranked-list li {
  counter-increment: rank;
  position: relative;
  padding-left: 46px;
  margin-bottom: 16px;
  min-height: 34px;
}
.guide-ranked-list li::before {
  content: counter(rank);
  position: absolute;
  left: 0;
  top: 0;
  width: 32px;
  height: 32px;
  background: var(--wood-gold-dim);
  color: #0a0e28;
  font-family: 'Cinzel', Georgia, serif;
  font-weight: bold;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.guide-rank-changelog {
  background: var(--wood-panel);
  border-left: 4px solid var(--wood-gold-dim);
  border-radius: 0 4px 4px 0;
  padding: 14px 18px;
  font-size: 0.95rem !important;
}
.guide-tips-list li { margin-bottom: 14px; }
.guide-disclaimer {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  line-height: 1.55;
  color: var(--wood-cream-dim);
  text-align: center;
  border-top: 1px solid var(--wood-border);
  padding-top: 22px;
  margin-top: 20px;
}

/* --- Recipe readability: lighter small print on cards + modal --- */
.recipe-card-inspired,
.recipe-card-intro,
.recipe-card-meta,
.recipe-ingredients,
.recipe-steps,
.recipe-modal-intro {
  color: #cabca6;
}
.recipe-card-meta strong,
.recipe-modal .recipe-card-meta strong { color: #ece0cd; }

/* --- Rope Drop Plans --- */
.plans-wrap { padding: 44px 0 80px; }
.plan-toolbar { margin-bottom: 26px; }
.plan-grid { display: flex; flex-direction: column; gap: 22px; }
.plan-card {
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-border);
  border-top: 3px solid var(--wood-gold-dim);
  border-radius: 4px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.5);
  overflow: hidden;
}
.plan-card-head { padding: 26px 28px; }
.plan-badge {
  display: inline-block;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.62rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 4px 10px;
  border-radius: 2px;
  background: var(--wood-gold-dim);
  color: #0a0e28;
  margin-bottom: 12px;
}
.plan-card-title {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1.35rem;
  margin: 0 0 6px;
}
.plan-card-party {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-style: italic;
  color: #cabca6;
  font-size: 0.9rem;
  margin: 0 0 10px;
}
.plan-card-bestfor {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: #cabca6;
  font-size: 0.86rem;
  line-height: 1.55;
  margin: 0 0 18px;
}
.plan-card-bestfor strong { color: #ece0cd; }
.plan-card-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.plan-toggle, .plan-print {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.76rem;
  font-weight: bold;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--wood-gold);
  background: none;
  border: 1px solid var(--wood-gold-dim);
  border-radius: 3px;
  padding: 8px 16px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.plan-toggle:hover, .plan-print:hover { background: var(--wood-gold-dim); color: #0a0e28; }
.plan-detail {
  border-top: 1px solid var(--wood-border);
  background: rgba(0,0,0,0.2);
  padding: 24px 28px 28px;
}
.plan-premise {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: #cabca6;
  font-size: 0.9rem;
  line-height: 1.65;
  margin: 0 0 22px;
  padding-bottom: 18px;
  border-bottom: 1px dashed var(--wood-border);
}
.plan-steps { list-style: none; margin: 0; padding: 0; counter-reset: plan-step; }
.plan-step {
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 4px 18px;
  padding: 14px 0;
  border-bottom: 1px dashed rgba(28, 36, 88, 0.5);
}
.plan-step:last-child { border-bottom: none; }
.plan-step-time {
  grid-row: span 2;
  font-family: 'Cinzel', Georgia, serif;
  font-size: 0.82rem;
  color: var(--wood-gold);
  letter-spacing: 0.3px;
  padding-top: 2px;
}
.plan-step-what {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.94rem;
  font-weight: bold;
  color: #ece0cd;
}
.plan-step-detail {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.84rem;
  line-height: 1.55;
  color: #cabca6;
}
.plan-skip {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.86rem;
  line-height: 1.6;
  color: #cabca6;
  border-left: 3px solid #9c3b3b;
  padding: 12px 16px;
  margin: 22px 0 0;
  background: rgba(0,0,0,0.2);
}
.plan-skip strong { color: #e08a8a; }
.plan-disclaimer {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  line-height: 1.6;
  color: #cabca6;
  text-align: center;
  max-width: 760px;
  margin: 36px auto 0;
}
@media (max-width: 560px) {
  .plan-step { grid-template-columns: 1fr; }
  .plan-step-time { grid-row: auto; }
}

/* Print: isolate the single plan the user asked to print */
@media print {
  body.printing-one-plan .site-header,
  body.printing-one-plan .site-footer,
  body.printing-one-plan .page-hero,
  body.printing-one-plan .no-print,
  body.printing-one-plan .pinned-video-widget,
  body.printing-one-plan .plan-card-actions { display: none !important; }
  body.printing-one-plan .plan-card { display: none; }
  body.printing-one-plan .plan-card.print-target { display: block; }
  body.printing-one-plan {
    background: #fff !important;
    color: #000 !important;
  }
  body.printing-one-plan .plan-card.print-target {
    border: 1px solid #999;
    box-shadow: none;
  }
  body.printing-one-plan .plan-card-title,
  body.printing-one-plan .plan-step-time { color: #000 !important; }
  body.printing-one-plan .plan-card-party,
  body.printing-one-plan .plan-card-bestfor,
  body.printing-one-plan .plan-premise,
  body.printing-one-plan .plan-step-what,
  body.printing-one-plan .plan-step-detail,
  body.printing-one-plan .plan-skip { color: #222 !important; }
  body.printing-one-plan .plan-badge {
    background: none !important;
    color: #000 !important;
    border: 1px solid #666;
  }
  body.printing-one-plan .plan-detail { background: none !important; }
  body.printing-one-plan .plan-step { break-inside: avoid; }
}

/* --- Missing-photo placeholders: construction symbol until a real photo lands --- */
:root { --construction-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238b6508' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'><path d='M10.5 3.5h3l4.6 15h-12.2z'/><path d='M9.3 9h5.4'/><path d='M8.3 13.5h7.4'/><path d='M2.5 18.5h19'/><path d='M2.5 21h19'/></svg>"); }

.thumb-placeholder,
.attraction-card-placeholder,
.resort-card-placeholder,
.park-card-placeholder,
.guide-photo-placeholder {
  background-image: var(--construction-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 44px 44px;
}

/* Existing decorative icons step aside so the construction marker reads clearly */
.thumb-placeholder > svg,
.park-card-placeholder > svg { display: none; }

.attraction-hero-placeholder,
.resort-hero-placeholder {
  flex-direction: column;
  gap: 14px;
  background-image: var(--construction-icon);
  background-repeat: no-repeat;
  background-position: center 34%;
  background-size: 54px 54px;
  padding-top: 96px;
}

.guide-photo-placeholder {
  width: 100%;
  height: 260px;
  border-radius: 4px;
  border: 1px dashed var(--wood-border);
  background-color: rgba(0,0,0,0.25);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  margin-bottom: 18px;
}
.guide-photo-placeholder span {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.74rem;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--wood-gold-dim);
  padding-bottom: 26px;
}

/* --- Calculator alert callout + supporting notes --- */
.calc-alert {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.9rem;
  line-height: 1.65;
  color: #cabca6;
  background: rgba(0,0,0,0.28);
  border: 1px solid var(--wood-border);
  border-left: 4px solid #c05f4e;
  border-radius: 4px;
  padding: 18px 22px;
  margin-bottom: 30px;
}
.calc-alert strong { color: #e8a091; }
.calc-alert em { color: #ece0cd; font-style: italic; }

.calc-notes {
  margin-top: 40px;
  border-top: 1px dashed var(--wood-border);
  padding-top: 30px;
}
.calc-notes h2 {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 1.25rem;
  margin: 0 0 18px;
}
.calc-notes ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.calc-notes li {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.9rem;
  line-height: 1.65;
  color: #cabca6;
  padding-left: 18px;
  border-left: 2px solid var(--wood-gold-dim);
}
.calc-notes li strong { color: #ece0cd; }
.calc-notes li a { color: var(--wood-gold); }

/* --- From Our Visits gallery (Universal page) --- */
.visit-gallery { padding: 20px 0 60px; }
.visit-gallery-sub {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: #cabca6;
  font-size: 0.9rem;
  margin: 0 0 22px;
}
.visit-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr));
  gap: 16px;
}
.visit-shot {
  margin: 0;
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 0 4px 10px rgba(0,0,0,0.5);
}
.visit-shot img {
  width: 100%;
  height: 160px;
  object-fit: cover;
  display: block;
}
.visit-shot figcaption {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.5px;
  color: var(--wood-cream);
  padding: 9px 12px;
  text-align: center;
}

/* --- Hidden Mickeys hero photo + caption --- */
.mickey-hero-photo {
  width: 100%;
  max-width: 620px;
  height: 200px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid var(--wood-border);
  margin: 0 auto 20px;
  display: block;
}
.mickey-hero-caption {
  display: block;
  font-style: italic;
  color: var(--wood-gold);
  font-size: 0.85rem;
  margin-top: 8px;
}

/* --- Mead Hall menu (Epic Universe guide) --- */
.mead-hall-menu {
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-border);
  border-radius: 6px;
  padding: 22px 24px;
  margin: 18px 0 8px;
}
.mead-hall-cols {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  gap: 12px 40px;
}
.mead-hall-menu h4 {
  font-family: "Cinzel", serif;
  color: var(--wood-gold);
  font-size: 1.02rem;
  letter-spacing: 0.5px;
  margin: 16px 0 8px;
  border-bottom: 1px solid var(--wood-border);
  padding-bottom: 5px;
}
.mead-hall-cols > .mead-col:first-child h4:first-child,
.mead-hall-cols > .mead-col > h4:first-child { margin-top: 0; }
.mead-list {
  list-style: none;
  margin: 0;
  padding: 0;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
.mead-list li {
  color: #cabca6;
  font-size: 0.88rem;
  line-height: 1.45;
  padding: 6px 0;
  border-bottom: 1px dotted rgba(202,188,166,0.15);
}
.mead-list li:last-child { border-bottom: none; }
.mead-list strong { color: var(--wood-cream); }
.mead-tag {
  display: inline-block;
  font-size: 0.62rem;
  font-weight: bold;
  letter-spacing: 0.5px;
  color: #0f1540;
  background: var(--wood-gold);
  border-radius: 3px;
  padding: 1px 5px;
  vertical-align: middle;
}
.mead-legend {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  color: #8a8265;
  margin: 16px 0 0;
}
.mead-photos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr));
  gap: 12px;
  margin-top: 16px;
}
.mead-photo img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid var(--wood-border);
  display: block;
  transition: transform 0.2s ease;
}
.mead-photo:hover img { transform: scale(1.02); }


/* ============================================================
   CARTOGRAPHERS LOG — site-wide visual polish layer (2026-07)
   Additive & scoped to body.home-v2. Safe to revert as one block.
   ============================================================ */

html { scroll-behavior: smooth; }

/* Atmospheric background: warm gold aura + edge vignette + fine paper grain,
   all viewport-anchored for a cinematic, aged-map feel. */
body.home-v2 {
  background-color: var(--wood-bg);
  background-image:
    radial-gradient(120% 65% at 50% -8%, rgba(212,175,55,0.07), transparent 55%),
    radial-gradient(150% 120% at 50% 42%, transparent 58%, rgba(0,0,0,0.45)),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22160%22%20height%3D%22160%22%3E%3Cfilter%20id%3D%22g%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.85%22%20numOctaves%3D%222%22%20stitchTiles%3D%22stitch%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22160%22%20height%3D%22160%22%20filter%3D%22url(%23g)%22%20opacity%3D%220.30%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat, no-repeat, repeat;
  background-size: auto, auto, 160px 160px;
  background-attachment: fixed, fixed, fixed;
}

/* Card imagery: slow Ken Burns zoom, a gold route-line sweep, and a glow ring
   on hover — applied to park cards and the visit galleries alike. */
.park-card, .visit-shot { position: relative; }
.park-card-img, .park-card-thumb img, .visit-shot img {
  transition: transform 0.7s cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: transform;
}
.park-card:hover .park-card-img,
.park-card:hover .park-card-thumb img,
.visit-shot:hover img { transform: scale(1.06); }

.park-card::before, .visit-shot::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, transparent, var(--wood-gold), transparent);
  transform: scaleX(0); transform-origin: center;
  transition: transform 0.35s ease; z-index: 4; pointer-events: none;
}
.park-card:hover::before, .visit-shot:hover::before { transform: scaleX(1); }

.park-card::after, .visit-shot::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(212,175,55,0);
  transition: box-shadow 0.3s ease; pointer-events: none; z-index: 3;
}
.park-card:hover::after, .visit-shot:hover::after {
  box-shadow: inset 0 0 0 1px rgba(212,175,55,0.55), 0 0 26px rgba(212,175,55,0.12);
}

/* Content boxes: refined map-frame — inset gold hairline + deeper lift. */
body.home-v2 .content-box {
  box-shadow: inset 0 0 0 1px rgba(212,175,55,0.09), 0 6px 22px rgba(0,0,0,0.4);
}

/* Large section titles: warm gold gradient sheen (with a safe solid fallback). */
.parks-section .box-title { color: #e9c46a; }
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .parks-section .box-title {
    background: linear-gradient(180deg, #f4dfa0 0%, #d4af37 55%, #b8860b 100%);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
  }
  /* keep the diamond flourishes visible (they must not inherit transparent fill) */
  .parks-section .box-title::before,
  .parks-section .box-title::after {
    -webkit-text-fill-color: var(--wood-gold-dim);
    color: var(--wood-gold-dim);
  }
}

/* Accessible gold focus ring for keyboard users. */
body.home-v2 a:focus-visible,
body.home-v2 button:focus-visible {
  outline: 2px solid var(--wood-gold);
  outline-offset: 3px;
  border-radius: 2px;
}


/* ============================================================
   TREASURE-MAP BACKGROUND (2026-07, quieted 2026-08) — the gold-engraved
   antique map on deep green, veiled to a whisper so it reads as paper
   grain rather than a picture. The compass rose layer was retired
   2026-08-15: at min(42vw,520px) it fought content on narrow screens and
   cost 470 KB on every page. To revert to the louder look, restore the
   0.70 veil and the compass.png layer from git history (or checkout the
   pre-treasure-bg tag for the original plain background).
   ============================================================ */
body.home-v2 {
  background-color: #070a22;
  background-image:
    radial-gradient(150% 120% at 50% 42%, transparent 54%, rgba(0,0,0,0.45)),
    linear-gradient(rgba(7, 10, 34,0.86), rgba(7, 10, 34,0.86)),
    url("../assets/backgrounds/map-gold-green.jpg");
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-size: cover, cover, cover;
  background-position: center, center, center;
  background-attachment: fixed, fixed, fixed;
}


/* ============================================================
   PLAN MY DAY — itinerary builder wizard + expedition-plan output
   ============================================================ */
.planner-wrap { padding: 30px 24px 70px; max-width: 1000px; }
.planner-wizard,
.crew-form,
.crew-output,
.trip-output,
.fpi {
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border);
  border-radius: 8px;
  padding: 30px 28px;
  box-shadow: inset 0 0 0 1px rgba(212,175,55,0.08), 0 6px 24px rgba(0,0,0,0.45);
}

.planner-step { margin-bottom: 28px; }
.planner-step h3 {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.3rem; text-transform: uppercase;
  letter-spacing: 1px; color: #e9c46a; margin-bottom: 12px;
  display: flex; align-items: center; gap: 10px;
}
.planner-step-num {
  display: inline-grid; place-items: center; width: 26px; height: 26px;
  border: 1px solid var(--wood-gold-dim); border-radius: 50%;
  font-size: 0.78rem; color: var(--wood-gold);
}
.planner-optional { font-size: 0.72rem; color: var(--wood-cream-dim); text-transform: none; letter-spacing: 0; }

.planner-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr)); gap: 12px; }
.planner-card {
  cursor: pointer; text-align: left; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  background: var(--wood-panel-solid); border: 1px solid var(--wood-border);
  border-radius: 6px; padding: 18px; color: var(--wood-cream);
  display: flex; flex-direction: column; gap: 4px;
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.planner-card:hover { transform: translateY(-2px); border-color: var(--wood-gold-dim); }
.planner-card.selected {
  border-color: var(--wood-gold);
  box-shadow: inset 0 0 0 1px var(--wood-gold), 0 4px 14px rgba(0,0,0,0.45);
  background: linear-gradient(160deg, #1c2458, var(--wood-panel-solid));
}
.planner-card-icon { font-size: 1.8rem; color: var(--wood-gold); display: inline-flex; }
.planner-card-icon svg { width: 32px; height: 32px; }
.planner-card-park .planner-card-icon svg { width: 34px; height: 34px; }
.planner-go svg, .planner-action svg, .planner-live svg { vertical-align: -3px; margin-right: 2px; }
.planner-card-title { color: var(--wood-gold); font-size: 1.18rem; }
.planner-card-sub { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.95rem; color: #cabca6; line-height: 1.45; }

/* Park picker — cards grouped under resort banners */
.planner-park-groups { display: flex; flex-direction: column; gap: 20px; }
.planner-resort-label {
  display: flex; align-items: baseline; gap: 12px; margin-bottom: 10px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; text-transform: uppercase; letter-spacing: 2px;
}
.planner-resort-label::after {
  content: ""; flex: 1; align-self: center; height: 1px;
  background: linear-gradient(to right, var(--wood-gold-dim), transparent);
}
.planner-resort-name { color: #e9c46a; font-size: 1.02rem; }
.planner-resort-loc { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.72rem; color: var(--wood-cream-dim); letter-spacing: 1px; }
.planner-cards-parks { grid-template-columns: repeat(auto-fill, minmax(min(160px, 100%), 1fr)); }
.planner-card-park { padding: 14px 16px; align-items: center; text-align: center; }
.planner-card-park .planner-card-icon { font-size: 1.6rem; }
.planner-card-park .planner-card-title { font-size: 1.05rem; line-height: 1.3; }

.planner-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.planner-chip {
  cursor: pointer; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.95rem;
  background: rgba(11, 16, 48,0.85); border: 1px solid #3a4275; border-radius: 22px;
  padding: 10px 18px; color: #d8ccb6;
  transition: all .15s ease;
}
.planner-chip:hover { color: var(--wood-cream); border-color: var(--wood-gold-dim); }
.planner-chip.selected { color: #0f1540; background: var(--wood-gold); border-color: var(--wood-gold); font-weight: bold; }

.planner-select {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.15rem; color: var(--wood-cream);
  background: var(--wood-panel-solid); border: 1px solid var(--wood-border);
  border-radius: 6px; padding: 10px 14px;
}
.planner-go {
  display: block; width: 100%; margin-top: 6px; cursor: pointer;
  font-family: 'Cinzel', Georgia, serif; font-size: 1.4rem; letter-spacing: 2.5px;
  color: #0f1540; background: linear-gradient(180deg, #e9c46a, var(--wood-gold));
  border: 1px solid #8e6f43; border-radius: 6px; padding: 16px;
  box-shadow: 0 5px 16px rgba(0,0,0,0.5);
  transition: transform .15s ease, box-shadow .15s ease;
}
.planner-go:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(0,0,0,0.6); }

/* ---- the generated plan ---- */
.planner-plan {
  margin-top: 40px; background: var(--wood-panel);
  border: 1px solid var(--wood-border); border-radius: 6px; padding: 30px 28px;
  box-shadow: inset 0 0 0 1px rgba(212,175,55,0.09), 0 6px 22px rgba(0,0,0,0.4);
}
.planner-plan-eyebrow { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.68rem; letter-spacing: 2.5px; text-transform: uppercase; color: var(--wood-gold-dim); }
.planner-plan h2 { font-family: 'Cinzel', Georgia, serif; color: #e9c46a; font-size: 2.1rem; margin: 6px 0 8px; }
.planner-plan-meta { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.95rem; color: var(--wood-cream-dim); display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.planner-stamp { font-size: 0.7rem; }
.planner-live { margin-top: 12px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.8rem; color: #7ee0a0; }
.planner-replan {
  margin-left: 10px; padding: 5px 12px; cursor: pointer;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.76rem; letter-spacing: 0.6px;
  color: #070a22; background: #7ee0a0; border: 0; border-radius: 4px; font-weight: bold;
}
.planner-replan:hover { background: #9ceab6; }
.planner-replan:disabled { opacity: 0.6; cursor: default; }

.planner-route {
  margin: 20px 0 6px; padding: 14px 18px; border: 1px dashed var(--wood-gold-dim);
  border-radius: 6px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.02rem; color: var(--wood-cream);
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
}
.planner-route-label { color: var(--wood-gold); text-transform: uppercase; font-size: 0.72rem; letter-spacing: 1.5px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; }
.planner-route-dash { color: var(--wood-gold-dim); letter-spacing: 2px; }
.planner-route-stop { white-space: nowrap; }

.planner-block { margin-top: 26px; }
.planner-block h4 {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; text-transform: uppercase; letter-spacing: 1.5px;
  font-size: 1.05rem; color: var(--wood-gold); border-bottom: 1px solid var(--wood-border);
  padding-bottom: 6px; margin-bottom: 4px;
}
.planner-item { display: flex; gap: 16px; padding: 12px 0; border-bottom: 1px dotted rgba(202,188,166,0.15); }
.planner-item:last-child { border-bottom: none; }
.planner-item-time {
  flex: 0 0 104px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.9rem;
  color: #e9c46a; padding-top: 3px; text-align: right; letter-spacing: 0.5px;
}
.planner-item-title { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.15rem; color: var(--wood-cream); }
.planner-item-sub { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.88rem; color: #b8ab93; margin-top: 3px; }
.planner-item-note { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.95rem; color: #cabca6; margin-top: 6px; line-height: 1.55; }
.planner-item-dining .planner-item-title { color: #e9c46a; }
.planner-wait-chip {
  display: inline-block; margin-left: 8px; vertical-align: middle;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.66rem; letter-spacing: 0.5px;
  color: #070a22; background: #7ee0a0; border-radius: 10px; padding: 2px 8px;
}
.planner-wait-chip.planner-wait-down { background: #d1573f; color: #fff; }
.planner-wait-chip[hidden] { display: none; }

.planner-skip { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.92rem; color: #b8ab93; margin-top: 22px; line-height: 1.6; }
.planner-fineprint { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.72rem; color: #8a8265; margin-top: 14px; line-height: 1.6; }
.planner-fineprint a { color: var(--wood-gold-dim); text-decoration: underline; }

.planner-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.planner-action {
  cursor: pointer; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.8rem; letter-spacing: 0.5px;
  color: var(--wood-cream); background: var(--wood-panel-solid);
  border: 1px solid var(--wood-border); border-radius: 6px; padding: 12px 18px;
  font-size: 0.92rem;
  text-decoration: none; transition: border-color .15s ease, color .15s ease;
}
.planner-action:hover { border-color: var(--wood-gold); color: var(--wood-gold); }

@media print {
  .planner-wizard, .planner-actions, .site-header, .site-footer, .pinned-video-widget { display: none !important; }
  body.home-v2 { background: #fff !important; color: #000; }
  .planner-plan { border-color: #999; box-shadow: none; background: #fff; }
  .planner-plan h2, .planner-block h4, .planner-item-time, .planner-item-title, .planner-plan-eyebrow { color: #000; }
  .planner-item-sub, .planner-item-note, .planner-plan-meta, .planner-skip, .planner-fineprint, .planner-route { color: #333; }
  .planner-route { border-color: #999; }
  .planner-block { break-inside: avoid; }
  .planner-wait-chip { display: none; }
  .page-hero { background: #fff !important; border: none; color: #000; padding: 10px 0 0; }
  .page-hero .tagline, .page-hero .eyebrow, .page-hero .log-stamp { display: none; }
  .page-hero h1 { color: #000; }
}

/* Subscribe nudge inside generated plans */
.planner-subscribe {
  margin-top: 26px; display: flex; flex-wrap: wrap; align-items: center; gap: 18px;
  background: linear-gradient(160deg, #1c2458, var(--wood-panel-solid));
  border: 1px solid var(--wood-gold-dim); border-radius: 6px; padding: 18px 20px;
}
.planner-subscribe-text { flex: 1 1 300px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; }
.planner-subscribe-text strong { display: block; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; color: #e9c46a; font-size: 1.02rem; margin-bottom: 4px; }
.planner-subscribe-text span { font-size: 0.95rem; color: #cabca6; line-height: 1.55; }
.planner-subscribe-btn {
  display: inline-flex; align-items: center; gap: 9px; white-space: nowrap;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-weight: bold; font-size: 0.85rem;
  color: #fff; background: #c00; border-radius: 6px; padding: 12px 18px;
  text-decoration: none; box-shadow: 0 4px 12px rgba(0,0,0,0.45);
  transition: transform .15s ease, background .15s ease;
}
.planner-subscribe-btn:hover { background: #e00; transform: translateY(-2px); }
@media print { .planner-subscribe { display: none !important; } }

/* Plan My Day — homepage feature spotlight */
.planner-feature { max-width: 780px; margin: 0 auto; padding: 44px 24px 10px; }
.planner-feature-inner {
  position: relative; text-align: center;
  background: linear-gradient(165deg, rgba(28, 36, 88,0.95), rgba(10, 14, 40,0.95));
  border: 2px solid var(--wood-gold-dim); border-radius: 10px;
  padding: 30px 30px 24px;
  box-shadow: inset 0 0 0 1px rgba(212,175,55,0.12), 0 10px 30px rgba(0,0,0,0.55);
}
.planner-feature-badge {
  position: absolute; top: -14px; left: 50%; transform: translateX(-50%);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.72rem; font-weight: bold;
  letter-spacing: 2.5px; text-transform: uppercase;
  color: #0f1540; background: linear-gradient(180deg, #e9c46a, var(--wood-gold));
  border-radius: 14px; padding: 6px 18px; box-shadow: 0 3px 10px rgba(0,0,0,0.5);
}
.planner-feature-title { font-family: Cinzel, Georgia, serif; font-size: clamp(1.6rem, 4vw, 2.1rem); color: #e9c46a; margin: 6px 0 10px; }
.planner-feature-lead { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.05rem; color: var(--wood-cream); line-height: 1.55; max-width: 560px; margin: 0 auto 18px; }
.planner-feature-points {
  list-style: none; margin: 0 auto 20px; padding: 0; max-width: 620px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px 22px; text-align: left;
}
.planner-feature-points li {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.9rem; color: #cabca6; line-height: 1.45;
  display: flex; align-items: flex-start; gap: 9px;
}
.planner-feature-points li svg {
  width: 17px; height: 17px; flex: none; margin-top: 2px;
  color: var(--wood-gold); fill: none; stroke: currentColor;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}
@media (max-width: 560px) { .planner-feature-points { grid-template-columns: 1fr; } }
.planner-feature-parkstrip {
  display: flex; justify-content: center; flex-wrap: wrap; gap: 14px;
  margin: 20px auto 6px; padding-top: 16px; max-width: 560px;
  border-top: 1px solid rgba(212,175,55,0.25);
}
.planner-feature-parkstrip svg {
  width: 24px; height: 24px; color: var(--wood-gold-dim);
  fill: none; stroke: currentColor; stroke-width: 1.7;
  stroke-linecap: round; stroke-linejoin: round;
  transition: color .2s ease, transform .2s ease;
}
.planner-feature-parkstrip svg:hover { color: var(--wood-gold); transform: translateY(-2px); }
.planner-feature-cta {
  display: inline-block; font-family: Cinzel, Georgia, serif; font-size: 1.1rem;
  letter-spacing: 2px; color: #0f1540;
  background: linear-gradient(180deg, #e9c46a, var(--wood-gold));
  border: 1px solid #8e6f43; border-radius: 6px; padding: 12px 30px;
  text-decoration: none; box-shadow: 0 5px 16px rgba(0,0,0,0.5);
  transition: transform .15s ease, box-shadow .15s ease;
}
.planner-feature-cta:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(0,0,0,0.6); }
.planner-feature-sub { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem; color: #b8ab93; margin-top: 2px; letter-spacing: 0.5px; }

/* ============================================================
   Crowd Calendar
   Deliberately not a grid of big coloured numbers — each day reads
   as a barometer gauge, and every score opens into its own reasoning.
   ============================================================ */
.cc-wrap { padding: 30px 24px 70px; max-width: 1080px; }

/* Crowd bands: calm reads cool and green, storm hot and red, with the
   site's own gold sitting at the midpoint. */
.cc-calm   { --cc: #4a9d7c; }
.cc-light  { --cc: #8fbc5a; }
.cc-choppy { --cc: #d9ae3c; }
.cc-heavy  { --cc: #dd8433; }
.cc-storm  { --cc: #c9453d; }
.cc-calm-text   { color: #6fc39d; }
.cc-light-text  { color: #a9d472; }
.cc-choppy-text { color: #e9c46a; }
.cc-heavy-text  { color: #f0a15c; }
.cc-storm-text  { color: #e8756c; }

.cc-controls {
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: 20px;
  margin-bottom: 22px;
}
.cc-field { display: flex; flex-direction: column; gap: 6px; }
.cc-field > span {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem; text-transform: uppercase;
  letter-spacing: 2px; color: #e9c46a;
}
.cc-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-left: auto; }
.cc-legend-item {
  display: flex; align-items: center; gap: 7px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem; color: var(--wood-cream-dim);
}
.cc-dot { width: 11px; height: 11px; border-radius: 50%; background: var(--cc); flex: none; }

.cc-monthbar {
  display: flex; align-items: center; justify-content: center; gap: 22px;
  margin-bottom: 14px;
}
.cc-monthbar h2 {
  font-family: Cinzel, Georgia, serif; font-size: clamp(1.3rem, 3.5vw, 1.8rem);
  color: #e9c46a; margin: 0; min-width: 8.5em; text-align: center;
}
.cc-nav {
  cursor: pointer; font-size: 1.1rem; line-height: 1;
  background: var(--wood-panel-solid); color: var(--wood-gold);
  border: 1px solid var(--wood-border); border-radius: 6px; padding: 9px 15px;
  transition: border-color .15s ease, color .15s ease;
}
.cc-nav:hover { border-color: var(--wood-gold); color: var(--wood-cream); }

/* The park picker, the legend and the month name used to sit straight on the
   site's map background. That background is an engraved antique chart with its
   own lettering on it, and one caption — "A Circle of Winds consisting of 32
   points, commonly called the Mariners Compass" — lands beside the month
   heading at the same size and very nearly the same gold. It read as part of
   the interface. Everything else on the site puts its content on a panel and
   this now does too, as one surface from the picker down to the last week. */
/* Opaque, not 0.88. The map behind it is atmosphere; the grid is data, and the
   two were sharing the same pixels. Everything text- or number-bearing on this
   page now sits on a solid fill — the map is the desk, the panels are the
   papers laid on it. The texture still runs at full strength in the margins,
   the hero and the footer, which is where it was doing its job. */
.cc-board {
  background: #0B241C;
  border: 1px solid var(--wood-border); border-radius: 8px;
  padding: 20px 18px 16px;
  box-shadow: inset 0 0 0 1px rgba(212,175,55,0.08), 0 6px 24px rgba(0,0,0,0.45);
}

.cc-grid {
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px;
}
.cc-dowhead {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.72rem; text-transform: uppercase;
  letter-spacing: 1.5px; color: var(--wood-cream-dim);
  text-align: center; padding-bottom: 4px;
}

.cc-day {
  cursor: pointer; position: relative; text-align: left;
  display: flex; flex-direction: column; gap: 5px;
  min-height: 74px; padding: 8px 9px;
  background: var(--wood-panel-solid);
  border: 1px solid var(--wood-border);
  border-left: 3px solid var(--cc);
  border-radius: 5px; color: var(--wood-cream);
  transition: transform .12s ease, border-color .12s ease;
}
.cc-day:hover { transform: translateY(-2px); border-color: var(--wood-gold-dim); }
.cc-day.cc-selected {
  border-color: var(--wood-gold);
  box-shadow: inset 0 0 0 1px var(--wood-gold);
}
.cc-day.cc-today .cc-daynum {
  background: var(--wood-gold); color: #0f1540;
  border-radius: 50%; width: 1.55em; height: 1.55em;
  display: inline-grid; place-items: center;
}
.cc-day.cc-past { opacity: 0.42; }
.cc-daynum { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.92rem; color: var(--wood-cream); }
.cc-level {
  position: absolute; top: 7px; right: 9px;
  font-family: Cinzel, Georgia, serif; font-size: 1.15rem; color: var(--cc);
}

/* The gauge: ten segments filled to the crowd level. Readable across a whole
   month at a glance without shouting a numeral from every cell. */
.cc-gauge { display: flex; gap: 2px; margin-top: auto; }
.cc-gauge i {
  flex: 1; height: 6px; border-radius: 1px;
  background: rgba(212, 175, 55, 0.14);
}
.cc-gauge i.on { background: var(--cc); }

/* ---- Day detail ---- */
.cc-detail {
  margin-top: 26px; background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border); border-radius: 8px; padding: 26px 24px;
}
.cc-detail-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 18px; flex-wrap: wrap;
}
.cc-detail-eyebrow {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.76rem; text-transform: uppercase;
  letter-spacing: 2px; color: var(--wood-cream-dim); margin-bottom: 4px;
}
.cc-detail-head h3 {
  font-family: Cinzel, Georgia, serif; font-size: clamp(1.2rem, 3vw, 1.65rem);
  color: var(--wood-gold); margin: 0;
}
.cc-score-badge {
  display: flex; align-items: baseline; gap: 3px;
  border: 2px solid var(--cc); border-radius: 8px; padding: 8px 16px;
  color: var(--cc); font-family: Cinzel, Georgia, serif;
}
.cc-score-badge strong { font-size: 1.9rem; line-height: 1; }
.cc-score-badge span { font-size: 0.82rem; opacity: 0.8; }
.cc-band-blurb {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.05rem; line-height: 1.6;
  color: var(--wood-cream); margin: 14px 0 22px;
}

.cc-panels { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
/* The lighter of the page's two panel values — this is the "why this score"
   block, and giving it its own value is what stops the page reading as one
   continuous wall from top to bottom. Opaque for the same reason as .cc-board:
   it carries the factor breakdown. */
.cc-panel {
  background: #141b45;
  border: 1px solid var(--wood-border); border-radius: 6px; padding: 18px 20px;
}
.cc-panel-wide { margin-top: 18px; }
.cc-panel h4 {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.86rem; text-transform: uppercase;
  letter-spacing: 2px; color: #e9c46a; margin: 0 0 14px;
}

.cc-factors { list-style: none; margin: 0; padding: 0; }
.cc-factor {
  display: flex; align-items: baseline; justify-content: space-between; gap: 14px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.92rem; color: #cabca6;
  padding: 7px 0; border-bottom: 1px dashed rgba(212, 175, 55, 0.16);
}
.cc-factor:last-child { border-bottom: 0; }
.cc-factor-base .cc-factor-label { color: var(--wood-cream); }
.cc-factor-val {
  flex: none; font-family: Cinzel, Georgia, serif; font-size: 0.92rem;
  color: var(--wood-cream-dim);
}
.cc-factor-val.up { color: #f0a15c; }
.cc-factor-val.down { color: #6fc39d; }
.cc-factor-note {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem; font-style: italic;
  color: var(--wood-cream-dim); margin: 12px 0 0;
}

.cc-advice { margin: 0; padding-left: 20px; }
.cc-advice li {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.94rem; line-height: 1.5;
  color: #cabca6; margin-bottom: 9px;
}
.cc-advice li::marker { color: var(--wood-gold-dim); }

.cc-rank-lead {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.9rem; line-height: 1.5;
  color: var(--wood-cream-dim); margin: -4px 0 14px;
}
.cc-ranks { list-style: none; margin: 0; padding: 0; }
.cc-rank {
  display: grid;
  grid-template-columns: 1.8em minmax(0, 1fr) auto 90px 2em;
  align-items: center; gap: 12px;
  padding: 8px; border-radius: 5px;
  border-bottom: 1px dashed rgba(212, 175, 55, 0.14);
}
.cc-rank:last-child { border-bottom: 0; }
.cc-rank.is-current { background: rgba(212, 175, 55, 0.09); }
.cc-rank-pos {
  font-family: Cinzel, Georgia, serif; font-size: 0.86rem;
  color: var(--wood-cream-dim); text-align: center;
}
.cc-rank-name {
  cursor: pointer; text-align: left; padding: 0;
  background: none; border: 0;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1rem; color: var(--wood-gold);
  text-decoration: underline; text-decoration-color: transparent;
  transition: text-decoration-color .15s ease;
}
.cc-rank-name:hover { text-decoration-color: var(--wood-gold); }
.cc-rank-resort {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.76rem; color: var(--wood-cream-dim);
}
.cc-rank-level { font-family: Cinzel, Georgia, serif; font-size: 1.05rem; text-align: right; }

.cc-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }

/* ---- Methodology ---- */
/* This block is the argument for trusting the numbers — it is the thing that
   separates this calendar from the ones that hand you a score and ask you to
   take it on faith. It was the least readable element on the page: four long
   paragraphs at 15.7px, on a 0.7-alpha panel with the map showing through.
   Contrast was never the problem (#cabca6 on the page ground measures 9.6:1);
   size and the texture behind it were. Opaque fill, a size up, and more leading. */
.cc-method {
  margin-top: 34px; background: #0B241C;
  border: 1px solid var(--wood-border); border-left: 3px solid var(--wood-gold-dim);
  border-radius: 0 8px 8px 0; padding: 26px 28px;
}
.cc-method h3 {
  font-family: Cinzel, Georgia, serif; font-size: 1.15rem; color: #e9c46a;
  margin: 0 0 14px;
}
.cc-method p {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.06rem; line-height: 1.72;
  color: #ddd0bb; margin: 0 0 14px; max-width: 74ch;
}
/* The opening paragraph carries the promise; let it lead. */
.cc-method p:first-of-type { font-size: 1.12rem; color: #ece2d2; }
.cc-method p:last-child { margin-bottom: 0; }
.cc-method-fine { font-size: 0.86rem !important; font-style: italic; }

@media (max-width: 780px) {
  .cc-panels { grid-template-columns: 1fr; }
  .cc-legend { margin-left: 0; }
  .cc-rank { grid-template-columns: 1.6em minmax(0, 1fr) 60px 2em; }
  .cc-rank-resort { display: none; }
}
@media (max-width: 560px) {
  .cc-wrap { padding: 20px 12px 60px; }
  .cc-grid { gap: 3px; }
  .cc-board { padding: 14px 10px 10px; }
  .cc-day { min-height: 58px; padding: 5px 6px; border-left-width: 2px; }
  .cc-level { font-size: 0.95rem; top: 4px; right: 6px; }
  .cc-daynum { font-size: 0.8rem; }
  .cc-gauge i { height: 4px; }
}

/* Card tile without photography — a gold emblem on the panel ground. Distinct
   from .park-card-placeholder, which carries the under-construction icon and
   should stay reserved for genuinely unfinished sections. */
.park-card-emblem {
  width: 100%; height: 220px;
  display: grid; place-items: center;
  background:
    radial-gradient(circle at 50% 42%, rgba(212, 175, 55, 0.10), transparent 62%),
    var(--wood-panel-solid);
  border-bottom: 1px solid var(--wood-border);
}
.park-card-emblem svg {
  width: 62px; height: 62px; color: var(--wood-gold-dim);
  transition: color .25s ease, transform .25s ease;
}
.park-card:hover .park-card-emblem svg { color: var(--wood-gold); transform: scale(1.06); }

/* ---- Chart My Day: crowd-aware date step and plan banner ---- */
.planner-when { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 16px; }
.planner-when-field { display: flex; flex-direction: column; gap: 6px; }
.planner-when-field > span {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.82rem; color: #cabca6;
}
.planner-when-field em { color: var(--wood-cream-dim); font-size: 0.76rem; }
.planner-when-hint {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.86rem; line-height: 1.5;
  color: var(--wood-cream-dim); margin: 12px 0 0; max-width: 60ch;
}
.planner-when-hint a { color: var(--wood-gold); }

/* Live crowd readout beside the date field. */
.planner-crowd-peek {
  display: flex; align-items: center; gap: 12px;
  background: rgba(11, 16, 48, 0.7);
  border: 1px solid var(--cc, var(--wood-border));
  border-left: 4px solid var(--cc, var(--wood-gold));
  border-radius: 6px; padding: 9px 16px;
}
.planner-peek-level {
  font-family: Cinzel, Georgia, serif; font-size: 1.5rem; line-height: 1;
  color: var(--cc, var(--wood-gold));
}
.planner-peek-level em { font-size: 0.62rem; font-style: normal; opacity: 0.75; }
.planner-peek-band {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.98rem; color: var(--wood-cream);
}
.planner-peek-note {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.76rem; color: var(--wood-cream-dim);
}

/* The banner at the top of a generated, date-aware plan. */
.planner-crowd-banner {
  margin: 18px 0 4px;
  background: rgba(11, 16, 48, 0.62);
  border: 1px solid var(--wood-border);
  border-left: 4px solid var(--cc, var(--wood-gold));
  border-radius: 0 8px 8px 0; padding: 18px 22px; text-align: left;
}
.planner-crowd-head { display: flex; align-items: flex-start; gap: 16px; }
.planner-crowd-badge {
  flex: none; display: inline-flex; align-items: baseline; gap: 2px;
  font-family: Cinzel, Georgia, serif; font-size: 1.7rem; line-height: 1;
  color: var(--cc, var(--wood-gold));
  border: 2px solid var(--cc, var(--wood-gold)); border-radius: 7px;
  padding: 7px 12px;
}
.planner-crowd-badge em { font-size: 0.5em; font-style: normal; opacity: 0.8; }
.planner-crowd-head strong {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.08rem; color: var(--wood-cream);
}
.planner-crowd-sub {
  display: block; margin-top: 5px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.88rem; line-height: 1.5;
  color: #cabca6;
}
.planner-crowd-tips { margin: 14px 0 0; padding-left: 20px; }
.planner-crowd-tips li {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.9rem; line-height: 1.5;
  color: #cabca6; margin-bottom: 6px;
}
.planner-crowd-tips li::marker { color: var(--cc, var(--wood-gold-dim)); }
.planner-crowd-link {
  display: inline-block; margin-top: 10px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.86rem; color: var(--wood-gold);
}

@media (max-width: 560px) {
  .planner-when { flex-direction: column; align-items: stretch; }
  .planner-crowd-head { flex-direction: column; gap: 10px; }
}

/* ============================================================
   Can My Kid Ride? — height checker
   ============================================================ */
.hc-controls {
  display: grid; grid-template-columns: 1fr 1.6fr 1fr; gap: 20px; align-items: end;
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border); border-radius: 8px;
  padding: 22px 24px; margin-bottom: 24px;
}
.hc-field { display: flex; flex-direction: column; gap: 8px; }
.hc-field label {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.8rem; text-transform: uppercase;
  letter-spacing: 1.6px; color: #e9c46a;
}
.hc-field label em { text-transform: none; letter-spacing: 0; color: var(--wood-cream-dim); font-size: 0.76rem; }
.hc-height-row { display: flex; align-items: center; gap: 16px; }
.hc-height-row input[type="range"] { flex: 1; min-width: 0; accent-color: var(--wood-gold); }
.hc-height-readout {
  flex: none; text-align: center; min-width: 78px;
  border: 1px solid var(--wood-gold-dim); border-radius: 6px; padding: 5px 10px;
  background: rgba(11, 16, 48, 0.7);
}
.hc-height-readout strong {
  display: block; font-family: Cinzel, Georgia, serif; font-size: 1.6rem;
  line-height: 1.05; color: var(--wood-gold);
}
.hc-height-readout span {
  display: block; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.66rem;
  text-transform: uppercase; letter-spacing: 1.2px; color: var(--wood-cream-dim);
}
.hc-height-readout em {
  display: block; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.7rem;
  font-style: normal; color: #9ea3cc; margin-top: 2px;
}

/* ---- Headline ---- */
.hc-headline {
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border); border-left: 4px solid var(--wood-gold);
  border-radius: 0 8px 8px 0; padding: 22px 26px; margin-bottom: 20px;
}
.hc-big { flex: none; text-align: center; }
.hc-big strong {
  display: block; font-family: Cinzel, Georgia, serif; font-size: 3.1rem;
  line-height: 1; color: var(--wood-gold);
}
.hc-big span {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.74rem; text-transform: uppercase;
  letter-spacing: 1.4px; color: var(--wood-cream-dim);
}
.hc-headline-text { flex: 1; min-width: 260px; }
.hc-headline-text p {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.05rem; line-height: 1.6;
  color: var(--wood-cream); margin: 0;
}
.hc-headline-text strong { color: #e9c46a; }
.hc-headline-sub {
  font-size: 0.9rem !important; color: var(--wood-cream-dim) !important; margin-top: 8px !important;
}

.hc-panel {
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border); border-radius: 8px;
  padding: 24px 26px; margin-bottom: 20px;
}
.hc-panel h3 {
  font-family: Cinzel, Georgia, serif; font-size: 1.2rem; color: #e9c46a; margin: 0 0 6px;
}
.hc-growth-lead, .hc-panel > p {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.98rem; line-height: 1.6;
  color: #cabca6; margin: 0 0 18px;
}

/* ---- The growth chart: the differentiator ---- */
.hc-milestones { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.hc-milestone {
  background: rgba(11, 16, 48, 0.6);
  border: 1px solid var(--wood-border); border-left: 3px solid var(--wood-gold-dim);
  border-radius: 0 6px 6px 0; padding: 14px 18px;
}
.hc-ms-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.hc-ms-h {
  font-family: Cinzel, Georgia, serif; font-size: 1.5rem; line-height: 1; color: var(--wood-gold);
}
.hc-ms-gap {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.94rem; color: var(--wood-cream);
}
.hc-ms-count {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem; text-transform: uppercase;
  letter-spacing: 1.2px; color: #6fc39d; margin-left: auto;
}
.hc-ms-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; }
.hc-ms-list li {
  display: flex; justify-content: space-between; gap: 14px; align-items: baseline;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.9rem; color: #cabca6;
  padding: 4px 0; border-bottom: 1px dashed rgba(212, 175, 55, 0.12);
}
.hc-ms-list li:last-child { border-bottom: 0; }
.hc-ms-list em { flex: none; font-style: normal; font-size: 0.78rem; color: var(--wood-cream-dim); }
.hc-ms-more { color: var(--wood-cream-dim) !important; font-style: italic; }

/* ---- Park by park ---- */
.hc-parks { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr)); gap: 16px; }
.hc-park {
  background: rgba(11, 16, 48, 0.6);
  border: 1px solid var(--wood-border); border-radius: 6px; padding: 15px 17px;
}
.hc-park-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.hc-park-head h4 {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1rem; color: var(--wood-gold); margin: 0;
}
.hc-park-score {
  flex: none; font-family: Cinzel, Georgia, serif; font-size: 1.15rem; color: var(--wood-cream);
}
.hc-park-score em { font-style: normal; font-size: 0.72em; color: var(--wood-cream-dim); }
.hc-park-score.is-all { color: #6fc39d; }
.hc-park-bar {
  height: 5px; border-radius: 3px; margin: 10px 0 12px;
  background: rgba(212, 175, 55, 0.14); overflow: hidden;
}
.hc-park-bar i { display: block; height: 100%; background: var(--wood-gold-dim); }
.hc-cant-label {
  display: block; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.72rem;
  text-transform: uppercase; letter-spacing: 1.3px; color: #e8756c; margin-bottom: 5px;
}
.hc-park-cant ul { list-style: none; margin: 0; padding: 0; }
.hc-park-cant li {
  display: flex; justify-content: space-between; gap: 10px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.86rem; color: #cabca6; padding: 2px 0;
}
.hc-park-cant li em { flex: none; font-style: normal; color: var(--wood-cream-dim); }
.hc-park-all {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.86rem; color: #6fc39d; margin: 0;
}

.hc-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 4px 0 8px; }

@media (max-width: 860px) {
  .hc-controls { grid-template-columns: 1fr; gap: 16px; }
}
@media (max-width: 560px) {
  .hc-big strong { font-size: 2.4rem; }
  .hc-headline { padding: 18px 18px; gap: 16px; }
  .hc-ms-count { margin-left: 0; }
}
@media print {
  .hc-controls, .hc-actions { display: none; }
}

/* ============================================================
   Contact page
   ============================================================ */
.contact-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 26px; align-items: start; }

.contact-formwrap, .contact-aside {
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border); border-radius: 8px;
  padding: 26px 26px 28px;
}
.contact-h2 {
  font-family: Cinzel, Georgia, serif; font-size: 1.25rem; color: #e9c46a;
  margin: 0 0 18px;
}
.contact-h3 {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.84rem; text-transform: uppercase;
  letter-spacing: 1.8px; color: #e9c46a; margin: 22px 0 8px;
}
.contact-p {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.93rem; line-height: 1.6;
  color: #cabca6; margin: 0 0 4px;
}
.contact-p a { color: var(--wood-gold); }
.contact-small { font-size: 0.8rem; color: var(--wood-cream-dim); }
.contact-list { margin: 0; padding-left: 19px; }
.contact-list li {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.89rem; line-height: 1.55;
  color: #cabca6; margin-bottom: 9px;
}
.contact-list li::marker { color: var(--wood-gold-dim); }

.contact-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.contact-field { display: flex; flex-direction: column; gap: 7px; margin-bottom: 16px; }
.contact-field > span {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem; text-transform: uppercase;
  letter-spacing: 1.6px; color: #e9c46a;
}
.contact-field > span em {
  text-transform: none; letter-spacing: 0; font-size: 0.76rem;
  color: var(--wood-cream-dim);
}
.contact-field textarea {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.95rem; line-height: 1.55;
  resize: vertical; min-height: 130px;
}

/* Honeypot: off-screen rather than display:none, since some bots skip
   hidden inputs but happily fill in ones that are merely positioned away. */
.contact-hp {
  position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden;
}

.contact-status {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.9rem; line-height: 1.5;
  margin: 14px 0 0; min-height: 1.2em; color: var(--wood-cream-dim);
}
.contact-status.is-ok { color: #6fc39d; }
.contact-status.is-error { color: #e8756c; }

@media (max-width: 820px) {
  .contact-grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .contact-row { grid-template-columns: 1fr; gap: 0; }
}

/* ============================================================
   Legal / policy pages — long-form prose, built for reading
   ============================================================ */
.legal-wrap { max-width: 780px; padding: 34px 24px 80px; }

.legal-wrap h2 {
  font-family: Cinzel, Georgia, serif; font-size: 1.35rem; color: #e9c46a;
  margin: 40px 0 12px; padding-bottom: 8px;
  border-bottom: 1px solid rgba(212, 175, 55, 0.28);
}
.legal-wrap h3 {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.05rem; color: var(--wood-gold);
  margin: 26px 0 8px;
}
.legal-wrap p {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.02rem; line-height: 1.72;
  color: #dccfb8; margin: 0 0 15px;
}
.legal-wrap ul { margin: 0 0 18px; padding-left: 22px; }
.legal-wrap li {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1rem; line-height: 1.68;
  color: #dccfb8; margin-bottom: 10px;
}
.legal-wrap li::marker { color: var(--wood-gold-dim); }
.legal-wrap a { color: var(--wood-gold); }
.legal-wrap strong { color: #f0e6d2; }
.legal-wrap code {
  font-family: "Courier New", monospace; font-size: 0.88em;
  background: rgba(11, 16, 48, 0.85); border: 1px solid var(--wood-border);
  border-radius: 3px; padding: 1px 6px; color: #e9c46a;
}

/* Opening summary box — the version most people will actually read. */
.legal-summary {
  background: rgba(10, 14, 40, 0.9);
  border: 1px solid var(--wood-border); border-left: 4px solid var(--wood-gold);
  border-radius: 0 8px 8px 0; padding: 24px 26px 20px; margin-bottom: 10px;
}
.legal-summary h2 {
  margin: 0 0 14px; border-bottom: 0; padding-bottom: 0; font-size: 1.2rem;
}
.legal-summary ul { margin-bottom: 10px; }
.legal-summary li { font-size: 0.98rem; }
.legal-summary-note {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
  font-size: 0.85rem !important; font-style: italic;
  color: var(--wood-cream-dim) !important; margin: 0 !important;
}

@media (max-width: 560px) {
  .legal-wrap { padding: 24px 16px 60px; }
  .legal-wrap h2 { font-size: 1.18rem; }
}

/* Print legibility for the newer tools.
   The site-wide print rule flips the page to a white background, so any text
   still carrying its dark-theme colour comes out nearly invisible on paper.
   The planner already had overrides; the crowd calendar and height checker
   did not. */
@media print {
  /* --- Crowd Calendar --- */
  .cc-controls, .cc-nav, .cc-actions, .cc-legend { display: none !important; }
  .cc-board, .cc-grid, .cc-detail, .cc-panel, .cc-method {
    background: #fff !important; border-color: #999 !important; box-shadow: none !important;
  }
  .cc-monthbar h2, .cc-detail-head h3, .cc-panel h4, .cc-method h3 { color: #000 !important; }
  .cc-day, .cc-daynum, .cc-band-blurb, .cc-factor, .cc-factor-label,
  .cc-advice li, .cc-rank-name, .cc-rank-level, .cc-method p {
    color: #000 !important; background: #fff !important;
  }
  .cc-detail-eyebrow, .cc-factor-val, .cc-rank-resort, .cc-rank-pos,
  .cc-rank-lead, .cc-factor-note, .cc-method-fine { color: #333 !important; }
  /* Keep the level readable without relying on the band colour. */
  .cc-level, .cc-score-badge { color: #000 !important; border-color: #666 !important; }
  .cc-gauge i { background: #ddd !important; }
  .cc-gauge i.on { background: #333 !important; }

  /* --- Can My Kid Ride? --- */
  .hc-headline, .hc-panel, .hc-park, .hc-milestone {
    background: #fff !important; border-color: #999 !important;
  }
  .hc-big strong, .hc-panel h3, .hc-park-head h4, .hc-ms-h,
  .hc-headline-text p, .hc-headline-text strong, .hc-park-score {
    color: #000 !important;
  }
  .hc-big span, .hc-headline-sub, .hc-growth-lead, .hc-ms-gap, .hc-ms-count,
  .hc-ms-list li, .hc-ms-list em, .hc-park-cant li, .hc-park-cant li em,
  .hc-cant-label, .hc-park-all, .hc-panel > p {
    color: #333 !important;
  }
  .hc-park-bar { background: #ddd !important; }
  .hc-park-bar i { background: #333 !important; }

  /* --- Legal pages, in case anyone prints the policy --- */
  .legal-wrap h2, .legal-wrap h3, .legal-wrap strong { color: #000 !important; }
  .legal-wrap p, .legal-wrap li { color: #222 !important; }
  .legal-summary { background: #fff !important; border-color: #999 !important; }
  .legal-wrap code { background: #f2f2f2 !important; color: #000 !important; border-color: #ccc !important; }
}

/* Packing list -> Adventurist Supply Co. product links.
   Deliberately quiet: sits under the item, prints as nothing. */
.pack-shop-link {
  display: inline-block;
  margin: 2px 0 0 28px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.02em;
  color: var(--wood-gold);
  text-decoration: none;
  opacity: 0.85;
  transition: opacity 0.15s ease;
}
.pack-shop-link:hover { opacity: 1; text-decoration: underline; }
.pack-item-checked .pack-shop-link { opacity: 0.45; }
@media print { .pack-shop-link { display: none; } }

/* ---------------------------------------------------------------- */
/* Chart My Crew — roster form + per-person plan output              */
/* Reuses .planner-* for anything that already exists (items, blocks, */
/* crowd banner). These are only the parts the roster needs.          */
/* ---------------------------------------------------------------- */

.crew-form { display: flex; flex-direction: column; gap: 22px; }
.crew-output { margin-top: 26px; }
.crew-row { display: flex; flex-wrap: wrap; gap: 22px; }
.crew-row .crew-field { flex: 1 1 240px; }

.crew-field label {
  display: block; margin-bottom: 8px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; color: var(--wood-gold);
  text-transform: uppercase; letter-spacing: 1.6px; font-size: 0.82rem;
}
.crew-optional { text-transform: none; letter-spacing: 0; color: #cabca6; font-size: 0.76rem; }
.crew-help {
  margin: -2px 0 10px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem; line-height: 1.5; color: #cabca6;
}

.crew-field select, .crew-field input[type="date"] {
  width: 100%; padding: 10px 12px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.95rem;
  color: var(--wood-cream); background: rgba(0,0,0,0.35);
  border: 1px solid var(--wood-gold-dim); border-radius: 5px;
}

.crew-member {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  padding: 10px; margin-bottom: 10px;
  border: 1px solid var(--wood-gold-dim); border-radius: 6px;
  background: rgba(0,0,0,0.22);
}
.crew-member input, .crew-member select {
  padding: 8px 10px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.92rem;
  color: var(--wood-cream); background: rgba(0,0,0,0.35);
  border: 1px solid var(--wood-gold-dim); border-radius: 4px;
}
.crew-name { flex: 1 1 140px; min-width: 0; }
.crew-thrill { flex: 1 1 180px; min-width: 0; }
.crew-inline { display: flex; align-items: center; gap: 6px; margin: 0; }
.crew-inline > span:first-child {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; color: var(--wood-gold);
  text-transform: uppercase; letter-spacing: 1.2px; font-size: 0.72rem;
}
.crew-height { width: 68px; }
.crew-unit { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.82rem; color: #cabca6; }

.crew-remove {
  cursor: pointer; width: 30px; height: 30px; flex: 0 0 auto;
  font-size: 1.1rem; line-height: 1; color: var(--wood-cream);
  background: transparent; border: 1px solid var(--wood-gold-dim); border-radius: 4px;
}
.crew-remove:hover:not(:disabled) { color: #ff8a7a; border-color: #ff8a7a; }
.crew-remove:disabled { opacity: 0.3; cursor: default; }

.crew-add {
  cursor: pointer; padding: 9px 16px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.88rem; letter-spacing: 0.5px;
  color: var(--wood-gold); background: transparent;
  border: 1px dashed var(--wood-gold-dim); border-radius: 5px;
}
.crew-add:hover { color: var(--wood-cream); border-color: var(--wood-gold); }

.crew-error {
  margin-top: 20px; padding: 14px 18px; border-radius: 6px;
  border: 1px solid #b4543f; background: rgba(180,84,63,0.14);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; color: #ffc9bd;
}

/* --- output --- */
.crew-people { display: flex; flex-wrap: wrap; gap: 12px; margin: 22px 0 6px; }
.crew-person-card {
  flex: 1 1 160px; display: flex; flex-direction: column; gap: 3px;
  padding: 12px 14px; border-radius: 6px;
  border: 1px solid var(--wood-gold-dim); background: rgba(0,0,0,0.25);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.82rem;
}
.crew-person-card strong { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1rem; color: var(--wood-gold); }
.crew-person-meta { color: #cabca6; }
.crew-person-count { color: var(--wood-cream); }
.crew-person-out { color: #e8b84b; }
.crew-person-all { color: #7ee0a0; }

.crew-splits { margin-top: 26px; }
.crew-splits h4, .crew-excluded h4 {
  font-family: 'Cinzel', Georgia, serif; color: var(--wood-gold);
  text-transform: uppercase; letter-spacing: 2px; font-size: 0.95rem;
  margin: 0 0 4px; padding-bottom: 8px; border-bottom: 1px solid var(--wood-gold-dim);
}
.crew-split {
  display: flex; flex-wrap: wrap; gap: 14px; padding: 12px 0;
  border-bottom: 1px dotted var(--wood-gold-dim);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.92rem; line-height: 1.55; color: var(--wood-cream);
}
.crew-split-time {
  flex: 0 0 140px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; color: var(--wood-gold); font-size: 0.88rem;
}
.crew-split-waiting { display: block; color: #e8b84b; }
.crew-item-out { color: #e8b84b !important; }

.crew-excluded { margin-top: 26px; }
.crew-excluded ul { margin: 10px 0 0; padding-left: 20px; }
.crew-excluded li {
  margin-bottom: 7px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.9rem; line-height: 1.5; color: #cabca6;
}
.crew-excluded li strong { color: var(--wood-cream); }

@media (max-width: 620px) {
  .crew-split-time { flex: 1 1 100%; }
  .crew-name, .crew-thrill { flex: 1 1 100%; }
}

/* Chart My Crew — must-do picker, Rider Swap, dropped-stop notice */
.crew-musts {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(210px, 100%), 1fr));
  gap: 4px 14px; max-height: 260px; overflow-y: auto;
  padding: 12px 14px; border: 1px solid var(--wood-gold-dim);
  border-radius: 6px; background: rgba(0,0,0,0.22);
}
.crew-must {
  display: flex; align-items: center; gap: 8px; padding: 3px 0; cursor: pointer;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.86rem; color: var(--wood-cream);
}
.crew-must input { accent-color: var(--wood-gold); flex: 0 0 auto; }
.crew-must:hover span { color: var(--wood-gold); }

.crew-swap {
  margin-top: 6px; padding: 8px 12px; border-left: 3px solid #7ee0a0;
  background: rgba(126,224,160,0.08); color: #bfe8cd !important;
}
.crew-swap strong { color: #7ee0a0; }

.crew-dropped {
  margin-top: 10px; padding: 10px 14px; border-radius: 5px;
  border: 1px solid var(--wood-gold-dim); background: rgba(0,0,0,0.25);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.84rem; line-height: 1.5; color: #cabca6;
}

/* ---------------------------------------------------------------- */
/* Disney Food Price Index                                           */
/* ---------------------------------------------------------------- */

.fpi { display: flex; flex-direction: column; gap: 30px; }
.fpi-loading, .fpi-error {
  padding: 20px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; color: #cabca6;
}
.fpi-error { border: 1px solid #b4543f; background: rgba(180,84,63,0.14); border-radius: 6px; color: #ffc9bd; }

.fpi-hero-stats, .fpi-stats {
  display: flex; flex-wrap: wrap; gap: 14px;
}
.fpi-stat {
  flex: 1 1 150px; display: flex; flex-direction: column; gap: 4px;
  padding: 16px 18px; border-radius: 7px;
  border: 1px solid var(--wood-gold-dim); background: rgba(0,0,0,0.28);
}
.fpi-stat-lead { flex: 1 1 260px; }
.fpi-stat-value {
  font-family: 'Cinzel', Georgia, serif; font-size: 1.85rem; color: var(--wood-gold); line-height: 1.1;
}
.fpi-stat-lead .fpi-stat-value { font-size: 2.6rem; }
.fpi-stat-label {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem; line-height: 1.4;
  text-transform: uppercase; letter-spacing: 1px; color: #cabca6;
}

.fpi-callout {
  padding: 16px 20px; border-radius: 7px;
  border: 1px solid var(--wood-gold-dim); border-left: 4px solid var(--wood-gold);
  background: rgba(212,175,55,0.07);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1rem; line-height: 1.65; color: var(--wood-cream);
}
.fpi-callout strong { color: var(--wood-gold); }

.fpi-section { display: flex; flex-direction: column; gap: 14px; }
.fpi-section-title {
  margin: 0; padding-bottom: 10px; border-bottom: 1px solid var(--wood-gold-dim);
  font-family: 'Cinzel', Georgia, serif; color: var(--wood-gold);
  text-transform: uppercase; letter-spacing: 2px; font-size: 1rem;
}
.fpi-lead {
  margin: 0; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.02rem; line-height: 1.6; color: var(--wood-cream);
}
.fpi-h {
  margin: 8px 0 0; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; color: var(--wood-gold);
  text-transform: uppercase; letter-spacing: 1.6px; font-size: 0.82rem;
}
.fpi-note { margin: 0; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.88rem; color: #cabca6; }

/* Tables scroll inside their own box so the page never scrolls sideways. */
.fpi-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.fpi-table {
  width: 100%; min-width: 480px; border-collapse: collapse;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.88rem; color: var(--wood-cream);
}
.fpi-table th {
  padding: 9px 10px; text-align: left; white-space: nowrap;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.74rem; font-weight: normal;
  text-transform: uppercase; letter-spacing: 1.2px; color: var(--wood-gold);
  border-bottom: 1px solid var(--wood-gold-dim);
}
.fpi-table td { padding: 9px 10px; border-bottom: 1px dotted rgba(212,175,55,0.22); vertical-align: top; }
.fpi-table tr:last-child td { border-bottom: 0; }
.fpi-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.fpi-up { color: #ff9c8a; }
.fpi-down { color: #7ee0a0; }
.fpi-size { color: #cabca6; font-size: 0.82rem; }
.fpi-where { line-height: 1.35; }
.fpi-park { display: block; font-size: 0.76rem; color: #cabca6; }

.fpi-method p {
  margin: 0; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.98rem; line-height: 1.68; color: var(--wood-cream);
}
.fpi-updated {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif !important; font-size: 0.8rem !important;
  line-height: 1.55 !important; color: #a2977f !important;
}

@media (max-width: 620px) {
  .fpi-stat-lead .fpi-stat-value { font-size: 2rem; }
  .fpi-stat-value { font-size: 1.5rem; }
}

/* Trip Planning outgrew one column. Nineteen links stacked 759px tall, which
   fit a desktop with 24px to spare and ran off the bottom of a phone entirely —
   the last item was unreachable. Columns keep it a single nav entry and give
   the next tool a group to join instead of another row to add. */
/* Phone dropdowns: below the header, not below the button.
   ---------------------------------------------------------------------------
   Every menu here is centred on its own nav button. That is fine on a desktop
   nav sitting on one row, and wrong on a phone, where the nav wraps onto three
   rows and the buttons land wherever they land. Measured on the trimmed Trip
   Planning menu: 375px wide, centred on a button near the right of row one,
   hanging off the screen edge at both 360px and 390px.

   `header.site-header` is position: sticky, which makes it a containing block.
   Taking `position: relative` off the dropdown hands the menu to the header, so
   left and right can pin it to the header's edges — on screen at any width, for
   every menu, without a single magic number.

   The trade is that the menu now drops below the whole header rather than below
   its button. On a nav that wraps onto three rows that is the better answer
   anyway: the button positions are jumbled, and a menu that always appears in
   the same place is easier to use than one that chases the button. */
@media (max-width: 800px) {
  .nav-dropdown { position: static; }
  .nav-dropdown-menu {
    left: 12px;
    right: 12px;
    transform: none;
    min-width: 0;
  }
  /* Long labels wrap instead of widening the menu past the screen. */
  .nav-dropdown-menu a { white-space: normal; }
  /* Whatever ends up in a menu, it can never run past the bottom. */
  .nav-dropdown-menu {
    max-height: calc(100vh - 190px);
    overflow-y: auto;
  }
}


/* Park closing time — stated on the plan, because it's often the real limit. */
.planner-closes {
  margin-top: 10px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.8rem;
  letter-spacing: 0.3px; color: #e8b84b;
}
.planner-closes strong { color: #ffd76a; }

/* Skip-the-line: what the passes bought, and where they went */
.crew-ll {
  margin-top: 10px; padding: 10px 14px; border-radius: 6px;
  border-left: 3px solid #7ee0a0; background: rgba(126,224,160,0.08);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.84rem; line-height: 1.55; color: #bfe8cd;
}
.crew-ll strong { color: #7ee0a0; }
.crew-ll-tag {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 3px;
  font-size: 0.72rem; letter-spacing: 0.4px;
  color: #070a22; background: #7ee0a0;
}

/* ---------------------------------------------------------------- */
/* Trip Cost Estimator                                               */
/* ---------------------------------------------------------------- */

.tc-form, .tc-output {
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border);
  border-radius: 8px;
  padding: 28px 26px;
  box-shadow: inset 0 0 0 1px rgba(212,175,55,0.08), 0 6px 24px rgba(0,0,0,0.45);
}
.tc-form { display: flex; flex-direction: column; gap: 20px; }
.tc-output { margin-top: 26px; }
.tc-row { display: flex; flex-wrap: wrap; gap: 18px; }
.tc-row .tc-field { flex: 1 1 170px; }

.tc-field label {
  display: block; margin-bottom: 7px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; color: var(--wood-gold);
  text-transform: uppercase; letter-spacing: 1.5px; font-size: 0.8rem;
}
.tc-hint { text-transform: none; letter-spacing: 0; color: #cabca6; font-size: 0.74rem; }
.tc-field select, .tc-field input {
  width: 100%; padding: 10px 12px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.95rem;
  color: var(--wood-cream); background: rgba(0,0,0,0.35);
  border: 1px solid var(--wood-gold-dim); border-radius: 5px;
}

.tc-headline {
  display: flex; flex-wrap: wrap; gap: 22px; align-items: flex-end;
  padding-bottom: 18px; margin-bottom: 18px;
  border-bottom: 1px solid var(--wood-gold-dim);
}
.tc-total { flex: 1 1 240px; display: flex; flex-direction: column; gap: 4px; }
.tc-total-value { font-family: 'Cinzel', Georgia, serif; font-size: 2.8rem; line-height: 1; color: var(--wood-gold); }
.tc-total-label {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem; letter-spacing: 1px;
  text-transform: uppercase; color: #cabca6;
}
.tc-total-splits { display: flex; gap: 22px; flex-wrap: wrap; }
.tc-total-splits div { display: flex; flex-direction: column; }
.tc-total-splits strong { font-family: 'Cinzel', Georgia, serif; font-size: 1.3rem; color: var(--wood-cream); }
.tc-total-splits span {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.72rem; letter-spacing: 0.8px;
  text-transform: uppercase; color: #cabca6;
}

.tc-scroll { overflow-x: auto; }
.tc-table {
  width: 100%; min-width: 560px; border-collapse: collapse;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.88rem; color: var(--wood-cream);
}
.tc-table th {
  padding: 9px 10px; text-align: left;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.72rem; font-weight: normal;
  text-transform: uppercase; letter-spacing: 1.2px; color: var(--wood-gold);
  border-bottom: 1px solid var(--wood-gold-dim);
}
.tc-table td { padding: 10px; border-bottom: 1px dotted rgba(212,175,55,0.22); vertical-align: top; }
.tc-group th { padding-top: 16px; border-bottom: 0; color: var(--wood-cream); letter-spacing: 2px; }
.tc-detail { color: #cabca6; }
.tc-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tc-taxcell span { display: block; font-size: 0.7rem; color: #a2977f; white-space: normal; }
.tc-yours {
  display: inline-block; padding: 1px 6px; border-radius: 3px;
  font-size: 0.68rem; color: #070a22; background: #7ee0a0;
}
.tc-table tfoot td {
  padding-top: 14px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; color: var(--wood-cream);
  border-bottom: 0; border-top: 1px solid var(--wood-gold-dim);
}
.tc-grand td { font-size: 1.1rem; color: var(--wood-gold); border-top: 0; padding-top: 4px; }

.tc-notes { margin: 18px 0 0; padding-left: 20px; }
.tc-notes li {
  margin-bottom: 8px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.86rem; line-height: 1.55; color: #cabca6;
}
.tc-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 22px; }

.tc-method { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--wood-gold-dim); }
.tc-method h3 {
  margin: 0 0 12px; font-family: 'Cinzel', Georgia, serif; color: var(--wood-gold);
  text-transform: uppercase; letter-spacing: 2px; font-size: 0.95rem;
}
.tc-method p {
  margin: 0 0 12px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.98rem; line-height: 1.66; color: var(--wood-cream);
}
.tc-limits {
  padding: 12px 16px; border-radius: 6px;
  border: 1px solid var(--wood-gold-dim); background: rgba(0,0,0,0.25);
  font-size: 0.9rem !important; color: #cabca6 !important;
}
.tc-limits strong { color: var(--wood-cream); }

/* ============================================================
   CHART MY TRIP — the multi-day itinerary
   ============================================================
   Deliberately built on the Chart My Crew form classes rather than a fresh
   set. The two planners ask most of the same questions and any drift between
   them would be visible on the same site. Only what's genuinely new to a trip
   — the day cards, the coverage table — gets its own rules.
   ============================================================ */

.trip-output { margin-top: 26px; }

.trip-travel .trip-check {
  display: flex; align-items: center; gap: 9px; margin-bottom: 8px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.88rem; letter-spacing: 0;
  text-transform: none; color: var(--wood-cream); cursor: pointer;
}
.trip-travel .trip-check input { flex: 0 0 auto; width: 16px; height: 16px; accent-color: var(--wood-gold); }

/* --- the honest warnings, above the plan where they can't be missed --- */
.trip-notes {
  margin: 22px 0 4px; padding: 16px 20px; border-radius: 6px;
  border: 1px solid var(--wood-gold-dim); background: rgba(233,196,106,0.08);
}
.trip-notes h4 {
  font-family: 'Cinzel', Georgia, serif; color: var(--wood-gold);
  text-transform: uppercase; letter-spacing: 2px; font-size: 0.88rem; margin: 0 0 10px;
}
.trip-notes ul { margin: 0; padding-left: 20px; }
.trip-notes li {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.88rem; line-height: 1.6;
  color: var(--wood-cream); margin-bottom: 7px;
}
.trip-notes li:last-child { margin-bottom: 0; }

/* --- one card per day --- */
.trip-days { display: flex; flex-direction: column; gap: 14px; margin-top: 24px; }

.trip-day {
  border: 1px solid var(--wood-gold-dim); border-radius: 7px;
  background: rgba(0,0,0,0.25); padding: 16px 18px;
}
.trip-day--off { background: rgba(0,0,0,0.13); border-style: dashed; }

.trip-day-head { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 16px; }

.trip-day-when {
  flex: 0 0 auto; min-width: 86px; display: flex; flex-direction: column; gap: 1px;
}
.trip-day-when strong {
  font-family: 'Cinzel', Georgia, serif; font-size: 0.95rem; color: var(--wood-gold);
  letter-spacing: 1px;
}
.trip-day-when span { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.8rem; color: #cabca6; }

.trip-day-park { flex: 1 1 220px; min-width: 0; }
.trip-day-park h4 {
  margin: 0 0 3px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.12rem;
  color: var(--wood-cream); letter-spacing: 0.3px;
}
.trip-visit {
  display: inline-block; margin-left: 4px; padding: 1px 7px; border-radius: 3px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.68rem; letter-spacing: 0.6px;
  text-transform: uppercase; color: #0a0e28; background: var(--wood-gold);
  vertical-align: middle;
}
.trip-day-why {
  margin: 0; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.84rem;
  line-height: 1.5; color: #cabca6;
}

.trip-day-crowd {
  flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: 2px;
  padding: 7px 12px; border-radius: 5px; border: 1px solid currentColor;
}
.trip-crowd-num { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.25rem; line-height: 1; }
.trip-crowd-num em { font-style: normal; font-size: 0.68rem; opacity: 0.7; }
.trip-crowd-name {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.68rem; text-transform: uppercase;
  letter-spacing: 0.8px; white-space: nowrap;
}

.trip-day-stats {
  margin-top: 12px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.82rem;
  color: #cabca6; letter-spacing: 0.3px;
}

.trip-day-detail { margin-top: 10px; }
.trip-day-detail summary {
  cursor: pointer; padding: 7px 0;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.84rem; color: var(--wood-gold);
  letter-spacing: 0.4px;
}
.trip-day-detail summary:hover { color: var(--wood-cream); }
.trip-day-schedule { padding-top: 8px; border-top: 1px solid var(--wood-gold-dim); }

.trip-repeat-tag {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 3px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.7rem; letter-spacing: 0.4px;
  color: #1a2050; background: #d8c07a;
}

/* --- coverage table --- */
.trip-coverage { margin-top: 28px; }
.trip-coverage h4 {
  font-family: 'Cinzel', Georgia, serif; color: var(--wood-gold);
  text-transform: uppercase; letter-spacing: 2px; font-size: 0.95rem;
  margin: 0 0 4px; padding-bottom: 8px; border-bottom: 1px solid var(--wood-gold-dim);
}
.trip-coverage-table { width: 100%; border-collapse: collapse; margin-top: 6px; }
.trip-coverage-table th {
  text-align: left; padding: 8px 10px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.76rem; color: var(--wood-gold);
  text-transform: uppercase; letter-spacing: 1.2px;
  border-bottom: 1px solid var(--wood-gold-dim);
}
.trip-coverage-table td {
  padding: 9px 10px; vertical-align: top;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.85rem; color: var(--wood-cream);
  border-bottom: 1px solid rgba(212,175,55,0.14);
}
.trip-cov-score { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1rem; color: var(--wood-gold); }
.trip-cov-person { display: inline-block; margin-right: 12px; color: #cabca6; }
.trip-cov-person strong { color: var(--wood-cream); }

.trip-caveat {
  margin: 22px 0 0; padding-top: 14px; border-top: 1px solid var(--wood-gold-dim);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.8rem; line-height: 1.6; color: #a89b86;
}

/* Narrow phones: the crowd badge stops being worth its own column. */
@media (max-width: 520px) {
  .trip-day-head { gap: 10px; }
  .trip-day-when { min-width: 0; flex: 1 1 100%; flex-direction: row; align-items: baseline; gap: 8px; }
  .trip-day-crowd { flex-direction: row; align-items: baseline; gap: 7px; padding: 5px 10px; }
  .trip-coverage-table { display: block; overflow-x: auto; }
}

@media print {
  /* THE SITE IS CREAM ON DARK GREEN. PAPER IS NOT.
     Measured before writing this: six of nine elements on a printed itinerary
     came out as cream or gold on white — the park names at a luminance
     difference of 39, the notes at 39, the coverage table at 39. The ride list
     printed fine and everything around it was effectively blank paper.

     So colour is restated here rather than inherited. Setting it on body isn't
     enough, because every one of these classes sets its own on screen and wins
     on specificity. */
  .trip-form,
  .trip-caveat,
  .planner-actions,
  .page-hero { display: none !important; }

  .trip-output { border: none; box-shadow: none; background: #fff; padding: 0; }

  .trip-day {
    break-inside: avoid; page-break-inside: avoid;
    border-color: #999; background: #fff;
  }

  .trip-day-park h4,
  .trip-day-when strong,
  .trip-notes h4,
  .trip-coverage h4,
  .trip-hop-head strong,
  .trip-finale-head strong,
  .trip-cov-score,
  .trip-cov-person strong { color: #000 !important; }

  .trip-day-why,
  .trip-day-stats,
  .trip-day-when span,
  .trip-notes li,
  .trip-coverage-table td,
  .trip-coverage-table th,
  .trip-cov-person,
  .trip-hop-why,
  .trip-finale-why,
  .trip-finale-time,
  .trip-closed-why,
  .trip-closed-list strong,
  .crew-help { color: #333 !important; }

  /* Tags are light text on a colour fill, which prints as a grey smudge with
     the ink turned off. Outline them instead. */
  .trip-visit, .trip-char-tag, .trip-repeat-tag,
  .trip-hop-tag, .trip-finale-tag, .crew-ll-tag {
    color: #000 !important; background: transparent !important;
    border: 1px solid #666; padding: 0 5px;
  }

  .trip-specials li, .trip-alsoon li {
    color: #000 !important; background: transparent !important; border-color: #999;
  }
  .trip-specials strong, .trip-alsoon strong { color: #000 !important; }

  /* A folded-up day prints as a heading and nothing else, so make sure the
     content is laid out whether or not the toggle was ever pressed. */
  .trip-day-detail summary { display: none; }
  .trip-day-detail > .trip-day-schedule { display: block !important; }
  .trip-day-schedule { border-top-color: #999; }

  .trip-notes { border-color: #999; background: #fff; }
  .trip-closed-list li { border-bottom-color: #bbb; }

  /* Found by scanning every text element in the print view for contrast rather
     than checking a list of selectors I'd chosen — which is how the first pass
     missed all five of these. The restaurant name printed at 1.7:1 and the
     "be in place by" time at 1.4:1, both effectively blank paper. */
  .trip-hours,
  .trip-hop-break span,
  .trip-closed-src,
  .trip-finale-why strong,
  .planner-item-dining .planner-item-title { color: #000 !important; }
  .trip-hours { color: #333 !important; }
  .trip-hop-break::before, .trip-hop-break::after { background: #bbb; }
}

/* The rotated stamp is nowrap so it reads as one struck line, which means a
   long one runs straight off a narrow phone rather than wrapping. Pages whose
   stamp already fits are unaffected — text that fits never wraps — so this is
   a floor under the component rather than a change to it. */
@media (max-width: 420px) {
  .log-stamp {
    white-space: normal;
    max-width: 100%;
    text-align: center;
    line-height: 1.5;
  }
}

/* ============================================================
   TRIP PLANNING HUB — everything in one place
   ============================================================
   The dropdown used to carry all 21 tools and guides. On a phone that is a
   21-row list at roughly 28px a row: it fits, technically, and it is horrible
   to use. The menu now carries the eight things people come for and points
   here for the rest.

   Nothing lost any internal linking in the move — the footer already links to
   every one of these from every page on the site.
   ============================================================ */

.hub-wrap { padding: 30px 24px 70px; max-width: 1040px; }

.hub-section { margin-bottom: 46px; }
.hub-section:last-child { margin-bottom: 0; }
.hub-section h2 {
  font-family: 'Cinzel', Georgia, serif; color: var(--wood-gold);
  text-transform: uppercase; letter-spacing: 2.4px; font-size: 1.05rem;
  margin: 0 0 6px; padding-bottom: 10px;
  border-bottom: 1px solid var(--wood-gold-dim);
}
.hub-lead {
  margin: 0 0 18px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.88rem; line-height: 1.6; color: #cabca6;
}

.hub-grid {
  display: grid; gap: 14px;
  grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr));
}

.hub-card {
  display: block; padding: 16px 18px; border-radius: 7px;
  border: 1px solid var(--wood-gold-dim);
  background: rgba(10, 14, 40, 0.72);
  text-decoration: none;
  transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}
.hub-card:hover, .hub-card:focus-visible {
  border-color: var(--wood-gold); background: rgba(10, 14, 40, 0.95);
  transform: translateY(-2px);
}
.hub-card h3 {
  margin: 0 0 6px; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.08rem;
  color: var(--wood-cream); letter-spacing: 0.3px;
}
.hub-card p {
  margin: 0; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.85rem;
  line-height: 1.55; color: #cabca6;
}

/* The flagship gets the full row on wide screens and a badge everywhere. */
.hub-card--lead { grid-column: 1 / -1; border-color: var(--wood-gold); }
.hub-card--lead h3 { font-size: 1.28rem; color: var(--wood-gold); }
.hub-card-tag {
  display: inline-block; margin-bottom: 8px; padding: 2px 9px; border-radius: 3px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.68rem; letter-spacing: 1.2px;
  text-transform: uppercase; color: #0a0e28; background: var(--wood-gold);
}

/* --- the trimmed dropdown's link through to this page --- */
.nav-group-all {
  display: block; margin-top: 6px; padding-top: 8px;
  border-top: 1px solid var(--wood-gold-dim);
  color: var(--wood-gold) !important;
}

@media print {
  .hub-card { break-inside: avoid; border-color: #999; background: #fff; }
}

/* --- Chart My Trip: the evening hop --------------------------------------
   A hop is a different kind of claim from the rest of a day's plan: it says
   "get on a bus". It gets its own block so nobody skims past it, and the block
   states the transfer time and what's waiting at the other end, because those
   are the two facts that decide whether it's worth doing. */
.trip-hop {
  margin-top: 12px; padding: 12px 14px; border-radius: 6px;
  border-left: 3px solid #7ab8e0; background: rgba(122,184,224,0.09);
}
.trip-hop-head { display: flex; align-items: baseline; gap: 9px; flex-wrap: wrap; }
.trip-hop-head strong {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.98rem; color: var(--wood-cream);
}
.trip-hop-tag {
  flex: 0 0 auto; padding: 2px 8px; border-radius: 3px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.68rem; letter-spacing: 1px;
  text-transform: uppercase; color: #06212f; background: #7ab8e0;
}
.trip-hop-why {
  margin: 6px 0 0; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.84rem;
  line-height: 1.55; color: #bcd9ea;
}

/* The transfer, shown in the timeline where it actually happens. */
.trip-hop-break {
  display: flex; align-items: center; gap: 10px;
  margin: 10px 0; padding: 0;
}
.trip-hop-break::before,
.trip-hop-break::after {
  content: ""; flex: 1; height: 1px; background: rgba(122,184,224,0.35);
}
.trip-hop-break span {
  flex: 0 0 auto; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.75rem;
  letter-spacing: 0.6px; text-transform: uppercase; color: #7ab8e0;
}

@media print {
  .trip-hop { border-color: #999; background: #fff; }
  .trip-hop-why { color: #333; }
}

/* --- Closures surfaced on a plan -----------------------------------------
   Warm amber rather than the alarm red used for errors. A ride being shut is
   information the reader needs, not something that has gone wrong with the
   plan — the plan handled it, which is the point being made. */
.trip-closed h4 { border-bottom-color: #c9a227; }
.trip-closed-list { margin: 10px 0 0; padding: 0; list-style: none; }
.trip-closed-list li {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px;
  padding: 9px 0; border-bottom: 1px solid rgba(201,162,39,0.18);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.86rem; line-height: 1.5;
}
.trip-closed-list li:last-child { border-bottom: 0; }
.trip-closed-list strong { color: #e9c46a; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.95rem; }
.trip-closed-why { flex: 1 1 240px; color: #cabca6; }
.trip-closed-src { flex: 0 0 auto; font-size: 0.76rem; color: var(--wood-gold); }

@media print {
  .trip-closed-list li { border-bottom-color: #bbb; }
  .trip-closed-list strong { color: #000; }
  .trip-closed-why { color: #333; }
}

/* --- Published vs typical hours ------------------------------------------
   Every day states which kind of hours it was planned against. Real hours get
   the gold treatment; typical ones stay muted and carry the word. A reader
   should never have to wonder whether a closing time is a fact or a guess. */
.trip-hours {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-variant-numeric: tabular-nums;
  color: #a89b86;
}
.trip-hours--real { color: var(--wood-gold); }

.trip-specials {
  margin: 10px 0 0; padding: 0; list-style: none;
  display: flex; flex-wrap: wrap; gap: 6px 8px;
}
.trip-specials li {
  padding: 3px 9px; border-radius: 3px;
  border: 1px solid rgba(212,175,55,0.4); background: rgba(212,175,55,0.08);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.76rem; color: var(--wood-cream);
}
.trip-specials strong { color: var(--wood-gold); font-weight: 600; }

/* --- Named meals ---------------------------------------------------------- */
.trip-char-tag {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 3px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.7rem; letter-spacing: 0.5px;
  color: #2b0f24; background: #e8a0cd;
}
/* Booking windows are the one dining fact with a deadline attached, so it gets
   a note rather than a line of small print. */
.trip-book {
  border-left: 3px solid #e8a0cd; padding-left: 10px;
  color: #edc4dd !important;
}

/* The hero's secondary way out.
   The primary button now goes to the planner, which is what the headline
   promises. News is still one tap away, just no longer the only thing the
   biggest button on the site does. Deliberately quiet — a second button of
   equal weight is two primary actions and therefore none. */
.plaque-btn-quiet {
  display: block;
  margin-top: 14px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.6px;
  color: rgba(255, 255, 255, 0.72);
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.28);
  padding-bottom: 2px;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}
.plaque-btn-quiet:hover,
.plaque-btn-quiet:focus-visible { color: #fff; border-bottom-color: #d4af37; }

/* --- The nighttime finale -------------------------------------------------
   Given its own block rather than a timeline row because it isn't a stop you
   walk up to — it's a commitment that reshapes the whole evening, and the
   "be in place by" time is the part people get wrong. */
.trip-finale {
  margin-top: 12px; padding: 12px 14px; border-radius: 6px;
  border-left: 3px solid #c9a0e8; background: rgba(201,160,232,0.10);
}
.trip-finale-head { display: flex; align-items: baseline; gap: 9px; flex-wrap: wrap; }
.trip-finale-head strong { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.98rem; color: var(--wood-cream); }
.trip-finale-tag {
  flex: 0 0 auto; padding: 2px 8px; border-radius: 3px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.68rem; letter-spacing: 1px;
  text-transform: uppercase; color: #22103a; background: #c9a0e8;
}
.trip-finale-time {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-variant-numeric: tabular-nums;
  font-size: 0.85rem; color: #d9c2ee;
}
.trip-finale-why {
  margin: 6px 0 0; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.84rem;
  line-height: 1.55; color: #d4c2e4;
}
.trip-finale-why strong { color: #e8d6f5; }

.trip-alsoon li { border-color: rgba(201,160,232,0.4); background: rgba(201,160,232,0.08); }
.trip-alsoon strong { color: #c9a0e8; }

@media print {
  .trip-finale { border-color: #999; background: #fff; }
  .trip-finale-why, .trip-finale-time { color: #333; }
}

/* Chart My Day's closure line — amber like the other planners' closed lists,
   so "this ride is shut" reads the same wherever you meet it. */
.planner-shut { border-left: 3px solid #c9a227; padding-left: 12px; }
.planner-shut strong { color: #e9c46a; }

/* --- Chart My Crew and Chart My Day on paper ------------------------------
   Same problem, same fix. These two were never checked either, and they share
   the planner-item markup with Chart My Trip, so the ride list was already
   readable while everything framing it was not. */
@media print {
  .crew-form, .crew-output .planner-actions, .planner-live, .planner-replan { display: none !important; }

  .crew-output { border: none; box-shadow: none; background: #fff; padding: 0; }

  .planner-head h3,
  .crew-person-card strong,
  .crew-splits h4, .crew-excluded h4,
  .planner-block h4 { color: #000 !important; }

  .planner-sub,
  .planner-closes,
  .crew-person-meta, .crew-person-count, .crew-person-all, .crew-person-out,
  .crew-split-time, .crew-split-waiting,
  .crew-excluded li, .crew-splits p,
  .planner-item-note { color: #333 !important; }

  .crew-person-card, .crew-split, .crew-ll {
    background: transparent !important; border-color: #999;
  }
  .crew-ll strong { color: #000 !important; }
  .planner-crowd-banner { background: transparent !important; border: 1px solid #999; }
  .planner-crowd-badge, .planner-crowd-head strong, .planner-crowd-sub { color: #000 !important; }

  /* Same full scan applied to these two. The split-up instructions — the whole
     point of Chart My Crew — printed at 1.4:1, and Chart My Day's closure line
     at 1.7:1. Both were invisible on paper. */
  .crew-ll, .crew-ll strong,
  .crew-split div, .crew-split strong,
  .planner-shut strong,
  .planner-route-label { color: #000 !important; }
  .crew-split .crew-split-waiting { color: #333 !important; }
  .trip-closed li strong, .crew-excluded li strong { color: #000 !important; }
  .log-stamp.planner-stamp { color: #8a3b2c !important; border-color: #8a3b2c !important; }
}

/* ------------------------------------------------------------------ */
/* Inline subscribe — the form that sits under a finished plan         */
/* ------------------------------------------------------------------ */

/* Present for screen readers, absent from the layout. The inline form's label
   is real rather than a placeholder: a placeholder disappears the moment
   someone types, which is exactly when a screen reader user needs it. */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.inline-subscribe {
  margin: 44px auto 8px;
  max-width: var(--max-width);
  padding: 0 24px;
}

.inline-subscribe-inner {
  background: linear-gradient(160deg, var(--green) 0%, var(--green-dark) 100%);
  border: 1px solid var(--green-mid);
  border-radius: 6px;
  padding: 30px 32px 26px;
  text-align: center;
}

.inline-subscribe h2 {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 1.45rem;
  font-weight: normal;
  color: var(--gold-light);
  margin: 0 0 10px;
  text-wrap: balance;
}

.inline-subscribe p {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.92rem;
  line-height: 1.55;
  color: var(--cream);
  margin: 0 auto 18px;
  max-width: 46em;
}

.inline-subscribe-form {
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0 auto;
  max-width: 480px;
}

.inline-subscribe-form input[type="email"] {
  flex: 1 1 240px;
  min-width: 0;
  min-height: 46px;
  padding: 0 14px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  /* 16px exactly. Anything smaller and iOS Safari zooms the page on focus,
     which on a phone reads as the site breaking. */
  font-size: 16px;
  color: var(--text-body);
  background: #fffdf7;
  border: 1px solid var(--green-mid);
  border-radius: 3px;
}

.inline-subscribe-form input[type="email"]:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 1px;
}

.inline-subscribe-form button[type="submit"] {
  flex: 0 0 auto;
  min-height: 46px;
  padding: 0 26px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #0a0e28;
  background: linear-gradient(var(--gold), #b8860b);
  border: 1px solid var(--gold);
  border-radius: 3px;
  cursor: pointer;
}

.inline-subscribe-form button[type="submit"]:hover {
  background: linear-gradient(#e9c46a, var(--gold));
}

.inline-subscribe-form button[type="submit"]:disabled {
  opacity: 0.6;
  cursor: default;
}

/* Reserves its line whether or not there's a message, so submitting doesn't
   shunt the fine print down the page. */
.inline-subscribe-message {
  min-height: 1.4em;
  margin: 14px 0 0;
  font-size: 0.9rem;
  font-weight: bold;
}

.inline-subscribe-message.success { color: #8fe0b8; }
.inline-subscribe-message.error { color: #ffb4a2; }

.inline-subscribe-fine {
  margin: 4px 0 0;
  font-size: 0.78rem;
  color: #9ea3cc;
}

@media (max-width: 560px) {
  .inline-subscribe { padding: 0 16px; }
  .inline-subscribe-inner { padding: 24px 18px 20px; }
  .inline-subscribe h2 { font-size: 1.2rem; }
  /* Stacked, and the button goes full width. A 46px-tall button squeezed into
     whatever space is left beside the field is a miss waiting to happen. */
  .inline-subscribe-form { flex-direction: column; }
  .inline-subscribe-form button[type="submit"] { width: 100%; }
  /* flex-basis follows the main axis, so the 240px basis that sets the field's
     WIDTH in a row becomes its HEIGHT once the container is a column — a
     240px-tall text box. Reset it here rather than above; the row layout still
     wants that basis. */
  .inline-subscribe-form input[type="email"] {
    flex: 0 0 auto;
    width: 100%;
    height: 46px;
  }
}

@media print {
  /* Nobody needs a signup box on a printed itinerary, and it would burn ink. */
  .inline-subscribe { display: none !important; }
}

/* ------------------------------------------------------------------ */
/* Narrow-viewport overflow fixes                                      */
/* ------------------------------------------------------------------ */

/* An <input> without an explicit width uses its `size` intrinsic width — about
   396px at this font size — and a grid item's default `min-width: auto` means
   the column cannot shrink below it. That made contact.html 154px wider than a
   320px screen, and 84px wider than a 390px one: the form ran off the edge on
   every phone tested. */
/* #contact-form, not .contact-form — it's an id in the markup. Worth the note,
   because the class version silently matched nothing and the page still
   overflowed by exactly as much as before. */
#contact-form input,
#contact-form textarea,
#contact-form select,
.contact-row > *,
.contact-row > * > * {
  min-width: 0;
  max-width: 100%;
}

#contact-form input,
#contact-form textarea,
#contact-form select {
  width: 100%;
  box-sizing: border-box;
}

/* A single flex row of buttons and a select, which had nowhere to go at 320px. */
.wait-toolbar-actions { flex-wrap: wrap; }

/* Inline code in the legal pages is unbreakable by default, so a long token —
   a cookie name, a URL — pushes the whole page sideways rather than wrapping. */
.legal-wrap code {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* ------------------------------------------------------------------ */
/* Height pages — /height/NN-inches.html                               */
/* ------------------------------------------------------------------ */

.hp-wrap { max-width: 900px; padding: 30px 24px 70px; }

.hp-lede {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.05rem; line-height: 1.7;
  color: var(--text-body); margin: 0 0 28px;
}

/* The lead answer, and the reason someone stays on the page: what another
   inch or two opens up. Given the strongest visual weight on purpose. */
.hp-unlock {
  background: linear-gradient(160deg, var(--green) 0%, var(--green-dark) 100%);
  border: 1px solid var(--green-mid); border-radius: 6px;
  padding: 24px 26px; margin: 0 0 34px;
}
.hp-unlock h2 {
  font-family: Cinzel, Georgia, serif; font-size: 1.3rem; color: var(--gold-light);
  margin: 0 0 8px; border: 0; padding: 0;
}
.hp-unlock p { color: var(--cream); font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.95rem; margin: 0 0 14px; }
.hp-list-unlock li { color: var(--cream); border-color: rgba(212,175,55,0.25); }
.hp-list-unlock .hp-land { color: var(--gold); }

.hp-resort {
  font-family: Cinzel, Georgia, serif; font-size: 1.1rem; color: var(--green-mid);
  text-transform: uppercase; letter-spacing: 1.5px;
  margin: 30px 0 4px; padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
}

.hp-park { margin: 18px 0 0; }
.hp-park h4 {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1rem; color: var(--text-body);
  margin: 0 0 8px; display: flex; align-items: center; gap: 10px;
}
.hp-count {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.72rem; font-weight: bold;
  color: #6b6550; background: var(--border); border-radius: 10px; padding: 2px 9px;
}

.hp-list { list-style: none; margin: 0; padding: 0; }
.hp-list li {
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.94rem; line-height: 1.5;
  padding: 7px 0; border-bottom: 1px solid var(--border);
}
.hp-list li:last-child { border-bottom: 0; }

/* The requirement itself, so a parent can see the margin at a glance. */
.hp-req {
  font-weight: bold; color: #8a3b2c; font-variant-numeric: tabular-nums;
}
.hp-any { font-size: 0.8rem; color: #4a7c59; }
.hp-land { margin-left: auto; font-size: 0.8rem; color: #8a8265; text-align: right; }

.hp-other { margin-top: 40px; }
.hp-heights { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; padding: 0; }
.hp-heights a, .hp-current {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 52px; min-height: 40px; padding: 0 10px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.9rem; font-weight: bold;
  border: 1px solid var(--border); border-radius: 4px;
  background: var(--card-bg); color: var(--green-mid); text-decoration: none;
}
.hp-heights a:hover { background: var(--green); color: var(--gold-light); border-color: var(--green); }
.hp-current { background: var(--green); color: var(--gold-light); border-color: var(--green); }
.hp-fine { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.86rem; color: #6b6550; margin: 0; }

@media (max-width: 560px) {
  .hp-wrap { padding: 24px 16px 60px; }
  .hp-unlock { padding: 18px; }
  /* The land name drops under the ride rather than being squeezed against it. */
  .hp-land { margin-left: 0; flex-basis: 100%; text-align: left; }
}

/* ------------------------------------------------------------------ */
/* YouTube facade                                                      */
/* ------------------------------------------------------------------ */

.video-facade { margin: 30px 0 0; }
.video-facade-btn {
  display: block; position: relative; width: 100%; padding: 0;
  border: 1px solid var(--wood-border); border-radius: 8px;
  background: #000; cursor: pointer; overflow: hidden;
  aspect-ratio: 16 / 9;
}
.video-facade-thumb {
  width: 100%; height: 100%; object-fit: cover; display: block;
  /* hqdefault is 4:3 with black bars; cropping to 16:9 loses the bars rather
     than showing them. */
  opacity: 0.86; transition: opacity .15s ease, transform .3s ease;
}
.video-facade-btn:hover .video-facade-thumb,
.video-facade-btn:focus-visible .video-facade-thumb { opacity: 1; transform: scale(1.02); }
.video-facade-play {
  position: absolute; inset: 0; display: grid; place-items: center;
  pointer-events: none;
}
.video-facade-play .vf-bg { fill: rgba(20,20,20,0.78); transition: fill .15s ease; }
.video-facade-btn:hover .vf-bg,
.video-facade-btn:focus-visible .vf-bg { fill: #cc0000; }
.video-facade-frame {
  width: 100%; aspect-ratio: 16 / 9; border: 1px solid var(--wood-border);
  border-radius: 8px; display: block;
}
.video-facade-caption {
  margin: 10px 0 0;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.82rem; color: #9ea3cc;
}
.video-facade-caption a { color: #cabca6; }

@media print {
  /* A play button on paper is ink for nothing. */
  .video-facade { display: none !important; }
}

/* ------------------------------------------------------------------ */
/* Affiliate blocks                                                    */
/* ------------------------------------------------------------------ */

/* Deliberately quiet. This sits under a number somebody has just read and it
   should look like a next step, not an advert interrupting the answer — the
   moment it out-shouts the tool above it, the tool stops being trusted. */
.aff-block {
  margin-top: 28px;
  padding: 22px 24px;
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border);
  border-left: 3px solid var(--wood-gold-dim);
  border-radius: 8px;
}
.aff-heading {
  margin: 0 0 6px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.15rem;
  color: #e9c46a; font-weight: bold;
}
.aff-lead {
  margin: 0 0 12px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.9rem; line-height: 1.55;
  color: #cabca6;
}
/* Smaller than the lead, but not grey-on-grey. A disclosure the reader can't
   comfortably read is the same as no disclosure, legally and otherwise. */
.aff-disclosure {
  margin: 0 0 16px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.8rem; line-height: 1.5;
  color: #9ea3cc;
}
.aff-disclosure a { color: #b8ab93; text-decoration: underline; }

/* ---- Inline links in prose (js/affiliates.js initInlineAffiliateLinks) ----
   Deliberately styled like any other link in the copy, not like a button. The
   sentence is doing the work; a merchant name that lights up differently from
   every other link reads as an advert and gets skipped. The disclosure above
   it is what makes the relationship clear — that's the honest signal, not a
   colour change. */
.aff-inline {
  color: var(--wood-gold);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.aff-inline:hover, .aff-inline:focus-visible { color: #e9c46a; }

.aff-inline-note {
  margin: 0 0 16px;
  padding: 9px 13px;
  border-left: 2px solid var(--wood-gold-dim);
  background: rgba(10, 14, 40, 0.55);
  border-radius: 0 4px 4px 0;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.82rem; line-height: 1.5;
  color: #9ea3cc;
}
.aff-inline-note a { color: #b8ab93; text-decoration: underline; }

.aff-links {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap: 12px;
}
.aff-link {
  display: flex; flex-direction: column; gap: 3px;
  padding: 14px 16px;
  background: rgba(0,0,0,0.25);
  border: 1px solid var(--wood-border); border-radius: 6px;
  text-decoration: none;
  transition: border-color .15s ease, transform .15s ease;
}
.aff-link:hover, .aff-link:focus-visible { border-color: var(--wood-gold); transform: translateY(-2px); }
.aff-link-name {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1rem; font-weight: bold; color: #e9c46a;
}
.aff-link-what {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.82rem; color: #cabca6;
}

@media print {
  /* A paid link on paper is ink for nothing. */
  .aff-block { display: none !important; }
}

/* ------------------------------------------------------------------ */
/* Site search                                                         */
/* ------------------------------------------------------------------ */

/* Matches the cart and YouTube icons beside it. */
.search-trigger {
  background: none; border: none; cursor: pointer;
  color: var(--wood-cream); display: inline-flex; align-items: center; padding: 0;
}
.search-trigger:hover { color: var(--wood-gold); }
.search-trigger svg { width: 18px; height: 18px; }

.site-search {
  position: fixed; inset: 0; z-index: 900;
  display: flex; align-items: flex-start; justify-content: center;
  padding: 8vh 16px 16px;
}
.site-search[hidden] { display: none; }
.site-search-backdrop { position: absolute; inset: 0; background: rgba(4, 14, 11, 0.82); }
.site-search-panel {
  position: relative; width: min(640px, 100%);
  max-height: 80vh; display: flex; flex-direction: column;
  background: #0b1030; border: 1px solid var(--wood-border); border-radius: 10px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.6);
  overflow: hidden;
}
.site-search-bar {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px; border-bottom: 1px solid var(--wood-border);
}
.site-search-bar svg { width: 20px; height: 20px; color: var(--wood-gold); flex: none; }
.site-search-input {
  flex: 1; min-width: 0;
  /* 16px exactly: below it, iOS Safari zooms the page the moment this focuses,
     which for a search box that opens automatically is the whole screen
     lurching. */
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 16px; color: var(--wood-cream);
  background: none; border: none; outline: none; padding: 8px 0;
}
.site-search-input::placeholder { color: #9ea3cc; }
.site-search-close {
  flex: none; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.72rem; font-weight: bold;
  letter-spacing: 1px; color: #cabca6; background: rgba(0,0,0,0.3);
  border: 1px solid var(--wood-border); border-radius: 5px; padding: 6px 10px; cursor: pointer;
}
.site-search-close:hover { color: var(--wood-cream); border-color: var(--wood-gold); }
.site-search-status {
  margin: 0; padding: 10px 16px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.8rem; color: #9ea3cc;
  border-bottom: 1px solid rgba(58, 66, 117,0.4);
}
.site-search-results { list-style: none; margin: 0; padding: 6px; overflow-y: auto; }
.site-search-results li { margin: 0; }
.site-search-results a {
  display: grid; grid-template-columns: auto 1fr; gap: 2px 10px;
  align-items: baseline;
  padding: 10px 12px; border-radius: 6px; text-decoration: none;
}
.site-search-results li.is-active a,
.site-search-results a:hover { background: rgba(233,196,106,0.12); }
.ss-kind {
  grid-row: 1 / span 2;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.6rem; font-weight: bold;
  letter-spacing: 1px; text-transform: uppercase; color: #0f1540;
  background: var(--wood-gold-dim); border-radius: 3px; padding: 3px 6px;
  white-space: nowrap; align-self: start; margin-top: 2px;
}
.ss-title { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1rem; color: var(--wood-cream); }
.ss-title mark { background: none; color: var(--wood-gold); font-weight: bold; }
.ss-sub { grid-column: 2; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem; color: #9ea3cc; }

@media (max-width: 560px) {
  .site-search { padding: 0; }
  .site-search-panel { width: 100%; max-height: 100%; height: 100%; border-radius: 0; border: none; }
}

/* ------------------------------------------------------------------ */
/* 404                                                                 */
/* ------------------------------------------------------------------ */

/* Vercel's own not-found page is a white screen with no header, no nav and no
   way back into the site. Somebody who mistypes a URL or follows a stale link
   from Pinterest lands there and leaves. This one keeps the masthead and the
   full footer and offers the six things people actually arrive for. */
/* On a panel, not on the map: the background's own engraved lettering runs
   right through body copy laid straight on it. */
.nf-lead {
  max-width: 46em; margin: 0 auto 22px; text-align: center;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.95rem; line-height: 1.6;
  color: #e4d7c5;
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border); border-radius: 8px;
  padding: 14px 20px;
}
.nf-lead-quiet { margin: 30px auto 0; font-size: 0.9rem; color: #cabca6; }
.nf-lead a { color: #e9c46a; }

.nf-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr));
  gap: 14px;
}
.nf-card {
  display: flex; flex-direction: column; gap: 6px;
  padding: 18px 20px;
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border);
  border-radius: 8px;
  text-decoration: none;
  transition: border-color .15s ease, transform .15s ease;
}
.nf-card:hover, .nf-card:focus-visible { border-color: var(--wood-gold); transform: translateY(-2px); }
.nf-card strong {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.1rem; color: #e9c46a; font-weight: bold;
}
.nf-card span {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.88rem; line-height: 1.5; color: #cabca6;
}

/* ------------------------------------------------------------------ */
/* Skip to content                                                     */
/* ------------------------------------------------------------------ */

/* Every page opens with the masthead and a nav carrying roughly thirty-five
   links, so reaching the actual content by keyboard meant thirty-five tab
   stops, on every page, every time. This is the first focusable thing on the
   page and it jumps straight past all of it.

   Off-screen rather than display:none, because a hidden element can't be
   focused and the link would never appear. tabindex="-1" on the target makes
   the browser move focus there rather than only scrolling — without it the
   next Tab goes back to the second nav link and the jump achieves nothing. */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 1000;
  padding: 12px 20px;
  background: #e9c46a;
  color: #0a0e28;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.95rem;
  font-weight: bold;
  text-decoration: none;
  border-radius: 0 0 6px 0;
}
.skip-link:focus {
  left: 0;
  outline: 2px solid #0a0e28;
  outline-offset: -4px;
}
/* The target takes focus programmatically; it must not draw a focus ring
   around the whole page for a mouse user who happened to click a jump link. */
[id][tabindex="-1"]:focus { outline: none; }

/* ------------------------------------------------------------------ */
/* Save to Pinterest                                                   */
/* ------------------------------------------------------------------ */

.pin-save-row {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 18px 24px 0;
  display: flex;
  justify-content: flex-end;
}

.pin-save-btn {
  display: inline-flex; align-items: center; gap: 8px;
  /* 44px, because this sits alongside Print and Share on a phone and a share
     button people can't hit is a share button that doesn't exist. */
  min-height: 44px; padding: 0 16px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.85rem; font-weight: bold;
  color: #fff; background: #bd081c;
  border: 1px solid #9c0616; border-radius: 22px;
  text-decoration: none; white-space: nowrap;
  transition: background 0.15s ease;
}
.pin-save-btn:hover,
.pin-save-btn:focus-visible { background: #9c0616; color: #fff; }
.pin-save-btn svg { width: 18px; height: 18px; flex: 0 0 auto; }

/* On a guide page the button sits under the title, inside a column that has
   already been wrapped and padded. Without this it inherits the standalone
   row's own max-width and gutters and ends up indented from its own heading. */
.pin-save-row--inline {
  max-width: none;
  margin: 0 0 4px;
  padding: 0;
  justify-content: flex-start;
}

@media (max-width: 560px) {
  .pin-save-row { padding: 14px 16px 0; justify-content: stretch; }
  .pin-save-row--inline { padding: 0; }
  .pin-save-btn { width: 100%; justify-content: center; }
}

@media print {
  /* A share button on paper is ink for nothing. */
  .pin-save-row { display: none !important; }
}

/* ------------------------------------------------------------------ */
/* Email me this plan                                                  */
/* ------------------------------------------------------------------ */

.ep-wrap { position: relative; display: inline-block; }

.ep-panel {
  /* In flow rather than absolutely positioned: the actions row wraps on a
     phone, and a floating panel would end up over the itinerary. */
  margin-top: 10px;
  background: var(--green);
  border: 1px solid var(--green-mid);
  border-radius: 6px;
  padding: 16px;
  min-width: 280px;
  text-align: left;
}

.ep-row { display: flex; gap: 8px; flex-wrap: wrap; }

.ep-row input[type="email"] {
  flex: 1 1 180px; min-width: 0; height: 44px; padding: 0 12px;
  /* 16px exactly — anything less and iOS Safari zooms the page on focus. */
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 16px;
  color: var(--text-body); background: #fffdf7;
  border: 1px solid var(--green-mid); border-radius: 3px;
}
.ep-row input[type="email"]:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; }

.ep-send {
  flex: 0 0 auto; height: 44px; padding: 0 20px; cursor: pointer;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.85rem; font-weight: bold;
  text-transform: uppercase; letter-spacing: 0.5px; color: #0a0e28;
  background: linear-gradient(var(--gold), #b8860b);
  border: 1px solid var(--gold); border-radius: 3px;
}
.ep-send:hover { background: linear-gradient(#e9c46a, var(--gold)); }
.ep-send:disabled { opacity: 0.6; cursor: default; }

.ep-optin {
  display: flex; align-items: flex-start; gap: 9px; margin-top: 12px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.83rem; line-height: 1.45;
  color: var(--cream); cursor: pointer;
}
.ep-optin input { margin-top: 2px; flex: 0 0 auto; width: 17px; height: 17px; }

.ep-message { min-height: 1.3em; margin: 10px 0 0; font-size: 0.85rem; font-weight: bold; color: var(--cream); }
.ep-message.success { color: #8fe0b8; }
.ep-message.error { color: #ffb4a2; }

@media (max-width: 560px) {
  .ep-wrap { display: block; }
  .ep-panel { min-width: 0; }
  .ep-send { width: 100%; }
}

@media print {
  .ep-wrap { display: none !important; }
}

/* ============================================================
   Booking Windows — deadline countdown
   ============================================================ */
.bw-wrap { max-width: 860px; padding: 30px 24px 70px; }

.bw-controls {
  display: grid; grid-template-columns: 1fr 1fr; gap: 18px;
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border); border-radius: 8px;
  padding: 22px 24px; margin-bottom: 24px;
}
/* min-width: 0 because a grid item defaults to min-width: auto, which means it
   refuses to shrink below its content's intrinsic width. The content here is a
   date input at 1.15rem with 14px of padding, and its intrinsic width is wider
   than a 320px phone — so the field held the whole page 48px open and
   booking-windows.html scrolled sideways. The inputs need the same treatment
   plus border-box, or their padding is added on top of the 100%. */
.bw-field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.bw-field > .planner-select {
  width: 100%; min-width: 0; box-sizing: border-box; max-width: 100%;
}
.bw-field-wide { grid-column: 1 / -1; }
.bw-field > span {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem; text-transform: uppercase;
  letter-spacing: 1.6px; color: #e9c46a;
}
.bw-field > em {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.8rem; font-style: normal;
  color: var(--wood-cream-dim);
}
.bw-check {
  grid-column: 1 / -1; display: flex; align-items: center; gap: 10px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.92rem; color: #cabca6;
}
.bw-check input { width: 17px; height: 17px; accent-color: var(--wood-gold); }
.bw-empty { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; color: var(--wood-cream-dim); }

/* ---- Headline ---- */
.bw-headline {
  display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 24px;
}
.bw-trip, .bw-next {
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border); border-radius: 8px; padding: 18px 20px;
  display: flex; flex-direction: column; gap: 5px;
}
.bw-next { border-left: 4px solid var(--wood-gold); border-radius: 0 8px 8px 0; }
.bw-trip strong, .bw-next strong {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.06rem; color: var(--wood-cream);
}
.bw-trip span, .bw-next span {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.86rem; color: #cabca6;
}
.bw-trip-count, .bw-next-count {
  font-family: Cinzel, Georgia, serif !important; font-size: 1.05rem !important;
  color: #e9c46a !important; margin-top: 3px;
}
.bw-next-label {
  font-size: 0.72rem !important; text-transform: uppercase; letter-spacing: 2px;
  color: #9ea3cc !important;
}
.bw-next-none strong { color: #6fc39d; }

/* ---- The list ---- */
.bw-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.bw-item {
  background: rgba(10, 14, 40, 0.88);
  border: 1px solid var(--wood-border); border-left: 4px solid var(--wood-gold-dim);
  border-radius: 0 8px 8px 0; padding: 18px 22px;
}
.bw-item.bw-high { border-left-color: #dd8433; }
.bw-item.bw-medium { border-left-color: var(--wood-gold); }
.bw-item.bw-low { border-left-color: #4a9d7c; }
.bw-item.is-past { opacity: 0.55; }

.bw-item-head {
  display: grid; grid-template-columns: 190px 1fr; gap: 18px; align-items: start;
}
.bw-when { display: flex; flex-direction: column; gap: 2px; }
.bw-when strong {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.98rem; color: #e9c46a; line-height: 1.35;
}
.bw-time {
  font-family: Cinzel, Georgia, serif; font-size: 0.92rem; color: var(--wood-cream);
}
.bw-count {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem;
  text-transform: uppercase; letter-spacing: 1.2px; color: #9ea3cc;
}
.bw-what h3 {
  font-family: Cinzel, Georgia, serif; font-size: 1.12rem; color: var(--wood-cream);
  margin: 0 0 3px;
}
.bw-park {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem;
  color: var(--wood-cream-dim);
}
.bw-detail {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.98rem; line-height: 1.62;
  color: #cabca6; margin: 13px 0 0;
}
.bw-timenote {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.85rem; line-height: 1.5;
  color: #f0a15c; margin: 9px 0 0;
}
.bw-action {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.88rem; line-height: 1.55;
  color: #cabca6; margin: 11px 0 0;
}
.bw-action span {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; text-transform: uppercase; letter-spacing: 1.4px;
  font-size: 0.72rem; color: #e9c46a; margin-right: 6px;
}
.bw-related { margin: 10px 0 0; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.86rem; }
.bw-related a { color: var(--wood-gold); }

.bw-perday { margin-top: 13px; }
.bw-perday summary {
  cursor: pointer; font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.84rem;
  color: var(--wood-gold); padding: 4px 0;
}
.bw-perday ul { list-style: none; margin: 8px 0 0; padding: 0; }
.bw-perday li {
  display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.85rem; color: #cabca6;
  padding: 5px 0; border-bottom: 1px dashed rgba(212, 175, 55, 0.14);
}
.bw-perday li:last-child { border-bottom: 0; }
.bw-perday li.is-past { opacity: 0.5; }
.bw-perday em { font-style: normal; color: var(--wood-cream-dim); }
.bw-perday b { font-weight: normal; color: #e9c46a; text-align: right; }

/* ---- Gaps + actions ---- */
/* The alarm-kit panel earns the gold edge: it's the one thing on this page we
   want acted on, sitting right after the list it turns into phone alarms. */
.bw-alarms {
  margin-top: 26px; background: rgba(11, 16, 48, 0.85);
  border: 1px solid var(--wood-gold-dim); border-left: 3px solid var(--wood-gold);
  border-radius: 0 8px 8px 0; padding: 22px 24px;
}
.bw-alarms h3 {
  font-family: Cinzel, Georgia, serif; font-size: 1.1rem; color: #e9c46a; margin: 0 0 10px;
}
.bw-alarms-lead {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.9rem; line-height: 1.6;
  color: var(--wood-cream); margin: 0 0 14px; max-width: 62ch;
}
.bw-alarms-form { max-width: 480px; }

.bw-gaps {
  margin-top: 26px; background: rgba(10, 14, 40, 0.7);
  border: 1px solid var(--wood-border); border-left: 3px solid var(--wood-gold-dim);
  border-radius: 0 8px 8px 0; padding: 22px 24px;
}
.bw-gaps h3 {
  font-family: Cinzel, Georgia, serif; font-size: 1.1rem; color: #e9c46a; margin: 0 0 12px;
}
.bw-gaps p {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.96rem; line-height: 1.62; color: #cabca6; margin: 0 0 12px;
}
.bw-gaps ul { margin: 0 0 14px; padding-left: 20px; }
.bw-gaps li {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.9rem; line-height: 1.55;
  color: #cabca6; margin-bottom: 6px;
}
.bw-gaps li::marker { color: var(--wood-gold-dim); }
.bw-fine { font-size: 0.86rem !important; font-style: italic; margin-bottom: 0 !important; }

.bw-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }

@media (max-width: 760px) {
  .bw-controls, .bw-headline { grid-template-columns: 1fr; }
  .bw-item-head { grid-template-columns: 1fr; gap: 8px; }
}
@media print {
  .bw-controls, .bw-actions { display: none; }
  .bw-headline, .bw-trip, .bw-next, .bw-item, .bw-gaps {
    background: #fff !important; border-color: #999 !important;
  }
  .bw-trip strong, .bw-next strong, .bw-what h3, .bw-when strong,
  .bw-time, .bw-gaps h3 { color: #000 !important; }
  .bw-detail, .bw-action, .bw-park, .bw-count, .bw-gaps p, .bw-gaps li,
  .bw-trip span, .bw-next span, .bw-timenote { color: #333 !important; }
  .bw-trip-count, .bw-next-count { color: #000 !important; }
  .bw-perday { display: none; }
}

/* Booking Windows — rules that aren't deadlines, kept out of the countdown */
.bw-advisory {
  margin-top: 26px; background: rgba(11, 16, 48, 0.6);
  border: 1px solid var(--wood-border); border-left: 3px solid #4a9d7c;
  border-radius: 0 8px 8px 0; padding: 20px 24px;
}
.bw-advisory h3 {
  font-family: Cinzel, Georgia, serif; font-size: 1.08rem; color: #e9c46a; margin: 0 0 14px;
}
.bw-adv-item + .bw-adv-item { margin-top: 18px; padding-top: 16px; border-top: 1px dashed rgba(212,175,55,0.16); }
.bw-adv-item h4 {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1rem; color: var(--wood-cream); margin: 0 0 7px;
}
.bw-adv-item p {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.95rem; line-height: 1.6; color: #cabca6; margin: 0;
}
@media print { .bw-advisory { background: #fff !important; border-color: #999 !important; }
  .bw-advisory h3, .bw-adv-item h4 { color: #000 !important; }
  .bw-adv-item p { color: #333 !important; } }

/* ============================================================
   EPCOT FOOD & WINE — every booth menu (js/render-food-wine.js)
   Two panel values, same as the crowd calendar: the summary and the
   booth cards sit on solid fill so the map behind them stays
   atmosphere rather than competing with 181 prices.
   ============================================================ */
.fw-summary {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
  gap: 14px; margin-bottom: 18px;
}
.fw-stat {
  background: #141b45; border: 1px solid var(--wood-border); border-radius: 6px;
  padding: 16px 18px; display: flex; flex-direction: column; gap: 4px; min-width: 0;
}
.fw-stat strong {
  font-family: Cinzel, Georgia, serif; font-size: 1.5rem; color: var(--wood-gold); line-height: 1.15;
}
.fw-stat span {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.8rem; letter-spacing: 1.4px;
  text-transform: uppercase; color: var(--wood-cream-dim);
}
.fw-source {
  background: #0B241C; border: 1px solid var(--wood-border);
  border-left: 3px solid var(--wood-gold-dim); border-radius: 0 6px 6px 0;
  padding: 16px 18px; margin: 0 0 22px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1rem; line-height: 1.65; color: #ddd0bb;
}
.fw-source em { color: var(--wood-cream); font-style: italic; }

.fw-controls {
  display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 16px;
  background: #0B241C; border: 1px solid var(--wood-border); border-radius: 8px;
  padding: 20px 22px; margin-bottom: 16px;
}
.fw-field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.fw-field > span {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem; text-transform: uppercase;
  letter-spacing: 1.6px; color: #e9c46a;
}
/* min-width:0 plus border-box, or the search input's intrinsic width holds a
   small phone open — the same trap the booking-windows fields fell into. */
.fw-field > .planner-select { width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; }

.fw-count {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.9rem;
  color: var(--wood-cream-dim); margin: 0 0 18px;
}
.fw-empty {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; color: var(--wood-cream-dim);
  background: #0B241C; border: 1px solid var(--wood-border); border-radius: 6px;
  padding: 22px 24px; margin: 0;
}

.fw-booth {
  background: #0B241C; border: 1px solid var(--wood-border); border-radius: 8px;
  padding: 20px 22px; margin-bottom: 16px;
}
.fw-booth-name {
  font-family: Cinzel, Georgia, serif; font-size: 1.35rem; color: var(--wood-gold);
  margin: 0 0 4px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.fw-badge {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.72rem; font-weight: bold;
  letter-spacing: 1px; text-transform: uppercase; color: #0a0e28;
  background: var(--wood-gold); border-radius: 3px; padding: 3px 9px;
}
.fw-cat {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem; letter-spacing: 2px;
  text-transform: uppercase; color: #e9c46a; margin: 18px 0 8px;
}
.fw-items { list-style: none; margin: 0; padding: 0; }
.fw-item {
  display: flex; gap: 18px; align-items: baseline;
  padding: 10px 0; border-bottom: 1px solid rgba(28, 36, 88, 0.55);
}
.fw-item:last-child { border-bottom: 0; }
.fw-item-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.fw-item-name { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 1.02rem; color: var(--wood-cream); }
.fw-item-desc {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.86rem; line-height: 1.5;
  color: var(--wood-cream-dim);
}
.fw-item-price {
  font-family: Cinzel, Georgia, serif; font-size: 1.05rem; color: var(--wood-gold);
  white-space: nowrap; flex: none;
}
.fw-item-price.is-unpriced {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.78rem;
  font-style: italic; color: #9ea3cc;
}

@media (max-width: 760px) {
  .fw-controls { grid-template-columns: 1fr; }
  .fw-item { flex-direction: column; gap: 4px; }
  .fw-item-price { align-self: flex-start; }
}
@media print {
  .fw-controls, .fw-count { display: none !important; }
  .fw-booth, .fw-summary, .fw-stat, .fw-source {
    background: #fff !important; border-color: #999 !important;
  }
  .fw-booth-name, .fw-cat, .fw-item-name, .fw-item-price, .fw-stat strong { color: #000 !important; }
}

/* ---------------------------------------------------------------------------
   Construction & closure project pages (/construction/<slug>)

   The date panel carries the whole argument of these pages, so the four states
   are deliberately NOT styled alike. A confirmed date gets the gold treatment
   and a big number; a window gets a quieter card and a bar; "not reopening" and
   "not announced" get no number at all. If a reader cannot tell at a glance
   which of the four they are looking at, the page has failed at the one job it
   has over every other park site.
   ------------------------------------------------------------------------- */
.cd-status-line {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin: 0 0 22px;
}
.cd-status-line .tracker-badge { position: static; }
.cd-where {
  color: var(--wood-cream-dim);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.95rem;
}

.cd-panel {
  border: 1px solid var(--wood-border);
  border-radius: 10px;
  background: var(--wood-panel-solid);
  padding: 22px 24px;
  margin: 0 0 30px;
}
.cd-label {
  display: block;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.76rem; letter-spacing: 0.09em; text-transform: uppercase;
  color: var(--wood-cream-dim);
  margin-bottom: 6px;
}
.cd-count {
  margin: 0;
  font-family: "Cinzel Decorative", Cinzel, Georgia, serif;
  font-size: clamp(2rem, 6vw, 3rem); line-height: 1.1;
  color: var(--wood-gold);
}
.cd-estimate {
  margin: 0;
  font-family: Cinzel, Georgia, serif;
  font-size: clamp(1.25rem, 3.4vw, 1.7rem); line-height: 1.3;
  color: var(--wood-cream);
}
.cd-statement {
  margin: 0;
  font-family: Cinzel, Georgia, serif;
  font-size: clamp(1.2rem, 3vw, 1.5rem);
  color: var(--wood-cream);
}
.cd-note, .cd-why, .cd-stale {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  margin: 8px 0 0;
}
.cd-note { color: var(--wood-cream-dim); font-size: 1rem; }
.cd-why  { color: var(--wood-cream-dim); font-size: 0.88rem; line-height: 1.6; }
.cd-why a { color: var(--wood-gold); }

/* Only the confirmed-date panel gets the gold edge. */
.cd-exact { border-color: var(--wood-gold-dim); }

/* An estimate whose window has entirely passed. Amber, not red: nothing is
   broken, the park just went quiet. */
.cd-stale {
  color: #e8b44a; font-size: 0.92rem; font-weight: 700;
}
.cd-is-stale { border-color: #7a5a12; }

.cd-bar {
  position: relative;
  height: 10px; border-radius: 5px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid var(--wood-border);
  margin: 16px 0 6px;
  overflow: hidden;
}
.cd-bar-fill {
  display: block; height: 100%;
  background: linear-gradient(90deg, #0e6b3e, var(--wood-gold));
}
.cd-bar-ends {
  display: flex; justify-content: space-between; gap: 12px;
  margin: 0;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.8rem; color: var(--wood-cream-dim);
}
.cd-bar-ends span:last-child { text-align: right; }

.cd-body {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 1.04rem; line-height: 1.75;
  color: var(--wood-cream);
}
.cd-source {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.9rem; color: var(--wood-cream-dim);
}
.cd-source a { color: var(--wood-gold); }

.cd-related { list-style: none; padding: 0; margin: 0; }
.cd-related li {
  display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  padding: 11px 0;
  border-bottom: 1px solid var(--wood-border);
}
.cd-related a {
  color: var(--wood-gold);
  font-family: Cinzel, Georgia, serif; font-size: 1.02rem;
}
.cd-related span {
  color: var(--wood-cream-dim);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.85rem;
  text-align: right;
}

.cd-sidebar-note {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.9rem; line-height: 1.6;
  color: var(--wood-cream-dim);
  margin: 0 0 14px;
}
.cd-sidebar-btn { display: block; text-align: center; margin-top: 10px; }
.cd-sidebar-btn-alt {
  border: 1px solid var(--wood-border);
  border-radius: 6px;
  padding: 10px 14px;
  color: var(--wood-cream);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.9rem;
  text-decoration: none;
}
.cd-sidebar-btn-alt:hover { border-color: var(--wood-gold-dim); color: var(--wood-gold); }

/* The tracker hub's cards now lead somewhere. */
.tracker-card-name a { color: inherit; text-decoration: none; }
.tracker-card-name a:hover { color: var(--wood-gold); }
.tracker-card-more {
  display: inline-block; margin-top: 10px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 0.86rem;
  color: var(--wood-gold); text-decoration: none;
}
.tracker-card-more:hover { text-decoration: underline; }

/* Static line under the homepage merch-review grid. Two links: the review
   hub and the shop. Kept outside #merch-grid so it survives the prerender
   bake and shows even when the feed fails. */
.merch-shop-line {
  margin: 12px 0 0;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.85rem;
  color: var(--wood-cream-dim);
}
.merch-shop-line a { color: var(--wood-gold); text-decoration: none; }
.merch-shop-line a:hover { text-decoration: underline; }

/* ============================================================
   BRAND HERO — the Cinderella's Day Off artwork, full width.
   Replaces the castle video hero. The art already carries the
   name, the tagline and the categories, so nothing is laid over
   it; the H1 and CTAs sit in the band directly beneath, which
   keeps them readable and keeps the keywords in the markup.
   ============================================================ */
.brand-hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  line-height: 0;
  background: var(--green-dark);
}
.brand-hero-art {
  display: block;
  width: 100%;
  /* The hero art is pre-trimmed to 3:1 so a wide viewport fills it without
     eating the band that carries the coaster, castle and cruise ship.
     height:auto is load-bearing: the width/height attributes on the <img> are a
     presentational hint that otherwise pin the element to the file's intrinsic
     height, cropping the art sideways instead of scaling it to the viewport. */
  height: auto;
  aspect-ratio: 2000 / 648;
  max-height: 620px;
  /* contain, NOT cover. The artwork is a composed banner - the sign, the URL
     and the lettering all have to survive, and cover crops one of them off at
     some viewport width every time. contain's failure mode is a slim navy bar
     on an ultra-wide screen, which is the one nobody notices. */
  object-fit: contain;
  background: var(--green-dark);
}
.brand-hero-band {
  background: var(--green);
  border-bottom: 3px solid rgba(216, 178, 90, 0.35);
  padding: 21px 20px 24px;
  text-align: center;
}
.brand-hero-band-inner {
  max-width: var(--max-width);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.brand-hero-title {
  font-family: 'Cinzel', Georgia, serif;
  font-weight: 700;
  font-size: clamp(1.5rem, 3.4vw, 2.4rem);
  line-height: 1.15;
  color: var(--gold-light);
  margin: 0;
}
.brand-hero-subtitle {
  font-size: clamp(0.95rem, 1.5vw, 1.1rem);
  line-height: 1.55;
  color: var(--cream);
  margin: 0;
  max-width: 46ch;
}
.brand-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 6px;
}
/* The header strip shows the same artwork; on the homepage the
   hero says it louder, so the strip would only repeat itself. */
body.home-v2 .pinned-banner { display: none; }

@media (max-width: 700px) {
  /* On a phone the full 2.4:1 art would only be ~155px tall, which shrinks the
     lettering to nothing. Give it a floor and let cover trim the outer edges. */
  /* On a phone the full banner is only ~122px tall and the tagline and URL are
     unreadable. Crop the outer edges instead (the coaster and the sign) so the
     centred lettering is roughly twice the size. A banner nobody can read is
     not doing its job. */
  .brand-hero-art {
    height: 200px;
    max-height: none;
    aspect-ratio: auto;
    object-fit: cover;
    object-position: center;
  }
  .brand-hero-band { padding: 17px 16px 20px; }
}

/* ------------------------------------------------------------------ */
/* Recipe detail page (/recipes/<slug>)                               */
/* ------------------------------------------------------------------ */
/* The grid cards used to be the only way into a recipe, via a modal, so every
   recipe shared one URL. The card title is now a real link to a real page and
   these are that page's styles. Deliberately close to .recipe-modal-* so the
   modal and the page don't read as two different recipes. */

.recipe-card-name .recipe-card-link {
  color: inherit;
  text-decoration: none;
}
.recipe-card-name .recipe-card-link:hover,
.recipe-card-name .recipe-card-link:focus-visible {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.recipe-detail { padding: 48px 24px 72px; max-width: 900px; }

.recipe-detail-crumbs {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.82rem;
  color: var(--wood-cream-dim);
  margin-bottom: 22px;
}
.recipe-detail-crumbs a { color: var(--wood-gold); text-decoration: none; }
.recipe-detail-crumbs a:hover { text-decoration: underline; }

.recipe-detail-title {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 2.1rem;
  line-height: 1.2;
  margin: 0 0 8px;
}
.recipe-detail-inspired,
.recipe-detail-intro,
.recipe-detail-note,
.recipe-detail-back {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
}
.recipe-detail-inspired { font-size: 0.95rem; margin: 0 0 14px; }
.recipe-detail-intro { font-size: 1.02rem; line-height: 1.7; margin: 0 0 30px; }

.recipe-detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 24px;
}
.recipe-detail-meta-item {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--wood-gold);
  border: 1px solid rgba(220, 187, 67, 0.4);
  border-radius: 999px;
  padding: 5px 13px;
}

.recipe-detail-cols {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 38px;
  margin-top: 8px;
}
.recipe-detail-cols h2 {
  font-family: 'Cinzel', Georgia, serif;
  color: var(--wood-gold);
  font-size: 0.95rem;
  text-transform: uppercase;
  letter-spacing: 0.9px;
  margin: 0 0 12px;
}
.recipe-detail-cols ul,
.recipe-detail-cols ol {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.95rem;
  line-height: 1.75;
  margin: 0;
  padding-left: 20px;
}
.recipe-detail-cols li { margin-bottom: 9px; }

.recipe-detail-note {
  font-size: 0.82rem;
  font-style: italic;
  margin: 40px 0 0;
  padding-top: 18px;
  border-top: 1px solid rgba(220, 187, 67, 0.22);
}
.recipe-detail-back { font-size: 0.9rem; margin: 22px 0 0; }
.recipe-detail-back a { color: var(--wood-gold); text-decoration: none; }
.recipe-detail-back a:hover { text-decoration: underline; }

@media (max-width: 640px) {
  .recipe-detail { padding: 32px 16px 56px; }
  .recipe-detail-title { font-size: 1.6rem; }
  .recipe-detail-cols { grid-template-columns: 1fr; gap: 26px; }
}