/* ============================================================
   pages.css — subpage & legal page specifics
   Majestic Bay Casino Resort
   ============================================================ */

/* ---------- Subpage hero ---------- */
.sub-hero {
  position: relative;
  min-height: 52vh;
  display: grid;
  place-items: center;
  text-align: center;
  overflow: hidden;
  isolation: isolate;
  padding: var(--s-8) 24px var(--s-7);
}
.sub-hero-bg {
  position: absolute; inset: 0; z-index: -2;
  background-size: cover; background-position: center;
  filter: brightness(0.5) saturate(0.9);
}
.sub-hero::after {
  content: "";
  position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(7,17,31,0.5), rgba(7,17,31,0.85));
}
.sub-hero .crumbs {
  font-family: var(--font-display);
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  color: var(--text-muted);
  margin-bottom: var(--s-4);
}
.sub-hero .crumbs a { color: var(--accent-ink); }
.sub-hero .crumbs .here { color: var(--ink); }
.sub-hero h1 { font-size: clamp(2.2rem, 3vw + 1rem, 3.6rem); margin: 0 0 var(--s-3); }
.sub-hero .deck { max-width: 60ch; margin: 0 auto; color: var(--text); font-size: 1.1rem; }
.sub-hero .back {
  margin-top: var(--s-5);
  display: inline-block;
}

/* ---------- Subpage chapter index ---------- */
.chapter-index {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: var(--s-5) 0;
  border-bottom: 1px solid var(--rule);
}
.chapter-index a {
  font-family: var(--font-display);
  font-size: 0.85rem;
  padding: 7px 14px;
  border-radius: var(--r-pill);
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  text-decoration: none;
}
.chapter-index a:hover { border-color: var(--accent-line); color: var(--accent-ink); }

/* ---------- Sub-section ---------- */
.sub-section {
  padding-block: var(--s-7);
  border-bottom: 1px solid var(--rule);
}
.sub-section:last-child { border-bottom: 0; }
.sub-section h2 { font-size: clamp(1.6rem, 1.2vw + 1.1rem, 2.4rem); margin-bottom: var(--s-4); }
.sub-section .lead { margin-bottom: var(--s-5); }

.callout {
  padding: var(--s-5);
  border-radius: var(--r-lg);
  background: var(--surface);
  border: 1px solid var(--border-strong);
  backdrop-filter: blur(var(--blur-sm));
  -webkit-backdrop-filter: blur(var(--blur-sm));
  margin: var(--s-5) 0;
}
.callout h4 { font-family: var(--font-display); color: var(--accent-ink); margin-bottom: 8px; font-size: 0.85rem; letter-spacing: var(--track-cap); text-transform: uppercase; }
.callout p { margin: 0; color: var(--text); }

/* ---------- Mini CTA ---------- */
.mini-cta {
  margin: var(--s-8) 0;
  padding: clamp(28px, 4vw, 48px);
  border-radius: var(--r-xl);
  background: var(--surface);
  border: 1px solid var(--border-strong);
  backdrop-filter: blur(var(--blur-md));
  -webkit-backdrop-filter: blur(var(--blur-md));
  text-align: center;
  display: grid;
  gap: var(--s-4);
  justify-items: center;
}
.mini-cta h2 { margin: 0; }
.mini-cta p { max-width: 56ch; color: var(--text); margin: 0; }

/* ---------- Related chapters ---------- */
.related-chapters {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--s-4);
  padding-block: var(--s-7);
}
.related-chapters a {
  display: grid;
  gap: 6px;
  padding: var(--s-5);
  border-radius: var(--r-lg);
  background: var(--surface);
  border: 1px solid var(--border);
  text-decoration: none;
  transition: border-color var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.related-chapters a:hover { border-color: var(--accent-line); transform: translateY(-2px); text-decoration: none; }
.related-chapters .rc-k { font-family: var(--font-display); font-size: 0.72rem; letter-spacing: var(--track-cap); text-transform: uppercase; color: var(--accent-ink); }
.related-chapters .rc-t { font-family: var(--font-display); color: var(--ink); font-size: 1.1rem; }
.related-chapters .rc-d { color: var(--text-muted); font-size: 0.88rem; }

/* ---------- Legal pages ---------- */
.legal { padding-block: var(--s-8); }
.legal .container { width: var(--maxw-narrow); }
.legal h1 { font-size: clamp(2rem, 2vw + 1.2rem, 3rem); margin-bottom: var(--s-3); }
.legal .updated { color: var(--text-faint); font-size: 0.9rem; margin-bottom: var(--s-6); }
.legal .toc {
  padding: var(--s-5);
  border-radius: var(--r-lg);
  background: var(--surface);
  border: 1px solid var(--border);
  margin-bottom: var(--s-7);
}
.legal .toc h2 { font-size: 0.78rem; letter-spacing: var(--track-cap); text-transform: uppercase; color: var(--accent-ink); margin-bottom: var(--s-3); }
.legal .toc ol { margin: 0; padding-left: 1.2em; display: grid; gap: 6px; }
.legal .toc a { color: var(--text); }
.legal .toc a:hover { color: var(--accent-ink); }
.legal .sub-section h2 { font-size: clamp(1.4rem, 1vw + 1rem, 1.9rem); }
.legal .prose a.link, .legal a.link { color: var(--accent-ink); }

/* ---------- Thanks page ---------- */
.thanks {
  min-height: 70vh;
  display: grid;
  place-items: center;
  text-align: center;
  gap: var(--s-4);
  padding-block: var(--s-9);
}
.thanks .mark { margin-bottom: var(--s-3); }
.thanks h1 { font-size: clamp(2rem, 2vw + 1.2rem, 3rem); margin: 0; }
.thanks p { max-width: 56ch; color: var(--text); }
.thanks .muted { color: var(--text-muted); }
.thanks .actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: var(--s-4); }

/* ---------- Responsive ---------- */
@media (max-width: 768px) {
  .related-chapters { grid-template-columns: 1fr; }
  .sub-hero { min-height: 44vh; }
}