/* Gala pages (landing + RSVP + Commemorative Book + Payment) — tokens from site style guide */
.gala-page {
  --gala-primary: #1A607C;
  --gala-primary-rgb: 26, 96, 124;
  --gala-secondary: #C5E0ED;
  --gala-tertiary: #FFC24D;
  --gala-tertiary-hover: #BC6F00;
  --gala-bg: #FFF6F3;
  --gala-white: #ffffff;
  --gala-black: #1a1a1a;
  --gala-shadow: 0 0 10px rgba(0,0,0,.35);
  --gala-font-display: 'PT Serif', serif;
  --gala-font-body: 'Source Sans 3', sans-serif;
  font-family: var(--gala-font-body);
  color: var(--gala-black);
}

.gala-page h1, .gala-page h2, .gala-page h3, .gala-page h4 {
  font-family: var(--gala-font-display);
  color: var(--gala-primary);
}

.gala-center { text-align: center; }

.gala-eyebrow {
  display: inline-block;
  text-transform: uppercase;
  letter-spacing: .15em;
  font-size: .8rem;
  font-weight: 700;
  color: var(--gala-tertiary-hover);
  margin-bottom: .5rem;
}

/* Hero band */
.gala-hero {
  background: var(--gala-primary);
  color: var(--gala-white);
  border-radius: 1rem;
  padding: 3rem 2rem;
  text-align: center;
  box-shadow: var(--gala-shadow);
  margin: 0 0 2.5rem;
}
.gala-hero .gala-eyebrow { color: var(--gala-tertiary); }
.gala-hero h2 { color: var(--gala-white); font-size: 2.5rem; margin: 0 0 .5rem; }
.gala-hero p { font-size: 1.15rem; margin: 0 0 .25rem; }

/* Tagline / quote banner */
.gala-tagline {
  background: var(--gala-bg);
  border-left: 4px solid var(--gala-tertiary);
  border-radius: .5rem;
  padding: 2rem;
  text-align: center;
  margin: 0 0 2.5rem;
}
.gala-tagline p {
  font-family: var(--gala-font-display);
  font-style: italic;
  font-size: 1.5rem;
  color: var(--gala-primary);
  margin: 0;
}

/* Icon fact rows */
.gala-facts { display: flex; flex-direction: column; gap: 1rem; margin: 0 0 2rem; }
.gala-fact { display: flex; align-items: flex-start; gap: .9rem; }
.gala-fact i { color: var(--gala-tertiary-hover); font-size: 1.25rem; width: 1.5rem; text-align: center; margin-top: .2rem; }
.gala-fact strong { color: var(--gala-primary); }

/* Price list rows */
.gala-price-list { display: flex; flex-direction: column; gap: .75rem; margin: 0 0 2rem; }
.gala-price-row {
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  padding: .9rem 1.2rem; background: var(--gala-white);
  border: 1px solid var(--gala-secondary); border-radius: .5rem; box-shadow: var(--gala-shadow);
}
.gala-price-row span:last-child { font-family: var(--gala-font-display); font-weight: 700; color: var(--gala-primary); white-space: nowrap; }

/* Card grid (sponsorship tiers) */
.gala-tiers { display: flex; flex-wrap: wrap; gap: 1.25rem; margin: 0 0 2rem; }
.gala-tier {
  flex: 1 1 200px; background: var(--gala-white); border: 2px solid var(--gala-secondary);
  border-radius: .75rem; padding: 1.75rem 1.5rem; text-align: center;
  box-shadow: var(--gala-shadow); transition: .25s ease;
}
.gala-tier:hover { border-color: var(--gala-tertiary); transform: translateY(-4px); }
.gala-tier i { display: block; font-size: 1.75rem; color: var(--gala-tertiary-hover); margin-bottom: .5rem; }
.gala-tier h3 { margin: 0 0 .5rem; font-size: 1.1rem; }
.gala-tier .gala-price { font-family: var(--gala-font-display); font-size: 1.9rem; font-weight: 700; color: var(--gala-primary); margin: 0; }

/* Buttons */
.gala-btn {
  display: inline-block; background: var(--gala-tertiary); color: var(--gala-black);
  font-weight: 700; padding: .9rem 2.2rem; border-radius: 2rem; text-decoration: none;
  box-shadow: var(--gala-shadow); transition: .25s ease;
}
.gala-btn:hover { background: var(--gala-tertiary-hover); color: var(--gala-white); }
.gala-btn-outline {
  display: inline-block; border: 2px solid var(--gala-primary); color: var(--gala-primary);
  padding: .8rem 2rem; border-radius: 2rem; text-decoration: none; font-weight: 700; transition: .25s ease;
}
.gala-btn-outline:hover { background: var(--gala-primary); color: var(--gala-white); }

