:root {
  --green-dark: #071a15;
  --green: #0f3329;
  --green-mid: #1e5142;
  --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: Georgia, 'Times New Roman', 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: Arial, 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: Arial, 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: #3c3a30; }

.category-pill {
  display: inline-block;
  background: var(--green);
  color: var(--gold-light);
  font-family: Arial, 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: Arial, 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: Georgia, serif;
}

footer nav {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  font-family: Arial, 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: Arial, 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: Arial, 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: Arial, 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(15, 51, 41, 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: Arial, 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: Arial, 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%;
  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: Arial, 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: Arial, 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: #3c3a30;
  margin-bottom: 24px;
  line-height: 1.7;
}

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

.pdp-option-label {
  font-family: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, sans-serif;
  font-size: 0.8rem;
  color: #8a8265;
  margin-bottom: 4px;
}

.cart-line-unavailable {
  font-family: Arial, sans-serif;
  font-size: 0.8rem;
  color: #b3372c;
  font-weight: 700;
  margin-bottom: 4px;
}

.cart-line-price {
  font-family: Arial, 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: Arial, 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: Arial, 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: Arial, sans-serif;
  font-size: 1.1rem;
  margin-bottom: 16px;
}

.cart-empty {
  text-align: center;
  padding: 40px 0;
  color: #8a8265;
  font-family: Arial, 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: Arial, 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, 26, 21, 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: Arial, 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: Arial, 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: Georgia, 'Times New Roman', serif;
  color: var(--gold-light);
  font-size: 1.2rem;
  margin-bottom: 10px;
}

.trivia-promo-text {
  font-family: Arial, 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: Georgia, 'Times New Roman', 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, 26, 21, 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(15, 51, 41, 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(15, 51, 41, 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: Georgia, 'Times New Roman', serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--green);
}

.trivia-category-sub {
  font-family: Arial, 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: Arial, 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: Georgia, 'Times New Roman', 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(15, 51, 41, 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: Arial, 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(30, 81, 66, 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: Georgia, 'Times New Roman', 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: Arial, 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: Arial, 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: #071a15;
  --wood-panel: rgba(15, 51, 41, 0.6);
  --wood-panel-solid: #0f3329;
  --wood-border: #1e5142;
  --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: #0f251a;
  overflow: hidden;
}
.pinned-banner img {
  display: block;
  width: 100%;
  height: clamp(52px, 5.5vw, 76px);
  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: #1b100a;
  border-top: 1px solid #5a3e2b;
  padding: 8px 24px;
}
.home-v2-nav a,
.home-v2-nav button {
  font-family: Arial, 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;
}

/* --- 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); }
@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 #332218;
}
.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,26,21,0.25) 0%, rgba(7,26,21,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: 'Georgia', 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(15, 51, 41, 0.45);
  backdrop-filter: blur(3px);
  border: 1px solid var(--wood-gold);
}
.adventure-plaque--transparent .plaque-btn:hover {
  background: rgba(15, 51, 41, 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: '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: '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: Georgia, serif;
  font-size: 1.1rem;
  text-transform: uppercase;
  color: #e9c46a;
  border-bottom: 2px solid #5a3e2b;
  padding-bottom: 8px;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.box-title::before { content: '♦'; color: var(--wood-gold-dim); }

.reveal-on-scroll {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal-on-scroll.is-visible {
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .reveal-on-scroll {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

.news-item {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 20px;
  padding-bottom: 15px;
  border-bottom: 1px solid rgba(90, 62, 43, 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: #22140c;
  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: #5a3e2b; }
.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: Arial, sans-serif;
  z-index: 2;
}
.news-title {
  font-family: Arial, 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: Arial, 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 #5a3e2b;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--wood-cream-dim);
  text-decoration: none;
  font-family: Arial, 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(15, 9, 6, 0.8);
  border: 1px solid #4a3224;
  border-radius: 4px;
  padding: 10px;
  text-align: center;
  text-decoration: none;
  display: block;
}
.merch-img-slot {
  width: 100%;
  height: 100px;
  background: #22140c;
  border-radius: 3px;
  margin-bottom: 8px;
  overflow: hidden;
}
.merch-card h4 {
  font-family: Arial, sans-serif;
  font-size: 0.85rem;
  color: var(--wood-cream);
  font-weight: normal;
}

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

.trivia-box {
  background: linear-gradient(rgba(46, 33, 22, 0.9), rgba(20, 13, 8, 0.95));
  border: 1px solid #8e6f43;
  border-radius: 4px;
  padding: 15px;
}
.trivia-option {
  background: rgba(255,255,255,0.05);
  border: 1px solid #5a3e2b;
  padding: 10px;
  margin-block: 8px;
  border-radius: 4px;
  font-size: 0.85rem;
  font-family: Arial, sans-serif;
  color: var(--wood-cream);
}

.history-box {
  background: linear-gradient(rgba(46, 33, 22, 0.9), rgba(20, 13, 8, 0.95));
  border: 1px solid #8e6f43;
  border-radius: 4px;
  padding: 15px;
  margin-top: 20px;
}
.history-label {
  font-family: Arial, 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: Arial, sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.82rem;
  line-height: 1.4;
}

body.home-v2 .site-footer {
  background: #110a06;
  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 #5a3e2b;
  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: Arial, 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: Arial, 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: Arial, 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(27, 16, 10, 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: #1b100a;
  font-family: Arial, 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, #241610 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: #1b100a;
  letter-spacing: 1px;
}

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

/* 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: #1b100a;
  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: #1b100a;
  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: #1b100a;
}
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: #1b100a; }
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 #332218;
  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: Arial, 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: Arial, 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: Arial, 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: #1b100a;
}
.rules-category-select {
  font-family: Arial, 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: Arial, 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: Arial, 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: #1b100a; }
.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: Arial, sans-serif;
  color: #e9c46a;
  font-size: 0.85rem;
  font-weight: bold;
  margin: 0 0 10px;
  line-height: 1.4;
}
.rule-card-details {
  font-family: Arial, 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(90,62,43,0.4);
  font-family: Arial, 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 #332218;
  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: Arial, 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: Arial, 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: #1b100a;
}

.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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, sans-serif;
  font-size: 0.68rem;
  color: var(--wood-cream-dim);
}

.wait-disclaimer {
  font-family: Arial, 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 #332218;
  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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: #1b100a;
  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: Arial, 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: Arial, 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(90,62,43,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: Arial, 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: Arial, 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 #332218;
  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: Arial, 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: Arial, 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: Arial, 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: #1b100a;
}
.mickey-location-select,
.mickey-difficulty-select,
.mickey-select {
  font-family: Arial, 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: Arial, sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.85rem;
}
.mickey-reset-btn {
  font-family: Arial, 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: Arial, 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: #1b100a; }
.mickey-tag-difficulty { color: #1b100a; }
.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: Arial, 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: Arial, 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: Arial, sans-serif;
  font-size: 0.82rem;
  font-weight: bold;
  color: var(--wood-cream);
  cursor: pointer;
  padding-top: 12px;
  border-top: 1px solid rgba(90,62,43,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: Arial, 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 #332218;
  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: Arial, 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: Arial, 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: Arial, 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; }
.merch-watch-disclosure {
  font-family: Arial, sans-serif;
  font-size: 0.78rem;
  color: var(--wood-cream-dim);
  background: rgba(0,0,0,0.25);
  border: 1px solid var(--wood-border);
  border-radius: 4px;
  padding: 12px 16px;
  margin: 0 0 20px;
  line-height: 1.5;
}
.merch-watch-count {
  font-family: Arial, sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.85rem;
  margin: 0 0 20px;
}
.merch-watch-results {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
  gap: 20px;
}
.merch-watch-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;
}
.merch-watch-card-tags { display: flex; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.merch-watch-tag {
  font-family: Arial, 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: #1b100a; }
.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: Arial, 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: Arial, 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: #1b100a;
  text-decoration: none;
}
.merch-watch-buy-btn:hover { filter: brightness(1.08); }

/* ==========================================================================
   ATTRACTION GUIDES — dedicated "Logbook" 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, #241610, var(--wood-bg));
}
.attraction-card-body { padding: 14px 16px; }
.attraction-card-land {
  display: block;
  font-family: Arial, 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 */
.attraction-hero {
  width: 100%;
  max-height: 440px;
  overflow: hidden;
  background: var(--wood-bg);
}
.attraction-hero-img { width: 100%; height: 100%; max-height: 440px; object-fit: cover; display: block; }
.attraction-hero-placeholder {
  width: 100%;
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #241610, var(--wood-bg));
  border-bottom: 3px solid var(--wood-border);
  padding: 24px;
}
.attraction-hero-placeholder span {
  color: var(--wood-cream-dim);
  font-family: Arial, 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: Arial, 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(90, 62, 43, 0.3);
  font-family: Arial, 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 #332218;
  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: Arial, sans-serif;
}
.dining-disclaimer {
  max-width: 640px;
  margin: 0 auto 26px;
  color: var(--wood-gold-dim);
  font-size: 0.78rem;
  font-family: Arial, 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: Arial, 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: Arial, 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: Arial, 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: #1b100a;
}
.dining-char-toggle {
  font-family: Arial, 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: #1b100a;
}

.dining-main { max-width: 1100px; margin: 0 auto; padding: 44px 24px 80px; }
.dining-count {
  font-family: Arial, 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: Arial, 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;
}
.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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, sans-serif;
  color: var(--wood-cream);
  font-size: 0.92rem;
  font-weight: bold;
  margin: 0 0 3px;
}
.dining-menu-item-desc {
  font-family: Arial, sans-serif;
  color: var(--wood-cream-dim);
  font-size: 0.8rem;
  line-height: 1.45;
  margin: 0;
}
.dining-menu-item-price {
  font-family: Arial, 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 "Logbook" 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, #241610, var(--wood-bg));
}
.resort-coming-soon-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: var(--wood-gold);
  color: #241610;
  font-family: Arial, 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: Arial, 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: Arial, 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 */
.resort-hero {
  position: relative;
  width: 100%;
  max-height: 440px;
  overflow: hidden;
  background: var(--wood-bg);
}
.resort-hero-img { width: 100%; height: 100%; max-height: 440px; object-fit: cover; display: block; }
.resort-hero-credit {
  position: absolute;
  right: 10px;
  bottom: 10px;
  background: rgba(20, 12, 8, 0.65);
  color: var(--wood-cream-dim);
  font-family: Arial, sans-serif;
  font-size: 0.7rem;
  padding: 4px 10px;
  border-radius: 4px;
  line-height: 1.3;
}
.resort-hero-placeholder {
  width: 100%;
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #241610, var(--wood-bg));
  border-bottom: 3px solid var(--wood-border);
  padding: 24px;
}
.resort-hero-placeholder span {
  color: var(--wood-cream-dim);
  font-family: Arial, 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: Arial, 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: Arial, sans-serif;
  font-size: 0.85rem;
  font-weight: bold;
  color: var(--wood-cream);
}
.resort-dining-meta {
  display: block;
  font-family: Arial, sans-serif;
  font-size: 0.72rem;
  color: var(--wood-gold-dim);
  margin-top: 2px;
}
.resort-dining-note {
  font-family: Arial, 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 #332218;
  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: Arial, 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: Arial, 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: #1b100a;
}
.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: Arial, 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: Arial, 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: Arial, sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.3px;
  padding: 4px 10px;
  border-radius: 4px;
  color: #241610;
  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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: 96px;
  height: 96px;
  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: Arial, 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;
}
.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: Georgia, serif;
  font-size: 1.02rem;
  color: var(--wood-gold);
  text-align: center;
}
.park-card-label .coming-soon {
  display: block;
  font-family: Arial, 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: Arial, 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: Georgia, 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: Arial, 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: #1b100a; 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: Georgia, serif;
  font-style: italic;
  color: var(--wood-cream-dim);
  font-size: 0.82rem;
  margin: 0 0 12px;
}
.recipe-card-intro {
  font-family: Arial, 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: Arial, 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: Arial, 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: #1b100a; }
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: #1b100a;
  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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, sans-serif;
  font-size: 0.72rem;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--wood-cream-dim);
}
.guide-toc a {
  font-family: Arial, 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: Arial, 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: Georgia, 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: Georgia, 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: #1b100a;
  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: Arial, 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: Arial, 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: #1b100a;
  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: Georgia, serif;
  font-style: italic;
  color: #cabca6;
  font-size: 0.9rem;
  margin: 0 0 10px;
}
.plan-card-bestfor {
  font-family: Arial, 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: Arial, 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: #1b100a; }
.plan-detail {
  border-top: 1px solid var(--wood-border);
  background: rgba(0,0,0,0.2);
  padding: 24px 28px 28px;
}
.plan-premise {
  font-family: Arial, 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(30, 81, 66, 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: Arial, sans-serif;
  font-size: 0.94rem;
  font-weight: bold;
  color: #ece0cd;
}
.plan-step-detail {
  font-family: Arial, sans-serif;
  font-size: 0.84rem;
  line-height: 1.55;
  color: #cabca6;
}
.plan-skip {
  font-family: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: #1c1408;
  background: var(--wood-gold);
  border-radius: 3px;
  padding: 1px 5px;
  vertical-align: middle;
}
.mead-legend {
  font-family: Arial, 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) — gold-engraved antique map on
   deep green + a realistic 1748 mariner's compass rose. Applied
   site-wide via body.home-v2. To revert: delete this block and the
   assets/backgrounds/ folder (or git checkout the pre-treasure-bg tag).
   ============================================================ */
body.home-v2 {
  background-color: #071a15;
  background-image:
    url("../assets/backgrounds/compass.png"),
    radial-gradient(150% 120% at 50% 42%, transparent 54%, rgba(0,0,0,0.45)),
    linear-gradient(rgba(7,26,21,0.70), rgba(7,26,21,0.70)),
    url("../assets/backgrounds/map-gold-green.jpg");
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
  background-size: min(42vw, 520px) auto, cover, cover, cover;
  background-position: right 14px top 122px, center, center, center;
  background-attachment: fixed, 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(11, 36, 28, 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: Georgia, 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: Georgia, 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, #14402f, 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: Arial, 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: Georgia, 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: Arial, 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: Arial, sans-serif; font-size: 0.95rem;
  background: rgba(15,51,41,0.85); border: 1px solid #3d6b58; 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: #1c1408; background: var(--wood-gold); border-color: var(--wood-gold); font-weight: bold; }

.planner-select {
  font-family: Georgia, 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: #1c1408; 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: Arial, 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: Arial, 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: Arial, sans-serif; font-size: 0.8rem; color: #7ee0a0; }
.planner-replan {
  margin-left: 10px; padding: 5px 12px; cursor: pointer;
  font-family: Arial, sans-serif; font-size: 0.76rem; letter-spacing: 0.6px;
  color: #0f2417; 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: Georgia, 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: Arial, 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: Georgia, 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: Arial, sans-serif; font-size: 0.9rem;
  color: #e9c46a; padding-top: 3px; text-align: right; letter-spacing: 0.5px;
}
.planner-item-title { font-family: Georgia, serif; font-size: 1.15rem; color: var(--wood-cream); }
.planner-item-sub { font-family: Arial, sans-serif; font-size: 0.88rem; color: #b8ab93; margin-top: 3px; }
.planner-item-note { font-family: Arial, 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: Arial, sans-serif; font-size: 0.66rem; letter-spacing: 0.5px;
  color: #071a15; 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: Arial, sans-serif; font-size: 0.92rem; color: #b8ab93; margin-top: 22px; line-height: 1.6; }
.planner-fineprint { font-family: Arial, 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: Arial, 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, #14402f, 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: Arial, sans-serif; }
.planner-subscribe-text strong { display: block; font-family: Georgia, 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: Arial, 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(20,64,47,0.95), rgba(11,36,28,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: Arial, sans-serif; font-size: 0.72rem; font-weight: bold;
  letter-spacing: 2.5px; text-transform: uppercase;
  color: #1c1408; 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: Georgia, 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: Arial, 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: #1c1408;
  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: Arial, 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: Georgia, 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: Arial, 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); }

.cc-grid {
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px;
  background: rgba(11, 36, 28, 0.88);
  border: 1px solid var(--wood-border); border-radius: 8px; padding: 12px;
}
.cc-dowhead {
  font-family: Georgia, 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: #1c1408;
  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: Georgia, 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(11, 36, 28, 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: Arial, 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: Georgia, 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; }
.cc-panel {
  background: rgba(15, 51, 41, 0.6);
  border: 1px solid var(--wood-border); border-radius: 6px; padding: 18px 20px;
}
.cc-panel-wide { margin-top: 18px; }
.cc-panel h4 {
  font-family: Georgia, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Georgia, 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: Arial, 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 ---- */
.cc-method {
  margin-top: 34px; background: rgba(11, 36, 28, 0.7);
  border: 1px solid var(--wood-border); border-left: 3px solid var(--wood-gold-dim);
  border-radius: 0 8px 8px 0; padding: 24px 26px;
}
.cc-method h3 {
  font-family: Cinzel, Georgia, serif; font-size: 1.15rem; color: #e9c46a;
  margin: 0 0 14px;
}
.cc-method p {
  font-family: Georgia, serif; font-size: 0.98rem; line-height: 1.65;
  color: #cabca6; margin: 0 0 12px;
}
.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; padding: 8px; }
  .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: Arial, 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: Arial, 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(15, 51, 41, 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: Georgia, serif; font-size: 0.98rem; color: var(--wood-cream);
}
.planner-peek-note {
  font-family: Arial, 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(15, 51, 41, 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: Georgia, serif; font-size: 1.08rem; color: var(--wood-cream);
}
.planner-crowd-sub {
  display: block; margin-top: 5px;
  font-family: Arial, 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: Arial, 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: Arial, 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(11, 36, 28, 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: Georgia, 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(15, 51, 41, 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: Arial, 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: Arial, sans-serif; font-size: 0.7rem;
  font-style: normal; color: #8fa898; margin-top: 2px;
}

/* ---- Headline ---- */
.hc-headline {
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
  background: rgba(11, 36, 28, 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: Arial, 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: Georgia, 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(11, 36, 28, 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: Georgia, 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(15, 51, 41, 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: Georgia, serif; font-size: 0.94rem; color: var(--wood-cream);
}
.hc-ms-count {
  font-family: Arial, 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: Arial, 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(15, 51, 41, 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: Georgia, 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: Arial, 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: Arial, 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: Arial, 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(11, 36, 28, 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: Georgia, serif; font-size: 0.84rem; text-transform: uppercase;
  letter-spacing: 1.8px; color: #e9c46a; margin: 22px 0 8px;
}
.contact-p {
  font-family: Arial, Helvetica, 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: Arial, Helvetica, 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: Georgia, 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: Arial, Helvetica, 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: Arial, Helvetica, 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: Georgia, serif; font-size: 1.05rem; color: var(--wood-gold);
  margin: 26px 0 8px;
}
.legal-wrap p {
  font-family: Georgia, 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: Georgia, 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(15, 51, 41, 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(11, 36, 28, 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: Arial, Helvetica, 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-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: Arial, 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: Georgia, 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: Arial, 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: Arial, 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: Arial, 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: Georgia, serif; color: var(--wood-gold);
  text-transform: uppercase; letter-spacing: 1.2px; font-size: 0.72rem;
}
.crew-height { width: 68px; }
.crew-unit { font-family: Arial, 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: Arial, 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: Arial, 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: Arial, sans-serif; font-size: 0.82rem;
}
.crew-person-card strong { font-family: Georgia, 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: Arial, sans-serif; font-size: 0.92rem; line-height: 1.55; color: var(--wood-cream);
}
.crew-split-time {
  flex: 0 0 140px; font-family: Georgia, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Georgia, 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: Georgia, serif; font-size: 1.02rem; line-height: 1.6; color: var(--wood-cream);
}
.fpi-h {
  margin: 8px 0 0; font-family: Georgia, serif; color: var(--wood-gold);
  text-transform: uppercase; letter-spacing: 1.6px; font-size: 0.82rem;
}
.fpi-note { margin: 0; font-family: Arial, 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: Arial, sans-serif; font-size: 0.88rem; color: var(--wood-cream);
}
.fpi-table th {
  padding: 9px 10px; text-align: left; white-space: nowrap;
  font-family: Georgia, 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: Georgia, serif; font-size: 0.98rem; line-height: 1.68; color: var(--wood-cream);
}
.fpi-limits {
  padding: 12px 16px; border-radius: 6px;
  border: 1px solid var(--wood-gold-dim); background: rgba(0,0,0,0.25);
  font-size: 0.92rem !important; color: #cabca6 !important;
}
.fpi-limits strong { color: var(--wood-cream); }
.fpi-updated {
  font-family: Arial, 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: Arial, 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: Arial, 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: #0f2417; background: #7ee0a0;
}

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

.tc-form, .tc-output {
  background: rgba(11, 36, 28, 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: Georgia, 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: Arial, 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: Arial, 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: Arial, 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: Arial, sans-serif; font-size: 0.88rem; color: var(--wood-cream);
}
.tc-table th {
  padding: 9px 10px; text-align: left;
  font-family: Georgia, 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: #0f2417; background: #7ee0a0;
}
.tc-table tfoot td {
  padding-top: 14px; font-family: Georgia, 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: Arial, 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: Georgia, 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: Arial, 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: Arial, 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: Arial, 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: Georgia, 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: Arial, sans-serif; font-size: 0.68rem; letter-spacing: 0.6px;
  text-transform: uppercase; color: #0b241c; background: var(--wood-gold);
  vertical-align: middle;
}
.trip-day-why {
  margin: 0; font-family: Arial, 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: Georgia, 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: Arial, sans-serif; font-size: 0.68rem; text-transform: uppercase;
  letter-spacing: 0.8px; white-space: nowrap;
}

.trip-day-stats {
  margin-top: 12px; font-family: Arial, 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: Arial, 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: Arial, sans-serif; font-size: 0.7rem; letter-spacing: 0.4px;
  color: #2b1f08; 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: Georgia, 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: Arial, 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: Georgia, 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: Arial, 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: Arial, 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(11, 36, 28, 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(11, 36, 28, 0.95);
  transform: translateY(-2px);
}
.hub-card h3 {
  margin: 0 0 6px; font-family: Georgia, serif; font-size: 1.08rem;
  color: var(--wood-cream); letter-spacing: 0.3px;
}
.hub-card p {
  margin: 0; font-family: Arial, 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: Arial, sans-serif; font-size: 0.68rem; letter-spacing: 1.2px;
  text-transform: uppercase; color: #0b241c; 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: Georgia, serif; font-size: 0.98rem; color: var(--wood-cream);
}
.trip-hop-tag {
  flex: 0 0 auto; padding: 2px 8px; border-radius: 3px;
  font-family: Arial, 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: Arial, 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: Arial, 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: Arial, 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: Georgia, 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: Arial, 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: Arial, 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: Arial, 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: '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: Georgia, serif; font-size: 0.98rem; color: var(--wood-cream); }
.trip-finale-tag {
  flex: 0 0 auto; padding: 2px 8px; border-radius: 3px;
  font-family: Arial, sans-serif; font-size: 0.68rem; letter-spacing: 1px;
  text-transform: uppercase; color: #22103a; background: #c9a0e8;
}
.trip-finale-time {
  font-family: Arial, sans-serif; font-variant-numeric: tabular-nums;
  font-size: 0.85rem; color: #d9c2ee;
}
.trip-finale-why {
  margin: 6px 0 0; font-family: Arial, 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: Georgia, "Times New Roman", serif;
  font-size: 1.45rem;
  font-weight: normal;
  color: var(--gold-light);
  margin: 0 0 10px;
  text-wrap: balance;
}

.inline-subscribe p {
  font-family: Arial, 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: Arial, 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: Arial, sans-serif;
  font-size: 0.85rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #1b100a;
  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: #8fa898;
}

@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: Georgia, 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: Arial, 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: Georgia, serif; font-size: 1rem; color: var(--text-body);
  margin: 0 0 8px; display: flex; align-items: center; gap: 10px;
}
.hp-count {
  font-family: Arial, 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: Arial, 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: Arial, 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: Arial, 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; }
}

/* ------------------------------------------------------------------ */
/* 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: Arial, 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; }

@media (max-width: 560px) {
  .pin-save-row { padding: 14px 16px 0; justify-content: stretch; }
  .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: Arial, 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: Arial, sans-serif; font-size: 0.85rem; font-weight: bold;
  text-transform: uppercase; letter-spacing: 0.5px; color: #1b100a;
  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: Arial, 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; }
}