/* Callout / address blocks */
.gala-callout { background: var(--gala-secondary); border-radius: .75rem; padding: 1.5rem 1.75rem; margin: 0 0 2rem; }
.gala-callout p { margin: 0 0 .5rem; }
.gala-callout p:last-child { margin-bottom: 0; }
.gala-address { background: var(--gala-bg); border-radius: .5rem; padding: 1.25rem 1.5rem; margin: 0 0 2rem; }

/* Scroll fade-in */
.s-animate { opacity: 0; transform: translateY(24px); transition: opacity 0.65s ease, transform 0.65s ease; }
.s-animate.s-in { opacity: 1; transform: translateY(0); }

@media (max-width: 640px) {
  .gala-hero h2 { font-size: 1.9rem; }
  .gala-tiers { flex-direction: column; }
}

/* ═══════════════════════════════════════════════════════════════════
   150th Anniversary invitation — module "Gala — 150th Anniversary
   Invitation" (id 150) in the gala-top position (Showcase section of
   the Gala Page outline, id 24).
   Type substitutes for the print piece: Adeptly -> Italiana,
   Adorn Story Serif -> Pinyon Script, Source Serif 4 -> exact match.
   The illustration is pre-flattened onto --inv-cream, so no blend
   mode is needed (the fade-in transform would isolate it anyway).
   ═══════════════════════════════════════════════════════════════════ */
.gala-invite {
  --inv-ink: #043747;
  --inv-cream: #FCF7EC;
  --inv-rule: rgba(4, 55, 71, .16);
  background: var(--inv-cream);
  color: var(--inv-ink);
  font-family: 'Source Serif 4', 'PT Serif', Georgia, serif;
  font-weight: 400;
  line-height: 1.65;
  padding: 4rem clamp(1.5rem, 3vw, 3.5rem) 3.5rem;
  /* full-bleed cream band without breaking out of the Gantry container */
  box-shadow: 0 0 0 100vmax var(--inv-cream);
  clip-path: inset(0 -100vmax);
}

/* Let the invitation use the full page width instead of the theme's default
   container cap. Scoped with :has() so only the section that actually holds
   the invitation is unclamped — the other gala pages share this stylesheet.
   Browsers without :has() fall back to the theme container width, which is
   the previous behaviour. */
#g-showcase:has(.gala-invite) > .g-container {
  max-width: none;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.gala-invite-inner {
  max-width: 1440px;
  margin: 0 auto;
  display: flex;
  gap: 3.5rem;
  align-items: flex-start;
}

/* Left column — illustration + mottos. Centred against the taller
   right-hand column rather than pinned to the top. */
.gala-invite-art { flex: 0 0 33%; text-align: center; align-self: center; padding-top: 0; }
.gala-invite-art img {
  display: block;
  width: 100%;
  max-width: 470px;
  height: auto;
  margin: 0 auto 2.5rem;
}
.gala-invite-motto {
  font-family: 'Italiana', 'PT Serif', serif;
  text-transform: uppercase;
  letter-spacing: .1em;
  font-size: 1.05rem;
  line-height: 1.95;
  margin: 0 0 1.75rem;
}
.gala-invite-art .gala-invite-motto:last-child { margin-bottom: 0; }

/* Right column — the invitation proper */
.gala-invite-body { flex: 1 1 auto; min-width: 0; }
.gala-invite-title {
  font-family: 'Italiana', 'PT Serif', serif;
  font-weight: 400;
  font-size: clamp(1.9rem, 3.35vw, 3rem);
  text-transform: uppercase;
  letter-spacing: .04em;
  line-height: 1.15;
  text-align: center;
  color: var(--inv-ink);
  margin: 0 0 1rem;
}
.gala-invite-lede {
  font-family: 'Italiana', 'PT Serif', serif;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: 1rem;
  line-height: 1.7;
  text-align: center;
  margin: 0 0 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--inv-rule);
}
.gala-script {
  font-family: 'Pinyon Script', 'Italiana', cursive;
  text-transform: none;
  letter-spacing: 0;
  font-size: 1.45em;
  line-height: 0;
}
/* Italiana has no em dash — borrow the body face for punctuation */
.gala-punct { font-family: 'Source Serif 4', 'PT Serif', Georgia, serif; }
.gala-invite-body p { margin: 0 0 1.25rem; font-size: 1.05rem; }

/* Centred event details block */
.gala-invite-details {
  text-align: center;
  font-family: 'Italiana', 'PT Serif', serif;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin: 2.75rem 0;
}
.gala-invite-details p { margin: 0 0 1.75rem; }
.gala-invite-details p:last-child { margin-bottom: 0; }
.gala-invite-date { font-size: 1.7rem; line-height: 1.5; }
.gala-invite-venue { font-size: 1.2rem; line-height: 1.7; }
.gala-invite-addr { font-size: .82em; letter-spacing: .1em; }
.gala-invite-sched { font-size: 1.05rem; line-height: 2; }

/* Closing note */
.gala-invite-close {
  text-align: center;
  font-style: italic;
  font-size: 1rem;
  max-width: 44rem;
  margin: 0 auto 1rem;
}
.gala-invite-body .gala-invite-close:last-child { margin-bottom: 0; }

@media (max-width: 900px) {
  .gala-invite { padding: 2.75rem 1.25rem 2.5rem; }
  .gala-invite-inner { flex-direction: column; gap: 2rem; }
  .gala-invite-art { flex: none; width: 100%; align-self: stretch; padding-top: 0; }
  .gala-invite-art img { max-width: 260px; margin-bottom: 1.75rem; }
  .gala-invite-date { font-size: 1.35rem; }
  .gala-invite-venue { font-size: 1.1rem; }
  .gala-invite-details { margin: 2rem 0; }
}

/* ═══════════════════════════════════════════════════════════════════
   150th Anniversary prayer — module "Gala — 150th Anniversary Prayer"
   (id 151) in the gala-shannon position (Expanded section of the Gala
   Page outline, id 24), directly beneath the Quicklinks buttons.
   Deep-teal counterpart to the cream invitation band above it. The
   colour is carried by the section itself so there is no white seam
   above the band; the module keeps a full-bleed shadow as a fallback
   for browsers without :has().
   ═══════════════════════════════════════════════════════════════════ */
#g-expanded:has(.gala-prayer) { background: #0C3E52; }
#g-expanded:has(.gala-prayer) > .g-container {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
/* Module 148 (the CSS/JS raw-tags module) shares this section. It renders
   nothing visible, but its .platform-content wrapper still contributes 24px of
   padding plus a 10px margin, and the prayer module's own wrapper adds another
   24px on top only. That is 58px of top-only chrome, which pushed the text
   130px below the band's top edge against 72px at the bottom. All of this
   band's spacing comes from .gala-prayer's own symmetric padding, so the
   wrappers are zeroed here to leave the text optically centred. */
#g-expanded:has(.gala-prayer) .platform-content {
  margin: 0;
  padding: 0;
}
.gala-prayer {
  --pray-ink: #FCF7EC;
  --pray-bg: #0C3E52;
  background: var(--pray-bg);
  color: var(--pray-ink);
  padding: min(6vw, 4.5rem) clamp(1.25rem, 3vw, 3rem);
  box-shadow: 0 0 0 100vmax var(--pray-bg);
  clip-path: inset(0 -100vmax);
}
.gala-prayer-inner {
  max-width: 46rem;
  margin: 0 auto;
  text-align: center;
}
/* !important: the theme colours headings by section ID, which outranks a
   plain class selector. */
.gala-prayer h2.gala-prayer-title {
  font-family: 'Italiana', 'PT Serif', serif;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: clamp(1.15rem, 2.2vw, 1.75rem);
  line-height: 1.4;
  color: var(--pray-ink) !important;
  margin: 0 0 2.25rem;
}
.gala-prayer .gala-prayer-body {
  font-family: 'Source Serif 4', 'PT Serif', Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1rem, 1.35vw, 1.2rem);
  line-height: 2;
  color: var(--pray-ink);
  margin: 0;
}

@media (max-width: 640px) {
  .gala-prayer h2.gala-prayer-title { margin-bottom: 1.5rem; }
  .gala-prayer .gala-prayer-body { font-size: .95rem; line-height: 1.9; }
}

/* ═══════════════════════════════════════════════════════════════════
   Display-type weight (ticket #35918 — "can we make the words bolder").
   Italiana and Pinyon Script ship from Google Fonts in a single 400
   weight, so there is no bold cut to switch to and font-weight: 700
   would only get the browser's synthesized fake bold, which smears the
   joins on a geometric face like this. A hairline stroke painted behind
   the fill thickens the strokes evenly instead and leaves the counters
   open. The body copy is real weight — it moved 300 -> 400 in
   .gala-invite and .gala-prayer-body above.
   ═══════════════════════════════════════════════════════════════════ */
.gala-invite-title,
.gala-invite-lede,
.gala-invite-motto,
.gala-invite-details,
.gala-prayer-title {
  -webkit-text-stroke: .3px currentColor;
  paint-order: stroke fill;
}

/* ═══════════════════════════════════════════════════════════════════
   Quicklinks — blockcontent-1179 in #g-utility.
   override.css styles these tiles site-wide: .5rem rounded corners and
   a gold (--tertiary-color) underline bar that grows to fill the tile
   on hover. On the gala page they take the gala palette instead —
   light blue underline, square corners. Three classes deep so these
   outrank the theme's two-class rules without !important, and the
   hover behaviour is left untouched.
   ═══════════════════════════════════════════════════════════════════ */
.gala-page .ql-inner-box .g-blockcontent-subcontent-block {
  border-radius: 0;
}
.gala-page .ql-inner-box .g-blockcontent-subcontent-block:after {
  background: var(--gala-secondary);
}