/* P31T50 source: assets/css/v2-font-stability-141.css */
/* Build 423 - public font-loading stability.
   Keep the approved Marcellus/Lato design while ensuring the faces used above
   the fold are requested immediately and render immediately with a fallback if the CDN face is not yet ready. Font files remain served by Google's font CDN. */
@font-face {
  font-family: 'Marcellus';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/marcellus/v13/wEO_EBrOk8hQLDvIAF81VvoK.woff2') format('woff2');
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/lato/v23/S6uyw4BMUTPHjx4wXiWtFCc.woff2') format('woff2');
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/lato/v23/S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2') format('woff2');
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/lato/v23/S6u9w4BMUTPHh50XSwiPGQ3q5d0.woff2') format('woff2');
}

/* P31T50 source: assets/css/styles.css */
:root {
  --bg: #050505;
  --bg-soft: #0b0907;
  --panel: #100d09;
  --panel-2: #15110b;
  --gold: #d2a23a;
  --gold-light: #f4d27c;
  --gold-dark: #8f641c;
  --cream: #f5efe3;
  --muted: #c9bda9;
  --line: rgba(210, 162, 58, 0.36);
  --shadow: 0 24px 70px rgba(0,0,0,.55);
  /* Public site shell is intentionally full-width; individual copy blocks keep their own readable max-widths. */
  --container: 100%;
  --radius: 18px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background:
    radial-gradient(circle at top right, rgba(210,162,58,.12), transparent 34rem),
    linear-gradient(180deg, #020202 0%, #090806 45%, #020202 100%);
  color: var(--cream);
  font-family: Lato, Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.6;
}

body.nav-open { overflow: hidden; }

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }

.container {
  width: min(var(--container), calc(100% - 40px));
  margin-inline: auto;
}

.section { padding: 84px 0; }
.section-tight { padding: 56px 0; }

.kicker {
  color: var(--gold-light);
  font-size: .78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .22em;
  margin: 0 0 14px;
}

h1, h2, h3, .serif {
  font-family: Marcellus, Georgia, serif;
  font-weight: 400;
  letter-spacing: .018em;
  line-height: 1.08;
}

h1 { font-size: clamp(2.35rem, 4.6vw, 4.25rem); margin: 0 0 20px; }
h2 { font-size: clamp(1.75rem, 2.75vw, 2.85rem); margin: 0 0 16px; }
h3 { font-size: clamp(1.2rem, 1.65vw, 1.65rem); margin: 0 0 12px; }

.gold { color: var(--gold-light); }
.muted { color: var(--muted); }

/* Shared header: one set of rules for every page */
.site-header {
  position: relative;
  z-index: 50;
  background: rgba(0,0,0,.95);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(10px);
}

.header-inner {
  width: min(var(--container), calc(100% - 40px));
  min-height: 112px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: 300px 1fr 54px;
  gap: 26px;
  align-items: center;
}

.logo-link {
  width: 300px;
  display: block;
}

.logo-link img {
  width: 100%;
  height: auto;
}

.main-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  white-space: nowrap;
}

.main-nav a {
  position: relative;
  color: var(--cream);
  font-size: .80rem;
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: .095em;
  padding: 14px 0;
}

.main-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 3px;
  height: 1px;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .2s ease;
}

.main-nav a:hover,
.main-nav a.active { color: var(--gold-light); }
.main-nav a:hover::after,
.main-nav a.active::after { transform: scaleX(1); }

.nav-toggle {
  display: none;
  width: 46px;
  height: 44px;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--gold-light);
  font-size: 1.7rem;
  line-height: 1;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 26px;
  border: 1px solid var(--gold);
  background: transparent;
  color: var(--gold-light);
  font-size: .82rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .12em;
  transition: transform .2s ease, background .2s ease, color .2s ease;
}

.btn:hover { transform: translateY(-2px); }
.btn-primary {
  background: linear-gradient(135deg, #9e6819, #f2c464);
  color: #050505;
  box-shadow: 0 16px 36px rgba(210,162,58,.18);
}
.btn-small { min-height: 42px; padding-inline: 20px; font-size: .76rem; }

/* Hero */
.hero {
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(90deg, rgba(0,0,0,.96) 0%, rgba(0,0,0,.86) 48%, rgba(17,12,7,.76) 100%),
    radial-gradient(circle at 78% 42%, rgba(210,162,58,.18), transparent 26rem);
}

.hero-grid {
  min-height: 680px;
  display: grid;
  grid-template-columns: 1.02fr .98fr;
  gap: 54px;
  align-items: center;
}

.hero-copy p {
  max-width: 560px;
  color: var(--cream);
  font-size: 1.13rem;
  margin: 0 0 30px;
}

.hero-actions { display: flex; gap: 16px; flex-wrap: wrap; }

.hero-visual {
  min-height: 490px;
  border-left: 1px solid var(--line);
  background:
    linear-gradient(180deg, rgba(0,0,0,.24), rgba(0,0,0,.75)),
    radial-gradient(circle at 70% 30%, rgba(244,210,124,.2), transparent 20rem),
    repeating-radial-gradient(circle at 50% 50%, rgba(244,210,124,.08) 0 2px, transparent 3px 58px);
  display: flex;
  align-items: end;
  padding: 38px;
}

.hero-photo-note {
  border-left: 2px solid var(--gold);
  padding-left: 20px;
  color: var(--muted);
}
.hero-photo-note strong {
  display: block;
  color: var(--gold-light);
  font-family: Marcellus, Georgia, serif;
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.trust-strip {
  border-bottom: 1px solid var(--line);
  background: rgba(0,0,0,.72);
}
.trust-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
}
.trust-item {
  min-height: 118px;
  border-left: 1px solid var(--line);
  display: grid;
  place-items: center;
  text-align: center;
  padding: 18px 14px;
}
.trust-item:last-child { border-right: 1px solid var(--line); }
.trust-icon { color: var(--gold-light); font-size: 1.7rem; line-height: 1; margin-bottom: 8px; }
.trust-item strong {
  font-size: .82rem;
  font-weight: 900;
  line-height: 1.24;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.section-head { max-width: 760px; margin: 0 auto 40px; text-align: center; }
.section-head p { color: var(--muted); margin: 0; }

.packages-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}
.package-card {
  background: #fff;
  color: #111;
  border: 1px solid rgba(210,162,58,.5);
  box-shadow: var(--shadow);
  transition: transform .22s ease, box-shadow .22s ease;
}
.package-card:hover { transform: translateY(-6px); box-shadow: 0 22px 55px rgba(210,162,58,.16); }
.package-card img { width: 100%; height: auto; object-fit: contain; }
.package-detail-image img { width: 100%; height: auto; object-fit: contain; }
.packages-grid .package-card { overflow: visible; display: block; }


.package-mini {
  background: var(--panel);
  border: 1px solid var(--line);
  padding: 26px;
}
.package-mini .price { font-family: Marcellus, Georgia, serif; font-size: 2.2rem; color: var(--gold-light); }

.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 44px;
  align-items: center;
}

.panel {
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  padding: 34px;
  box-shadow: var(--shadow);
}

.event-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}
.event-card {
  min-height: 210px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(210,162,58,.08), rgba(0,0,0,.55));
  padding: 28px;
}
.event-card h3 { color: var(--gold-light); font-size: 1.7rem; }

.tile-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.tile {
  min-height: 230px;
  border-right: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(210,162,58,.14), rgba(0,0,0,.8));
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: end;
}
.tile:first-child { border-left: 1px solid var(--line); }
.tile h3 { color: var(--cream); margin-bottom: 6px; }
.tile p { color: var(--muted); margin: 0; }

.page-hero {
  padding: 130px 0 90px;
  border-bottom: 1px solid var(--line);
  background: radial-gradient(circle at 78% 24%, rgba(210,162,58,.14), transparent 30rem);
}
.page-hero .container {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 60px;
  align-items: center;
}
.page-hero-card {
  border: 1px solid var(--line);
  background: rgba(255,255,255,.025);
  padding: 34px;
}

.detail-list { padding-left: 1.1rem; color: var(--muted); }
.detail-list li { margin-bottom: 8px; }

.package-detail {
  border-top: 1px solid var(--line);
  padding: 72px 0;
}
.package-detail-grid {
  display: grid;
  grid-template-columns: 350px 1fr;
  gap: 42px;
  align-items: center;
}
.package-detail-image {
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}
.package-price-row {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin: 22px 0;
}
.price-box {
  border: 1px solid var(--line);
  padding: 14px 20px;
  min-width: 150px;
}
.price-box span { display: block; color: var(--muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; }
.price-box strong { font-family: Marcellus, Georgia, serif; font-size: 2.1rem; color: var(--gold-light); }

.contact-form {
  display: grid;
  gap: 14px;
}
.contact-form input,
.contact-form textarea,
.contact-form select {
  width: 100%;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.04);
  color: var(--cream);
  min-height: 48px;
  padding: 12px 14px;
  font: inherit;
}
.contact-form textarea { min-height: 140px; }

/* Keep native contact-form dropdown options legible in browsers that render
   the opened menu on a light background. */
.contact-form select {
  color-scheme: dark;
}
.contact-form select option {
  background: #101010;
  color: var(--cream);
}
.contact-form select option:disabled {
  color: #a99f90;
}

.site-footer {
  border-top: 1px solid var(--line);
  padding: 56px 0 28px;
  background: #030303;
  color: var(--muted);
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.2fr .8fr .9fr .9fr;
  gap: 32px;
}
.footer-logo { width: 240px; margin-bottom: 18px; }
.footer-grid h3 { color: var(--gold-light); font-size: 1.25rem; }
.footer-grid ul { list-style: none; padding: 0; margin: 0; }
.footer-grid li { margin-bottom: 8px; }
.footer-bottom { margin-top: 38px; padding-top: 20px; border-top: 1px solid var(--line); font-size: .82rem; }


/* Footer Option B */
.site-footer.footer-option-b {
  border-top: 1px solid rgba(210,162,58,.32);
  padding: 26px 0 18px;
  background: #000;
}

.footer-option-b .footer-b-shell {
  overflow: hidden;
  border: 1px solid rgba(210,162,58,.46);
  border-radius: 22px;
  background: #000;
  box-shadow: 0 18px 52px rgba(0,0,0,.34);
}

.footer-option-b .footer-b-main {
  display: grid;
  grid-template-columns: minmax(230px, 280px) 1fr;
  gap: 30px;
  align-items: center;
  padding: 24px 28px 22px;
}

.footer-option-b .footer-b-brand {
  display: flex;
  align-items: center;
  min-height: 92px;
  padding-right: 28px;
  border-right: 1px solid rgba(210,162,58,.30);
}

.footer-option-b .footer-b-brand img {
  width: min(100%, 252px);
  height: auto;
}

.footer-option-b .footer-b-nav {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  align-items: start;
}

.footer-option-b .footer-b-nav-group {
  min-width: 0;
}

.footer-option-b .footer-b-nav-toggle {
  width: 100%;
  margin: 0 0 11px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--gold-light);
  font: 900 .72rem/1.2 Lato, Arial, sans-serif;
  text-align: left;
  text-transform: uppercase;
  letter-spacing: .18em;
  cursor: default;
}

.footer-option-b .footer-b-chevron {
  display: none;
}

.footer-option-b .footer-b-links {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 17px;
}

.footer-option-b .footer-b-links a {
  position: relative;
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.4;
  transition: color .18s ease;
}

.footer-option-b .footer-b-links a:hover,
.footer-option-b .footer-b-links a:focus-visible {
  color: var(--cream);
  outline: none;
}

.footer-option-b .footer-b-links a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: -2px;
  height: 1px;
  background: var(--gold-light);
  transition: right .18s ease;
}

.footer-option-b .footer-b-links a:hover::after,
.footer-option-b .footer-b-links a:focus-visible::after {
  right: 0;
}

.footer-option-b .footer-b-contact-row {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  padding: 15px 28px;
  border-top: 1px solid rgba(210,162,58,.25);
  background: #000;
}

.footer-option-b .footer-b-contact-actions {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  gap: 9px;
  min-width: 0;
}

.footer-option-b .footer-b-contact-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 13px;
  border: 1px solid rgba(210,162,58,.34);
  border-radius: 999px;
  background: rgba(255,255,255,.025);
  color: var(--cream);
  font-size: .77rem;
  line-height: 1.2;
  white-space: nowrap;
  transition: border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease;
}

.footer-option-b .footer-b-contact-pill svg {
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  padding: 4px;
  border-radius: 50%;
  fill: none;
  stroke: var(--footer-contact-icon, var(--gold-light));
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  background: var(--footer-contact-icon-bg, rgba(210,162,58,.09));
}

.footer-option-b .footer-b-contact-pill--phone {
  --footer-contact-icon: #55d66b;
  --footer-contact-icon-bg: rgba(85,214,107,.12);
}

.footer-option-b .footer-b-contact-pill--email {
  --footer-contact-icon: #ef6b63;
  --footer-contact-icon-bg: rgba(239,107,99,.12);
}

.footer-option-b .footer-b-contact-pill--web {
  --footer-contact-icon: #58aaf8;
  --footer-contact-icon-bg: rgba(88,170,248,.12);
}

.footer-option-b .footer-b-contact-pill:hover,
.footer-option-b .footer-b-contact-pill:focus-visible,
.footer-option-b .footer-b-social:hover,
.footer-option-b .footer-b-social:focus-visible {
  border-color: rgba(244,210,124,.78);
  background: rgba(210,162,58,.08);
  color: var(--gold-light);
  transform: translateY(-1px);
  outline: none;
}

.footer-option-b .footer-b-socials {
  display: flex;
  gap: 9px;
  flex: 0 0 auto;
}

.footer-option-b .footer-b-social {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(210,162,58,.42);
  border-radius: 50%;
  background: rgba(255,255,255,.025);
  color: var(--gold-light);
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

.footer-option-b .footer-b-social svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.footer-option-b .footer-b-social:last-child svg {
  fill: currentColor;
  stroke: none;
}

.footer-option-b .footer-b-social--instagram {
  color: #e85ba5;
  border-color: rgba(232,91,165,.52);
  background: rgba(232,91,165,.07);
}

.footer-option-b .footer-b-social--facebook {
  color: #5b9df9;
  border-color: rgba(91,157,249,.52);
  background: rgba(91,157,249,.07);
}

.footer-option-b .footer-b-social--instagram:hover,
.footer-option-b .footer-b-social--instagram:focus-visible {
  color: #f079ba;
  border-color: rgba(240,121,186,.78);
  background: rgba(232,91,165,.12);
}

.footer-option-b .footer-b-social--facebook:hover,
.footer-option-b .footer-b-social--facebook:focus-visible {
  color: #78affb;
  border-color: rgba(120,175,251,.78);
  background: rgba(91,157,249,.12);
}

.footer-option-b .footer-b-bottom {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 10px 20px;
  border-top: 1px solid rgba(210,162,58,.18);
  color: #948a7b;
  font-size: .72rem;
  line-height: 1.35;
  letter-spacing: .015em;
  text-align: center;
}

.footer-option-b .footer-b-bottom-separator {
  color: rgba(210,162,58,.62);
}

.footer-option-b .footer-b-legal {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0 7px;
}

.footer-option-b .footer-b-legal a {
  color: #aaa091;
  transition: color .18s ease;
}

.footer-option-b .footer-b-legal a[aria-current="page"] {
  color: var(--gold-light);
}

.footer-option-b .footer-b-legal a:hover,
.footer-option-b .footer-b-legal a:focus-visible {
  color: var(--gold-light);
  outline: none;
}

.footer-option-b .footer-b-legal span {
  color: rgba(210,162,58,.55);
}

@media (max-width: 980px) {
  .footer-option-b .footer-b-main {
    grid-template-columns: 210px 1fr;
    gap: 24px;
    padding-inline: 24px;
  }

  .footer-option-b .footer-b-brand {
    padding-right: 24px;
  }

  .footer-option-b .footer-b-nav {
    gap: 20px;
  }

  .footer-option-b .footer-b-contact-row {
    align-items: flex-end;
    padding-inline: 24px;
  }

  .footer-option-b .footer-b-contact-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, max-content));
  }

  .footer-option-b .footer-b-contact-pill:last-child {
    grid-column: 1 / -1;
    width: max-content;
  }
}

@media (max-width: 700px) {
  .footer-option-b {
    padding: 18px 0 14px;
  }

  .footer-option-b .footer-b-shell {
    border-radius: 18px;
  }

  .footer-option-b .footer-b-main {
    display: block;
    padding: 20px 18px 11px;
  }

  .footer-option-b .footer-b-brand {
    min-height: 0;
    justify-content: center;
    padding: 0 0 18px;
    border-right: 0;
    border-bottom: 1px solid rgba(210,162,58,.25);
  }

  .footer-option-b .footer-b-brand img {
    width: min(100%, 236px);
  }

  .footer-option-b .footer-b-nav {
    display: block;
    padding-top: 8px;
  }

  .footer-option-b .footer-b-nav-group {
    border-bottom: 1px solid rgba(210,162,58,.18);
  }

  .footer-option-b .footer-b-nav-group:last-child {
    border-bottom: 0;
  }

  .footer-option-b .footer-b-nav-toggle {
    min-height: 46px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    color: var(--gold-light);
    cursor: pointer;
  }

  .footer-option-b .footer-b-chevron {
    width: 18px;
    height: 18px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform .18s ease;
  }

  .footer-option-b .footer-b-nav-toggle[aria-expanded="true"] .footer-b-chevron {
    transform: rotate(180deg);
  }

  .footer-option-b .footer-b-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 18px;
    padding: 0 0 13px;
  }

  .footer-option-b .footer-b-links a {
    padding: 7px 0;
    font-size: .84rem;
  }

  .footer-option-b .footer-b-nav-group.is-collapsed .footer-b-links {
    display: none;
  }

  .footer-option-b .footer-b-contact-row {
    display: block;
    padding: 15px 18px 16px;
  }

  .footer-option-b .footer-b-contact-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .footer-option-b .footer-b-contact-pill,
  .footer-option-b .footer-b-contact-pill:last-child {
    width: 100%;
    min-height: 42px;
    justify-content: flex-start;
    grid-column: auto;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .footer-option-b .footer-b-socials {
    justify-content: center;
    margin-top: 13px;
  }

  .footer-option-b .footer-b-social {
    width: 40px;
    height: 40px;
  }

  .footer-option-b .footer-b-bottom {
    flex-direction: column;
    gap: 2px;
    min-height: 0;
    padding: 11px 16px 13px;
  }

  .footer-option-b .footer-b-bottom-separator {
    display: none;
  }

  .footer-option-b .footer-b-legal {
    margin: 3px 0;
    row-gap: 2px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .footer-option-b .footer-b-links a::after,
  .footer-option-b .footer-b-contact-pill,
  .footer-option-b .footer-b-social,
  .footer-option-b .footer-b-chevron {
    transition: none;
  }
}


.info-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: stretch;
}

.info-card {
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  padding: 30px;
  box-shadow: var(--shadow);
}

.info-card p { color: var(--muted); }
.info-card .btn { margin-top: 10px; }

.embed-panel {
  margin-top: 22px;
  border: 1px dashed rgba(244, 210, 124, .46);
  background: rgba(255,255,255,.028);
  padding: 24px;
}

.embed-panel code {
  color: var(--gold-light);
  overflow-wrap: anywhere;
}

.embed-placeholder {
  margin-top: 16px;
  min-height: 140px;
  display: grid;
  place-items: center;
  text-align: center;
  border: 1px solid rgba(210,162,58,.25);
  color: var(--muted);
  padding: 20px;
}

@media (max-width: 1120px) {
  .header-inner { grid-template-columns: 260px 1fr 170px; gap: 16px; }
  .logo-link { width: 260px; }
  .main-nav { gap: 14px; }
  .main-nav a { font-size: .76rem; letter-spacing: .075em; }
  .packages-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .event-grid, .tile-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
  .header-inner {
    min-height: 86px;
    grid-template-columns: 240px 1fr 46px;
  }
  .header-action { display: none; }
  .nav-toggle { display: inline-grid; place-items: center; justify-self: end; }
  .main-nav {
    position: fixed;
    top: 86px;
    left: 0;
    right: 0;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    background: rgba(0,0,0,.98);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 16px 20px 24px;
  }
  body.nav-open .main-nav { display: flex; }
  .main-nav a { padding: 15px 0; font-size: .92rem; }
  .hero-grid, .page-hero .container, .two-col, .package-detail-grid, .info-actions { grid-template-columns: 1fr; }
  .hero-grid { min-height: auto; padding: 80px 0; }
  .hero-visual { min-height: 300px; border-left: 0; border-top: 1px solid var(--line); }
  .trust-grid { grid-template-columns: repeat(2, 1fr); }
  .trust-item:last-child { grid-column: span 2; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  .container, .header-inner { width: min(100% - 26px, var(--container)); }
  .header-inner { grid-template-columns: 200px 1fr 44px; }
  .logo-link { width: 200px; }
  h1 { font-size: clamp(1.95rem, 9vw, 2.85rem); }
  .section { padding: 58px 0; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .btn { width: 100%; }
  .packages-grid, .event-grid, .tile-grid, .footer-grid { grid-template-columns: 1fr; }
  .trust-grid { grid-template-columns: 1fr; }
  .trust-item, .trust-item:last-child { grid-column: auto; border-right: 1px solid var(--line); }
  .package-detail-grid { gap: 24px; }
  .package-detail-image { max-width: 330px; margin: 0 auto; }
}


/* Occasions and collaborations */
.text-link {
  display: inline-block;
  margin-top: 14px;
  color: var(--gold-light);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .78rem;
}
.text-link:hover { color: var(--cream); }
.occasions-grid .event-card { min-height: 260px; }
.collab-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}
.collab-card {
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(255,255,255,.04), rgba(255,255,255,.012));
  padding: 32px;
  box-shadow: var(--shadow);
}
.collab-card h3 { color: var(--gold-light); }
.collab-card p { color: var(--muted); }
@media (max-width: 900px) {
  .collab-grid { grid-template-columns: 1fr; }
}


/* Booking and enquiry cascade updates */
.contact-details-list {
  margin-top: 24px;
  display: grid;
  gap: 8px;
  color: var(--muted);
}
.contact-details-list p { margin: 0; }
.contact-details-list strong { color: var(--cream); }

.form-row {
  display: grid;
  gap: 8px;
}
.form-row label {
  color: var(--gold-light);
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 800;
}
.two-fields {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.contact-form select:disabled {
  opacity: .62;
  cursor: not-allowed;
}
.form-note {
  margin: -4px 0 0;
  color: var(--muted);
  font-size: .92rem;
}
.booking-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.step-card {
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.012));
  padding: 28px;
  box-shadow: var(--shadow);
}
.step-card span {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  margin-bottom: 16px;
  border: 1px solid rgba(244,210,124,.55);
  border-radius: 999px;
  color: var(--gold-light);
  font-weight: 900;
}
.step-card p { color: var(--muted); }
.narrow-container {
  max-width: 920px;
}
.booking-embed-panel {
  margin-top: 26px;
}
.large-placeholder {
  min-height: 320px;
}
.notice-box {
  margin-top: 22px;
  border-left: 3px solid var(--gold);
  background: rgba(210,162,58,.08);
  padding: 22px 24px;
}
.notice-box p { color: var(--muted); }
@media (max-width: 900px) {
  .booking-steps, .two-fields { grid-template-columns: 1fr; }
}


/* Gallery and image-placement update */
.image-slot {
  min-height: 220px;
  border: 1px solid rgba(210,162,58,.42);
  background:
    linear-gradient(145deg, rgba(210,162,58,.13), rgba(255,255,255,.025)),
    radial-gradient(circle at 72% 28%, rgba(244,210,124,.16), transparent 14rem);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 8px;
  padding: 26px;
  color: var(--muted);
  box-shadow: var(--shadow);
}
.image-slot span {
  color: var(--gold-light);
  font-size: .74rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.image-slot strong {
  color: var(--cream);
  font-family: Marcellus, Georgia, serif;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.15;
}
.image-slot p { margin: 0; color: var(--muted); }
.image-slot-large { min-height: 340px; }
.image-slot-tall { min-height: 470px; }
.image-slot-small { min-height: 180px; margin-bottom: 24px; }
.feature-with-image { align-items: stretch; }
.event-grid-compact { grid-template-columns: repeat(2, 1fr); }
.panel-with-image { padding: 24px; }
.gallery-preview-grid,
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.gallery-preview {
  min-height: 260px;
  transition: transform .22s ease, border-color .22s ease;
}
.gallery-preview:hover {
  transform: translateY(-5px);
  border-color: rgba(244,210,124,.78);
}
.gallery-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.gallery-item { min-height: 300px; }
.video-embed-grid {
  display: grid;
  gap: 18px;
}
.video-placeholder {
  min-height: 190px;
}
@media (max-width: 900px) {
  .gallery-preview-grid,
  .gallery-grid,
  .event-grid-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .image-slot-large,
  .image-slot-tall { min-height: 300px; }
}
@media (max-width: 640px) {
  .gallery-preview-grid,
  .gallery-grid,
  .event-grid-compact { grid-template-columns: 1fr; }
  .image-slot { min-height: 240px; }
}


/* Reviews and expanded gallery update */
.review-summary-card .small-note {
  font-size: .92rem;
  color: var(--muted);
}
.featured-reviews-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
.review-card {
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.018));
  padding: 28px;
  box-shadow: var(--shadow);
}
.review-card-featured {
  min-height: 300px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.review-quote {
  color: var(--cream);
  font-family: Marcellus, Georgia, serif;
  font-size: clamp(1.2rem, 1.8vw, 1.55rem);
  line-height: 1.45;
  margin: 0 0 26px;
}
.review-meta {
  border-top: 1px solid rgba(210,162,58,.22);
  padding-top: 18px;
  display: grid;
  gap: 4px;
}
.review-meta strong { color: var(--gold-light); }
.review-meta span { color: var(--muted); font-size: .92rem; }
.compact-head { max-width: 850px; }
.review-stack {
  display: grid;
  gap: 14px;
}
.review-row {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) 250px;
  gap: 22px;
  align-items: start;
  border: 1px solid rgba(255,255,255,.11);
  background: rgba(255,255,255,.035);
  padding: 22px;
}
.review-row p {
  margin: 0;
  color: var(--cream);
  line-height: 1.65;
}
.review-row footer {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: .92rem;
}
.review-row footer strong { color: var(--gold-light); }
.review-tag {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: fit-content;
  min-width: 112px;
  border: 1px solid rgba(210,162,58,.48);
  color: var(--gold-light);
  background: rgba(210,162,58,.09);
  padding: 8px 12px;
  font-size: .75rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.review-format-panel pre {
  white-space: pre-wrap;
  margin: 12px 0 0;
  padding: 18px;
  background: rgba(0,0,0,.24);
  border: 1px solid rgba(255,255,255,.1);
  color: var(--cream);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  line-height: 1.55;
}
.video-feature-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(260px, .8fr);
  gap: 20px;
}
.video-side-list {
  display: grid;
  gap: 20px;
}
.video-placeholder-large { min-height: 420px; }
.gallery-grid-large .gallery-item { min-height: 330px; }
.mini-gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 24px;
}
.mini-image-slot {
  min-height: 160px;
  padding: 18px;
}
.mini-image-slot strong { font-size: 1.15rem; }
.tick-list code {
  color: var(--gold-light);
  font-size: .92rem;
}
@media (max-width: 1000px) {
  .featured-reviews-grid { grid-template-columns: 1fr; }
  .review-row { grid-template-columns: 1fr; gap: 12px; }
  .video-feature-grid { grid-template-columns: 1fr; }
  .video-placeholder-large { min-height: 280px; }
}
@media (max-width: 640px) {
  .review-card { padding: 22px; }
  .review-row { padding: 18px; }
  .mini-gallery-grid { grid-template-columns: 1fr; }
}


/* Header update: remove top-right availability button and keep the wider menu balanced */
.header-inner {
  grid-template-columns: 300px minmax(0, 1fr) 54px;
}
.main-nav {
  gap: 13px;
}
.main-nav a {
  font-size: .76rem;
  letter-spacing: .078em;
}
.header-action { display: none !important; }

/* Performance schedule */
.schedule-list {
  display: grid;
  gap: 18px;
}
.month-group {
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  box-shadow: var(--shadow);
}
.month-group summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  padding: 24px 28px;
  border-bottom: 1px solid rgba(210,162,58,.18);
}
.month-group summary::-webkit-details-marker { display: none; }
.month-group summary span {
  font-family: Marcellus, Georgia, serif;
  color: var(--gold-light);
  font-size: clamp(1.35rem, 2vw, 1.9rem);
}
.month-group summary small {
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .1em;
  font-weight: 800;
  font-size: .72rem;
}
.schedule-items {
  display: grid;
  gap: 14px;
  padding: 18px;
}
.schedule-card {
  display: grid;
  grid-template-columns: 58px 190px minmax(0, 1fr) 190px;
  gap: 20px;
  align-items: center;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(0,0,0,.24);
  padding: 18px;
}
.event-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(210,162,58,.54);
  border-radius: 999px;
  background: rgba(210,162,58,.1);
  font-size: 1.45rem;
}
.event-date strong,
.event-info h3,
.event-format { color: var(--cream); }
.event-date,
.event-info,
.event-format { min-width: 0; }
.event-date strong {
  display: block;
  font-family: Marcellus, Georgia, serif;
  font-size: 1.2rem;
  margin-bottom: 2px;
}
.event-date span,
.event-info p {
  color: var(--muted);
  margin: 0;
}
.event-info h3 {
  margin: 0 0 4px;
  font-size: 1.35rem;
}
.event-format {
  justify-self: end;
  text-align: right;
  border: 1px solid rgba(210,162,58,.42);
  color: var(--gold-light);
  padding: 9px 12px;
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.gig-map-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: 8px;
  color: var(--gold-light);
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: .72rem;
  text-decoration: none;
  border-bottom: 1px solid rgba(210,162,58,.45);
}
.gig-map-link:hover,
.gig-map-link:focus-visible {
  color: var(--cream);
  border-bottom-color: var(--cream);
}

.schedule-key ul {
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 18px;
  row-gap: 6px;
  list-style: none;
}
.schedule-key li {
  display: flex;
  gap: 8px;
  align-items: center;
  color: var(--muted);
  line-height: 1.25;
  font-size: .94rem;
}
.schedule-key span {
  width: 24px;
  flex: 0 0 24px;
  text-align: center;
  font-size: 1.05rem;
}
@media (max-width: 560px) {
 .schedule-key ul {
    grid-template-columns: 1fr;
  }
}
.review-library-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.review-card-open {
  min-height: 240px;
  display: grid;
  align-content: start;
  gap: 12px;
}
.review-card-open h3 { margin-top: 6px; }
.review-card-open p { margin: 0; color: var(--muted); }
@media (max-width: 1120px) {
  .header-inner { grid-template-columns: 260px 1fr 54px; }
  .logo-link { width: 260px; }
  .main-nav { gap: 10px; }
  .main-nav a { font-size: .70rem; letter-spacing: .055em; }
}
@media (max-width: 900px) {
  .header-inner { grid-template-columns: 260px 1fr; }
  .main-nav a { font-size: .92rem; letter-spacing: .095em; }
  .schedule-card { grid-template-columns: 54px 1fr; }
  .event-format { justify-self: start; text-align: left; grid-column: 2; }
  .review-library-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .schedule-card { grid-template-columns: 1fr; }
  .event-format { grid-column: auto; }
  .event-icon { width: 48px; height: 48px; }
  .month-group summary { align-items: flex-start; flex-direction: column; }
  .review-library-grid { grid-template-columns: 1fr; }
}

/* Keep mobile menu behaviour intact after the performance-menu update */
@media (max-width: 900px) {
  .nav-toggle { display: inline-grid; place-items: center; justify-self: end; }
  .main-nav {
    position: fixed;
    top: 86px;
    left: 0;
    right: 0;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    background: rgba(0,0,0,.98);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 16px 20px 24px;
  }
  body.nav-open .main-nav { display: flex; }
}

/* Final header spacing tidy: keeps the desktop menu away from the logo without changing page widths */
@media (min-width: 901px) {
  .header-inner {
    grid-template-columns: 250px minmax(0, 1fr) 54px;
    gap: 44px;
  }
  .logo-link {
    width: 250px;
  }
  .main-nav {
    justify-content: flex-start;
    gap: 12px;
  }
  .main-nav a {
    font-size: .76rem;
    letter-spacing: .07em;
  }
}

@media (min-width: 901px) and (max-width: 1120px) {
  .header-inner {
    grid-template-columns: 230px minmax(0, 1fr) 54px;
    gap: 34px;
  }
  .logo-link {
    width: 230px;
  }
  .main-nav {
    gap: 9px;
  }
  .main-nav a {
    font-size: .70rem;
    letter-spacing: .045em;
  }
}

/* To Hell or Verona page expansion */
.section-dark {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(210,162,58,.055), rgba(0,0,0,.28));
}
.toh-hero h1 { max-width: 820px; }
.btn-secondary {
  background: rgba(255,255,255,.025);
  color: var(--cream);
}
.btn-secondary:hover { color: var(--gold-light); }
.toh-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
.toh-stat {
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(210,162,58,.045));
  padding: 24px 20px;
  text-align: center;
  box-shadow: var(--shadow);
}
.toh-stat strong {
  display: block;
  color: var(--gold-light);
  font-family: Marcellus, Georgia, serif;
  font-size: clamp(1.65rem, 2.4vw, 2.45rem);
  font-weight: 400;
  line-height: 1.05;
  margin-bottom: 8px;
}
.toh-stat span {
  display: block;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.toh-lineup-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}
.toh-highlights-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.toh-highlights-grid .event-card {
  min-height: 290px;
}
.toh-icon {
  font-size: 2.1rem;
  line-height: 1;
  margin-bottom: 18px;
}
.toh-booking-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.toh-booking-grid div {
  border: 1px solid var(--line);
  background: rgba(255,255,255,.025);
  color: var(--cream);
  padding: 18px 20px;
  font-weight: 800;
}
.venue-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
}
.venue-cloud span {
  border: 1px solid rgba(210,162,58,.5);
  color: var(--gold-light);
  background: rgba(210,162,58,.06);
  padding: 10px 16px;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.cta-band {
  border-top: 1px solid var(--line);
  background: radial-gradient(circle at 20% 20%, rgba(210,162,58,.16), transparent 24rem);
}
.cta-actions {
  display: flex;
  gap: 14px;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.muted strong { color: var(--cream); }

@media (max-width: 1100px) {
  .toh-highlights-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .toh-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .toh-lineup-grid,
  .toh-booking-grid { grid-template-columns: 1fr; }
  .cta-actions { justify-content: stretch; }
  .cta-actions .btn { flex: 1 1 100%; }
}
@media (max-width: 640px) {
  .toh-highlights-grid,
  .toh-stats-grid { grid-template-columns: 1fr; }
}


/* Visible image placeholder upload dimensions */
.slot-dim {
  display: block;
  margin-top: 8px;
  color: rgba(244,210,124,.82);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .06em;
  line-height: 1.35;
  text-transform: none;
}
.hero-photo-note .slot-dim {
  margin-top: 12px;
  color: rgba(244,210,124,.9);
}
.video-placeholder .slot-dim {
  color: rgba(244,210,124,.86);
  font-family: Lato, Arial, sans-serif;
}


/* Real placeholder image files while preserving editable caption text */
.hero-visual-with-image {
  padding: 0;
  overflow: hidden;
  display: grid;
  grid-template-rows: minmax(260px, 1fr) auto;
}
.hero-visual-with-image .slot-image {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.hero-visual-with-image .hero-photo-note {
  margin: 0;
  padding: 24px 30px;
  background: rgba(0,0,0,.72);
  border-left: 0;
  border-top: 1px solid rgba(210,162,58,.35);
}
.image-slot-with-image {
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 0;
}
.image-slot-with-image .slot-image {
  width: 100%;
  display: block;
  object-fit: cover;
  aspect-ratio: 4 / 3;
  flex: 0 0 auto;
}
.image-slot-large.image-slot-with-image .slot-image,
.page-hero-card.image-slot-with-image .slot-image { aspect-ratio: 16 / 10; }
.image-slot-tall.image-slot-with-image .slot-image { aspect-ratio: 5 / 7; }
.image-slot-small.image-slot-with-image .slot-image { aspect-ratio: 3 / 2; }
.mini-image-slot.image-slot-with-image .slot-image { aspect-ratio: 4 / 3; }
.gallery-preview.image-slot-with-image .slot-image,
.gallery-item.image-slot-with-image .slot-image { aspect-ratio: 4 / 3; }
.slot-caption {
  padding: 18px 20px 20px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 8px;
  min-height: 120px;
  background: linear-gradient(180deg, rgba(0,0,0,.72), rgba(0,0,0,.94));
}
.image-slot-tall .slot-caption { min-height: 150px; }
.mini-image-slot .slot-caption { min-height: 92px; padding: 14px; }
.gallery-preview.image-slot-with-image { text-decoration: none; }
@media (max-width: 640px) {
  .hero-visual-with-image { grid-template-rows: 260px auto; }
  .slot-caption { min-height: 100px; }
}


/* Footer social link icons */
.footer-social-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: inherit;
  text-decoration: none;
}
.footer-social-link:hover {
  color: var(--gold-light);
}
.footer-social-icon {
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 20px;
  border: 1px solid rgba(210,162,58,.58);
  color: var(--gold-light);
  font-size: 0.84rem;
  font-weight: 900;
  line-height: 1;
}
.footer-social-icon-facebook {
  border-radius: 4px;
  font-family: Arial, sans-serif;
}
.footer-social-icon-instagram {
  border-radius: 50%;
  font-size: 1.05rem;
}


/* Footer contact link icons */
.footer-contact-list {
  display: grid;
  gap: 8px;
}
.footer-contact-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: inherit;
  text-decoration: none;
}
.footer-contact-link:hover {
  color: var(--gold-light);
}
.footer-contact-icon {
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 20px;
  border: 1px solid rgba(210,162,58,.58);
  color: var(--gold-light);
  font-size: 0.82rem;
  font-weight: 900;
  line-height: 1;
  border-radius: 50%;
}

/* Standardised page-start spacing across all internal pages */
.page-hero {
  padding: 76px 0 58px;
}

.page-hero .container {
  gap: 44px;
}

main > .section:first-child,
main > .section-tight:first-child {
  padding-top: 76px;
}

@media (max-width: 900px) {
  .page-hero {
    padding: 58px 0 46px;
  }

  main > .section:first-child,
  main > .section-tight:first-child {
    padding-top: 58px;
  }
}

/* Align page hero text consistently at the top of the hero area */
.page-hero .container {
  align-items: start;
}

@media (max-width: 900px) {
  .page-hero .container {
    align-items: start;
  }
}


/* Refined title scale: less dominating page headings */
.page-hero {
  padding: 64px 0 48px;
}

.page-hero h1 {
  font-size: clamp(2.05rem, 3.35vw, 3.35rem);
  line-height: 1.12;
  letter-spacing: .012em;
  margin-bottom: 16px;
}

.page-hero .kicker {
  font-size: .72rem;
  letter-spacing: .2em;
  margin-bottom: 10px;
}

.page-hero p {
  font-size: 1rem;
  line-height: 1.68;
}

.section-head h2 {
  font-size: clamp(1.7rem, 2.45vw, 2.55rem);
  line-height: 1.14;
}

.hero-copy h1 {
  font-size: clamp(2.25rem, 4.1vw, 3.85rem);
  line-height: 1.1;
}

@media (max-width: 900px) {
  .page-hero {
    padding: 52px 0 40px;
  }
}

@media (max-width: 640px) {
  .page-hero h1 {
    font-size: clamp(1.85rem, 8.5vw, 2.55rem);
  }

  .hero-copy h1 {
    font-size: clamp(2rem, 9vw, 2.85rem);
  }
}

/* Wedding package detail compact viewport fit - 2026-08-06
   Tighter version: reduces vertical height further so each package fits better on laptop screens. */
.package-detail {
  padding: 24px 0 28px;
}

.package-detail-grid {
  grid-template-columns: minmax(240px, 305px) minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}

.package-detail-image {
  max-width: 305px;
  justify-self: center;
}

.package-detail-image img {
  max-height: 455px;
  width: 100%;
  object-fit: contain;
  display: block;
}

.package-detail h1,
.package-detail h2:first-child {
  font-size: clamp(1.8rem, 2.55vw, 2.65rem);
  line-height: 1.03;
  margin-bottom: 0.38rem;
}

.package-detail h2:not(:first-child) {
  font-size: clamp(1.28rem, 1.65vw, 1.6rem);
  line-height: 1.08;
  margin-top: 0.75rem;
  margin-bottom: 0.45rem;
}

.package-detail p {
  margin-bottom: 0.58rem;
  line-height: 1.48;
}

.package-price-row {
  gap: 10px;
  margin: 12px 0 15px;
}

.price-box {
  min-width: 118px;
  padding: 9px 14px;
}

.price-box strong {
  font-size: 1.55rem;
}

.package-detail .detail-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 20px;
  margin-top: 0.25rem;
  margin-bottom: 0.35rem;
}

.package-detail .detail-list li {
  margin-bottom: 0;
  line-height: 1.35;
}

.package-detail .btn {
  margin-top: 0.65rem;
  padding-top: 0.85rem;
  padding-bottom: 0.85rem;
}

@media (min-width: 981px) and (max-height: 780px) {
  .package-detail {
    padding: 18px 0 22px;
  }

  .package-detail-image {
    max-width: 285px;
  }

  .package-detail-image img {
    max-height: 430px;
  }

  .package-detail h1,
  .package-detail h2:first-child {
    font-size: clamp(1.7rem, 2.25vw, 2.35rem);
  }

  .package-detail p {
    font-size: 0.98rem;
    line-height: 1.42;
  }
}

@media (max-width: 980px) {
  .package-detail-grid {
    grid-template-columns: 1fr;
  }

  .package-detail-image {
    max-width: 360px;
  }

  .package-detail .detail-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .package-detail {
    padding: 38px 0;
  }

  .package-detail-image {
    max-width: 300px;
  }

  .package-detail-image img {
    max-height: none;
  }
}

/* Anchor positioning fix - keeps sticky header from covering section titles */
html {
  scroll-padding-top: 132px;
}

#wedding-packages,
#wedding-info-pack,
.package-detail {
  scroll-margin-top: 132px;
}

@media (max-width: 900px) {
  html {
    scroll-padding-top: 96px;
  }

  #wedding-packages,
  #wedding-info-pack,
  .package-detail {
    scroll-margin-top: 96px;
  }
}

/* Wedding package individual anchor refinement - 2026-08-06
   Main package list needs the larger offset, but individual package sections were landing too low.
   This brings each package heading up so "Wedding Package" is the first visible package text. */
.package-detail {
  scroll-margin-top: 52px;
}

@media (max-width: 900px) {
  .package-detail {
    scroll-margin-top: 70px;
  }
}

/* Wedding package anchor exact alignment - 2026-08-06
   Individual package links should start at the package section itself, so the
   "Wedding Package" label is the first package text visible rather than the
   previous package's Check Availability button. */
.package-detail[id] {
  scroll-margin-top: 0;
}

@media (max-width: 900px) {
  .package-detail[id] {
    scroll-margin-top: 0;
  }
}

/* Wedding package list anchor spacing refinement - 2026-08-06
   Keeps individual package anchors as-is, but removes the oversized blank gap
   before "Choose your package / Wedding packages" when using the View packages button. */
#wedding-packages.section {
  padding-top: 26px;
}

#wedding-packages .section-head {
  margin-bottom: 28px;
}

@media (max-width: 900px) {
  #wedding-packages.section {
    padding-top: 24px;
  }

  #wedding-packages .section-head {
    margin-bottom: 24px;
  }
}

/* Wedding packages list anchor correction - 2026-08-06
   The View Packages button should land on the package chooser itself, not leave
   buttons from the previous section visible above the heading. Individual
   package anchors remain controlled by .package-detail[id]. */
#wedding-packages,
#wedding-packages.section {
  scroll-margin-top: 0;
}

@media (max-width: 900px) {
  #wedding-packages,
  #wedding-packages.section {
    scroll-margin-top: 0;
  }
}

/* Upcoming gigs: expanded landing area and clean jump anchor */
.page-hero .hero-actions {
  margin-top: 1.1rem;
}

.performance-calendar-section {
  scroll-margin-top: 92px;
}

@media (min-width: 900px) {
  .performance-calendar-section {
    padding-top: 3.25rem;
  }
}

@media (max-width: 640px) {
  .page-hero .hero-actions {
    gap: 0.75rem;
  }
}

/* Site-wide refinement pass - 2026-08-06
   Cleaner first-screen balance, fixed return-to-top button and tighter anchor landings. */
.return-to-top {
  position: fixed;
  right: max(22px, env(safe-area-inset-right));
  bottom: max(22px, env(safe-area-inset-bottom));
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 1px solid rgba(210,162,58,.72);
  background: linear-gradient(135deg, var(--gold), var(--gold-light));
  color: #080604;
  box-shadow: 0 16px 34px rgba(0,0,0,.38);
  font-size: 1.35rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease, box-shadow .22s ease;
  z-index: 9999;
}

.return-to-top.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.return-to-top:hover,
.return-to-top:focus-visible {
  box-shadow: 0 18px 42px rgba(210,162,58,.32);
  outline: none;
}

.weddings-page .page-hero,
.reviews-page .page-hero,
.about-page .page-hero {
  padding-top: 50px;
  padding-bottom: 44px;
}

.weddings-page .page-hero .container,
.reviews-page .page-hero .container,
.about-page .page-hero .container {
  gap: 34px;
  align-items: center;
}

.weddings-page .page-hero h1,
.reviews-page .page-hero h1,
.about-page .page-hero h1 {
  margin-bottom: 14px;
}

.weddings-page .page-hero p,
.reviews-page .page-hero p,
.about-page .page-hero p {
  line-height: 1.58;
}

.weddings-page .page-hero-card,
.reviews-page .page-hero-card,
.about-page .page-hero-card {
  padding: 28px 30px;
}

.weddings-page .page-hero-card h3,
.reviews-page .page-hero-card h3,
.about-page .page-hero-card h2 {
  font-size: clamp(1.35rem, 2.25vw, 2.15rem);
  line-height: 1.12;
}

.weddings-page .small-note,
.reviews-page .small-note {
  font-size: .92rem;
  color: var(--muted);
}

/* Keep wedding page wedding-focused while still giving non-wedding visitors a route. */
.weddings-page .page-hero-card .text-link {
  color: var(--gold-light);
}

/* Better fallback anchor positions when JavaScript is unavailable. */
#wedding-packages {
  scroll-margin-top: 96px;
}

.package-detail[id],
.performance-calendar-section[id] {
  scroll-margin-top: 104px;
}

@media (max-width: 900px) {
  .weddings-page .page-hero,
  .reviews-page .page-hero,
  .about-page .page-hero {
    padding-top: 42px;
    padding-bottom: 38px;
  }

  .return-to-top {
    right: max(14px, env(safe-area-inset-right));
    bottom: max(14px, env(safe-area-inset-bottom));
    width: 42px;
    height: 42px;
    font-size: 1.2rem;
  }
}


@media (max-width: 420px) {
  .return-to-top {
    width: 40px;
    height: 40px;
    right: max(12px, env(safe-area-inset-right));
    bottom: max(12px, env(safe-area-inset-bottom));
  }
}

/* Wedding package landscape-card refinements */
.weddings-page .packages-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
  align-items: stretch;
}

.weddings-page .packages-grid .package-card {
  padding: 0;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.03);
}

.weddings-page .packages-grid .package-card img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: contain;
}

.weddings-page .package-detail-grid {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: center;
}

.weddings-page .package-detail-image img {
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
}

.weddings-page #wedding-info-pack {
  margin-top: 1rem;
}

@media (min-width: 1180px) {
  .weddings-page .packages-grid .package-card:nth-child(5) {
    grid-column: 1 / -1;
    max-width: calc(50% - 0.625rem);
    justify-self: center;
  }
}

@media (max-width: 900px) {
  .weddings-page .packages-grid,
  .weddings-page .package-detail-grid {
    grid-template-columns: 1fr;
  }

  .weddings-page .packages-grid .package-card:nth-child(5) {
    max-width: none;
  }
}

/* Wedding page polish: larger package cards and softer page flow */
.weddings-page .page-hero {
  padding-top: clamp(4.5rem, 6vw, 6.5rem);
  padding-bottom: clamp(3.5rem, 5vw, 5.25rem);
}

.weddings-page .page-hero-card,
.weddings-page .info-card,
.weddings-page .package-detail-image,
.weddings-page .price-box {
  border-radius: 18px;
}

.weddings-page .page-hero-card,
.weddings-page .info-card {
  background: linear-gradient(145deg, rgba(210,162,58,.10), rgba(255,255,255,.025));
  border-color: rgba(210,162,58,.34);
}

.weddings-page #wedding-packages {
  padding-top: clamp(3.5rem, 6vw, 5.5rem);
  padding-bottom: clamp(3rem, 5vw, 4.75rem);
  background: radial-gradient(circle at 50% 0%, rgba(210,162,58,.08), transparent 34rem);
}

.weddings-page #wedding-packages .container {
  max-width: 1500px;
}

.weddings-page #wedding-packages .section-head {
  margin-bottom: clamp(1.5rem, 3vw, 2.6rem);
}

.weddings-page #wedding-packages .section-head p:last-child {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

.weddings-page .packages-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: clamp(1.5rem, 2.5vw, 2.5rem) !important;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

.weddings-page .packages-grid .package-card {
  border-radius: 20px;
  border-color: rgba(210,162,58,.48);
  background: rgba(255,255,255,.04);
  box-shadow: 0 20px 60px rgba(0,0,0,.42);
}

.weddings-page .packages-grid .package-card img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: contain;
}

@media (min-width: 1100px) {
  .weddings-page .packages-grid .package-card:nth-child(5) {
    grid-column: 1 / -1;
    max-width: calc(50% - clamp(.75rem, 1.25vw, 1.25rem));
    justify-self: center;
  }
}

.weddings-page .package-detail {
  padding-top: clamp(3rem, 5vw, 4.75rem);
  padding-bottom: clamp(3rem, 5vw, 4.75rem);
  border-top-color: rgba(210,162,58,.28);
  background: linear-gradient(180deg, rgba(255,255,255,.018), rgba(0,0,0,.12));
}

.weddings-page .package-detail:nth-of-type(even) {
  background: radial-gradient(circle at 20% 20%, rgba(210,162,58,.055), transparent 30rem);
}

.weddings-page .package-detail-grid {
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, .75fr) !important;
  gap: clamp(1.75rem, 3vw, 3.5rem);
  align-items: center;
}

.weddings-page .package-detail-image {
  background: rgba(255,255,255,.03);
  border-color: rgba(210,162,58,.36);
  padding: clamp(.35rem, .8vw, .75rem);
}

.weddings-page .package-detail-image img {
  border-radius: 14px;
  width: 100%;
}

.weddings-page .package-detail h2 {
  margin-bottom: .35rem;
}

.weddings-page .package-detail .gold {
  margin-bottom: 1rem;
}

.weddings-page .package-price-row {
  margin: 1rem 0 1.35rem;
}

.weddings-page .price-box {
  background: rgba(255,255,255,.025);
  min-width: 135px;
}

.weddings-page .detail-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .45rem 1.25rem;
  margin-bottom: 1.25rem;
}

.weddings-page .detail-list li {
  margin-bottom: 0;
}

.weddings-page #wedding-info-pack {
  padding-top: clamp(3rem, 5vw, 4.75rem);
  padding-bottom: clamp(3.5rem, 6vw, 5.5rem);
  background: radial-gradient(circle at 50% 0%, rgba(210,162,58,.08), transparent 32rem);
}

.weddings-page .info-actions {
  gap: clamp(1.25rem, 2.5vw, 2rem);
}

.weddings-page .info-card {
  padding: clamp(1.6rem, 3vw, 2.35rem);
}

.weddings-page .info-card h2 {
  font-size: clamp(1.75rem, 2.6vw, 2.65rem);
}

@media (max-width: 980px) {
  .weddings-page .packages-grid,
  .weddings-page .package-detail-grid,
  .weddings-page .detail-list {
    grid-template-columns: 1fr !important;
  }

  .weddings-page .packages-grid .package-card:nth-child(5) {
    max-width: none;
  }

  .weddings-page .package-detail-image {
    max-width: none;
    margin: 0;
  }
}

@media (max-width: 640px) {
  .weddings-page #wedding-packages .container {
    width: min(100% - 1.4rem, 1500px);
  }

  .weddings-page .packages-grid {
    gap: 1rem !important;
  }

  .weddings-page .package-detail {
    padding-top: 2.4rem;
    padding-bottom: 2.4rem;
  }
}


/* 2026-08-06 corrected wedding package split:
   landscape cards for package chooser/home preview; portrait artwork only in package detail sections. */

#packages-preview .packages-grid,
.weddings-page .packages-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(18px, 2vw, 30px);
  align-items: stretch;
}

#packages-preview .packages-grid .package-card,
.weddings-page .packages-grid .package-card {
  display: block;
  overflow: hidden;
  padding: 0;
  border-radius: 18px;
  background: rgba(255,255,255,.035);
}

#packages-preview .packages-grid .package-card img,
.weddings-page .packages-grid .package-card img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: contain;
  background: #fbf8f1;
}

#packages-preview .packages-grid .package-card:nth-child(5),
.weddings-page .packages-grid .package-card:nth-child(5) {
  grid-column: 1 / -1;
  justify-self: center;
  width: min(100%, 640px);
  max-width: none;
}

.weddings-page .package-detail {
  padding: 42px 0 46px;
}

.weddings-page .package-detail-grid {
  grid-template-columns: minmax(250px, 360px) minmax(0, 1fr);
  gap: clamp(30px, 4vw, 58px);
  align-items: start;
}

.weddings-page .package-detail-image {
  justify-self: center;
  width: 100%;
  max-width: 360px;
  overflow: hidden;
  border-radius: 18px;
  background: #fbf8f1;
}

.weddings-page .package-detail-image img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: auto;
  object-fit: contain;
}

.weddings-page .package-detail .detail-list {
  gap: 7px 26px;
}

/* Stop older scroll-margin rules fighting the JavaScript anchor positioning. */
html {
  scroll-padding-top: 0 !important;
}

#wedding-packages,
#wedding-info-pack,
.package-detail,
.package-detail[id],
.performance-calendar-section[id] {
  scroll-margin-top: 0 !important;
}

@media (max-width: 980px) {
  #packages-preview .packages-grid,
  .weddings-page .packages-grid,
  .weddings-page .package-detail-grid {
    grid-template-columns: 1fr;
  }

  #packages-preview .packages-grid .package-card:nth-child(5),
  .weddings-page .packages-grid .package-card:nth-child(5) {
    grid-column: auto;
    width: 100%;
  }

  .weddings-page .package-detail-image {
    max-width: min(100%, 420px);
  }
}

@media (min-width: 1180px) {
  #packages-preview .packages-grid {
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* 2026-08-06 package detail layout correction
   Keeps the landscape chooser cards, but makes the clicked-through detail layout
   use a controlled portrait image column and a wider text column. */
.weddings-page .package-detail .container.package-detail-grid {
  max-width: 1180px;
  grid-template-columns: minmax(260px, 360px) minmax(0, 680px) !important;
  gap: clamp(28px, 4vw, 58px) !important;
  justify-content: center;
  align-items: start;
}

.weddings-page .package-detail-image {
  width: 100%;
  max-width: 360px !important;
  justify-self: end;
  margin: 0;
}

.weddings-page .package-detail-image img {
  width: 100%;
  max-height: 560px;
  object-fit: contain;
}

.weddings-page .package-detail .package-detail-grid > div:last-child {
  max-width: 680px;
  justify-self: start;
}

.weddings-page .package-detail .detail-list {
  grid-template-columns: repeat(2, minmax(220px, 1fr));
}

@media (min-width: 1200px) {
  .weddings-page .package-detail .container.package-detail-grid {
    transform: translateX(-24px);
  }
}

@media (max-width: 980px) {
  .weddings-page .package-detail .container.package-detail-grid {
    grid-template-columns: 1fr !important;
    max-width: 760px;
    transform: none;
  }

  .weddings-page .package-detail-image {
    justify-self: center;
    max-width: min(100%, 390px) !important;
  }

  .weddings-page .package-detail .package-detail-grid > div:last-child {
    max-width: none;
    justify-self: stretch;
  }
}

@media (max-width: 640px) {
  .weddings-page .package-detail .detail-list {
    grid-template-columns: 1fr;
  }
}

/* 2026-08-07 remove extra white wrapper around wedding package detail images */
.weddings-page .package-detail-image {
  background: transparent !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.weddings-page .package-detail-image img {
  display: block;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* Wedding package chooser order correction
   Ensures the top landscape package cards always display:
   Organza, Velvet, Satin, Silk, Custom. */
.weddings-page #wedding-packages .packages-grid .package-card[href$="#wedding-organza"] { order: 1; }
.weddings-page #wedding-packages .packages-grid .package-card[href$="#wedding-velvet"] { order: 2; }
.weddings-page #wedding-packages .packages-grid .package-card[href$="#wedding-satin"] { order: 3; }
.weddings-page #wedding-packages .packages-grid .package-card[href$="#wedding-silk"] { order: 4; }
.weddings-page #wedding-packages .packages-grid .package-card[href$="#wedding-custom"] { order: 5; }

@media (min-width: 981px) {
  .weddings-page #wedding-packages .packages-grid .package-card:nth-child(5) {
    grid-column: auto;
    justify-self: stretch;
    width: auto;
    max-width: none;
  }

  .weddings-page #wedding-packages .packages-grid .package-card[href$="#wedding-custom"] {
    grid-column: 1 / -1;
    justify-self: center;
    width: min(100%, 640px);
    max-width: none;
  }
}

/* Homepage redesign - 2026-08-07 */
.home-page .home-hero {
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 76% 28%, rgba(210,162,58,.14), transparent 30rem),
    linear-gradient(180deg, #030303 0%, #090806 100%);
}
.home-page .home-hero-grid {
  min-height: 650px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 64px;
  padding: 68px 0;
}
.home-page .home-hero-copy { max-width: 650px; }
.home-page .home-hero-copy h1 { font-size: clamp(2.45rem, 4.35vw, 4.45rem); }
.home-page .home-hero-lead {
  max-width: 620px;
  margin: 0 0 32px;
  color: var(--muted);
  font-size: 1.13rem;
}
.home-page .home-hero-media {
  position: relative;
  margin: 0;
  min-height: 500px;
  overflow: hidden;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  background: #090909;
}
.home-page .home-hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 52%, rgba(0,0,0,.82) 100%);
  pointer-events: none;
}
.home-page .home-hero-media img {
  width: 100%;
  height: 100%;
  min-height: 500px;
  object-fit: cover;
  object-position: center;
}
.home-page .home-hero-media figcaption {
  position: absolute;
  left: 26px;
  right: 26px;
  bottom: 22px;
  z-index: 2;
  color: var(--cream);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.home-page .home-trust-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.home-page .home-trust-card {
  min-height: 102px;
  padding: 22px 20px;
  border-left: 1px solid var(--line);
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}
.home-page .home-trust-card:last-child { border-right: 1px solid var(--line); }
.home-page .home-trust-icon {
  width: 30px;
  height: 30px;
  color: var(--gold-light);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.home-page .home-trust-icon svg {
  width: 30px;
  height: 30px;
  display: block;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.home-page .home-trust-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.home-page .home-trust-grid strong {
  color: var(--gold-light);
  font-family: Marcellus, Georgia, serif;
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.12;
}
.home-page .home-trust-grid span { color: var(--muted); font-size: .88rem; }
.home-page .home-intro { padding-top: 44px; padding-bottom: 44px; }
.home-page .home-intro-grid {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 80px;
  align-items: start;
}
.home-page .home-intro-grid h2 { max-width: 500px; }
.home-page .home-intro-copy { max-width: 650px; color: var(--muted); font-size: 1.05rem; }
.home-page .home-intro-copy p:first-child { margin-top: 0; }
.home-page .home-pathways-section {
  padding-top: 42px;
  padding-bottom: 44px;
  border-top: 1px solid rgba(210,162,58,.18);
  border-bottom: 1px solid rgba(210,162,58,.18);
  background: rgba(0,0,0,.28);
}
.home-page .home-pathways {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border: 1px solid var(--line);
}
.home-page .home-pathway {
  position: relative;
  min-height: 365px;
  padding: 28px 34px 30px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(0,0,0,.28));
  transition: background .22s ease, transform .22s ease;
}
.home-page .home-pathway:last-child { border-right: 0; }
.home-page .home-pathway:hover { background: linear-gradient(180deg, rgba(210,162,58,.11), rgba(0,0,0,.42)); }
.home-page .home-pathway-featured { background: linear-gradient(180deg, rgba(210,162,58,.12), rgba(0,0,0,.38)); }
.home-page .home-pathway-icon {
  width: 38px;
  height: 38px;
  margin-bottom: 26px;
  color: rgba(244,210,124,.68);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.home-page .home-pathway-icon svg {
  width: 36px;
  height: 36px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.home-page .home-pathway .text-link { margin-top: auto; padding-top: 16px; }
.home-page .home-pathway h3 { color: var(--cream); font-size: clamp(1.55rem, 2.1vw, 2.25rem); }
.home-page .home-pathway > p:not(.kicker) { color: var(--muted); }
.home-page .home-wedding-feature { padding-top: 58px; padding-bottom: 58px; }
.home-page .home-feature-grid {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  gap: 58px;
  align-items: center;
}
.home-page .home-feature-copy { max-width: 660px; }
.home-page .home-feature-copy > p:not(.kicker) { max-width: 620px; }
.home-page .home-pathways-section .section-head { margin-bottom: 26px; }
.home-page .home-wedding-moments {
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(210,162,58,.09), rgba(0,0,0,.38));
  box-shadow: var(--shadow);
}
.home-page .home-wedding-moment {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 16px;
  align-items: start;
  padding: 24px 26px;
  border-bottom: 1px solid var(--line);
}
.home-page .home-wedding-moment:last-child { border-bottom: 0; }
.home-page .home-wedding-moment-icon {
  width: 34px;
  height: 34px;
  color: var(--gold-light);
  display: inline-flex;
}
.home-page .home-wedding-moment-icon svg {
  width: 32px;
  height: 32px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.home-page .home-wedding-moment strong {
  display: block;
  color: var(--gold-light);
  font-family: Marcellus, Georgia, serif;
  font-size: 1.2rem;
  font-weight: 400;
  margin-bottom: 4px;
}
.home-page .home-wedding-moment span { color: var(--muted); font-size: .94rem; line-height: 1.45; }
.home-page .home-photo-panel {
  position: relative;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  background: #050505;
  box-shadow: var(--shadow);
}
.home-page .home-photo-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 52%, rgba(0,0,0,.88) 100%);
  pointer-events: none;
}
.home-page .home-photo-panel img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.home-page .home-photo-panel figcaption {
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 20px;
  z-index: 2;
  color: var(--cream);
  font-family: Marcellus, Georgia, serif;
  font-size: 1.05rem;
  line-height: 1.25;
}
.home-page .home-feature-photo {
  min-height: 430px;
}
.home-page .home-feature-photo img {
  min-height: 430px;
  object-position: center 48%;
}
.home-page .home-performance-band {
  padding-top: 44px;
  padding-bottom: 44px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: linear-gradient(90deg, rgba(210,162,58,.07), rgba(0,0,0,.38));
}
.home-page .home-performance-grid {
  display: grid;
  grid-template-columns: .78fr .82fr 1fr;
  gap: 34px;
  align-items: stretch;
}
.home-page .home-performance-copy { align-self: center; }
.home-page .home-performance-photo { min-height: 300px; }
.home-page .home-performance-photo img { min-height: 300px; object-position: center; }
.home-page .home-performance-links { border-top: 1px solid var(--line); }
.home-page .home-performance-links a {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 24px;
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
}
.home-page .home-performance-links strong {
  color: var(--gold-light);
  font-family: Marcellus, Georgia, serif;
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 12px;
}
.home-page .home-performance-links > a > span { color: var(--muted); }
.home-page .home-performance-link-icon {
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--gold-light);
}
.home-page .home-performance-link-icon svg {
  width: 25px;
  height: 25px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.home-page .home-about-preview { padding-top: 60px; padding-bottom: 60px; }
.home-page .home-about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 72px;
  align-items: center;
}
.home-page .home-about-grid > div:first-child { max-width: 620px; }
.home-page .home-about-side { display: grid; gap: 16px; }
.home-page .home-about-photo { min-height: 270px; }
.home-page .home-about-photo img { min-height: 270px; object-position: center 40%; }
.home-page .home-about-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.home-page .home-mini-card {
  padding: 28px 30px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.025);
  transition: transform .2s ease, background .2s ease;
}
.home-page .home-mini-card:hover { transform: translateY(-3px); background: rgba(210,162,58,.07); }
.home-page .home-mini-card span {
  display: block;
  margin-bottom: 6px;
  color: var(--gold-light);
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.home-page .home-mini-card strong { font-family: Marcellus, Georgia, serif; font-size: 1.4rem; font-weight: 400; }
.home-page .home-final-cta {
  padding: 82px 0;
  border-top: 1px solid var(--line);
  background:
    radial-gradient(circle at 80% 20%, rgba(210,162,58,.18), transparent 24rem),
    #070604;
}
.home-page .home-final-cta-inner {
  display: flex;
  justify-content: space-between;
  gap: 48px;
  align-items: center;
}
.home-page .home-final-cta-inner > div:first-child { max-width: 680px; }
.home-page .home-final-cta-inner p:last-child { color: var(--muted); margin-bottom: 0; }

@media (max-width: 900px) {
  .home-page .home-hero-grid,
  .home-page .home-intro-grid,
  .home-page .home-feature-grid,
  .home-page .home-performance-grid,
  .home-page .home-about-grid { grid-template-columns: 1fr; gap: 42px; }
  .home-page .home-performance-photo { min-height: 380px; }
  .home-page .home-performance-photo img { min-height: 380px; }
  .home-page .home-hero-grid { padding: 54px 0 64px; }
  .home-page .home-hero-media,
  .home-page .home-hero-media img { min-height: 420px; }
  .home-page .home-trust-grid { grid-template-columns: repeat(2, 1fr); }
  .home-page .home-trust-card:nth-child(2) { border-right: 1px solid var(--line); }
  .home-page .home-pathways { grid-template-columns: 1fr; }
  .home-page .home-pathway { min-height: auto; border-right: 0; border-bottom: 1px solid var(--line); }
  .home-page .home-pathway:last-child { border-bottom: 0; }
  .home-page .home-pathway-icon { margin-bottom: 20px; }
  .home-page .home-final-cta-inner { display: grid; }
}

@media (max-width: 640px) {
  .home-page .home-hero-copy h1 { font-size: clamp(2.3rem, 11vw, 3.4rem); }
  .home-page .home-hero-media,
  .home-page .home-hero-media img { min-height: 330px; }
  .home-page .home-trust-grid { grid-template-columns: 1fr; }
  .home-page .home-trust-card { border-right: 1px solid var(--line); }
  .home-page .home-intro { padding-top: 38px; padding-bottom: 38px; }
  .home-page .home-pathway { padding: 30px 26px; }
  .home-page .home-wedding-feature { padding-top: 46px; padding-bottom: 46px; }
  .home-page .home-feature-photo,
  .home-page .home-feature-photo img { min-height: 360px; }
  .home-page .home-about-actions { grid-template-columns: 1fr; }
  .home-page .home-performance-links a { grid-template-columns: 1fr; gap: 4px; }
  .home-page .home-pathways-section { padding-top: 36px; padding-bottom: 38px; }
  .home-page .home-performance-band { padding-top: 38px; padding-bottom: 38px; }
  .home-page .home-about-preview { padding-top: 48px; padding-bottom: 48px; }
  .home-page .home-final-cta { padding: 62px 0; }
}

/* Live Cognito booking form */
.booking-live-form {
  border-style: solid;
  background: rgba(0,0,0,.28);
  padding: clamp(24px, 4vw, 44px);
  overflow: hidden;
}
.booking-live-form iframe {
  display: block;
  width: 100% !important;
  max-width: 100%;
  border: 0;
}
.booking-live-form noscript p {
  margin: 0;
  color: var(--muted);
}

@media (max-width: 640px) {
  .booking-live-form { padding: 20px 16px; }
}


/* Booking page refinement - 2026-08-07
   Keeps the live Cognito form comfortable inside the site design and makes the
   Start booking form anchor land directly on the form heading rather than the
   padded edge of the surrounding section. */
.booking-page .booking-hero {
  padding-bottom: 44px;
}

.booking-page .booking-steps {
  gap: 16px;
}

.booking-page .step-card {
  padding: 24px 26px;
}

.booking-page .step-card p {
  margin-bottom: 0;
}

.booking-page .booking-form-section {
  padding-top: 50px;
  padding-bottom: 62px;
}

#booking-form-start {
  scroll-margin-top: 132px;
}

.booking-page #booking-form-start > .kicker {
  margin-bottom: 9px;
}

.booking-page #booking-form-start > h2 {
  margin-bottom: 12px;
}

.booking-page #booking-form-start > .muted {
  max-width: 760px;
  margin-top: 0;
  margin-bottom: 0;
}

.booking-page .booking-embed-panel {
  margin-top: 20px;
}

.booking-page .booking-live-form {
  width: 100%;
  padding: clamp(28px, 3.2vw, 38px);
  border-style: solid;
  background: linear-gradient(145deg, rgba(255,255,255,.035), rgba(0,0,0,.22));
  overflow: hidden;
}

.booking-page .booking-live-form > div,
.booking-page .booking-live-form iframe {
  width: 100% !important;
  max-width: 100% !important;
}

.booking-page .booking-live-form iframe {
  display: block;
  margin: 0 !important;
  border: 0 !important;
}

.booking-page .section-muted {
  padding-top: 58px;
  padding-bottom: 64px;
}

.booking-page .section-muted .notice-box p:last-child {
  margin-bottom: 0;
}

@media (max-width: 900px) {
  #booking-form-start {
    scroll-margin-top: 98px;
  }

  .booking-page .booking-form-section {
    padding-top: 42px;
    padding-bottom: 52px;
  }

  .booking-page .section-muted {
    padding-top: 48px;
    padding-bottom: 54px;
  }
}

@media (max-width: 640px) {
  .booking-page .booking-hero {
    padding-bottom: 38px;
  }

  .booking-page .step-card {
    padding: 22px;
  }

  .booking-page .booking-live-form {
    padding: 20px 16px;
  }
}

/* Performance map page */
.performance-map-hero {
  padding-bottom: 44px;
}
.performance-map-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
  gap: 52px;
  align-items: end;
}
.performance-map-intro > div:first-child {
  max-width: 760px;
}
.performance-map-note {
  border-left: 2px solid var(--gold);
  padding: 8px 0 8px 22px;
}
.performance-map-note strong {
  display: block;
  color: var(--gold-light);
  font-family: Marcellus, Georgia, serif;
  font-size: 1.35rem;
  font-weight: 400;
  margin-bottom: 8px;
}
.performance-map-note p {
  margin: 0;
  color: var(--muted);
}
.performance-map-section {
  padding-top: 34px;
}
.performance-map-frame {
  --map-ui-crop: 86px;
  position: relative;
  overflow: hidden;
  height: clamp(540px, 68vh, 820px);
  border: 1px solid var(--line);
  background: #080808;
  box-shadow: var(--shadow);
}
.performance-map-frame iframe {
  position: absolute;
  top: calc(-1 * var(--map-ui-crop));
  left: 0;
  display: block;
  width: 100%;
  height: calc(100% + var(--map-ui-crop));
  border: 0;
}
.performance-map-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 22px;
}
.performance-map-actions p {
  margin: 0;
}
@media (max-width: 820px) {
  .performance-map-intro {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .performance-map-frame {
    height: 620px;
  }
}
@media (max-width: 640px) {
  .performance-map-hero {
    padding-bottom: 30px;
  }
  .performance-map-section {
    padding-top: 22px;
  }
  .performance-map-frame {
    --map-ui-crop: 80px;
    height: 540px;
  }
  .performance-map-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .performance-map-actions .btn {
    width: 100%;
  }
}

/* Cookie and privacy preference controls */
.cookie-banner,
.cookie-modal {
  --cookie-gold: var(--gold, #d2a23a);
  --cookie-gold-light: #f0cf73;
  --cookie-black: #050505;
  --cookie-panel: #0b0b0b;
  --cookie-border: rgba(210, 162, 58, .7);
  --cookie-muted: var(--muted, #c6c0b5);
}

.cookie-banner[hidden],
.cookie-modal[hidden],
.cookie-embed-placeholder[hidden],
[data-cookie-category="google-embed"] iframe[hidden] {
  display: none !important;
}

.cookie-banner {
  position: fixed;
  z-index: 10000;
  left: 50%;
  bottom: 12px;
  width: min(1040px, calc(100% - 24px));
  transform: translateX(-50%);
  background: #050505;
  color: #fff;
  border: 1px solid var(--cookie-gold);
  border-radius: 14px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, .58);
}

.cookie-banner__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 14px 16px;
}

.cookie-banner__copy {
  max-width: 640px;
}

.cookie-banner__eyebrow,
.cookie-modal__eyebrow {
  display: block;
  margin-bottom: 5px;
  color: var(--cookie-gold-light);
  font-size: .73rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.cookie-banner h2,
.cookie-modal h2,
.cookie-preference-row h3 {
  color: #fff;
}

.cookie-banner h2 {
  margin: 0 0 3px;
  font-size: clamp(.98rem, 1.35vw, 1.16rem);
}

.cookie-banner p {
  margin: 0 0 4px;
  color: #d6d2ca;
  line-height: 1.4;
  font-size: .78rem;
}

.cookie-banner a,
.cookie-modal a,
.cookie-settings-inline {
  color: var(--cookie-gold-light);
  text-underline-offset: 3px;
}

.cookie-banner__actions,
.cookie-modal__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.cookie-banner__actions {
  display: grid;
  grid-template-columns: repeat(3, max-content);
  justify-content: end;
  gap: 6px;
  max-width: none;
}

.cookie-choice-button {
  min-height: 42px;
  padding: 10px 15px;
  border: 1px solid var(--cookie-gold);
  border-radius: 999px;
  background: #0a0a0a;
  color: #fff;
  font: inherit;
  font-size: .86rem;
  font-weight: 800;
  line-height: 1.15;
  cursor: pointer;
  transition: background-color .18s ease, color .18s ease, transform .18s ease, border-color .18s ease;
}

.cookie-banner .cookie-choice-button {
  min-height: 34px;
  padding: 7px 10px;
  font-size: .72rem;
  white-space: nowrap;
}

.cookie-banner__eyebrow {
  margin-bottom: 3px;
  font-size: .63rem;
  letter-spacing: .12em;
}

.cookie-banner > .cookie-banner__inner > .cookie-banner__copy > a {
  font-size: .75rem;
}

.cookie-choice-button:hover,
.cookie-choice-button:focus-visible {
  background: var(--cookie-gold);
  color: #050505;
  outline: none;
  transform: translateY(-1px);
}

.cookie-choice-button:focus-visible,
.cookie-switch input:focus-visible + .cookie-switch__track,
.cookie-modal__close:focus-visible,
.cookie-settings-inline:focus-visible {
  box-shadow: 0 0 0 3px rgba(240, 207, 115, .25);
}

.cookie-modal {
  position: fixed;
  z-index: 10020;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 20px;
}

.cookie-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .76);
  backdrop-filter: blur(5px);
}

.cookie-modal__panel {
  position: relative;
  z-index: 1;
  width: min(720px, 100%);
  max-height: min(820px, calc(100vh - 40px));
  overflow: auto;
  padding: clamp(24px, 4vw, 38px);
  background: #050505;
  color: #fff;
  border: 1px solid var(--cookie-gold);
  border-radius: 20px;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .72);
}

.cookie-modal__close {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(210, 162, 58, .5);
  border-radius: 50%;
  background: #0a0a0a;
  color: #fff;
  font-size: 1.45rem;
  line-height: 1;
  cursor: pointer;
}

.cookie-modal h2 {
  margin: 0 44px 8px 0;
  font-size: clamp(1.55rem, 3vw, 2rem);
}

.cookie-modal__intro {
  margin: 0;
  color: #d6d2ca;
  line-height: 1.6;
}

.cookie-preference-list {
  display: grid;
  gap: 10px;
  margin: 24px 0;
}

.cookie-preference-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 22px;
  align-items: center;
  padding: 17px 18px;
  border: 1px solid rgba(210, 162, 58, .32);
  border-radius: 14px;
  background: #0b0b0b;
}

.cookie-preference-row h3 {
  margin: 0 0 4px;
  font-size: 1rem;
}

.cookie-preference-row p {
  margin: 0;
  color: #c9c4bb;
  font-size: .88rem;
  line-height: 1.5;
}

.cookie-preference-row--inactive {
  opacity: .72;
}

.cookie-preference-status {
  white-space: nowrap;
  padding: 6px 9px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  color: #ddd8cf;
  font-size: .73rem;
  font-weight: 800;
}

.cookie-preference-status--fixed {
  border-color: rgba(210, 162, 58, .58);
  color: var(--cookie-gold-light);
}

.cookie-switch {
  position: relative;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}

.cookie-switch input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.cookie-switch__track {
  position: relative;
  width: 52px;
  height: 30px;
  border: 1px solid rgba(255,255,255,.26);
  border-radius: 999px;
  background: #252525;
  transition: background-color .18s ease, border-color .18s ease;
}

.cookie-switch__thumb {
  position: absolute;
  top: 4px;
  left: 4px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #f5f1e8;
  transition: transform .18s ease, background-color .18s ease;
}

.cookie-switch input:checked + .cookie-switch__track {
  border-color: var(--cookie-gold);
  background: rgba(210, 162, 58, .35);
}

.cookie-switch input:checked + .cookie-switch__track .cookie-switch__thumb {
  transform: translateX(22px);
  background: var(--cookie-gold-light);
}

.cookie-modal__policy-link {
  margin: 16px 0 0;
  font-size: .85rem;
}

.cookie-modal-open {
  overflow: hidden;
}

.cookie-settings-inline {
  font: inherit;
}

.cookie-embed-placeholder {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px;
  background:
    radial-gradient(circle at 50% 30%, rgba(210,162,58,.12), transparent 38%),
    #070707;
  text-align: center;
}

.cookie-embed-placeholder__inner {
  width: min(600px, 100%);
  padding: clamp(24px, 5vw, 42px);
  border: 1px solid rgba(210,162,58,.42);
  border-radius: 16px;
  background: rgba(5,5,5,.92);
}

.cookie-embed-placeholder__icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  margin: 0 auto 14px;
  border: 1px solid var(--cookie-gold);
  border-radius: 50%;
  color: var(--cookie-gold-light);
  font-size: 1.35rem;
}

.cookie-embed-placeholder h3 {
  margin: 0 0 8px;
  color: #fff;
  font-size: clamp(1.2rem, 2.4vw, 1.55rem);
}

.cookie-embed-placeholder p {
  margin: 0 auto 18px;
  color: #d0cbc2;
  line-height: 1.55;
}

.cookie-embed-placeholder__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}

.cookie-embed-placeholder .cookie-choice-button {
  min-width: 148px;
}

@media (max-width: 760px) {
  .cookie-banner__inner {
    grid-template-columns: 1fr;
    gap: 9px;
    padding: 12px 13px;
  }
  .cookie-banner__actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    justify-content: stretch;
    width: 100%;
  }
  .cookie-banner .cookie-choice-button {
    width: 100%;
    padding-inline: 6px;
    white-space: normal;
  }
}

@media (max-width: 600px) {
  .cookie-banner {
    bottom: 8px;
    width: calc(100% - 14px);
    border-radius: 12px;
  }
  .cookie-banner__inner {
    padding: 11px 12px;
  }
  .cookie-banner__eyebrow {
    display: none;
  }
  .cookie-banner h2 {
    font-size: .94rem;
  }
  .cookie-banner p {
    font-size: .72rem;
    line-height: 1.35;
  }
  .cookie-banner a {
    font-size: .7rem;
  }
  .cookie-banner__actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
  }
  .cookie-modal__actions {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }
  .cookie-choice-button {
    width: 100%;
  }
  .cookie-modal {
    padding: 10px;
  }
  .cookie-modal__panel {
    max-height: calc(100vh - 20px);
    padding: 24px 18px;
    border-radius: 15px;
  }
  .cookie-preference-row {
    grid-template-columns: 1fr;
    gap: 12px;
    align-items: start;
  }
  .cookie-preference-status,
  .cookie-switch {
    justify-self: start;
  }
  .cookie-embed-placeholder {
    padding: 16px;
  }
  .cookie-embed-placeholder__inner {
    padding: 24px 18px;
  }
}

.cookie-modal .sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}



.cookie-banner__links {
  margin-top: 2px !important;
}

.cookie-banner__links strong {
  color: #f0cf73;
  font-weight: 800;
}


/* Build 113: compact grouped public navigation */
.main-nav>.nav-dropdown{position:relative;display:block}
.main-nav>.nav-dropdown>summary{position:relative;display:flex;align-items:center;gap:5px;list-style:none;cursor:pointer;color:var(--cream);font-size:.76rem;font-weight:800;line-height:1;text-transform:uppercase;letter-spacing:.07em;padding:14px 0;user-select:none}
.main-nav>.nav-dropdown>summary::-webkit-details-marker{display:none}
.main-nav>.nav-dropdown>summary::after{content:"";position:absolute;left:0;right:0;bottom:3px;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:center;transition:transform .2s ease}
.main-nav>.nav-dropdown>summary:hover,.main-nav>.nav-dropdown>summary:focus-visible,.main-nav>.nav-dropdown[open]>summary,.main-nav>.nav-dropdown.is-current>summary{color:var(--gold-light)}
.main-nav>.nav-dropdown>summary:hover::after,.main-nav>.nav-dropdown>summary:focus-visible::after,.main-nav>.nav-dropdown[open]>summary::after,.main-nav>.nav-dropdown.is-current>summary::after{transform:scaleX(1)}
.nav-dropdown-chevron{display:inline-block;font-size:.9rem;line-height:1;transition:transform .18s ease}.nav-dropdown[open] .nav-dropdown-chevron{transform:rotate(180deg)}
.nav-dropdown-menu{display:none}.nav-dropdown[open]>.nav-dropdown-menu{display:grid}
.main-nav>.nav-availability{border:1px solid rgba(210,162,58,.62);border-radius:999px;padding:10px 13px;color:var(--gold-light)}
.main-nav>.nav-availability::after{display:none}.main-nav>.nav-availability:hover,.main-nav>.nav-availability:focus-visible{background:rgba(210,162,58,.09);color:#fff}
@media(min-width:901px){
  .main-nav>.nav-dropdown>.nav-dropdown-menu{position:absolute;z-index:120;top:calc(100% + 8px);left:50%;transform:translateX(-50%);width:310px;padding:9px;border:1px solid rgba(210,162,58,.3);border-radius:14px;background:rgba(7,7,7,.99);box-shadow:0 24px 60px rgba(0,0,0,.48);gap:2px;white-space:normal}
  .main-nav>.nav-dropdown>.nav-dropdown-menu a{display:grid;gap:4px;padding:11px 12px;border-radius:9px;font-size:.78rem;letter-spacing:.055em;line-height:1.2}
  .main-nav>.nav-dropdown>.nav-dropdown-menu a::after{display:none}
  .main-nav>.nav-dropdown>.nav-dropdown-menu a:hover,.main-nav>.nav-dropdown>.nav-dropdown-menu a:focus-visible,.main-nav>.nav-dropdown>.nav-dropdown-menu a[aria-current="page"]{background:rgba(210,162,58,.09);color:var(--gold-light)}
  .main-nav>.nav-dropdown>.nav-dropdown-menu small{font-size:.7rem;line-height:1.35;letter-spacing:0;text-transform:none;color:#a9a195;font-weight:500}
}
@media(max-width:900px){
  .main-nav>.nav-dropdown{border-bottom:1px solid rgba(210,162,58,.13)}
  .main-nav>.nav-dropdown>summary{justify-content:space-between;padding:15px 0;font-size:.92rem;letter-spacing:.095em}
  .main-nav>.nav-dropdown>summary::after{display:none}
  .main-nav>.nav-dropdown>.nav-dropdown-menu{position:static;transform:none;width:auto;padding:0 0 10px 14px;border:0;border-left:1px solid rgba(210,162,58,.3);border-radius:0;background:transparent;box-shadow:none;gap:0;white-space:normal}
  .main-nav>.nav-dropdown>.nav-dropdown-menu a{display:grid;gap:3px;padding:11px 12px;font-size:.82rem;letter-spacing:.055em;border-bottom:0}
  .main-nav>.nav-dropdown>.nav-dropdown-menu a::after{display:none}
  .main-nav>.nav-dropdown>.nav-dropdown-menu small{font-size:.72rem;line-height:1.35;letter-spacing:0;text-transform:none;color:#9e978b;font-weight:500}
  .main-nav>.nav-availability{margin-top:12px;text-align:center;padding:13px 14px}
}
@media(max-width:1120px) and (min-width:901px){.main-nav>.nav-dropdown>summary{font-size:.70rem;letter-spacing:.045em}.main-nav>.nav-availability{font-size:.68rem;padding:9px 10px}}

/* Build 115: restore readable, consistent public navigation after grouped-menu rollout. */
@media (min-width: 1121px) {
  .main-nav { gap: 15px; }
  .main-nav > a,
  .main-nav > .nav-dropdown > summary,
  .main-nav > .nav-availability {
    font-size: .88rem;
    letter-spacing: .055em;
    font-weight: 800;
  }
  .main-nav > .nav-availability { padding: 10px 14px; }
}
@media (min-width: 901px) and (max-width: 1120px) {
  .header-inner { grid-template-columns: 215px minmax(0, 1fr) 54px; gap: 26px; }
  .logo-link { width: 215px; }
  .main-nav { gap: 8px; }
  .main-nav > a,
  .main-nav > .nav-dropdown > summary,
  .main-nav > .nav-availability {
    font-size: .80rem;
    letter-spacing: .035em;
    font-weight: 800;
  }
  .main-nav > .nav-availability { padding: 9px 10px; }
}
@media (max-width: 900px) {
  .main-nav > a,
  .main-nav > .nav-dropdown > summary,
  .main-nav > .nav-availability {
    font-size: .96rem;
    letter-spacing: .075em;
    font-weight: 800;
  }
}
@media (min-width: 901px) {
  .main-nav > .nav-dropdown > .nav-dropdown-menu a {
    font-size: .84rem;
    letter-spacing: .045em;
  }
  .main-nav > .nav-dropdown > .nav-dropdown-menu small { font-size: .74rem; }
}

/* Build 253 - full-width CONTENT correction.
   Build 252 widened the shared shell/header but several older page-specific
   max-width rules still kept the actual public content visually narrow.
   This pass keeps readable long-form prose constrained, while allowing the
   real page layouts, hero/media columns and major grids to use the available
   desktop width with one consistent responsive gutter. */
:root {
  --public-content-gutter: clamp(28px, 4vw, 72px);
}

@media (min-width: 901px) {
  /* Header and normal public content now share exactly the same desktop edges.
     Article/legal/narrow reading shells keep their own intentional measures. */
  body:not(.legal-page) .header-inner,
  body:not(.legal-page) .container:not(.article-shell):not(.narrow-container) {
    width: auto !important;
    margin-left: var(--public-content-gutter) !important;
    margin-right: var(--public-content-gutter) !important;
  }

  /* Remove legacy copy caps inside split/grid layouts. Text still occupies its
     allocated column; it is not stretched across the entire viewport. */
  .home-page .home-hero-copy,
  .home-page .home-hero-lead,
  .home-page .home-intro-copy,
  .home-page .home-feature-copy,
  .home-page .home-feature-copy > p:not(.kicker),
  .home-page .home-about-grid > div:first-child,
  .home-page .home-final-cta-inner > div:first-child,
  .about-page .about-hero-copy,
  .about-page .about-hero-copy > p:not(.kicker),
  .collaborations-page .collaborations-hero-copy,
  .collaborations-page .collaborations-hero-lead,
  .occasions-page .occasions-hero-copy,
  .occasions-page .occasions-hero-lead,
  .contact-page .contact-hero h1,
  .contact-page .contact-hero-lead,
  .performances-page .performances-hero-lead,
  .performances-page .performances-hero-support,
  .past-gigs-page .performances-hero-lead,
  .performance-map-intro > div:first-child,
  .reviews-page .reviews-hero-copy > p:not(.kicker),
  .resource-hero-copy h1,
  .resource-hero-copy > p:not(.kicker) {
    max-width: none !important;
  }

  /* Media in a split layout should fill its allocated column rather than sit
     as a small capped image inside a newly widened shell. */
  .about-page .about-hero-media,
  .reviews-page .reviews-hero-media,
  .contact-page .contact-hero-media,
  .resource-hero-media {
    max-width: none !important;
    width: 100% !important;
  }

  /* Structural grids/panels that retained old desktop caps. */
  .about-page .about-craft-grid,
  .about-page .about-case-grid,
  .about-page .about-woodwind-note,
  .collaborations-page .collab-thov-compact,
  .weddings-page #wedding-packages .container,
  .weddings-page .packages-grid,
  #packages-preview .packages-grid,
  .weddings-page .package-detail .container.package-detail-grid,
  .weddings-page .package-detail .package-detail-grid > div:last-child {
    max-width: none !important;
  }


}

@media (max-width: 900px) {
  :root {
    --public-content-gutter: 13px;
  }
}

/* Build 335 — canonical public page scroll control.
   The Home page is the visual reference. Every page-level floating scroll arrow,
   including both Wedding Advice controls, uses this exact treatment. */
html:root body[class] button.section-scroll-next.section-scroll-next[class][type="button"],
html:root body[class] button.advice-page-scroll.advice-page-scroll[class][type="button"],
html:root body[class] button.article-page-scroll.article-page-scroll[class][type="button"] {
  box-sizing: border-box !important;
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: max(20px, env(safe-area-inset-bottom)) !important;
  z-index: 9998 !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
  padding: 0 !important;
  border: 1px solid rgba(244,210,124,.72) !important;
  border-radius: 50% !important;
  background: rgba(8,8,8,.94) !important;
  color: var(--gold-light, #f4d27c) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.18) !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
  opacity: .86 !important;
  transform: translate(-50%, 0) !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  transition: opacity .2s ease, transform .2s ease, border-color .2s ease, background .2s ease !important;
}

html:root body[class] button.section-scroll-next.section-scroll-next[class][type="button"][hidden],
html:root body[class] button.advice-page-scroll.advice-page-scroll[class][type="button"][hidden],
html:root body[class] button.article-page-scroll.article-page-scroll[class][type="button"][hidden] {
  display: none !important;
}

html:root body[class] button.section-scroll-next.section-scroll-next[class][type="button"] svg,
html:root body[class] button.advice-page-scroll.advice-page-scroll[class][type="button"] svg,
html:root body[class] button.article-page-scroll.article-page-scroll[class][type="button"] svg {
  width: 23px !important;
  height: 23px !important;
  display: block !important;
  overflow: visible !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.65)) !important;
  transition: transform .18s ease !important;
}

html:root body[class] button.section-scroll-next.section-scroll-next[class][type="button"] svg path,
html:root body[class] button.advice-page-scroll.advice-page-scroll[class][type="button"] svg path,
html:root body[class] button.article-page-scroll.article-page-scroll[class][type="button"] svg path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html:root body[class] button.section-scroll-next.section-scroll-next[class][type="button"]:hover,
html:root body[class] button.section-scroll-next.section-scroll-next[class][type="button"]:focus-visible,
html:root body[class] button.advice-page-scroll.advice-page-scroll[class][type="button"]:hover,
html:root body[class] button.advice-page-scroll.advice-page-scroll[class][type="button"]:focus-visible,
html:root body[class] button.article-page-scroll.article-page-scroll[class][type="button"]:hover,
html:root body[class] button.article-page-scroll.article-page-scroll[class][type="button"]:focus-visible {
  opacity: 1 !important;
  border-color: var(--gold-light, #f4d27c) !important;
  background: rgba(8,8,8,.985) !important;
  color: var(--gold-light, #f4d27c) !important;
  outline: none !important;
}

html:root body[class] button.section-scroll-next.section-scroll-next[class][type="button"]:hover svg,
html:root body[class] button.section-scroll-next.section-scroll-next[class][type="button"]:focus-visible svg,
html:root body[class] button.advice-page-scroll.advice-page-scroll[class][type="button"]:hover svg,
html:root body[class] button.advice-page-scroll.advice-page-scroll[class][type="button"]:focus-visible svg,
html:root body[class] button.article-page-scroll.article-page-scroll[class][type="button"]:hover svg,
html:root body[class] button.article-page-scroll.article-page-scroll[class][type="button"]:focus-visible svg {
  transform: translateY(2px) !important;
}

@media (max-width: 640px) {
  html:root body[class] button.section-scroll-next.section-scroll-next[class][type="button"],
  html:root body[class] button.advice-page-scroll.advice-page-scroll[class][type="button"],
  html:root body[class] button.article-page-scroll.article-page-scroll[class][type="button"] {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    bottom: max(14px, env(safe-area-inset-bottom)) !important;
  }
  html:root body[class] button.section-scroll-next.section-scroll-next[class][type="button"] svg,
  html:root body[class] button.advice-page-scroll.advice-page-scroll[class][type="button"] svg,
  html:root body[class] button.article-page-scroll.article-page-scroll[class][type="button"] svg {
    width: 20px !important;
    height: 20px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:root body[class] button.section-scroll-next.section-scroll-next[class][type="button"],
  html:root body[class] button.section-scroll-next.section-scroll-next[class][type="button"] svg,
  html:root body[class] button.advice-page-scroll.advice-page-scroll[class][type="button"],
  html:root body[class] button.advice-page-scroll.advice-page-scroll[class][type="button"] svg,
  html:root body[class] button.article-page-scroll.article-page-scroll[class][type="button"],
  html:root body[class] button.article-page-scroll.article-page-scroll[class][type="button"] svg {
    transition: none !important;
  }
}

/* Build 397: never paint the legacy Credentials image in a provisional split.
   The loader releases this image-only gate after shared CSS, the selected source
   and exact crop are ready. Body copy and links remain visible throughout. */
@media (scripting:enabled) {
  html:not([data-jt-credentials-ready="1"]) body[class*="credentials"] #main-content > section:first-of-type img,
  html:has(link[rel="canonical"][href$="/credentials.html"]):not([data-jt-credentials-ready="1"]) #main-content > section:first-of-type img {
    visibility:hidden !important;
  }
}

/* P31T50 source: assets/css/frontend-qa2.css */
/* Front-end QA2 — responsive and accessibility hardening (2026-08-14).
   Loaded after page-specific styles so these are deliberate site-wide final guards. */

/* Keyboard focus visibility. */
:where(a, button, input, select, textarea, summary, [tabindex]:not([tabindex="-1"])):focus-visible {
  outline: 3px solid var(--gold-light);
  outline-offset: 3px;
}

/* Some older page-specific rules deliberately removed outlines. Restore a
   consistent keyboard indicator as the final cascade layer. */
.main-nav a:focus-visible,
.nav-toggle:focus-visible,
.btn:focus-visible,
.text-link:focus-visible,
.footer-option-b a:focus-visible,
.footer-option-b button:focus-visible,
.legal-toc a:focus-visible,
.legal-block a:focus-visible,
.legal-callout a:focus-visible,
.return-to-top:focus-visible,
.section-scroll-next:focus-visible,
.cookie-choice-button:focus-visible,
.cookie-modal__close:focus-visible,
.cookie-settings-inline:focus-visible {
  outline: 3px solid var(--gold-light) !important;
  outline-offset: 3px !important;
}

/* Robust wrapping for long addresses, URLs and contact details. */
main,
footer,
.panel,
.info-card,
.event-card,
.collab-card,
.legal-article,
.booking-form-card,
.contact-enquiry-form {
  min-width: 0;
}

p,
li,
dd,
figcaption,
.footer-b-contact-pill,
.footer-b-links,
.legal-block,
.form-status {
  overflow-wrap: break-word;
}

.legal-block a,
.legal-contact-card a,
.footer-b-contact-pill--email,
.footer-b-contact-pill--web {
  overflow-wrap: anywhere;
}

iframe,
video,
svg,
canvas {
  max-width: 100%;
}

h1,
h2,
h3 {
  text-wrap: balance;
}

.btn {
  max-width: 100%;
  min-height: 48px;
  padding-top: 10px;
  padding-bottom: 10px;
  line-height: 1.25;
  text-align: center;
  white-space: normal;
}

/* Header/navigation: switch to the compact menu before the desktop navigation
   becomes cramped. The previous 900px breakpoint overflowed around 1024px. */
@media (max-width: 1080px) {
  .header-inner {
    width: min(var(--container), calc(100% - 32px));
    min-height: 86px !important;
    grid-template-columns: minmax(0, 240px) 48px !important;
    justify-content: space-between;
    gap: 18px !important;
  }

  .logo-link {
    width: min(240px, 100%) !important;
    min-width: 0;
  }

  .nav-toggle {
    display: inline-grid !important;
    grid-column: 2;
    place-items: center;
    justify-self: end;
    width: 48px;
    height: 48px;
    min-width: 48px;
    min-height: 48px;
    padding: 0;
    border-radius: 10px;
    cursor: pointer;
  }

  .main-nav {
    position: absolute !important;
    z-index: 60;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    display: none !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    max-height: calc(100dvh - 86px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: 12px max(20px, env(safe-area-inset-right)) max(22px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left)) !important;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: rgba(0,0,0,.985) !important;
    box-shadow: 0 22px 50px rgba(0,0,0,.48);
    white-space: normal !important;
  }

  body.nav-open .main-nav {
    display: flex !important;
  }

  .main-nav a {
    display: flex;
    align-items: center;
    min-height: 48px;
    width: 100%;
    padding: 12px 4px !important;
    font-size: .9rem !important;
    line-height: 1.25 !important;
    white-space: normal;
  }

  .main-nav a::after {
    bottom: 5px;
  }
}

@media (min-width: 1081px) and (max-width: 1240px) {
  .header-inner {
    grid-template-columns: 220px minmax(0, 1fr) !important;
    gap: 18px !important;
  }
  .logo-link { width: 220px !important; }
  .main-nav {
    justify-content: flex-end;
    gap: 10px !important;
  }
  .main-nav a {
    font-size: .70rem !important;
    letter-spacing: .055em !important;
  }
  .nav-toggle { display: none !important; }
}

@media (max-width: 640px) {
  .container,
  .header-inner {
    width: min(100% - 26px, var(--container)) !important;
  }

  .header-inner {
    grid-template-columns: minmax(0, 200px) 46px !important;
    gap: 12px !important;
  }

  .logo-link { width: min(200px, 100%) !important; }

  .main-nav {
    padding-left: max(14px, env(safe-area-inset-left)) !important;
    padding-right: max(14px, env(safe-area-inset-right)) !important;
  }

  .section,
  .section-tight {
    scroll-margin-top: 96px;
  }

  .footer-option-b .footer-b-nav-toggle,
  .footer-option-b .footer-b-contact-pill,
  .footer-option-b .footer-b-social {
    min-height: 44px;
  }

  .footer-option-b .footer-b-social {
    width: 44px;
    height: 44px;
  }

  .return-to-top,
  .weddings-page .section-scroll-next,
  .occasions-page .section-scroll-next,
  .collaborations-page .section-scroll-next,
  .reviews-page .section-scroll-next,
  .about-page .section-scroll-next,
  .thov-page .section-scroll-next {
    width: 44px !important;
    height: 44px !important;
  }
}

@media (max-width: 360px) {
  .header-inner {
    width: calc(100% - 22px) !important;
    grid-template-columns: minmax(0, 178px) 46px !important;
    gap: 10px !important;
  }
  .logo-link { width: min(178px, 100%) !important; }
  .main-nav a { font-size: .86rem !important; }
}

/* Fix genuine 320px min-content overflow in the collaboration project cards. */
.collaborations-page .collab-project-feature,
.collaborations-page .collab-project-images,
.collaborations-page .collab-project-copy,
.collaborations-page .collab-project-single-image {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 700px) {
  .collaborations-page .collab-project-images {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .collaborations-page .collab-project-images img,
  .collaborations-page .collab-project-single-image img {
    min-width: 0;
    max-width: 100%;
  }
}

@media (max-width: 380px) {
  .collaborations-page .collab-project-images {
    grid-template-columns: 1fr !important;
  }
  .collaborations-page .collab-project-images img,
  .collaborations-page .collab-project-single-image img {
    height: auto !important;
    max-height: 260px;
    object-fit: contain;
  }
}

/* Scrollable legal tables are intentional on narrow phones; make the scroll
   region keyboard-focusable and visibly discoverable. */
.legal-table-wrap[tabindex="0"]:focus-visible {
  outline: 3px solid var(--gold-light);
  outline-offset: 3px;
}

@media (max-width: 700px) {
  .legal-layout {
    min-width: 0;
  }
  .legal-table-wrap {
    max-width: 100%;
    scrollbar-width: thin;
    scrollbar-color: var(--gold) #090806;
  }
}

/* Native form usability on small touch devices and iOS: keep fields at a
   readable 16px and status messaging visually clear. */
.contact-page .contact-field input,
.contact-page .contact-field select,
.contact-page .contact-field textarea,
.booking-page .booking-field input,
.booking-page .booking-field select,
.booking-page .booking-field textarea {
  font-size: 1rem;
}

.form-status[role="alert"] {
  border-color: rgba(239,107,99,.52);
}

[aria-invalid="true"] {
  border-color: #ef8f87 !important;
  box-shadow: 0 0 0 3px rgba(239,107,99,.14) !important;
}

@media (max-width: 480px) {
  .contact-page .contact-enquiry-form,
  .booking-page .booking-form-card__body,
  .booking-page .booking-form-card__head {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }

  .form-turnstile-block {
    padding-left: 12px;
    padding-right: 12px;
  }

  .contact-page .contact-date-row {
    grid-template-columns: 1fr !important;
    align-items: stretch;
  }

  .contact-page .contact-check {
    min-height: 48px;
  }
}

/* Honour reduced-motion preferences across the entire public site, including
   custom arrows and JavaScript-assisted anchor scrolling. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* P31T50 source: assets/css/frontend-qa4.css */
/*
 * Front-end QA4 — content & final consistency
 * Shared navigation-dropdown and footer-density refinements.
 */

/* Gigs dropdown: keeps the primary navigation concise while exposing the
   upcoming archive and confirmed-booking routes consistently. */
.main-nav .main-nav-group {
  position: relative;
  display: flex;
  align-items: center;
}

.main-nav .main-nav-submenu-toggle {
  appearance: none;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 34px;
  padding: 7px 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: 700 .78rem/1 Lato, Arial, sans-serif;
  letter-spacing: .085em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color .18s ease;
}

.main-nav .main-nav-submenu-toggle::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 2px;
  height: 1px;
  background: var(--gold-light);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .18s ease;
}

.main-nav .main-nav-submenu-toggle:hover,
.main-nav .main-nav-submenu-toggle:focus-visible,
.main-nav .main-nav-submenu-toggle.active {
  color: var(--gold-light);
}

.main-nav .main-nav-submenu-toggle:hover::before,
.main-nav .main-nav-submenu-toggle:focus-visible::before,
.main-nav .main-nav-submenu-toggle.active::before {
  transform: scaleX(1);
}

.main-nav .main-nav-submenu-toggle:focus-visible {
  outline: 2px solid var(--gold-light);
  outline-offset: 5px;
}

.main-nav .main-nav-submenu-chevron {
  width: 11px;
  height: 11px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .18s ease;
}

.main-nav .main-nav-group.is-open .main-nav-submenu-chevron {
  transform: rotate(180deg);
}

.main-nav .main-nav-submenu {
  position: absolute;
  z-index: 120;
  top: calc(100% + 8px);
  left: 50%;
  width: max-content;
  min-width: 210px;
  padding: 7px;
  border: 1px solid rgba(210,162,58,.42);
  border-radius: 13px;
  background: rgba(8,8,8,.98);
  box-shadow: 0 18px 40px rgba(0,0,0,.42);
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, -5px);
  pointer-events: none;
  transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
}

.main-nav .main-nav-group:hover .main-nav-submenu,
.main-nav .main-nav-group:focus-within .main-nav-submenu,
.main-nav .main-nav-group.is-open .main-nav-submenu {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
  pointer-events: auto;
}

.main-nav .main-nav-submenu a {
  display: block;
  min-width: 0;
  padding: 9px 11px;
  border-radius: 8px;
  color: var(--muted);
  font-size: .76rem;
  line-height: 1.25;
  letter-spacing: .045em;
  text-transform: none;
  white-space: nowrap;
}

.main-nav .main-nav-submenu a::after {
  display: none;
}

.main-nav .main-nav-submenu a:hover,
.main-nav .main-nav-submenu a:focus-visible,
.main-nav .main-nav-submenu a.active {
  background: rgba(210,162,58,.10);
  color: var(--gold-light);
}

/* Footer was intentionally generous during the page-build stage. QA4 tightens
   the desktop footprint while keeping mobile controls at accessible sizes. */
.site-footer.footer-option-b {
  padding: 18px 0 13px;
}

.footer-option-b .footer-b-main {
  grid-template-columns: minmax(205px, 240px) 1fr;
  gap: 22px;
  padding: 17px 22px 15px;
}

.footer-option-b .footer-b-brand {
  min-height: 70px;
  padding-right: 22px;
}

.footer-option-b .footer-b-brand img {
  width: min(100%, 214px);
}

.footer-option-b .footer-b-nav {
  gap: 20px;
}

.footer-option-b .footer-b-nav-toggle {
  margin-bottom: 7px;
}

.footer-option-b .footer-b-links {
  gap: 5px 14px;
}

.footer-option-b .footer-b-contact-row {
  gap: 12px;
  padding: 10px 22px;
}

.footer-option-b .footer-b-contact-actions,
.footer-option-b .footer-b-socials {
  gap: 7px;
}

.footer-option-b .footer-b-contact-pill {
  min-height: 34px;
  padding: 6px 10px;
  font-size: .75rem;
}

.footer-option-b .footer-b-contact-pill svg {
  width: 22px;
  height: 22px;
  flex-basis: 22px;
}

.footer-option-b .footer-b-social {
  width: 34px;
  height: 34px;
}

.footer-option-b .footer-b-bottom {
  min-height: 34px;
  padding: 7px 16px;
}

@media (max-width: 1080px) {
  .main-nav .main-nav-group {
    display: block;
    width: 100%;
  }

  .main-nav .main-nav-submenu-toggle {
    width: 100%;
    min-height: 48px;
    justify-content: space-between;
    padding: 15px 0;
    font-size: .92rem;
    letter-spacing: .095em;
  }

  .main-nav .main-nav-submenu-toggle::before {
    display: none;
  }

  .main-nav .main-nav-submenu-chevron {
    width: 15px;
    height: 15px;
    margin-right: 2px;
  }

  .main-nav .main-nav-submenu,
  .main-nav .main-nav-group:hover .main-nav-submenu,
  .main-nav .main-nav-group:focus-within .main-nav-submenu {
    position: static;
    width: 100%;
    min-width: 0;
    padding: 0 0 7px 13px;
    border: 0;
    border-left: 1px solid rgba(210,162,58,.35);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
    display: none;
  }

  .main-nav .main-nav-group.is-open .main-nav-submenu {
    display: grid;
  }

  .main-nav .main-nav-submenu a {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: 10px 12px;
    font-size: .86rem;
    letter-spacing: .04em;
    white-space: normal;
  }
}

@media (max-width: 700px) {
  .site-footer.footer-option-b {
    padding: 13px 0 10px;
  }

  .footer-option-b .footer-b-main {
    padding: 15px 16px 8px;
  }

  .footer-option-b .footer-b-brand {
    padding-bottom: 12px;
  }

  .footer-option-b .footer-b-brand img {
    width: min(100%, 205px);
  }

  .footer-option-b .footer-b-nav {
    padding-top: 5px;
  }

  .footer-option-b .footer-b-nav-toggle {
    min-height: 44px;
  }

  .footer-option-b .footer-b-links {
    padding-bottom: 9px;
  }

  .footer-option-b .footer-b-links a {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: 6px 0;
  }

  .footer-option-b .footer-b-contact-row {
    padding: 11px 16px 12px;
  }

  .footer-option-b .footer-b-contact-pill {
    min-height: 44px;
  }

  .footer-option-b .footer-b-social {
    width: 44px;
    height: 44px;
  }

  .footer-option-b .footer-b-bottom {
    padding: 9px 13px 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .main-nav .main-nav-submenu,
  .main-nav .main-nav-submenu-chevron,
  .main-nav .main-nav-submenu-toggle::before {
    transition: none;
  }
}

/* User-approved public header behaviour — 2026-08-14.
   The public site header stays in normal document flow. It must not become
   sticky/fixed unless explicitly requested later. */
.site-header {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
}

/* Build 050 — public-site main-navigation readability.
   Shorter labels create enough room to increase the desktop type size without
   reintroducing header overflow. The hidden desktop menu-toggle no longer
   reserves an empty grid column, and the logo is slightly narrower. */
@media (min-width: 1081px) {
  .header-inner {
    grid-template-columns: 260px minmax(0, 1fr) !important;
    gap: 24px !important;
  }

  .logo-link {
    width: 260px !important;
  }

  .main-nav {
    justify-content: flex-end !important;
    gap: 13px !important;
  }

  .main-nav a {
    font-size: .86rem !important;
    letter-spacing: .06em !important;
  }
}

@media (min-width: 1081px) and (max-width: 1240px) {
  .header-inner {
    grid-template-columns: 230px minmax(0, 1fr) !important;
    gap: 16px !important;
  }

  .logo-link {
    width: 230px !important;
  }

  .main-nav {
    gap: 8px !important;
  }

  .main-nav a {
    font-size: .80rem !important;
    letter-spacing: .04em !important;
  }
}


/* Build 052 — restore the original JT logo composition and give the public
   desktop header enough logo footprint for crisp legibility. The menu labels
   remain the shorter Build 050 wording and mobile behaviour is unchanged. */

/* P31T50 source: assets/css/frontend-readability-102.css */
/* Build 102: public-site readability pass.
   Keeps compact decorative labels where they are part of the visual system,
   while increasing functional/help text that visitors need to read or act on. */

/* Shared actions and footer navigation. */
.btn{font-size:.88rem}
.btn-small{font-size:.84rem}
.text-link{font-size:.84rem}
.footer-option-b .footer-b-nav-toggle{font-size:.8rem}
.footer-option-b .footer-b-links a{font-size:.88rem}
.footer-option-b .footer-b-contact-pill{font-size:.86rem}
.footer-option-b .footer-b-bottom{font-size:.82rem}

/* Contact page: labels, notes and the four direct-contact cards. */
.contact-page .contact-method{min-height:104px;gap:16px}
.contact-page .contact-method-icon{width:44px;height:44px;flex-basis:44px}
.contact-page .contact-method-icon svg{width:30px;height:30px}
.contact-page .contact-method-icon-letter{font-size:2rem}
.contact-page .contact-method small{font-size:.78rem;letter-spacing:.11em}
.contact-page .contact-method strong{font-size:.96rem;line-height:1.4}
.contact-page .contact-method:nth-child(2) strong{font-size:.92rem}
.contact-page .contact-field label{font-size:.96rem;letter-spacing:.025em}
.contact-page .contact-check{font-size:.92rem;letter-spacing:.02em}
.contact-page .contact-form-note{font-size:.87rem;line-height:1.6}
.contact-page .contact-required-note{font-size:.84rem}
.contact-page .contact-status{font-size:.9rem}
.contact-page .contact-next-list p{font-size:.92rem;line-height:1.58}
.contact-page .contact-booked-box>p:not(.kicker){font-size:.9rem;line-height:1.58}
.contact-page .contact-repair-note p{font-size:.9rem;line-height:1.58}

/* Credentials request: form labels and supporting copy are deliberately larger. */
.credentials-page .credentials-request-note p{font-size:.98rem;line-height:1.65}
.credentials-page .credentials-form-card legend small{font-size:.88rem;line-height:1.45}
.credentials-page .credentials-field>span{font-size:.96rem;letter-spacing:.015em}
.credentials-page .credentials-field small{font-size:.86rem;line-height:1.52}
.credentials-page .credentials-check strong{font-size:.98rem}
.credentials-page .credentials-check small{font-size:.86rem;line-height:1.52}
.credentials-page .credentials-document-error{font-size:.9rem}
.credentials-page .credentials-confirm{font-size:.94rem;line-height:1.62}
.credentials-page .credentials-request-form .form-turnstile-copy,
.credentials-page .credentials-request-form .form-turnstile-status{font-size:.84rem;line-height:1.5}
.credentials-page .credentials-request-footer p{font-size:.9rem;line-height:1.6}

/* Credentials venue/supplier CTA: stronger text and larger action targets. */
.credentials-page .credentials-venue-shell p{font-size:1.02rem;line-height:1.7}
.credentials-page .credentials-venue-actions{gap:12px}
.credentials-page .credentials-venue-actions .btn{min-height:54px;padding-inline:24px;font-size:.9rem}
.credentials-page .credentials-venue-actions .btn svg{width:22px;height:22px;flex:0 0 22px}

/* Confirmed-booking form: the same label-size problem existed here. */
.booking-page .booking-field label{font-size:.92rem;letter-spacing:.02em}
.booking-page .booking-field small{font-size:.86rem;line-height:1.55}
.booking-page .booking-check{font-size:.9rem;line-height:1.6}
.booking-page .booking-submit-copy p{font-size:.88rem;line-height:1.6}
.booking-page .booking-payment-options>legend{font-size:.9rem}
.booking-page .booking-radio-card small{font-size:.84rem;line-height:1.5}
.form-turnstile-heading span{font-size:.82rem}
.form-turnstile-copy,.form-turnstile-status{font-size:.84rem;line-height:1.5}

/* Other public text found below a comfortable reading size during the audit. */
.gallery-caption,.weddings-page .wedding-photo figcaption,
.collaborations-page .collab-photo-card figcaption,
.thov-page .thov-feature-media figcaption{font-size:.84rem}
.performance-map-page .venue-website-link,.venue-website-link{font-size:.82rem}
.reviews-page .review-card footer{font-size:.84rem}
.reviews-page .reviews-details summary small{font-size:.82rem}
.reviews-page .hero-quote-card blockquote{font-size:.9rem}
.setup-category-link{font-size:.84rem}
.setup-category-link small{font-size:.74rem}
.setup-product-copy p{font-size:.88rem;line-height:1.6}
.setup-product-link,.setup-product-details{font-size:.76rem}
.performances-page .gig-compact-type,.performances-page .event-format{font-size:.78rem}
.performances-page .gig-period-footer,.past-gigs-page .past-gigs-return a{font-size:.84rem}

/* Cookie controls are functional text, not decorative micro-copy. */
.cookie-banner p{font-size:.84rem}
.cookie-banner .cookie-choice-button{font-size:.8rem;min-height:38px}
.cookie-banner>.cookie-banner__inner>.cookie-banner__copy>a{font-size:.8rem}
@media(max-width:600px){
  .cookie-banner p{font-size:.8rem;line-height:1.42}
  .cookie-banner a{font-size:.78rem}
}

@media(max-width:700px){
  .contact-page .contact-method{min-height:86px}
  .contact-page .contact-method-icon{width:40px;height:40px;flex-basis:40px}
  .contact-page .contact-method-icon svg{width:28px;height:28px}
}

/* Footer/contact icon sizing and hero captions from the same readability audit. */
.footer-option-b .footer-b-contact-pill svg{width:30px;height:30px;flex-basis:30px}
.footer-option-b .footer-b-social{width:44px;height:44px}
.contact-page .contact-hero-media figcaption,.home-page .home-hero-media figcaption{font-size:.84rem}

/* P31T50 source: assets/css/resources-hub.css */
.resource-page{background:#080808;color:var(--cream)}
.resource-hero{padding:clamp(54px,7vw,92px) 0 58px;border-bottom:1px solid var(--line);background:radial-gradient(circle at 78% 22%,rgba(210,162,58,.13),transparent 28%),linear-gradient(180deg,#0b0906,#080808)}
.resource-hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);gap:clamp(28px,5vw,64px);align-items:center}
.resource-hero-copy h1{max-width:760px;margin:.2rem 0 1rem}.resource-hero-copy>p:not(.kicker){max-width:760px;color:var(--muted);font-size:clamp(1rem,1.4vw,1.16rem);line-height:1.75}
.resource-hero-media{margin:0;position:relative;border:1px solid rgba(210,162,58,.28);border-radius:22px;overflow:hidden;background:#0a0a0a;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.resource-hero-media img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}.resource-hero-media figcaption{position:absolute;left:14px;bottom:14px;padding:7px 10px;border-radius:999px;background:rgba(0,0,0,.72);border:1px solid rgba(210,162,58,.3);font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-light)}
.resource-section{padding:62px 0}.resource-section-alt{background:linear-gradient(180deg,rgba(210,162,58,.04),rgba(255,255,255,.01));border-top:1px solid rgba(210,162,58,.12);border-bottom:1px solid rgba(210,162,58,.12)}
.resource-section-head{max-width:820px;margin-bottom:28px}.resource-section-head p{color:var(--muted);line-height:1.7}.resource-section-head h2{margin:.2rem 0 .7rem}
.resource-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.resource-card{border:1px solid rgba(210,162,58,.23);border-radius:18px;background:linear-gradient(155deg,rgba(18,16,12,.96),rgba(7,7,7,.98));padding:24px;min-width:0}.resource-card h3{margin:.2rem 0 .65rem}.resource-card p{color:var(--muted);line-height:1.65;margin:.3rem 0}.resource-meta{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 0}.resource-chip,.resource-sample-badge{display:inline-flex;align-items:center;min-height:28px;padding:5px 9px;border-radius:999px;border:1px solid rgba(210,162,58,.28);color:var(--gold-light);font-size:.68rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.resource-sample-badge{border-color:rgba(255,190,92,.5);background:rgba(255,190,92,.08)}
.resource-empty{padding:30px;border:1px dashed rgba(210,162,58,.35);border-radius:18px;background:rgba(210,162,58,.035);color:var(--muted)}
.song-toolbar,.advice-toolbar,.supplier-toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 24px}.resource-filter{min-height:44px;padding:0 12px;border:1px solid rgba(210,162,58,.35);border-radius:9px;background:#0b0a08;color:var(--cream);font:inherit}.resource-filter:focus{outline:2px solid var(--gold);outline-offset:2px}
.song-list{display:grid;gap:14px}.song-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,420px);gap:22px;align-items:center;border:1px solid rgba(210,162,58,.22);border-radius:18px;padding:22px 24px;background:rgba(255,255,255,.018)}.song-card h3{margin:0 0 4px}.song-artist{color:var(--gold-light);font-weight:800}.song-card audio{width:100%;height:44px}.song-card[hidden]{display:none}
.advice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.advice-card{display:flex;flex-direction:column;min-height:100%;padding:26px;border:1px solid rgba(210,162,58,.22);border-radius:18px;background:linear-gradient(155deg,rgba(20,17,12,.96),rgba(8,8,8,.98))}.advice-card h2{font-size:clamp(1.45rem,2vw,1.95rem);margin:.55rem 0 .65rem}.advice-card p{color:var(--muted);line-height:1.68}.advice-card .text-link{margin-top:auto;padding-top:12px}.advice-date{font-size:.76rem;color:#9d9488}.advice-category{color:var(--gold-light);font-size:.72rem;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.article-shell{max-width:860px}.article-head{padding:56px 0 30px}.article-head h1{margin:.25rem 0 1rem}.article-head .article-lede{font-size:1.14rem;color:var(--muted);line-height:1.75}.article-body{padding:10px 0 70px}.article-body h2{margin:2.2rem 0 .75rem}.article-body h3{margin:1.8rem 0 .65rem}.article-body p,.article-body li{color:#d4cdc0;line-height:1.78;font-size:1.02rem}.article-body ul{padding-left:1.3rem}.article-back{display:inline-flex;margin-top:20px}
.supplier-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.supplier-card{display:flex;flex-direction:column;min-height:100%;padding:24px;border:1px solid rgba(210,162,58,.22);border-radius:18px;background:linear-gradient(155deg,rgba(18,16,12,.96),rgba(7,7,7,.98))}.supplier-card h3{margin:.2rem 0 .5rem}.supplier-card p{color:var(--muted);line-height:1.65}.supplier-card-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:12px}.supplier-worked{color:var(--gold-light);font-size:.78rem;font-weight:900}.supplier-category{font-size:.72rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-light)}
.credentials-quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.credential-quick-card{padding:25px;border:1px solid rgba(210,162,58,.24);border-radius:18px;background:linear-gradient(155deg,rgba(18,16,12,.96),rgba(7,7,7,.98))}.credential-quick-card h3{margin:.3rem 0 .7rem}.credential-quick-card p{color:var(--muted);line-height:1.65}
.resource-cta{padding:58px 0}.resource-cta-shell{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;padding:30px 32px;border:1px solid rgba(210,162,58,.34);border-radius:18px;background:linear-gradient(135deg,rgba(210,162,58,.09),rgba(8,8,8,.96) 48%)}.resource-cta-shell p{margin:0;color:var(--muted)}.resource-cta-shell h2{margin:.1rem 0 .5rem}.resource-cta-actions{display:flex;gap:10px;flex-wrap:wrap}
@media(max-width:940px){.resource-hero-grid,.resource-cta-shell{grid-template-columns:1fr}.resource-card-grid,.supplier-grid,.credentials-quick-grid{grid-template-columns:1fr 1fr}.resource-cta-actions{justify-content:flex-start}}
@media(max-width:720px){.resource-hero{padding-top:44px}.resource-card-grid,.advice-grid,.supplier-grid,.credentials-quick-grid{grid-template-columns:1fr}.song-card{grid-template-columns:1fr}.resource-hero-media img{aspect-ratio:16/11}.resource-section{padding:50px 0}.resource-cta-shell{padding:24px 22px}}

/* Build 115: compact page-specific resource heroes. */
.resource-hero{padding:clamp(36px,4.8vw,58px) 0 clamp(34px,4vw,48px)}
.resource-hero-grid{grid-template-columns:minmax(0,1.16fr) minmax(290px,.84fr);gap:clamp(26px,4vw,52px)}
.resource-hero-copy h1{font-size:clamp(2.15rem,3.9vw,3.75rem);margin-bottom:.85rem}
.resource-hero-copy>p:not(.kicker){line-height:1.65}
.resource-hero-media{width:100%;max-width:520px;justify-self:end;border-radius:18px}
.resource-hero-media img{width:100%;height:auto;aspect-ratio:16/9;max-height:292px;object-fit:cover}
@media(max-width:940px){.resource-hero-media{max-width:none;justify-self:stretch}.resource-hero-media img{max-height:360px}}
@media(max-width:720px){.resource-hero{padding:34px 0 36px}.resource-hero-media img{aspect-ratio:16/9;max-height:260px}.resource-hero-grid{gap:24px}}

/* Build 250: Wedding Advice rich article formatting. */
.article-body ol{padding-left:1.45rem}.article-body li+li{margin-top:.35rem}.article-body strong{color:var(--cream);font-weight:800}.article-body em{color:#e8dfd0}.article-body blockquote{margin:1.7rem 0;padding:1rem 1.2rem;border-left:3px solid var(--gold);background:rgba(210,162,58,.06);border-radius:0 12px 12px 0}.article-body blockquote p{margin:0;color:#e8dfd0;font-size:1.05rem}.article-body hr{border:0;border-top:1px solid rgba(210,162,58,.3);margin:2.2rem 0}.article-body a:not(.btn):not(.text-link){color:var(--gold-light);text-decoration-thickness:1px;text-underline-offset:3px}.article-body a:not(.btn):not(.text-link):hover{color:#fff0bc}

/* Build 257: Wedding Advice article pages are a full site experience, not a fixed-width document. */
.article-hero{position:relative;padding:clamp(46px,5vw,76px) 0;border-bottom:1px solid rgba(210,162,58,.2);overflow:hidden;background:radial-gradient(circle at 78% 18%,rgba(210,162,58,.16),transparent 30%),linear-gradient(180deg,#0c0a07 0%,#080808 100%)}
.article-hero::after{content:"";position:absolute;inset:auto 0 0;height:1px;background:linear-gradient(90deg,transparent,rgba(210,162,58,.6),transparent)}
.article-hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:clamp(34px,5vw,82px);align-items:center}
.article-hero-copy{min-width:0}.article-breadcrumbs{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:22px;font-size:.78rem;font-weight:800;letter-spacing:.045em;text-transform:uppercase;color:#a89d8d}.article-breadcrumbs a{color:var(--gold-light);text-decoration:none}.article-breadcrumbs a:hover{text-decoration:underline;text-underline-offset:4px}
.article-hero-copy h1{max-width:1050px;margin:.28rem 0 1rem;font-size:clamp(2.45rem,4.4vw,5.25rem);line-height:1.02}.article-hero-copy .article-lede{max-width:920px;margin:0;color:#d5cdbf;font-size:clamp(1.06rem,1.35vw,1.25rem);line-height:1.72}.article-byline{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:20px 0 0;color:#a99f91;font-size:.86rem;font-weight:700}.article-hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.article-hero-media{position:relative;margin:0;min-width:0;border:1px solid rgba(210,162,58,.32);border-radius:22px;overflow:hidden;background:#111;box-shadow:0 30px 70px rgba(0,0,0,.42)}.article-hero-media img{display:block;width:100%;height:clamp(320px,31vw,520px);object-fit:cover;object-position:center}.article-hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(0,0,0,.42));pointer-events:none}.article-hero-media figcaption{position:absolute;z-index:2;left:16px;bottom:15px;padding:7px 10px;border-radius:999px;background:rgba(0,0,0,.72);border:1px solid rgba(210,162,58,.32);color:var(--gold-light);font-size:.67rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.article-content-section{padding:clamp(48px,5.5vw,82px) 0;background:#080808}.article-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:clamp(36px,5vw,86px);align-items:start}.article-reading-column{min-width:0;max-width:980px}.article-reading-column>p:first-child{font-size:1.15rem;color:#e4dccf}.article-reading-column h2{margin:2.55rem 0 .82rem;font-size:clamp(1.75rem,2.4vw,2.55rem);line-height:1.14}.article-reading-column h3{margin:2rem 0 .65rem;font-size:clamp(1.32rem,1.7vw,1.7rem)}.article-reading-column p,.article-reading-column li{color:#d8d0c4;line-height:1.84;font-size:clamp(1.02rem,1.05vw,1.1rem)}.article-reading-column p{margin:.75rem 0 1.15rem}.article-reading-column ul,.article-reading-column ol{padding-left:1.5rem;margin:1rem 0 1.5rem}.article-reading-column li+li{margin-top:.45rem}.article-reading-column strong{color:#fff3d1}.article-reading-column blockquote{margin:2rem 0;padding:1.15rem 1.35rem;border-left:3px solid var(--gold);background:linear-gradient(90deg,rgba(210,162,58,.09),rgba(210,162,58,.025));border-radius:0 14px 14px 0}.article-reading-column blockquote p{margin:0;color:#eee4d4;font-size:1.08rem}
.article-side-rail{min-width:0}.article-side-card{border:1px solid rgba(210,162,58,.25);border-radius:18px;background:linear-gradient(160deg,rgba(20,17,12,.96),rgba(8,8,8,.98));padding:24px}.article-side-card--sticky{position:sticky;top:128px}.article-side-card h2{margin:.15rem 0 1.2rem;font-size:1.65rem}.article-side-topic{display:block;padding:15px 0;border-top:1px solid rgba(210,162,58,.14);border-bottom:1px solid rgba(210,162,58,.14);text-decoration:none}.article-side-topic span{display:block;color:#9f9587;font-size:.72rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase}.article-side-topic strong{display:block;margin-top:4px;color:var(--gold-light);font-size:1rem}.article-side-tags{display:flex;gap:7px;flex-wrap:wrap;margin:18px 0}.article-side-links{display:grid;border-top:1px solid rgba(210,162,58,.14);margin-top:18px}.article-side-links a{display:flex;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid rgba(210,162,58,.12);color:#e8dfd0;text-decoration:none;font-size:.9rem}.article-side-links a span{color:var(--gold)}.article-side-links a:hover{color:var(--gold-light)}
.article-sequence{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:48px;padding-top:28px;border-top:1px solid rgba(210,162,58,.2)}.article-sequence-link{display:flex;flex-direction:column;gap:7px;min-height:118px;padding:18px;border:1px solid rgba(210,162,58,.2);border-radius:14px;background:rgba(255,255,255,.018);text-decoration:none}.article-sequence-link span{color:var(--gold-light);font-size:.72rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase}.article-sequence-link strong{color:#f2eadc;line-height:1.35}.article-sequence-link--next{text-align:right}.article-sequence-link:hover{border-color:rgba(210,162,58,.55);background:rgba(210,162,58,.05)}
.article-related-section{padding:clamp(52px,6vw,82px) 0;background:linear-gradient(180deg,#0c0a07,#080808);border-top:1px solid rgba(210,162,58,.14);border-bottom:1px solid rgba(210,162,58,.14)}.article-related-head{max-width:900px}.article-related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.article-related-card h3{font-family:Marcellus,Georgia,serif;font-size:clamp(1.45rem,1.75vw,1.85rem);line-height:1.18;margin:.55rem 0 .7rem}.article-related-card .text-link{margin-top:auto;padding-top:14px}
.article-category-section{padding:48px 0;background:#080808}.article-category-shell{display:grid;grid-template-columns:minmax(260px,.62fr) minmax(0,1.38fr);gap:32px;align-items:center}.article-category-shell h2{margin:.15rem 0 0;font-size:clamp(1.7rem,2.3vw,2.5rem)}.article-category-links{display:flex;justify-content:flex-end;gap:9px;flex-wrap:wrap}.resource-filter-link{display:inline-flex;align-items:center;min-height:42px;padding:8px 12px;border:1px solid rgba(210,162,58,.28);border-radius:999px;color:#e8dfd0;text-decoration:none;font-size:.78rem;font-weight:800}.resource-filter-link:hover,.resource-filter-link.is-current{border-color:var(--gold);background:rgba(210,162,58,.1);color:var(--gold-light)}
.article-final-cta{padding-top:22px}.article-not-found{min-height:62vh;display:flex;align-items:center;padding:70px 0}.article-not-found-card{max-width:800px;padding:38px;border:1px solid rgba(210,162,58,.26);border-radius:20px;background:linear-gradient(150deg,rgba(210,162,58,.07),rgba(8,8,8,.98))}.article-not-found-card h1{margin:.25rem 0 .8rem}.article-not-found-card p:not(.kicker){color:var(--muted);font-size:1.08rem}
@media(max-width:1080px){.article-hero-grid{grid-template-columns:minmax(0,1fr) minmax(320px,.72fr);gap:34px}.article-layout{grid-template-columns:minmax(0,1fr) 290px;gap:34px}.article-related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.article-related-card:last-child{grid-column:span 2}}
@media(max-width:860px){.article-hero-grid,.article-layout,.article-category-shell{grid-template-columns:1fr}.article-hero-media{max-width:none}.article-side-card--sticky{position:static}.article-related-grid{grid-template-columns:1fr}.article-related-card:last-child{grid-column:auto}.article-category-links{justify-content:flex-start}}
@media(max-width:620px){.article-hero{padding:34px 0 38px}.article-hero-copy h1{font-size:clamp(2.15rem,10vw,3.4rem)}.article-hero-media img{height:260px}.article-content-section{padding:40px 0}.article-sequence{grid-template-columns:1fr}.article-sequence-link--next{text-align:left}.article-category-section{padding:40px 0}.article-side-card{padding:21px}.article-related-section{padding:46px 0}.article-hero-actions .btn{width:100%;justify-content:center}}


/* Build 258 — Wedding Advice article layout based on the approved visual direction.
   Full-depth image hero, dark reading field, warm-light guide rail and image carousel. */
.resource-page-advice .article-hero {
  position: relative;
  min-height: calc(100svh - 108px);
  padding: 0 !important;
  display: flex;
  align-items: stretch;
  overflow: hidden;
  isolation: isolate;
  background: #080808 !important;
}
.resource-page-advice .article-hero::after { display: none !important; }
.resource-page-advice .article-hero-picture,
.resource-page-advice .article-hero-background,
.resource-page-advice .article-hero-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.resource-page-advice .article-hero-picture { z-index: -3; margin: 0; }
.resource-page-advice .article-hero-background {
  display: block;
  object-fit: cover;
  object-position: 64% 45%;
  transform: scale(1.01);
}
.resource-page-advice .article-hero-shade {
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(4,4,4,.96) 0%, rgba(4,4,4,.88) 28%, rgba(4,4,4,.56) 52%, rgba(4,4,4,.18) 76%, rgba(4,4,4,.12) 100%),
    linear-gradient(180deg, rgba(0,0,0,.2) 0%, rgba(0,0,0,.06) 58%, rgba(0,0,0,.66) 100%);
}
.resource-page-advice .article-hero-grid {
  width: 100% !important;
  max-width: none !important;
  min-height: calc(100svh - 108px);
  display: flex !important;
  align-items: center !important;
  padding: clamp(70px,8vh,118px) var(--public-content-gutter,clamp(28px,4vw,72px)) clamp(92px,11vh,138px) !important;
}
.resource-page-advice .article-hero-copy {
  width: min(780px,58vw);
  max-width: 780px;
  padding: clamp(24px,3vw,44px) 0;
  text-shadow: 0 2px 18px rgba(0,0,0,.5);
}
.resource-page-advice .article-breadcrumbs { margin-bottom: 18px; color: rgba(245,237,225,.74); }
.resource-page-advice .article-hero-copy .kicker { color: #efc767; }
.resource-page-advice .article-hero-copy h1 {
  max-width: 760px;
  margin: .28rem 0 1rem;
  font-size: clamp(2.75rem,4.55vw,5.7rem);
  line-height: .99;
  text-wrap: balance;
  color: #fff8ea;
}
.resource-page-advice .article-hero-copy .article-lede {
  max-width: 700px;
  color: rgba(255,248,234,.9);
  font-size: clamp(1.06rem,1.3vw,1.25rem);
  line-height: 1.68;
}
.resource-page-advice .article-byline { color: rgba(255,248,234,.82); }
.resource-page-advice .article-hero .article-hero-scroll {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: 24px !important;
  transform: translateX(-50%) !important;
  z-index: 6 !important;
}

.resource-page-advice .article-content-section {
  padding: clamp(54px,6vw,92px) 0;
  background:
    radial-gradient(circle at 8% 8%, rgba(210,162,58,.045), transparent 28%),
    #090909;
}
.resource-page-advice .article-layout {
  width: 100% !important;
  max-width: none !important;
  grid-template-columns: minmax(0,1fr) minmax(330px,430px) !important;
  gap: clamp(38px,5.2vw,92px) !important;
  align-items: start;
}
.resource-page-advice .article-reading-column {
  width: 100%;
  max-width: 980px;
}
.resource-page-advice .article-reading-column > p:first-child {
  font-size: clamp(1.08rem,1.3vw,1.22rem);
  color: #eee5d8;
}

/* Deliberate light/dark contrast: the guide rail uses the same warm ivory family as
   the site's approved light sections. */
.resource-page-advice .article-side-card {
  padding: clamp(24px,2.4vw,34px);
  border: 1px solid rgba(178,132,38,.42);
  border-radius: 14px;
  background: linear-gradient(155deg,#f5f0e7 0%,#eee5d8 100%);
  color: #17130e;
  box-shadow: 0 24px 56px rgba(0,0,0,.28);
}
.resource-page-advice .article-side-card--sticky { top: 122px; }
.resource-page-advice .article-side-section + .article-side-section {
  margin-top: 24px;
  padding-top: 22px;
  border-top: 1px solid rgba(154,111,26,.3);
}
.resource-page-advice .article-side-section h2 {
  margin: 0 0 13px;
  color: #18130d;
  font-family: Lato,Arial,sans-serif;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.resource-page-advice .article-toc-list {
  list-style: none;
  padding: 0;
  margin: 0;
  border-left: 1px solid rgba(190,142,41,.38);
}
.resource-page-advice .article-toc-list li { margin: 0; }
.resource-page-advice .article-toc-list li + li { margin-top: 2px; }
.resource-page-advice .article-toc-list a {
  display: block;
  padding: 6px 0 6px 13px;
  color: #302a22;
  text-decoration: none;
  font-size: .85rem;
  line-height: 1.4;
}
.resource-page-advice .article-toc-list li.is-subheading a { padding-left: 26px; color: #5c5144; font-size: .8rem; }
.resource-page-advice .article-toc-list a:hover,
.resource-page-advice .article-toc-list a:focus-visible { color: #8e6414; text-decoration: underline; text-underline-offset: 3px; }
.resource-page-advice .article-side-tags { margin: 0; display: flex; gap: 8px; flex-wrap: wrap; }
.resource-page-advice .article-topic-chip {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 5px 11px;
  border: 1px solid rgba(99,78,47,.13);
  border-radius: 999px;
  background: rgba(107,84,49,.08);
  color: #30281e;
  text-decoration: none;
  font-size: .74rem;
  font-weight: 700;
}
.resource-page-advice .article-topic-chip:hover { border-color: rgba(154,111,26,.55); color: #7a5511; }
.resource-page-advice .article-side-links { margin: 0; border-top: 0; }
.resource-page-advice .article-side-links a {
  color: #241e17;
  border-bottom: 1px solid rgba(99,78,47,.14);
  font-size: .84rem;
  font-weight: 700;
}
.resource-page-advice .article-side-links a:first-child { border-top: 1px solid rgba(99,78,47,.14); }
.resource-page-advice .article-side-links a span { color: #a57417; }
.resource-page-advice .article-side-links a:hover { color: #8e6414; }

/* Related advice carousel: image-led, horizontally controlled and scroll-snap safe. */
.resource-page-advice .article-related-section {
  padding: clamp(56px,6vw,90px) 0;
  background: linear-gradient(180deg,#0d0c0a 0%,#080808 100%);
  border-top: 1px solid rgba(210,162,58,.17);
  border-bottom: 1px solid rgba(210,162,58,.17);
}
.resource-page-advice .article-related-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  max-width: none;
  margin-bottom: 24px;
}
.resource-page-advice .article-related-head h2 { margin: .1rem 0 0; font-size: clamp(2rem,2.8vw,3rem); }
.resource-page-advice .article-related-all { flex: 0 0 auto; }
.resource-page-advice .article-carousel { position: relative; padding-inline: 62px; }
.resource-page-advice .article-carousel-viewport {
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  outline: none;
}
.resource-page-advice .article-carousel-viewport::-webkit-scrollbar { display: none; }
.resource-page-advice .article-carousel-track { display: flex; gap: 18px; }
.resource-page-advice .article-carousel-card {
  flex: 0 0 calc((100% - 36px)/3);
  min-width: 0;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(210,162,58,.25);
  border-radius: 13px;
  background: rgba(255,255,255,.018);
}
.resource-page-advice .article-carousel-image {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #111;
}
.resource-page-advice .article-carousel-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform .3s ease;
}
.resource-page-advice .article-carousel-card:hover .article-carousel-image img { transform: scale(1.025); }
.resource-page-advice .article-carousel-body { display: flex; flex-direction: column; flex: 1; padding: 18px; }
.resource-page-advice .article-carousel-body h3 { margin: .45rem 0 .62rem; font-size: clamp(1.25rem,1.55vw,1.65rem); line-height: 1.16; }
.resource-page-advice .article-carousel-body h3 a { color: #f6eddf; text-decoration: none; }
.resource-page-advice .article-carousel-body h3 a:hover { color: #efc767; }
.resource-page-advice .article-carousel-body p { margin: 0 0 14px; color: #bcb2a4; line-height: 1.55; font-size: .88rem; }
.resource-page-advice .article-carousel-body .text-link { margin-top: auto; }
.resource-page-advice .article-carousel-arrow {
  position: absolute;
  top: 50%;
  width: 42px;
  height: 42px;
  margin: 0;
  padding: 0;
  transform: translateY(-70%);
  display: grid;
  place-items: center;
  border: 1px solid #d2a23a;
  border-radius: 999px;
  background: rgba(8,8,8,.96);
  color: #efc767;
  z-index: 4;
  cursor: pointer;
}
.resource-page-advice .article-carousel-arrow--prev { left: 4px; }
.resource-page-advice .article-carousel-arrow--next { right: 4px; }
.resource-page-advice .article-carousel-arrow svg { width: 22px; height: 22px; }
.resource-page-advice .article-carousel-arrow path { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.resource-page-advice .article-carousel-arrow:hover,
.resource-page-advice .article-carousel-arrow:focus-visible { background: #d2a23a; color: #080808; outline: none; }
.resource-page-advice .article-carousel-arrow:disabled { opacity: .3; cursor: default; background: rgba(8,8,8,.75); color: #efc767; }
.resource-page-advice .article-carousel-footer { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 34px; padding-top: 16px; }
.resource-page-advice .article-carousel-dots { display: flex; align-items: center; gap: 7px; }
.resource-page-advice .article-carousel-dot { width: 7px; height: 7px; padding: 0; border: 0; border-radius: 50%; background: #69635b; cursor: pointer; }
.resource-page-advice .article-carousel-dot.is-active { background: #d2a23a; }
.resource-page-advice .article-carousel-count { color: #a89e90; font-size: .72rem; font-weight: 800; min-width: 42px; text-align: center; }

@media (max-width: 1080px) {
  .resource-page-advice .article-hero { min-height: calc(100svh - 86px); }
  .resource-page-advice .article-hero-grid { min-height: calc(100svh - 86px); }
  .resource-page-advice .article-hero-copy { width: min(720px,70vw); }
  .resource-page-advice .article-layout { grid-template-columns: minmax(0,1fr) minmax(290px,360px) !important; gap: 36px !important; }
  .resource-page-advice .article-carousel-card { flex-basis: calc((100% - 18px)/2); }
}
@media (max-width: 860px) {
  .resource-page-advice .article-hero-background { object-position: 68% 45%; }
  .resource-page-advice .article-hero-shade {
    background: linear-gradient(90deg,rgba(4,4,4,.94) 0%,rgba(4,4,4,.77) 60%,rgba(4,4,4,.42) 100%),linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.68));
  }
  .resource-page-advice .article-hero-copy { width: min(680px,82vw); }
  .resource-page-advice .article-layout { grid-template-columns: 1fr !important; }
  .resource-page-advice .article-side-card--sticky { position: static; }
}
@media (max-width: 650px) {
  .resource-page-advice .article-hero { min-height: calc(100svh - 86px); }
  .resource-page-advice .article-hero-grid { min-height: calc(100svh - 86px); padding: 58px 20px 90px !important; align-items: end !important; }
  .resource-page-advice .article-hero-background { object-position: 68% center; }
  .resource-page-advice .article-hero-shade { background: linear-gradient(180deg,rgba(0,0,0,.22) 0%,rgba(0,0,0,.35) 30%,rgba(0,0,0,.92) 78%,rgba(0,0,0,.98) 100%); }
  .resource-page-advice .article-hero-copy { width: 100%; max-width: none; }
  .resource-page-advice .article-hero-copy h1 { font-size: clamp(2.25rem,11vw,3.7rem); }
  .resource-page-advice .article-carousel { padding-inline: 48px; }
  .resource-page-advice .article-carousel-card { flex-basis: 100%; }
  .resource-page-advice .article-related-head { align-items: flex-start; flex-direction: column; gap: 8px; }
  .resource-page-advice .article-carousel-arrow { width: 38px; height: 38px; }
  .resource-page-advice .article-carousel-arrow--prev { left: 0; }
  .resource-page-advice .article-carousel-arrow--next { right: 0; }
}

/* Build 348: Listen page — searchable repertoire + short performance clips. */
.resource-page-listen .listen-clips-section{background:#090909;border-top:1px solid rgba(210,162,58,.12);border-bottom:1px solid rgba(210,162,58,.12)}
.resource-page-listen .listen-section-head-row{display:flex;align-items:end;justify-content:space-between;gap:24px;max-width:none}
.resource-page-listen .listen-section-head-row>div{max-width:820px}
.resource-page-listen .listen-clip-empty strong,.resource-page-listen .listen-no-results strong{display:block;margin-bottom:6px;color:var(--cream);font-family:Marcellus,serif;font-size:1.2rem}
.resource-page-listen .listen-clip-empty p,.resource-page-listen .listen-no-results p{margin:0}
.resource-page-listen .listen-clip-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.resource-page-listen .listen-clip-card{display:flex;flex-direction:column;justify-content:space-between;gap:18px;padding:22px;border:1px solid rgba(210,162,58,.23);border-radius:18px;background:linear-gradient(155deg,rgba(18,16,12,.96),rgba(7,7,7,.98))}
.resource-page-listen .listen-clip-card h3{margin:.15rem 0 .25rem;font-size:clamp(1.28rem,1.6vw,1.7rem)}
.resource-page-listen .listen-clip-card audio{width:100%;height:42px}
.resource-page-listen .listen-song-eyebrow{margin:0 0 7px;color:var(--gold-light);font-size:.7rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.resource-page-listen .listen-song-artist{margin:0;color:var(--gold-light);font-weight:800}
.resource-page-listen .listen-song-version{margin:5px 0 0;color:#c9c0b2;font-style:italic;font-size:.88rem;line-height:1.45}
.resource-page-listen .listen-song-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:11px}
.resource-page-listen .listen-song-meta span{display:inline-flex;align-items:center;min-height:27px;padding:4px 9px;border:1px solid rgba(210,162,58,.25);border-radius:999px;color:#d8cfbf;font-size:.68rem;font-weight:800}

.resource-page-listen .listen-song-library{background:linear-gradient(180deg,#f4efe6 0%,#eee6da 100%);color:#17130e;border-color:rgba(112,79,21,.18)}
.resource-page-listen .listen-song-library .kicker{color:#9b6f1d}
.resource-page-listen .listen-song-library .resource-section-head h2{color:#17130e}
.resource-page-listen .listen-song-library .resource-section-head p{color:#5d554b}
.resource-page-listen .listen-library-toolbar{display:grid;grid-template-columns:minmax(260px,1.25fr) minmax(290px,auto) minmax(180px,.7fr) minmax(180px,.8fr) auto auto;gap:12px;align-items:end;margin:0 0 14px;padding:18px;border:1px solid rgba(107,76,22,.22);border-radius:18px;background:rgba(255,255,255,.48);box-shadow:0 10px 28px rgba(63,44,13,.06)}
.resource-page-listen .listen-library-search,.resource-page-listen .listen-library-filter{display:grid;gap:7px;min-width:0;color:#3f372d;font-size:.7rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase}
.resource-page-listen .listen-library-search input,.resource-page-listen .listen-library-filter select{width:100%;box-sizing:border-box;min-height:44px;padding:9px 13px;border:1px solid rgba(91,66,25,.3);border-radius:999px;background:#fffaf2;color:#18130d;font:600 .9rem/1.2 Lato,Arial,sans-serif;text-transform:none;letter-spacing:0;outline:none}
.resource-page-listen .listen-library-search input:focus,.resource-page-listen .listen-library-filter select:focus{border-color:#b78322;box-shadow:0 0 0 3px rgba(183,131,34,.14)}
.resource-page-listen .listen-browse-mode{display:grid;gap:7px;min-width:0}
.resource-page-listen .listen-browse-mode>span{color:#3f372d;font-size:.7rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase}
.resource-page-listen .listen-browse-buttons{display:flex;gap:7px;flex-wrap:nowrap}
.resource-page-listen .listen-browse-buttons .btn,.resource-page-listen .listen-clear-filters{min-height:44px;padding:9px 15px;border-radius:999px;border:1px solid rgba(121,86,28,.38);background:#fffaf2;color:#5d4319;white-space:nowrap}
.resource-page-listen .listen-browse-buttons .btn:hover,.resource-page-listen .listen-browse-buttons .btn:focus-visible,.resource-page-listen .listen-clear-filters:hover,.resource-page-listen .listen-clear-filters:focus-visible{background:#f2dfb7;color:#1a1308;border-color:#b78322}
.resource-page-listen .listen-browse-buttons .btn.is-active{background:#17130e;color:#efc767;border-color:#17130e}
.resource-page-listen .listen-clip-toggle{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 13px;border:1px solid rgba(121,86,28,.38);border-radius:999px;background:#fffaf2;color:#4b3818;font-size:.78rem;font-weight:900;white-space:nowrap;cursor:pointer}
.resource-page-listen .listen-clip-toggle input{width:17px;height:17px;accent-color:#9d711d}
.resource-page-listen .listen-library-status{display:flex;align-items:baseline;gap:6px;margin:0 0 12px;color:#655c50;font-size:.82rem;font-weight:700}
.resource-page-listen .listen-library-status strong{color:#18130d;font-size:1.18rem}
.resource-page-listen .listen-song-results{display:grid;gap:9px}
.resource-page-listen .listen-song-group-heading{margin:20px 0 3px;padding:0 4px 8px;border-bottom:1px solid rgba(145,103,29,.24);color:#926719;font-family:Marcellus,serif;font-size:1.28rem;line-height:1.2;text-transform:none}
.resource-page-listen .listen-song-group-heading:first-child{margin-top:4px}
.resource-page-listen .listen-song-row{display:grid;grid-template-columns:minmax(250px,1.2fr) minmax(240px,.95fr) minmax(180px,.8fr);gap:18px;align-items:center;padding:17px 18px;border:1px solid rgba(98,72,30,.17);border-radius:15px;background:rgba(255,255,255,.62);box-shadow:0 5px 16px rgba(62,43,12,.035)}
.resource-page-listen .listen-song-row[hidden]{display:none!important}
.resource-page-listen .listen-song-title-line{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.resource-page-listen .listen-song-row h3{margin:0;color:#17130e;font-size:1.06rem;line-height:1.25}
.resource-page-listen .listen-song-row .listen-song-artist{margin:3px 0 0;color:#8d6316;font-size:.86rem}
.resource-page-listen .listen-song-row .listen-song-version{color:#665e53;font-size:.78rem}
.resource-page-listen .listen-song-row .resource-sample-badge{min-height:23px;padding:3px 7px;border-color:rgba(133,94,23,.38);background:rgba(210,162,58,.09);color:#7d5712;font-size:.6rem}
.resource-page-listen .listen-song-details{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.resource-page-listen .listen-detail-chip{display:inline-flex;align-items:center;min-height:27px;padding:4px 8px;border:1px solid rgba(100,76,39,.16);border-radius:999px;background:rgba(83,63,31,.055);color:#51483d;font-size:.68rem;font-weight:800}
.resource-page-listen .listen-detail-chip--genre{border-color:rgba(166,116,25,.24);background:rgba(210,162,58,.09);color:#7d5712}
.resource-page-listen .listen-song-action{min-width:0;text-align:right}
.resource-page-listen .listen-song-action audio{width:min(100%,330px);height:38px}
.resource-page-listen .listen-no-clip{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:5px 10px;border:1px solid rgba(105,82,46,.14);border-radius:999px;color:#867c6d;font-size:.67rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.resource-page-listen .listen-no-results{margin-top:14px;border-color:rgba(126,90,27,.33);background:rgba(255,255,255,.42);color:#62594d}
.resource-page-listen .listen-no-results strong{color:#17130e}
.resource-page-listen .listen-request-shell p{max-width:820px}

@media(max-width:1220px){
  .resource-page-listen .listen-library-toolbar{grid-template-columns:minmax(250px,1.2fr) minmax(280px,auto) minmax(180px,.8fr);}
  .resource-page-listen .listen-clip-toggle,.resource-page-listen .listen-clear-filters{justify-self:start}
}
@media(max-width:940px){
  .resource-page-listen .listen-clip-grid{grid-template-columns:1fr 1fr}
  .resource-page-listen .listen-section-head-row{align-items:start;flex-direction:column}
  .resource-page-listen .listen-library-toolbar{grid-template-columns:1fr 1fr}
  .resource-page-listen .listen-song-row{grid-template-columns:minmax(0,1.1fr) minmax(220px,.9fr)}
  .resource-page-listen .listen-song-action{grid-column:1/-1;text-align:left}
}
@media(max-width:680px){
  .resource-page-listen .listen-clip-grid,.resource-page-listen .listen-library-toolbar{grid-template-columns:1fr}
  .resource-page-listen .listen-browse-buttons{flex-wrap:wrap}
  .resource-page-listen .listen-browse-buttons .btn{flex:1 1 auto}
  .resource-page-listen .listen-clip-toggle,.resource-page-listen .listen-clear-filters{justify-self:stretch;justify-content:center}
  .resource-page-listen .listen-song-row{grid-template-columns:1fr;gap:10px;padding:15px}
  .resource-page-listen .listen-song-action{grid-column:auto;text-align:left}
  .resource-page-listen .listen-song-action audio{width:100%}
  .resource-page-listen .listen-song-group-heading{margin-top:16px}
}

/* Build 349: compact Song Library with sticky browse navigation and pagination. */
.resource-page-listen .listen-library-layout{display:grid;grid-template-columns:minmax(205px,235px) minmax(0,1fr);gap:24px;align-items:start}
.resource-page-listen .listen-library-nav{position:sticky;top:92px;display:grid;gap:16px;padding:17px;border:1px solid rgba(107,76,22,.22);border-radius:18px;background:rgba(255,255,255,.58);box-shadow:0 10px 28px rgba(63,44,13,.06)}
.resource-page-listen .listen-library-nav-block{display:grid;gap:8px}
.resource-page-listen .listen-library-nav-block+.listen-library-nav-block{padding-top:14px;border-top:1px solid rgba(107,76,22,.14)}
.resource-page-listen .listen-library-nav-label{color:#3f372d;font-size:.68rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.resource-page-listen .listen-library-nav .listen-browse-buttons{display:grid;grid-template-columns:1fr;gap:7px}
.resource-page-listen .listen-library-nav .listen-browse-buttons .btn{width:100%;min-height:37px;padding:7px 11px;text-align:left}
.resource-page-listen .listen-alpha-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
.resource-page-listen .listen-alpha-nav button{display:grid;place-items:center;min-width:0;min-height:30px;padding:3px;border:1px solid rgba(121,86,28,.25);border-radius:8px;background:#fffaf2;color:#5d4319;font:800 .7rem/1 Lato,Arial,sans-serif;cursor:pointer}
.resource-page-listen .listen-alpha-nav button:hover,.resource-page-listen .listen-alpha-nav button:focus-visible,.resource-page-listen .listen-alpha-nav button.is-active{background:#17130e;color:#efc767;border-color:#17130e}
.resource-page-listen .listen-alpha-nav button:disabled{opacity:.3;cursor:default}
.resource-page-listen .listen-genre-nav{display:grid;gap:4px}
.resource-page-listen .listen-genre-nav button{width:100%;padding:5px 0;border:0;background:transparent;color:#655749;font:700 .73rem/1.25 Lato,Arial,sans-serif;text-align:left;cursor:pointer}
.resource-page-listen .listen-genre-nav button:hover,.resource-page-listen .listen-genre-nav button:focus-visible{color:#9b6f1d;text-decoration:underline;text-underline-offset:3px}
.resource-page-listen .listen-genre-nav button.is-active{color:#17130e;font-weight:900}
.resource-page-listen .listen-library-nav .listen-clip-toggle{justify-content:flex-start;min-height:38px;padding:7px 10px}
.resource-page-listen .listen-library-nav .listen-clear-filters{width:100%;min-height:38px;padding:7px 11px}
.resource-page-listen .listen-library-main{min-width:0}
.resource-page-listen .listen-library-toolbar{grid-template-columns:minmax(260px,1fr) minmax(210px,300px);gap:12px;margin:0 0 12px;padding:14px;border-radius:16px}
.resource-page-listen .listen-library-topline{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 10px}
.resource-page-listen .listen-library-status{margin:0;white-space:nowrap}
.resource-page-listen .listen-library-status [data-song-range]{color:#857968;font-size:.75rem;font-weight:700}
.resource-page-listen .listen-song-results{gap:6px}
.resource-page-listen .listen-song-row{grid-template-columns:1fr;gap:14px;min-height:52px;padding:10px 13px;border-radius:11px}
.resource-page-listen .listen-song-row.listen-song-row--clip{grid-template-columns:minmax(0,1fr) auto}
.resource-page-listen .listen-song-title-line{gap:7px;flex-wrap:nowrap}
.resource-page-listen .listen-song-row h3{min-width:0;font-size:.94rem;line-height:1.22}
.resource-page-listen .listen-song-artist-inline{color:#8d6316;font-family:Lato,Arial,sans-serif;font-size:.84em;font-weight:800}
.resource-page-listen .listen-song-compact-meta{margin:3px 0 0;color:#70675b;font-size:.7rem;font-weight:700;line-height:1.3}
.resource-page-listen .listen-song-row .resource-sample-badge{flex:0 0 auto;min-height:20px;padding:2px 6px;font-size:.55rem}
.resource-page-listen .listen-song-action{display:flex;grid-column:auto;align-items:center;justify-content:flex-end;min-width:250px}
.resource-page-listen .listen-song-action audio{width:min(280px,30vw);height:34px}
.resource-page-listen .listen-pagination{display:flex;align-items:center;justify-content:flex-end;gap:5px;min-height:34px;flex-wrap:wrap}
.resource-page-listen .listen-pagination[hidden]{display:none!important}
.resource-page-listen .listen-page-button{min-width:31px;min-height:31px;padding:5px 9px;border:1px solid rgba(121,86,28,.3);border-radius:999px;background:#fffaf2;color:#5d4319;font:800 .68rem/1 Lato,Arial,sans-serif;cursor:pointer}
.resource-page-listen .listen-page-button:hover,.resource-page-listen .listen-page-button:focus-visible{background:#f2dfb7;color:#1a1308;border-color:#b78322}
.resource-page-listen .listen-page-button.is-current{background:#17130e;color:#efc767;border-color:#17130e;cursor:default}
.resource-page-listen .listen-page-button:disabled{opacity:.35;cursor:default}
.resource-page-listen .listen-page-ellipsis{display:inline-grid;place-items:center;min-width:20px;color:#86765f;font-weight:900}
.resource-page-listen .listen-pagination--bottom{margin-top:12px}

@media(max-width:1020px){
  .resource-page-listen .listen-library-layout{grid-template-columns:1fr}
  .resource-page-listen .listen-library-nav{position:static;grid-template-columns:1fr 1fr;align-items:start}
  .resource-page-listen .listen-library-nav-block+.listen-library-nav-block{padding-top:0;border-top:0}
  .resource-page-listen .listen-genre-nav{grid-template-columns:1fr 1fr;column-gap:14px}
  .resource-page-listen .listen-alpha-nav{grid-template-columns:repeat(9,minmax(0,1fr))}
}
@media(max-width:760px){
  .resource-page-listen .listen-library-nav{grid-template-columns:1fr}
  .resource-page-listen .listen-library-toolbar{grid-template-columns:1fr}
  .resource-page-listen .listen-library-topline{align-items:flex-start;flex-direction:column}
  .resource-page-listen .listen-pagination{justify-content:flex-start}
  .resource-page-listen .listen-alpha-nav{grid-template-columns:repeat(7,minmax(0,1fr))}
  .resource-page-listen .listen-song-row{grid-template-columns:1fr;gap:7px;padding:10px 11px}
  .resource-page-listen .listen-song-title-line{align-items:flex-start;flex-wrap:wrap}
  .resource-page-listen .listen-song-action{justify-content:flex-start;min-width:0}
  .resource-page-listen .listen-song-action audio{width:100%;height:34px}
}
@media(max-width:480px){
  .resource-page-listen .listen-genre-nav{grid-template-columns:1fr}
  .resource-page-listen .listen-alpha-nav{grid-template-columns:repeat(6,minmax(0,1fr))}
  .resource-page-listen .listen-page-button{padding-inline:8px}
}


/* Build 354: visibly separate alternate backing/artist versions without duplicating database records. */
.resource-page-listen .listen-version-key{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 10px}
.resource-page-listen .listen-version-key-item{display:inline-flex;align-items:center;gap:6px;color:#746a5d;font-size:.66rem;font-weight:800;line-height:1.2}
.resource-page-listen .listen-version-key-item i{display:block;width:15px;height:9px;border:1px solid rgba(113,80,26,.2);border-radius:3px}
.resource-page-listen .listen-version-key-item--backing i{background:#fff1d1;border-color:rgba(170,118,24,.32)}
.resource-page-listen .listen-version-key-item--artist i{background:#ece4d8;border-color:rgba(105,78,42,.3)}
.resource-page-listen .listen-song-row--variant{box-shadow:inset 3px 0 0 rgba(174,122,27,.42),0 5px 16px rgba(62,43,12,.035)}
.resource-page-listen .listen-song-row--variant-backing{background:linear-gradient(90deg,rgba(255,241,209,.92),rgba(255,251,242,.82));border-color:rgba(170,118,24,.28)}
.resource-page-listen .listen-song-row--variant-artist{background:linear-gradient(90deg,rgba(236,228,216,.98),rgba(250,246,239,.86));border-color:rgba(105,78,42,.25);box-shadow:inset 3px 0 0 rgba(111,82,43,.42),0 5px 16px rgba(62,43,12,.035)}
.resource-page-listen .listen-song-row--variant-backing.listen-song-row--variant-artist{background:linear-gradient(90deg,rgba(246,230,196,.96),rgba(239,231,219,.9));box-shadow:inset 3px 0 0 rgba(145,101,28,.52),0 5px 16px rgba(62,43,12,.035)}
.resource-page-listen .listen-version-badge{display:inline-flex;align-items:center;min-height:19px;padding:2px 6px;border:1px solid transparent;border-radius:999px;font:800 .53rem/1 Lato,Arial,sans-serif;letter-spacing:.035em;text-transform:uppercase;white-space:nowrap}
.resource-page-listen .listen-version-badge--backing{background:rgba(255,248,230,.88);border-color:rgba(170,118,24,.3);color:#795716}
.resource-page-listen .listen-version-badge--artist{background:rgba(250,247,241,.84);border-color:rgba(105,78,42,.28);color:#665035}
.resource-page-listen .listen-library-status [data-song-title-count]{color:#857968;font-size:.75rem;font-weight:700}
@media(max-width:760px){
  .resource-page-listen .listen-version-key{gap:6px 10px}
  .resource-page-listen .listen-version-key-item{font-size:.62rem}
}


/* Build 357: subtle public indicator that a private Admin backing-track source exists. */
.resource-page-listen .listen-backing-availability{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;width:21px;height:21px;border:1px solid rgba(145,101,28,.34);border-radius:999px;background:rgba(210,162,58,.11);color:#8a6117}
.resource-page-listen .listen-backing-availability svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.resource-page-listen .listen-version-key-item--available{gap:6px}
.resource-page-listen .listen-version-key-item--available .listen-backing-availability{width:21px;height:21px}

/* Build 374: richer Listen filtering, durations, suggested uses, enquiries and video links. */
.resource-page-listen .listen-hero-note{max-width:760px;padding:12px 14px;border-left:3px solid var(--gold);border-radius:0 10px 10px 0;background:rgba(210,162,58,.08);color:#ddd3c4}
.resource-page-listen .listen-library-toolbar{grid-template-columns:minmax(260px,1fr) minmax(190px,260px) minmax(210px,300px)}
.resource-page-listen .listen-active-filter{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 10px;padding:8px 10px;border:1px solid rgba(151,105,25,.24);border-radius:10px;background:#fff7e8;color:#5d5142;font-size:.7rem;font-weight:800}
.resource-page-listen .listen-active-filter[hidden]{display:none!important}
.resource-page-listen .listen-active-filter strong{color:#6e4b0f}
.resource-page-listen .listen-active-filter button{padding:0;border:0;background:transparent;color:#8a6117;font:800 .7rem/1.2 Lato,Arial,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.resource-page-listen .listen-inline-filter,.resource-page-listen .listen-meta-filter,.resource-page-listen .listen-song-chip-row button{padding:0;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer}
.resource-page-listen .listen-inline-filter:hover,.resource-page-listen .listen-inline-filter:focus-visible,.resource-page-listen .listen-meta-filter:hover,.resource-page-listen .listen-meta-filter:focus-visible{color:#9b6f1d;text-decoration:underline;text-underline-offset:3px}
.resource-page-listen .listen-song-artist-inline .listen-inline-filter{color:#8d6316;font-weight:800}
.resource-page-listen .listen-meta-filter{color:#8a6117;font-weight:850}
.resource-page-listen .listen-song-chip-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:5px}
.resource-page-listen .listen-song-chip-row>span{margin-right:2px;color:#756b5d;font-size:.58rem;font-weight:900;letter-spacing:.045em;text-transform:uppercase}
.resource-page-listen .listen-song-chip-row button{display:inline-flex;align-items:center;min-height:20px;padding:2px 6px;border:1px solid rgba(120,91,45,.18);border-radius:999px;background:rgba(255,255,255,.48);color:#625542;font-size:.6rem;font-weight:800}
.resource-page-listen .listen-song-chip-row--uses button{border-color:rgba(167,117,27,.28);background:rgba(210,162,58,.10);color:#765313}
.resource-page-listen .listen-song-chip-row button:hover,.resource-page-listen .listen-song-chip-row button:focus-visible{border-color:#a87922;background:#f3dfb5;color:#2d2416}
.resource-page-listen .listen-song-video-links{display:inline-flex;align-items:center;gap:5px;flex-wrap:wrap;margin-left:2px}
.resource-page-listen .listen-video-link{display:inline-grid;place-items:center;width:27px;height:27px;border:1px solid rgba(105,82,46,.22);border-radius:999px;background:#fffaf2;color:#5d4319;text-decoration:none;flex:0 0 auto}.resource-page-listen .listen-video-link svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.resource-page-listen .listen-video-link--youtube svg path:first-child,.resource-page-listen .listen-video-link--facebook svg path{fill:currentColor;stroke:none}.resource-page-listen .listen-video-link .listen-video-icon-fill{fill:currentColor;stroke:none}
.resource-page-listen .listen-video-link:hover,.resource-page-listen .listen-video-link:focus-visible{border-color:#a87922;background:#17130e;color:#efc767}
.resource-page-listen .listen-song-row.listen-song-row--clip{grid-template-columns:minmax(0,1fr) minmax(250px,auto)}
.resource-page-listen .listen-song-secondary-actions{display:grid;gap:6px;justify-items:end;min-width:0}
.resource-page-listen .listen-song-action{display:grid;gap:2px;justify-items:end;min-width:250px}
.resource-page-listen .listen-song-action small{color:#7e756a;font-size:.6rem;font-weight:800}
.resource-page-listen .listen-song-enquiry-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.resource-page-listen .listen-song-enquiry-actions a{color:#7a5717;font-size:.62rem;font-weight:850;text-decoration:underline;text-underline-offset:3px}
.resource-page-listen .listen-song-enquiry-actions a:hover,.resource-page-listen .listen-song-enquiry-actions a:focus-visible{color:#17130e}
@media(max-width:1020px){.resource-page-listen .listen-library-toolbar{grid-template-columns:1fr 1fr}.resource-page-listen .listen-library-toolbar .listen-library-search{grid-column:1/-1}}
@media(max-width:760px){.resource-page-listen .listen-library-toolbar{grid-template-columns:1fr}.resource-page-listen .listen-library-toolbar .listen-library-search{grid-column:auto}.resource-page-listen .listen-song-row.listen-song-row--clip{grid-template-columns:1fr}.resource-page-listen .listen-song-secondary-actions{justify-items:start}.resource-page-listen .listen-song-action{justify-items:start;min-width:0;width:100%}.resource-page-listen .listen-song-enquiry-actions{justify-content:flex-start}}

/* Build 375: make repertoire metadata self-explanatory and keep durations
   visible even before a public audio snippet has been uploaded. */
.resource-page-listen .listen-song-detail-row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:8px;margin-top:5px}
.resource-page-listen .listen-song-detail-label{padding-top:3px;color:#756b5d;font-size:.58rem;font-weight:900;letter-spacing:.045em;text-transform:uppercase;white-space:nowrap}
.resource-page-listen .listen-song-detail-values{display:flex;align-items:center;gap:5px;flex-wrap:wrap;min-width:0}
.resource-page-listen .listen-song-detail-values>span,.resource-page-listen .listen-song-detail-values>.listen-meta-filter{display:inline-flex;align-items:center;min-height:20px;padding:2px 6px;border:1px solid rgba(120,91,45,.18);border-radius:999px;background:rgba(255,255,255,.48);color:#625542;font-size:.6rem;font-weight:800;line-height:1.2}
.resource-page-listen .listen-song-detail-values>.listen-meta-filter{cursor:pointer}
.resource-page-listen .listen-song-detail-values>.listen-meta-filter:hover,.resource-page-listen .listen-song-detail-values>.listen-meta-filter:focus-visible{border-color:#a87922;background:#f3dfb5;color:#2d2416}
.resource-page-listen .listen-song-detail-values>.listen-song-duration{border-color:rgba(44,111,82,.2);background:rgba(50,144,101,.08);color:#285f49}
.resource-page-listen .listen-song-detail-values>.listen-song-duration--snippet{border-color:rgba(167,117,27,.26);background:rgba(210,162,58,.1);color:#765313}
@media(max-width:640px){.resource-page-listen .listen-song-detail-row{grid-template-columns:1fr;gap:3px}.resource-page-listen .listen-song-detail-label{padding-top:0}}

/* Build 377: true lazy repertoire pages, compact metadata and visible filter reset. */
.resource-page-listen .listen-library-search-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
.resource-page-listen .listen-search-clear{min-height:44px;padding:9px 14px;border:1px solid rgba(121,86,28,.38);border-radius:999px;background:#fffaf2;color:#5d4319;font:850 .72rem/1 Lato,Arial,sans-serif;letter-spacing:0;text-transform:none;white-space:nowrap;cursor:pointer}
.resource-page-listen .listen-search-clear:hover,.resource-page-listen .listen-search-clear:focus-visible{background:#f2dfb7;color:#1a1308;border-color:#b78322;outline:none}
.resource-page-listen .listen-song-chips-line{display:flex;align-items:flex-start;gap:5px 14px;flex-wrap:wrap;margin-top:5px}
.resource-page-listen .listen-song-chips-line .listen-song-chip-row{margin-top:0}
.resource-page-listen .listen-meta-filter--backing{border-color:rgba(167,117,27,.28)!important;background:rgba(210,162,58,.10)!important;color:#765313!important}
.resource-page-listen .listen-library-loading{margin:8px 0;padding:9px 12px;border:1px solid rgba(151,105,25,.2);border-radius:10px;background:rgba(255,250,242,.72);color:#695b48;font-size:.72rem;font-weight:800}
.resource-page-listen .listen-library-loading[hidden]{display:none!important}
.resource-page-listen .listen-song-results.is-loading{opacity:.6;pointer-events:none;transition:opacity .12s ease}
@media(max-width:560px){.resource-page-listen .listen-library-search-row{grid-template-columns:1fr}.resource-page-listen .listen-search-clear{justify-self:start;min-height:38px;padding:7px 12px}}

/* Build 378: consolidated song cards + curated Featured song snippets. */
.resource-page-listen .listen-featured-grid{display:grid;grid-template-columns:1fr;gap:14px}
.resource-page-listen .listen-featured-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,440px);gap:24px;align-items:center;padding:18px 20px;border:1px solid rgba(210,162,58,.23);border-radius:16px;background:linear-gradient(155deg,rgba(18,16,12,.96),rgba(7,7,7,.98))}
.resource-page-listen .listen-featured-card h3{margin:0 0 3px;color:var(--cream);font-size:1.18rem;line-height:1.25}
.resource-page-listen .listen-featured-card .listen-song-artist{font-size:.78rem}
.resource-page-listen .listen-featured-player{display:grid;gap:4px;width:100%;justify-self:end}
.resource-page-listen .listen-featured-player small{color:#bdb3a4;font-size:.62rem;font-weight:800;letter-spacing:.02em}
.resource-page-listen .listen-featured-player audio{display:none}
.resource-page-listen .listen-version-key--compact{align-items:center;justify-content:flex-start;gap:8px 16px;padding:7px 0}
.resource-page-listen .listen-version-key-copy{color:#776e62;font-size:.66rem;font-weight:700}

/* One musical version = one public row. Backing choices and discovery metadata
   wrap inside that row rather than multiplying the title across the page. */
.resource-page-listen .listen-song-row{grid-template-columns:minmax(0,1fr);gap:9px;align-items:start;padding:13px 15px}
.resource-page-listen .listen-song-row.listen-song-row--clip{grid-template-columns:minmax(0,1fr) minmax(235px,285px);align-items:center}
.resource-page-listen .listen-song-main{min-width:0}
.resource-page-listen .listen-song-info-line{display:flex;align-items:center;gap:5px 12px;flex-wrap:wrap;margin-top:5px;min-width:0}
.resource-page-listen .listen-song-info-line .listen-song-chip-row{margin-top:0}
.resource-page-listen .listen-song-chip-row--descriptors>button:first-child{border-color:rgba(105,82,46,.24);background:rgba(250,247,241,.9);color:#594b39}
.resource-page-listen .listen-song-chip-row--backings button{border-color:rgba(167,117,27,.3);background:rgba(210,162,58,.11);color:#765313}
.resource-page-listen .listen-song-plain-meta{display:inline-flex;align-items:center;min-height:20px;padding:2px 2px;color:#756b5d;font-size:.6rem;font-weight:800;white-space:nowrap}
.resource-page-listen .listen-song-more-uses{position:relative;display:inline-flex;align-items:center}
.resource-page-listen .listen-song-more-uses summary{list-style:none;display:inline-flex;align-items:center;min-height:20px;padding:2px 7px;border:1px dashed rgba(167,117,27,.34);border-radius:999px;background:rgba(255,255,255,.38);color:#765313;font-size:.6rem;font-weight:850;cursor:pointer}
.resource-page-listen .listen-song-more-uses summary::-webkit-details-marker{display:none}
.resource-page-listen .listen-song-more-uses[open]{flex-basis:100%;margin-left:0}
.resource-page-listen .listen-song-more-uses>span{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:5px}
.resource-page-listen .listen-song-secondary-actions{align-self:center}
.resource-page-listen .listen-song-action{min-width:235px}
.resource-page-listen .listen-song-action audio{display:none}

/* Build 389: keep stored song/snippet durations on the title line and label Genre consistently. */
.resource-page-listen .listen-song-title-durations{display:inline-flex;align-items:center;gap:5px;flex:0 0 auto;color:#756b5d;font-size:.62rem;font-weight:800;line-height:1.15;white-space:nowrap}
.resource-page-listen .listen-song-chip-row--genre button{border-color:rgba(105,82,46,.24);background:rgba(250,247,241,.9);color:#594b39}
@media(max-width:760px){.resource-page-listen .listen-song-title-durations{font-size:.6rem}}

@media(max-width:880px){
  .resource-page-listen .listen-featured-card{grid-template-columns:1fr;gap:12px}
  .resource-page-listen .listen-featured-player{justify-self:stretch}
}
@media(max-width:760px){
  .resource-page-listen .listen-song-row.listen-song-row--clip{grid-template-columns:1fr}
  .resource-page-listen .listen-song-action{min-width:0;width:100%}
}

/* Build 390: normalise Listen metadata pill spacing and interaction states.
   Genre and tag pills are separate metadata groups, but every clickable pill
   now uses the same hover/focus treatment with no inherited underline. */
.resource-page-listen .listen-song-info-line{column-gap:12px;row-gap:5px}
.resource-page-listen .listen-song-chip-row{gap:5px}
.resource-page-listen .listen-song-chip-row .listen-meta-filter:hover,
.resource-page-listen .listen-song-chip-row .listen-meta-filter:focus-visible,
.resource-page-listen .listen-song-chip-row button:hover,
.resource-page-listen .listen-song-chip-row button:focus-visible,
.resource-page-listen .listen-song-chip-row--descriptors>button:first-child:hover,
.resource-page-listen .listen-song-chip-row--descriptors>button:first-child:focus-visible,
.resource-page-listen .listen-song-chip-row--genre button:hover,
.resource-page-listen .listen-song-chip-row--genre button:focus-visible{
  border-color:#a87922;
  background:#f3dfb5;
  color:#2d2416;
  text-decoration:none;
}

/* Build 393: Browse by uses its original sticky positioning and natural height.
   Wheel/trackpad input is intentionally not captured here: hovering the card
   scrolls the document normally, so the visitor can continue through the full page. */

/* Build 397: server-rendered page links share the existing pagination styling. */
.listen-pagination a.listen-page-button,.listen-pagination span.listen-page-button { display:inline-flex;align-items:center;justify-content:center;text-decoration:none; }
.listen-pagination .listen-page-button[aria-disabled="true"] { opacity:.45;cursor:default; }
.listen-pagination a.listen-page-button:focus-visible { outline:2px solid currentColor;outline-offset:3px; }


/* P30Y: collapse Featured snippets to one visual line on wide desktop.
   Genre, title, artist, duration summary and player stay aligned horizontally;
   existing two-column/stacked responsive behaviour remains below desktop width. */
@media(min-width:1180px){
  .resource-page-listen .listen-featured-card{grid-template-columns:minmax(0,1.35fr) minmax(500px,.9fr);gap:28px;padding:13px 20px}
  .resource-page-listen .listen-featured-copy{display:grid;grid-template-columns:minmax(130px,.72fr) minmax(190px,1.15fr) minmax(170px,1fr);gap:18px;align-items:center;min-width:0}
  .resource-page-listen .listen-featured-copy .listen-song-eyebrow,
  .resource-page-listen .listen-featured-copy h3,
  .resource-page-listen .listen-featured-copy .listen-song-artist{margin:0;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .resource-page-listen .listen-featured-card h3{font-size:1.02rem;line-height:1.2}
  .resource-page-listen .listen-featured-card .listen-song-artist{font-size:.74rem}
  .resource-page-listen .listen-featured-player{grid-template-columns:auto auto;gap:14px;align-items:center;justify-content:end}
  .resource-page-listen .listen-featured-player small{white-space:nowrap}
}

/* P30Z: compact Listen audio controls. Native browser players are replaced by
   large, predictable Play / Pause / Stop buttons. Starting one snippet stops
   and rewinds any other snippet already playing. */
.resource-page-listen .listen-audio-controls{display:inline-flex;align-items:center;justify-content:flex-end;gap:7px;white-space:nowrap}
.resource-page-listen .listen-audio-controls audio{display:none!important}
.resource-page-listen .listen-audio-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:72px;min-height:42px;padding:0 11px;border:1px solid rgba(168,121,34,.45);border-radius:10px;background:#fffaf2;color:#4c3919;font:850 .7rem/1 Lato,Arial,sans-serif;letter-spacing:.01em;cursor:pointer;transition:background .14s ease,border-color .14s ease,color .14s ease,transform .14s ease}
.resource-page-listen .listen-audio-button>span:first-child{font-size:.9rem;line-height:1}
.resource-page-listen .listen-audio-button:hover,.resource-page-listen .listen-audio-button:focus-visible{background:#f1ddae;border-color:#b78322;color:#21170a;outline:none;transform:translateY(-1px)}
.resource-page-listen .listen-audio-button[aria-pressed="true"]{background:#d7ad4b;border-color:#d7ad4b;color:#15100a}
.resource-page-listen .listen-featured-card .listen-audio-button{background:#2f2f2f;border-color:rgba(210,162,58,.45);color:#f7f0df}
.resource-page-listen .listen-featured-card .listen-audio-button:hover,.resource-page-listen .listen-featured-card .listen-audio-button:focus-visible{background:#44403a;border-color:#d2a23a;color:#fff7df}
.resource-page-listen .listen-featured-card .listen-audio-button[aria-pressed="true"]{background:#d2a23a;border-color:#d2a23a;color:#17110a}
.resource-page-listen .listen-song-action{min-width:230px}
.resource-page-listen .listen-song-action .listen-audio-controls{width:100%;justify-content:flex-end}
@media(max-width:760px){.resource-page-listen .listen-audio-controls{justify-content:flex-start;flex-wrap:wrap}.resource-page-listen .listen-song-action .listen-audio-controls{justify-content:flex-start}.resource-page-listen .listen-audio-button{min-width:70px}}


/* P31A: one canonical public song can contain several artist/arrangement
   versions and several exact backing snippets without duplicating the title. */
.resource-page-listen .listen-song-row.listen-song-row--versions{align-items:start}
.resource-page-listen .listen-song-version-list{display:flex;align-items:flex-start;gap:6px;min-width:0}
.resource-page-listen .listen-song-version-list>span{padding-top:3px;color:#6e6253;font-size:.58rem;font-weight:900;text-transform:uppercase;letter-spacing:.035em;white-space:nowrap}
.resource-page-listen .listen-song-version-list>div{display:flex;gap:5px;flex-wrap:wrap;min-width:0}
.resource-page-listen .listen-song-version-chip{display:inline-flex;align-items:center;gap:5px;min-height:22px;padding:3px 7px;border:1px solid rgba(112,82,42,.22);border-radius:999px;background:rgba(249,245,237,.9);color:#4f4437;font-size:.59rem;line-height:1.15}
.resource-page-listen .listen-song-version-chip strong{font-weight:850}.resource-page-listen .listen-song-version-chip small{color:#80601f;font-size:inherit;font-weight:750}
.resource-page-listen .listen-song-snippet-stack{display:grid;gap:7px;justify-items:end;width:100%}
.resource-page-listen .listen-song-snippet-stack .listen-song-action{display:grid;grid-template-columns:minmax(82px,1fr) auto;gap:8px;align-items:center;width:100%;min-width:0}
.resource-page-listen .listen-song-snippet-stack .listen-song-action>small{max-width:145px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}
.resource-page-listen .listen-song-row.listen-song-row--clip{grid-template-columns:minmax(0,1fr) minmax(310px,390px)}
@media(max-width:900px){.resource-page-listen .listen-song-row.listen-song-row--clip{grid-template-columns:1fr}.resource-page-listen .listen-song-secondary-actions,.resource-page-listen .listen-song-snippet-stack{justify-items:start}.resource-page-listen .listen-song-snippet-stack .listen-song-action{grid-template-columns:1fr;justify-items:start}.resource-page-listen .listen-song-snippet-stack .listen-song-action>small{max-width:none;text-align:left}}
@media(max-width:600px){.resource-page-listen .listen-song-version-list{display:grid}.resource-page-listen .listen-song-version-chip{border-radius:8px;white-space:normal}}

/* P31B: compact Featured copy without hiding long version/artist context.
   The desktop card remains horizontal, but title and artist may use two short
   lines instead of being chopped with an ellipsis. */
@media(min-width:1180px){
  .resource-page-listen .listen-featured-copy{grid-template-columns:minmax(115px,.62fr) minmax(180px,1fr) minmax(210px,1.2fr);gap:14px}
  .resource-page-listen .listen-featured-copy .listen-song-eyebrow{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.66rem}
  .resource-page-listen .listen-featured-copy h3,
  .resource-page-listen .listen-featured-copy .listen-song-artist{white-space:normal;text-overflow:clip;overflow:hidden;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
  .resource-page-listen .listen-featured-card h3{font-size:.9rem;line-height:1.16}
  .resource-page-listen .listen-featured-card .listen-song-artist{font-size:.68rem;line-height:1.18}
  .resource-page-listen .listen-featured-player{gap:10px}
  .resource-page-listen .listen-featured-player small{font-size:.58rem;line-height:1.2;white-space:normal;max-width:210px;text-align:right}
}
.resource-page-listen .listen-song-snippet-stack .listen-song-action>small{max-width:190px;white-space:normal;line-height:1.18;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}

/* P31C: keep the Featured row compact but make long titles/version labels readable. */
@media(min-width:1180px){
  .resource-page-listen .listen-featured-copy{grid-template-columns:minmax(105px,.58fr) minmax(175px,.95fr) minmax(200px,1.12fr);gap:12px}
  .resource-page-listen .listen-featured-copy .listen-song-eyebrow{font-size:.61rem;line-height:1.15}
  .resource-page-listen .listen-featured-card h3{font-size:.82rem;line-height:1.15}
  .resource-page-listen .listen-featured-card .listen-song-artist{font-size:.62rem;line-height:1.18}
  .resource-page-listen .listen-featured-player small{font-size:.54rem;line-height:1.2;max-width:235px;overflow-wrap:anywhere}
}


/* P31F - public canonical song version count */
.resource-page-listen .listen-song-version-total{display:inline-flex;align-items:center;margin-left:7px;padding:2px 7px;border:1px solid rgba(194,139,32,.36);border-radius:999px;background:rgba(194,139,32,.08);color:#8d6316;font-family:Lato,Arial,sans-serif;font-size:.62rem;font-weight:850;line-height:1.2;vertical-align:middle;white-space:nowrap}
@media(max-width:760px){.resource-page-listen .listen-song-version-total{margin-left:4px;font-size:.59rem}}


/* P31G: the shared late button layer made the Listen Browse-by controls gold
   on cream. Keep the pill layout, but restore strong readable contrast and a
   very obvious selected mode. */
html body.resource-page-listen .listen-library-nav .listen-browse-buttons .btn{
  min-height:42px!important;
  padding:9px 14px!important;
  border:2px solid #a9781f!important;
  background:#fffaf0!important;
  color:#3f2c0b!important;
  font-size:.78rem!important;
  font-weight:900!important;
  letter-spacing:.075em!important;
  box-shadow:0 1px 0 rgba(86,59,13,.04)!important;
}
html body.resource-page-listen .listen-library-nav .listen-browse-buttons .btn.is-active,
html body.resource-page-listen .listen-library-nav .listen-browse-buttons .btn[aria-pressed="true"]{
  border-color:#17130e!important;
  background:#17130e!important;
  color:#f3cf78!important;
  box-shadow:0 0 0 2px rgba(210,162,58,.24)!important;
}
@media (hover:hover) and (pointer:fine){
  html body.resource-page-listen .listen-library-nav .listen-browse-buttons .btn:not(.is-active):not([aria-pressed="true"]):hover{
    border-color:#8b6116!important;
    background:#f3dfb5!important;
    color:#241807!important;
  }
}
.resource-page-listen .listen-library-status [data-song-version-summary]{color:#857968;font-size:.75rem;font-weight:700}

/* P31T50 source: assets/css/credentials.css */
.credentials-page{background:#050505;color:#f5f1e8}
.credentials-hero{position:relative;overflow:hidden;padding:clamp(64px,8vw,112px) 0 58px;background:radial-gradient(circle at 78% 26%,rgba(210,162,58,.17),transparent 30%),linear-gradient(180deg,#090806 0%,#050505 100%);border-bottom:1px solid rgba(210,162,58,.22)}
.credentials-hero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:clamp(32px,6vw,78px);align-items:center}
.credentials-hero h1{max-width:760px;margin:.2rem 0 1rem;font-size:clamp(2.55rem,5vw,5rem);line-height:.98}
.credentials-hero-copy>p:not(.kicker){max-width:760px;color:#d5cec0;font-size:clamp(1.02rem,1.6vw,1.2rem);line-height:1.75}
.credentials-document-stack{position:relative;min-height:330px;display:grid;place-items:center}
.credentials-sheet{position:absolute;width:min(78%,330px);aspect-ratio:4/5;border:1px solid rgba(244,210,124,.56);border-radius:18px;background:linear-gradient(145deg,rgba(20,18,14,.98),rgba(8,8,8,.98));box-shadow:0 28px 70px rgba(0,0,0,.45)}
.credentials-sheet:nth-child(1){transform:translate(-38px,18px) rotate(-7deg);opacity:.52}.credentials-sheet:nth-child(2){transform:translate(34px,4px) rotate(7deg);opacity:.72}.credentials-sheet--front{position:relative;transform:none!important;opacity:1!important;padding:36px 30px;display:flex;flex-direction:column;justify-content:space-between}
.credentials-sheet-mark{width:68px;height:68px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold-light)}
.credentials-sheet-mark svg{width:34px;height:34px;stroke:currentColor;fill:none;stroke-width:1.6}
.credentials-sheet-lines{display:grid;gap:10px}.credentials-sheet-lines i{display:block;height:2px;background:linear-gradient(90deg,rgba(244,210,124,.8),rgba(244,210,124,.08));border-radius:99px}.credentials-sheet-lines i:nth-child(2){width:74%}.credentials-sheet-lines i:nth-child(3){width:88%}.credentials-sheet-lines i:nth-child(4){width:62%}
.credentials-sheet-label{font-family:Marcellus,Georgia,serif;color:var(--gold-light);font-size:1.25rem;letter-spacing:.04em}
.credentials-intro{padding:58px 0 28px}.credentials-intro-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.55fr);gap:36px;align-items:start}.credentials-intro h2,.credentials-documents h2,.credentials-access h2{margin:.25rem 0 1rem;font-size:clamp(2rem,3.4vw,3rem)}.credentials-intro p{color:#d0c9bc;line-height:1.75;max-width:820px}
.credentials-intro-note{padding:22px 24px;border:1px solid rgba(210,162,58,.3);border-radius:16px;background:rgba(210,162,58,.06)}.credentials-intro-note strong{display:block;color:var(--gold-light);margin-bottom:7px}.credentials-intro-note p{margin:0;font-size:.95rem}
.credentials-documents{padding:22px 0 62px}.credentials-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.credential-card{display:flex;flex-direction:column;min-height:100%;padding:28px;border:1px solid rgba(210,162,58,.24);border-radius:18px;background:linear-gradient(160deg,rgba(18,16,12,.96),rgba(8,8,8,.96));box-shadow:0 16px 38px rgba(0,0,0,.18)}.credential-card-icon{width:58px;height:58px;border-radius:14px;border:1px solid rgba(210,162,58,.4);display:grid;place-items:center;color:var(--gold-light);background:#090909}.credential-card-icon svg{width:30px;height:30px;stroke:currentColor;fill:none;stroke-width:1.7}.credential-card-badge{display:inline-flex;align-self:flex-start;margin:20px 0 10px;padding:6px 10px;border:1px solid rgba(210,162,58,.25);border-radius:999px;color:var(--gold-light);font-size:.7rem;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.credential-card h3{font-family:Marcellus,Georgia,serif;font-size:1.62rem;margin:.15rem 0 .8rem;color:#fff}.credential-card p{color:#cfc8bb;line-height:1.68;margin:0 0 22px}.credential-card .btn{margin-top:auto;align-self:flex-start}.credential-card--controlled{border-color:rgba(244,210,124,.38)}
.credentials-access{padding:58px 0;background:#0b0907;border-top:1px solid rgba(210,162,58,.14);border-bottom:1px solid rgba(210,162,58,.14)}.credentials-access-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:44px;align-items:start}.credentials-access-copy p{color:#d0c9bc;line-height:1.75}.credentials-access-list{display:grid;gap:14px}.credentials-access-row{display:grid;grid-template-columns:44px 1fr;gap:15px;padding:18px;border:1px solid rgba(210,162,58,.18);border-radius:14px;background:rgba(255,255,255,.018)}.credentials-access-row span{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(210,162,58,.08);color:var(--gold-light);font-weight:900}.credentials-access-row strong{display:block;color:#fff;margin-bottom:4px}.credentials-access-row p{margin:0;color:#beb7ab;font-size:.94rem;line-height:1.58}
.credentials-venue-cta{padding:64px 0}.credentials-venue-shell{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:30px;align-items:center;padding:32px 34px;border:1px solid rgba(210,162,58,.35);border-radius:18px;background:linear-gradient(135deg,rgba(210,162,58,.1),rgba(9,9,9,.96) 42%)}.credentials-venue-shell h2{margin:.1rem 0 .55rem;font-size:clamp(1.8rem,3vw,2.6rem)}.credentials-venue-shell p{margin:0;color:#d0c9bc;line-height:1.65}.credentials-venue-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:920px){.credentials-hero-grid,.credentials-intro-grid,.credentials-access-grid,.credentials-venue-shell{grid-template-columns:1fr}.credentials-document-stack{min-height:280px}.credentials-grid{grid-template-columns:1fr}.credentials-venue-actions{justify-content:flex-start}}
@media(max-width:620px){.credentials-hero{padding-top:50px}.credentials-document-stack{min-height:235px}.credentials-sheet{width:210px}.credentials-sheet--front{padding:24px}.credential-card{padding:22px}.credentials-venue-shell{padding:25px 22px}.credentials-venue-actions .btn{width:100%}}

/* Build 100: dedicated credentials/document request form */
.credentials-request{padding:64px 0;background:linear-gradient(180deg,#070604 0%,#0b0907 100%);border-top:1px solid rgba(210,162,58,.14);border-bottom:1px solid rgba(210,162,58,.14)}
.credentials-request-shell{max-width:1120px}
.credentials-request-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.42fr);gap:28px;align-items:start;margin-bottom:26px}
.credentials-request-head h2{margin:.2rem 0 .8rem;font-size:clamp(2rem,3.4vw,3rem)}
.credentials-request-head>div>p:not(.kicker){margin:0;max-width:780px;color:#d0c9bc;line-height:1.75}
.credentials-request-note{padding:20px 22px;border:1px solid rgba(210,162,58,.32);border-radius:16px;background:rgba(210,162,58,.055)}
.credentials-request-note strong{display:block;color:var(--gold-light);margin-bottom:7px}.credentials-request-note p{margin:0;color:#cfc7ba;font-size:.91rem;line-height:1.6}
.credentials-request-form{display:grid;gap:18px}
.credentials-form-card{margin:0;padding:0 24px 24px;border:1px solid rgba(210,162,58,.24);border-radius:18px;background:linear-gradient(160deg,rgba(18,16,12,.96),rgba(8,8,8,.96));box-shadow:0 16px 38px rgba(0,0,0,.14)}
.credentials-form-card legend{display:flex;align-items:center;gap:12px;max-width:calc(100% - 24px);padding:0 10px 0 0;color:#fff}
.credentials-form-card legend>span:first-child{width:38px;height:38px;flex:0 0 38px;border:1px solid rgba(210,162,58,.5);border-radius:50%;display:grid;place-items:center;background:#0a0907;color:var(--gold-light);font-weight:900}
.credentials-form-card legend>span:last-child{display:grid;gap:2px;padding:18px 0 12px}.credentials-form-card legend strong{font-family:Marcellus,Georgia,serif;font-size:1.28rem;font-weight:400}.credentials-form-card legend small{color:#a9a092;font-size:.76rem;line-height:1.35}
.credentials-form-grid{display:grid;gap:16px}.credentials-form-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.credentials-field-span-2{grid-column:1/-1}
.credentials-field{display:grid;gap:7px;min-width:0}.credentials-field>span{color:#f3eadb;font-size:.78rem;font-weight:800;letter-spacing:.025em}.credentials-field b{color:var(--gold-light)}
.credentials-field input,.credentials-field select,.credentials-field textarea{width:100%;box-sizing:border-box;padding:11px 13px;border:1px solid rgba(210,162,58,.42);border-radius:10px;background:#090806;color:#f5f1e8;font:inherit;outline:none}
.credentials-field input,.credentials-field select{min-height:48px}.credentials-field textarea{min-height:96px;resize:vertical;line-height:1.55}.credentials-field textarea[name="request_reason"]{min-height:138px}
.credentials-field input::placeholder,.credentials-field textarea::placeholder{color:#81796d}.credentials-field input:focus,.credentials-field select:focus,.credentials-field textarea:focus{border-color:var(--gold-light);box-shadow:0 0 0 3px rgba(210,162,58,.1)}
.credentials-field small{color:#91887c;font-size:.74rem;line-height:1.45}
.credentials-check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.credentials-check{display:flex;gap:11px;align-items:flex-start;padding:15px;border:1px solid rgba(210,162,58,.23);border-radius:13px;background:rgba(255,255,255,.018);cursor:pointer}.credentials-check:hover{border-color:rgba(244,210,124,.48);background:rgba(210,162,58,.04)}
.credentials-check input{width:18px;height:18px;flex:0 0 18px;margin:2px 0 0;accent-color:#d2a23a}.credentials-check span{display:grid;gap:4px}.credentials-check strong{color:#fff;font-size:.9rem}.credentials-check small{color:#aaa193;font-size:.77rem;line-height:1.45}
.credentials-document-error{min-height:1.2em;margin:10px 0 0;color:#f3c0bc;font-size:.8rem}.credentials-request-detail-grid{margin-top:14px;padding-top:16px;border-top:1px solid rgba(210,162,58,.13)}
.credentials-request-confirm{padding:18px 20px;border:1px solid rgba(210,162,58,.2);border-radius:14px;background:rgba(255,255,255,.016)}.credentials-confirm{display:flex;gap:11px;align-items:flex-start;color:#cfc8bb;font-size:.86rem;line-height:1.55}.credentials-confirm input{width:18px;height:18px;flex:0 0 18px;margin-top:2px;accent-color:#d2a23a}.credentials-confirm a{color:var(--gold-light)}
.credentials-request-form .form-turnstile-block{padding:18px 20px;border:1px solid rgba(210,162,58,.2);border-radius:14px;background:rgba(255,255,255,.016)}
.credentials-request-form .form-turnstile-copy,.credentials-request-form .form-turnstile-status{margin:7px 0 0;color:#9d9487;font-size:.76rem}.credentials-request-form .form-turnstile-status[data-state="success"]{color:#b8e7c1}
.credentials-request-footer{display:flex;align-items:center;gap:18px;justify-content:space-between}.credentials-request-footer p{max-width:720px;margin:0;color:#a9a093;font-size:.79rem;line-height:1.55}.credentials-request-footer .btn{flex:0 0 auto}
.credentials-request-form [aria-invalid="true"]{border-color:#d86d65!important;box-shadow:0 0 0 3px rgba(216,109,101,.08)!important}
@media(max-width:820px){.credentials-request-head,.credentials-form-grid-2,.credentials-check-grid{grid-template-columns:1fr}.credentials-field-span-2{grid-column:auto}.credentials-request-footer{align-items:flex-start;flex-direction:column}}
@media(max-width:620px){.credentials-request{padding:50px 0}.credentials-form-card{padding:0 17px 18px}.credentials-form-card legend strong{font-size:1.12rem}.credentials-request-footer .btn{width:100%}}

/* Build 451C: stabilise the credentials hero before the portrait source decodes.
   The approved visual height is unchanged; this simply makes it definite rather
   than allowing the source image's intrinsic 2:3 ratio to influence grid sizing. */
.credentials-page .preview-v2-hero-media{height:clamp(500px,61svh,720px)!important;min-height:clamp(500px,61svh,720px)!important}
.credentials-page .preview-v2-hero-media img{height:100%!important;min-height:0!important;max-height:none!important;aspect-ratio:auto!important;object-fit:cover!important}
@media(max-width:1100px){.credentials-page .preview-v2-hero-media{height:520px!important;min-height:520px!important}}
@media(max-width:900px){.credentials-page .preview-v2-hero-media{height:clamp(340px,64vw,520px)!important;min-height:clamp(340px,64vw,520px)!important}}
@media(max-width:640px){.credentials-page .preview-v2-hero-media{height:320px!important;min-height:320px!important}}


/* Build 451N: render the approved Credentials divider in the initial layout so page-preview enhancement cannot create post-paint CLS. */
body.jt-credentials-divider-ready #main-content > .credentials-landing-divider {
  box-sizing:content-box!important;width:100%!important;max-width:none!important;min-width:0!important;
  height:100px!important;min-height:100px!important;max-height:100px!important;margin:0!important;padding:0!important;
  display:block!important;overflow:hidden!important;border-top:1px solid rgba(76,60,38,.20)!important;border-right:0!important;
  border-bottom:1px solid rgba(76,60,38,.20)!important;border-left:0!important;border-radius:0!important;
  background:#e9e0d3!important;color:#17130e!important;box-shadow:none!important;
}
body.jt-credentials-divider-ready #main-content > .credentials-landing-divider > .jt-landing-divider-grid {
  box-sizing:border-box!important;width:100%!important;max-width:none!important;min-width:0!important;height:100px!important;
  min-height:100px!important;max-height:100px!important;margin:0!important;padding:0!important;display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;grid-template-rows:100px!important;gap:0!important;
  align-items:stretch!important;overflow:hidden!important;
}
body.jt-credentials-divider-ready #main-content > .credentials-landing-divider .jt-landing-divider-item {
  box-sizing:border-box!important;width:auto!important;min-width:0!important;height:100px!important;min-height:100px!important;
  max-height:100px!important;margin:0!important;padding:16px clamp(20px,2.5vw,44px)!important;display:flex!important;
  flex-direction:column!important;justify-content:center!important;align-items:flex-start!important;gap:0!important;overflow:hidden!important;
  border:0!important;border-right:1px solid rgba(76,60,38,.18)!important;border-radius:0!important;background:transparent!important;
  color:#17130e!important;text-decoration:none!important;box-shadow:none!important;
}
body.jt-credentials-divider-ready #main-content > .credentials-landing-divider .jt-landing-divider-item:last-child {border-right:0!important}
body.jt-credentials-divider-ready #main-content > .credentials-landing-divider .jt-landing-divider-item > span:first-child {
  display:block!important;margin:0 0 5px!important;padding:0!important;color:#8b681f!important;font-family:Lato,Arial,sans-serif!important;
  font-size:.72rem!important;font-weight:900!important;line-height:1.2!important;letter-spacing:.15em!important;text-transform:uppercase!important;
}
body.jt-credentials-divider-ready #main-content > .credentials-landing-divider .jt-landing-divider-item > strong {
  display:block!important;margin:0!important;padding:0!important;color:#17130e!important;font-family:Marcellus,Georgia,serif!important;
  font-size:clamp(1.02rem,1.15vw,1.24rem)!important;font-weight:400!important;line-height:1.2!important;
}
body.jt-credentials-divider-ready #main-content > .credentials-landing-divider .jt-landing-divider-item > small {
  display:block!important;margin:5px 0 0!important;padding:0!important;color:#625b52!important;font-family:Lato,Arial,sans-serif!important;
  font-size:.78rem!important;font-weight:500!important;line-height:1.35!important;
}
@media (min-width:1001px) {
  body.jt-credentials-divider-ready #main-content > .jt-credentials-divider-host {
    height:calc(100svh - 112px - 102px)!important;min-height:calc(100svh - 112px - 102px)!important;max-height:calc(100svh - 112px - 102px)!important;
  }
}
@media (max-width:640px) {
  body.jt-credentials-divider-ready #main-content > .credentials-landing-divider {height:auto!important;min-height:0!important;max-height:none!important}
  body.jt-credentials-divider-ready #main-content > .credentials-landing-divider > .jt-landing-divider-grid {
    height:auto!important;min-height:0!important;max-height:none!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:repeat(2,auto)!important;
  }
  body.jt-credentials-divider-ready #main-content > .credentials-landing-divider .jt-landing-divider-item {
    height:auto!important;min-height:92px!important;max-height:none!important;padding:14px 18px!important;
  }
  body.jt-credentials-divider-ready #main-content > .credentials-landing-divider .jt-landing-divider-item:nth-child(2n) {border-right:0!important}
  body.jt-credentials-divider-ready #main-content > .credentials-landing-divider .jt-landing-divider-item:nth-child(-n+2) {border-bottom:1px solid rgba(76,60,38,.18)!important}
}


/* Build 451W4Q1P6: Credentials CTA plain-background treatment. */
.credentials-page .resource-cta-shell{padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.credentials-page .resource-cta-actions{justify-content:flex-end}
@media(max-width:940px){.credentials-page .resource-cta-actions{justify-content:flex-start}}

/* P31T50 source: assets/css/page-preview-v2.css */
/* Build 124 - parallel V2 public-page preview system.
   Presentation-only: original page content, forms, data and scripts are preserved. */
.page2-preview {
  --v2-dark: #070706;
  --v2-dark-soft: #11100e;
  --v2-light: #f4efe7;
  --v2-light-deep: #e9e0d3;
  --v2-ink: #17130e;
  --v2-gold: #d2a23a;
  --v2-gold-soft: #e7bf61;
  --v2-muted-dark: #6c6358;
  --v2-pad-x: clamp(28px, 5vw, 96px);
  --v2-pad-y: clamp(62px, 6vw, 104px);
  --v2-pad-y-compact: clamp(34px, 3.2vw, 58px);
  background: var(--v2-dark);
}

/* Full-width shell while retaining the current menu system and page content. */
.page2-preview .site-header .header-inner {
  width: 100%;
  max-width: none;
  padding-inline: clamp(24px, 3.4vw, 66px);
}
.page2-preview main {
  width: 100%;
  max-width: none;
  overflow: clip;
}
.page2-preview main > .preview-v2-section {
  width: 100%;
  max-width: none;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  position: relative;
  clear: both;
  overflow: hidden;
}
.page2-preview main > .preview-v2-section > .container,
.page2-preview main > .preview-v2-section > [class*="container"] {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  padding: var(--v2-pad-y) var(--v2-pad-x) !important;
}

/* Strict dark / soft-white rhythm. */
.page2-preview .preview-v2-dark {
  background: var(--v2-dark) !important;
  color: #f7f1e7 !important;
  border-color: rgba(210,162,58,.30) !important;
}
.page2-preview .preview-v2-light {
  background: var(--v2-light) !important;
  color: var(--v2-ink) !important;
  border-color: rgba(61,48,31,.18) !important;
}
.page2-preview .preview-v2-light h1,
.page2-preview .preview-v2-light h2,
.page2-preview .preview-v2-light h3,
.page2-preview .preview-v2-light h4,
.page2-preview .preview-v2-light strong,
.page2-preview .preview-v2-light label,
.page2-preview .preview-v2-light legend {
  color: var(--v2-ink) !important;
}
.page2-preview .preview-v2-light p,
.page2-preview .preview-v2-light li,
.page2-preview .preview-v2-light .muted,
.page2-preview .preview-v2-light .detail-list,
.page2-preview .preview-v2-light figcaption,
.page2-preview .preview-v2-light small {
  color: var(--v2-muted-dark) !important;
}
.page2-preview .preview-v2-light .kicker,
.page2-preview .preview-v2-light .gold,
.page2-preview .preview-v2-light .text-link,
.page2-preview .preview-v2-light a:not(.btn):not(.nav-availability) {
  color: #7f5c17;
}
.page2-preview .preview-v2-dark .muted,
.page2-preview .preview-v2-dark p,
.page2-preview .preview-v2-dark li,
.page2-preview .preview-v2-dark figcaption {
  color: rgba(247,241,231,.78);
}
.page2-preview .preview-v2-dark .kicker,
.page2-preview .preview-v2-dark .gold,
.page2-preview .preview-v2-dark .text-link {
  color: var(--v2-gold-soft) !important;
}

/* Section text scale and internal breathing room: never external spacer bands. */
.page2-preview main .section-head {
  max-width: min(980px, 100%);
  margin: 0 0 clamp(28px, 3vw, 48px);
  text-align: left;
}
.page2-preview main .section-head h2,
.page2-preview main .resource-section-head h2 {
  font-size: clamp(2rem, 3vw, 3.4rem);
}
.page2-preview main .kicker {
  font-size: clamp(.77rem, .8vw, .9rem);
  letter-spacing: .18em;
}

/* Compact bands stay useful but shallow. */
.page2-preview main > .preview-v2-strip > .container,
.page2-preview main > .preview-v2-strip > [class*="container"] {
  padding-top: var(--v2-pad-y-compact) !important;
  padding-bottom: var(--v2-pad-y-compact) !important;
}

/* Full-width hero: text and imagery/panel fill the complete hero band. */
.page2-preview main > .preview-v2-hero {
  background: #050505 !important;
  color: #f7f1e7 !important;
  border-bottom: 1px solid rgba(210,162,58,.28);
}
.page2-preview main > .preview-v2-hero > .preview-v2-hero-split {
  display: grid !important;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr) !important;
  gap: 0 !important;
  align-items: stretch !important;
  min-height: clamp(500px, 61svh, 720px);
  padding: 0 !important;
}
.page2-preview .preview-v2-hero-copy {
  min-width: 0;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(58px, 6vw, 108px) var(--v2-pad-x) !important;
  background:
    radial-gradient(circle at 100% 20%, rgba(210,162,58,.12), transparent 32rem),
    #050505;
  position: relative;
  z-index: 2;
}
.page2-preview .preview-v2-hero-copy h1 {
  max-width: 13ch;
  font-size: clamp(2.65rem, 4.3vw, 5rem);
  line-height: 1.02;
}
.page2-preview .preview-v2-hero-copy p {
  max-width: 760px;
}
.page2-preview .preview-v2-hero-media {
  min-width: 0;
  min-height: clamp(500px, 61svh, 720px);
  height: 100%;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  border: 0 !important;
  border-radius: 0 !important;
  position: relative;
}
.page2-preview .preview-v2-hero-media img {
  width: 100% !important;
  height: 100% !important;
  min-height: inherit;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 0 !important;
}
.page2-preview .preview-v2-hero-media figcaption {
  position: absolute;
  left: 24px;
  bottom: 18px;
  z-index: 2;
  padding: 8px 12px;
  background: rgba(0,0,0,.68);
  color: #f7f1e7 !important;
  border-left: 2px solid var(--v2-gold);
}
.page2-preview .preview-v2-hero-panel {
  margin: 0 !important;
  padding: clamp(42px, 5vw, 80px) var(--v2-pad-x) !important;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0c0b09;
}
.page2-preview main > .preview-v2-hero > .preview-v2-hero-single {
  width: 100%;
  max-width: none;
  padding: clamp(64px, 7vw, 116px) var(--v2-pad-x) !important;
}

/* Prevent old card widths/radii from making the page look boxed-in. */
.page2-preview main .page-hero-card,
.page2-preview main .real-photo-card,
.page2-preview main .about-card,
.page2-preview main .review-card,
.page2-preview main .collab-card,
.page2-preview main .occasion-card,
.page2-preview main .contact-method-card,
.page2-preview main .resource-card,
.page2-preview main .package-card {
  border-radius: 0 !important;
}

/* Light-section cards/forms stay readable without reverting to an all-black page. */
.page2-preview .preview-v2-light input,
.page2-preview .preview-v2-light textarea,
.page2-preview .preview-v2-light select,
.page2-preview .preview-v2-light .page-hero-card,
.page2-preview .preview-v2-light [class*="card"],
.page2-preview .preview-v2-light [class*="panel"],
.page2-preview .preview-v2-light [class*="box"] {
  background: rgba(255,255,255,.48) !important;
  color: var(--v2-ink) !important;
  border-color: rgba(61,48,31,.22) !important;
  box-shadow: none !important;
}
.page2-preview .preview-v2-light input::placeholder,
.page2-preview .preview-v2-light textarea::placeholder { color: #7e756a; }
.page2-preview .preview-v2-light select option { background: #fff; color: #17130e; }

/* Media containment everywhere: no image bleed into the following section. */
.page2-preview main figure,
.page2-preview main [class*="media"],
.page2-preview main [class*="photo"],
.page2-preview main [class*="image"] {
  max-width: 100%;
  overflow: hidden;
}
.page2-preview main figure img,
.page2-preview main [class*="media"] img,
.page2-preview main [class*="photo"] img,
.page2-preview main [class*="image"] img {
  max-width: 100%;
}

/* Package and two-column layouts stretch across the page rather than sitting in a narrow island. */
.page2-preview main .package-detail-grid,
.page2-preview main .about-two-col,
.page2-preview main [class*="-grid"] {
  max-width: none;
}
.page2-preview main .package-detail-grid {
  grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr);
  gap: clamp(34px, 5vw, 86px);
}

/* Map and form pages: use the width rather than leaving large margins. */
.page2-preview .performance-map-frame,
.page2-preview .booking-form-container,
.page2-preview .contact-enquiry-section .container,
.page2-preview .setup-layout {
  max-width: none !important;
  width: 100% !important;
}
.page2-preview .performance-map-frame iframe { width: 100%; }

/* Full-width footer, same content. */
.page2-preview .site-footer.footer-option-b {
  width: 100%;
  padding: 0 !important;
  margin: 0;
  background: #000;
}
.page2-preview .footer-option-b .footer-b-shell {
  width: 100%;
  max-width: none;
  margin: 0;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
  border-radius: 0;
  box-shadow: none;
}
.page2-preview .footer-option-b .footer-b-main,
.page2-preview .footer-option-b .footer-b-contact-row,
.page2-preview .footer-option-b .footer-b-bottom {
  padding-left: var(--v2-pad-x);
  padding-right: var(--v2-pad-x);
}

/* Standard section-scroll control for all V2 preview pages. */
.page2-preview .preview-v2-scroll-next {
  position: fixed !important;
  right: clamp(16px, 2vw, 30px) !important;
  bottom: clamp(16px, 2vw, 30px) !important;
  z-index: 45 !important;
  width: 50px !important;
  height: 50px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(210,162,58,.72) !important;
  border-radius: 50% !important;
  background: rgba(5,5,5,.82) !important;
  color: var(--v2-gold-soft) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.32) !important;
  backdrop-filter: blur(8px);
  cursor: pointer;
}
.page2-preview .preview-v2-scroll-next svg {
  width: 28px;
  height: 28px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.page2-preview .preview-v2-scroll-next.is-at-end { opacity: .38; }

/* Page-specific containment refinements. */
.page2-preview--gallery .gallery-showcase,
.page2-preview--gallery .gallery-hero { overflow: hidden; }
.page2-preview--gallery .gallery-grid,
.page2-preview--gallery [class*="gallery-"] { max-width: none; }
.page2-preview--my-setup .setup-category-bar,
.page2-preview--my-setup .setup-affiliate-strip { min-height: 0; }
.page2-preview--my-setup .setup-category-bar > .container,
.page2-preview--my-setup .setup-affiliate-strip > .container {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}
.page2-preview--weddings .wedding-photo-section img,
.page2-preview--occasions .occasions-section img,
.page2-preview--collaborations .collab-section img,
.page2-preview--to-hell-or-verona .thov-section img,
.page2-preview--about .about-section img,
.page2-preview--reviews .reviews-section img {
  object-fit: cover;
}

/* Legal pages retain their complete long-form content but gain the same full-width rhythm. */
.page2-preview--privacy-policy main > section:nth-of-type(2) > .container,
.page2-preview--cookie-policy main > section:nth-of-type(2) > .container,
.page2-preview--terms-of-use main > section:nth-of-type(2) > .container,
.page2-preview--booking-terms main > section:nth-of-type(2) > .container,
.page2-preview--accessibility main > section:nth-of-type(2) > .container {
  max-width: none !important;
  padding-inline: clamp(34px, 9vw, 170px) !important;
}

@media (max-width: 1100px) {
  .page2-preview {
    --v2-pad-x: clamp(24px, 4.5vw, 54px);
    --v2-pad-y: clamp(52px, 6vw, 78px);
  }
  .page2-preview main > .preview-v2-hero > .preview-v2-hero-split {
    grid-template-columns: 1fr 1fr !important;
    min-height: 520px;
  }
  .page2-preview .preview-v2-hero-media { min-height: 520px; }
}

@media (max-width: 900px) {
  .page2-preview .site-header .header-inner { width: calc(100% - 24px); padding-inline: 0; }
  .page2-preview main > .preview-v2-hero > .preview-v2-hero-split {
    grid-template-columns: 1fr !important;
    min-height: 0;
  }
  .page2-preview .preview-v2-hero-copy {
    padding: 52px var(--v2-pad-x) !important;
  }
  .page2-preview .preview-v2-hero-copy h1 { max-width: 18ch; }
  .page2-preview .preview-v2-hero-media { min-height: clamp(340px, 64vw, 520px); }
  .page2-preview main .package-detail-grid { grid-template-columns: 1fr; }
  .page2-preview .footer-option-b .footer-b-main { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .page2-preview {
    --v2-pad-x: 22px;
    --v2-pad-y: 42px;
    --v2-pad-y-compact: 26px;
  }
  .page2-preview .preview-v2-hero-copy { padding-block: 44px !important; }
  .page2-preview .preview-v2-hero-copy h1 { font-size: clamp(2.15rem, 10vw, 3rem); }
  .page2-preview .preview-v2-hero-media { min-height: 320px; }
  .page2-preview .preview-v2-scroll-next { width: 46px !important; height: 46px !important; }
}

/* P31T50 source: assets/css/v2-button-system-133.css */
/* Build 133 - public V2 CTA design system.
   Primary = filled gold pill; secondary = outlined gold pill; tertiary = text link.
   This file is loaded last on the parallel V2 preview pages so page-specific
   legacy button shapes cannot reintroduce rectangular CTAs. */

.page2-preview .btn,
.home-preview-page .btn {
  min-height: 50px !important;
  padding: 12px 27px !important;
  border: 1px solid #d2a23a !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #e7bf61 !important;
  box-shadow: none !important;
  font-size: clamp(.78rem, .78vw, .88rem) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: .105em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}

.page2-preview .btn.btn-primary,
.home-preview-page .btn.btn-primary {
  border-color: #d3a437 !important;
  background: linear-gradient(135deg, #a86f18 0%, #efc45f 100%) !important;
  color: #080704 !important;
  box-shadow: 0 12px 28px rgba(164, 112, 26, .18) !important;
}

.page2-preview .preview-v2-light .btn:not(.btn-primary),
.home-preview-page .preview-light-section .btn:not(.btn-primary),
.home-preview-page .preview-about-section .btn:not(.btn-primary) {
  border-color: #956a16 !important;
  color: #69480b !important;
}

@media (hover: hover) and (pointer: fine) {
  .page2-preview .btn:hover,
  .page2-preview .btn:focus-visible,
  .home-preview-page .btn:hover,
  .home-preview-page .btn:focus-visible {
    transform: translateY(-2px);
    background: rgba(210, 162, 58, .10) !important;
  }

  .page2-preview .btn.btn-primary:hover,
  .page2-preview .btn.btn-primary:focus-visible,
  .home-preview-page .btn.btn-primary:hover,
  .home-preview-page .btn.btn-primary:focus-visible {
    background: linear-gradient(135deg, #bb7f1c 0%, #f4cf75 100%) !important;
  }
}

@media (max-width: 640px) {
  .page2-preview .btn,
  .home-preview-page .btn {
    min-height: 48px !important;
    padding: 11px 22px !important;
  }
}

/* P31T50 source: assets/css/v2-readability-136.css */
/* Build 136 - V2 readability and scoped visual refinements.
   Applies only to the parallel redesigned *2 preview site. */

/* Consistent supporting/body copy scale outside landing heroes. */
.page2-preview main > section:not(.preview-v2-hero) p:not(.kicker):not(.preview-section-eyebrow):not(.review-source),
.home-preview-page main > section:not(.preview-hero) p:not(.preview-section-eyebrow):not(.preview-eyebrow):not(.review-source) {
  font-size: clamp(1.04rem, .92vw, 1.17rem) !important;
  line-height: 1.68 !important;
  text-wrap: pretty;
}
.page2-preview main > section:not(.preview-v2-hero) li {
  font-size: clamp(1rem, .86vw, 1.1rem);
  line-height: 1.62;
}

/* Weddings2 ceremony image mosaic: rounded corners expose the section colour,
   never a separate grey card background. */
.page2-preview--weddings .wedding-photo-section-featured,
.page2-preview--weddings .wedding-photo-section-featured > .container,
.page2-preview--weddings .wedding-photo-section-featured .wedding-photo-feature-grid,
.page2-preview--weddings .wedding-photo-section-featured .wedding-photo-feature-side,
.page2-preview--weddings .wedding-photo-section-featured .wedding-photo {
  background: var(--v2-light) !important;
  background-color: var(--v2-light) !important;
  box-shadow: none !important;
}
.page2-preview--weddings .wedding-photo-section-featured .wedding-photo figcaption {
  color: #fff !important;
}

/* Index2 corporate/functions image: portrait violin photo framed as a wide
   background panel without changing the panel dimensions. */
.home-preview-page .preview-performance-panel--events > img {
  object-position: 50% 42% !important;
}

/* Index2 repertoire: turn the plain ruled list into compact editorial tiles. */
.home-preview-page .preview-repertoire-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: clamp(1.25rem, 2vw, 1.7rem) 0 clamp(1.35rem, 2vw, 1.8rem);
}
.home-preview-page .preview-repertoire-card {
  min-width: 0;
  padding: clamp(14px, 1.2vw, 18px) clamp(15px, 1.35vw, 20px);
  border: 1px solid rgba(231, 191, 97, .22);
  border-radius: 14px;
  background: rgba(255,255,255,.035);
}
.home-preview-page .preview-repertoire-card > span {
  display: block;
  margin-bottom: .28rem;
  color: #e7bf61;
  font-size: clamp(.7rem, .62vw, .8rem);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.home-preview-page .preview-repertoire-card > strong {
  display: block;
  color: #fff;
  font-family: "Marcellus", serif;
  font-size: clamp(1.02rem, .92vw, 1.18rem);
  font-weight: 400;
  line-height: 1.25;
}
.home-preview-page .preview-repertoire-card > small {
  display: block;
  margin-top: .35rem;
  color: rgba(247,241,231,.7);
  font-size: clamp(.82rem, .72vw, .94rem);
  line-height: 1.45;
}

@media (max-width: 760px) {
  .home-preview-page .preview-repertoire-grid { grid-template-columns: 1fr; }
  .page2-preview main > section:not(.preview-v2-hero) p:not(.kicker):not(.preview-section-eyebrow):not(.review-source),
  .home-preview-page main > section:not(.preview-hero) p:not(.preview-section-eyebrow):not(.preview-eyebrow):not(.review-source) {
    font-size: 1rem !important;
    line-height: 1.62 !important;
  }
}

/* P31T50 source: assets/css/v2-consistency-137.css */
/* Build 137 - V2 navigation and section-copy consistency.
   Applies only to the parallel redesigned preview pages. */

.page2-preview,
.home-preview-page {
  --v2-section-copy-size: clamp(1.08rem, 0.98vw, 1.20rem);
  --v2-section-copy-leading: 1.68;
}

/* Shared explanatory-copy scale immediately beneath section titles. */
.page2-preview main .section-head > p:not(.kicker):not(.gold):not(.review-source),
.page2-preview main [class$="-section-head"] > p:not(.kicker):not(.gold):not(.review-source),
.page2-preview main .resource-section-head > p:not(.kicker):not(.gold):not(.review-source),
.page2-preview main h2 + p:not(.kicker):not(.gold):not(.review-source),
.home-preview-page main .preview-wedding-copy > p:not(.preview-section-eyebrow),
.home-preview-page main .preview-about-copy > p:not(.preview-section-eyebrow),
.home-preview-page main .preview-listen-copy > p:not(.preview-section-eyebrow),
.home-preview-page main h2 + p:not(.preview-section-eyebrow):not(.preview-eyebrow):not(.review-source) {
  font-size: var(--v2-section-copy-size) !important;
  line-height: var(--v2-section-copy-leading) !important;
  text-wrap: pretty;
}

/* Weddings2 ceremony introduction: breathing room belongs inside the copy
   column, not as a blank spacer between sections. */
.page2-preview--weddings .wedding-photo-section-featured .wedding-photo-head {
  box-sizing: border-box;
  padding: clamp(20px, 1.8vw, 34px) clamp(10px, 1.15vw, 20px) !important;
}
.page2-preview--weddings .wedding-photo-section-featured .wedding-photo-head > p:not(.kicker) {
  margin-top: clamp(16px, 1.25vw, 22px) !important;
}

@media (max-width: 760px) {
  .page2-preview,
  .home-preview-page {
    --v2-section-copy-size: 1rem;
    --v2-section-copy-leading: 1.62;
  }
  .page2-preview--weddings .wedding-photo-section-featured .wedding-photo-head {
    padding: 12px 0 18px !important;
  }
}

/* P31T50 source: assets/css/v2-regression-fix-138.css */
/* Build 138 - strict regression fix only.
   1) Restore centred/shared header geometry while retaining Home.
   2) Lock V2 supporting prose to one actual size rather than page-specific clamps. */

/* Keep logo + navigation together in the established centred header shell.
   Do not use the full-width V2 header override on normal preview pages. */
@media (min-width: 901px) {
  body.page2-preview:not(.page2-preview--found-my-gear) .site-header .header-inner,
  body.home-preview-page .site-header .header-inner {
    width: min(var(--container), calc(100% - 40px)) !important;
    max-width: var(--container) !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
  }

  body.page2-preview:not(.page2-preview--found-my-gear) .site-header .main-nav,
  body.home-preview-page .site-header .main-nav {
    justify-content: center !important;
  }
}

/* One real supporting-copy size across the V2 site.
   Kicker/eyebrow/meta/caption/status text deliberately retains its own hierarchy. */
body.page2-preview main > section:not(.preview-v2-hero) p:not(.kicker):not(.preview-section-eyebrow):not(.review-source):not(.gold):not([class*="caption"]):not([class*="meta"]):not([class*="status"]):not([class*="note"]),
body.home-preview-page main > section:not(.preview-hero) p:not(.preview-section-eyebrow):not(.preview-eyebrow):not(.review-source):not(.gold):not([class*="caption"]):not([class*="meta"]):not([class*="status"]):not([class*="note"]),
body.page2-preview main h2 + p:not(.kicker):not(.gold):not(.review-source),
body.home-preview-page main h2 + p:not(.preview-section-eyebrow):not(.preview-eyebrow):not(.gold):not(.review-source) {
  font-size: 18px !important;
  line-height: 1.68 !important;
  letter-spacing: normal !important;
  text-wrap: pretty;
}

@media (max-width: 760px) {
  body.page2-preview main > section:not(.preview-v2-hero) p:not(.kicker):not(.preview-section-eyebrow):not(.review-source):not(.gold):not([class*="caption"]):not([class*="meta"]):not([class*="status"]):not([class*="note"]),
  body.home-preview-page main > section:not(.preview-hero) p:not(.preview-section-eyebrow):not(.preview-eyebrow):not(.review-source):not(.gold):not([class*="caption"]):not([class*="meta"]):not([class*="status"]):not([class*="note"]),
  body.page2-preview main h2 + p:not(.kicker):not(.gold):not(.review-source),
  body.home-preview-page main h2 + p:not(.preview-section-eyebrow):not(.preview-eyebrow):not(.gold):not(.review-source) {
    font-size: 16px !important;
    line-height: 1.62 !important;
  }
}

/* Build 139 - hero supporting-copy consistency correction.
   Build 138 standardised section prose but intentionally excluded hero sections,
   leaving Weddings2 visibly smaller than Index2. Keep one exact rendered hero
   supporting-copy size across the redesigned V2 site. */
body.home-preview-page main > section.preview-hero .preview-hero-lead,
body.page2-preview main > section.preview-v2-hero p:not(.kicker):not(.preview-section-eyebrow):not(.review-source):not(.gold):not([class*="caption"]):not([class*="meta"]):not([class*="status"]):not([class*="note"]) {
  font-size: 19px !important;
  line-height: 1.68 !important;
  letter-spacing: normal !important;
}

@media (max-width: 760px) {
  body.home-preview-page main > section.preview-hero .preview-hero-lead,
  body.page2-preview main > section.preview-v2-hero p:not(.kicker):not(.preview-section-eyebrow):not(.review-source):not(.gold):not([class*="caption"]):not([class*="meta"]):not([class*="status"]):not([class*="note"]) {
    font-size: 17px !important;
    line-height: 1.62 !important;
  }
}

/* P31T50 source: assets/css/v2-section-rhythm-140.css */
/* Build 140 - V2 section-title and copy-to-CTA rhythm consistency.
   Scope: redesigned *2 preview pages only.
   Keep the Index2 landing hero deliberately larger; preserve dense/legal/card/package hierarchy. */

body.page2-preview,
body.home-preview-page {
  --v2-primary-title-size: 54px;
  --v2-primary-title-leading: 1.06;
  --v2-copy-to-cta-gap: 24px;
}

/* Normal V2 page hero titles share the same primary title scale.
   Index2's landing hero is intentionally NOT included. */
body.page2-preview main > .preview-v2-hero .preview-v2-hero-copy > h1 {
  font-size: var(--v2-primary-title-size) !important;
  line-height: var(--v2-primary-title-leading) !important;
}

/* Primary editorial section titles - one consistent visual scale.
   Deliberately excludes legal subsections, cards, package-detail titles and utility headings. */
body.home-preview-page main .preview-wedding-copy > h2,
body.home-preview-page main .preview-performance-copy > h2,
body.home-preview-page main .preview-listen-copy > h2,
body.home-preview-page main .preview-gallery-intro > h2,
body.home-preview-page main .preview-about-copy > h2,
body.home-preview-page main .preview-final-cta h2,
body.page2-preview main .section-head > h2,
body.page2-preview main .resource-section-head > h2,
body.page2-preview main .reviews-section-head > h2,
body.page2-preview main .contact-section-head > h2,
body.page2-preview main .about-copy > h2,
body.page2-preview main .about-section-head > h2,
body.page2-preview main .about-final-head > h2,
body.page2-preview main .collab-theatre-copy > h2,
body.page2-preview main .collab-session-intro > h2,
body.page2-preview main .collab-thov-compact h2,
body.page2-preview main .collab-cta-grid h2,
body.page2-preview main .occasions-copy-panel > h2,
body.page2-preview main .occasions-thov-panel > h2,
body.page2-preview main .occasions-final-grid h2,
body.page2-preview main .thov-feature-copy > h2,
body.page2-preview main .thov-identity-grid h2,
body.page2-preview main .thov-final-grid h2,
body.page2-preview main .booking-form-intro > h2,
body.page2-preview main .booking-after-section h2,
body.page2-preview main .reviews-final-grid h2,
body.page2-preview main .gig-snapshot-heading h2,
body.page2-preview main .gig-guide-grid h2,
body.page2-preview main .gig-enquiry-cta h2,
body.page2-preview main .gallery-group-heading h2 {
  font-size: var(--v2-primary-title-size) !important;
  line-height: var(--v2-primary-title-leading) !important;
  text-wrap: balance;
}

/* One consistent gap from explanatory copy to its CTA group.
   Margin only: no section height, grid, image or padding changes. */
body.home-preview-page main .preview-hero-actions,
body.home-preview-page main .hero-actions,
body.page2-preview main .hero-actions,
body.page2-preview main .about-hero-actions,
body.page2-preview main .contact-hero-actions,
body.page2-preview main .reviews-hero-actions,
body.page2-preview main .reviews-final-actions,
body.page2-preview main .gallery-cta-actions {
  margin-top: var(--v2-copy-to-cta-gap) !important;
}

/* Editorial sections where the CTA is a direct child rather than wrapped.
   Exclude package-detail/info-card/toolbars so approved dense layouts do not move. */
body.page2-preview main section:not(.package-detail) :not(.info-card):not(.supplier-toolbar):not(.advice-toolbar) > p:last-of-type + a.btn,
body.home-preview-page main section > p:last-of-type + a.btn,
body.home-preview-page main .preview-listen-copy > .btn {
  margin-top: var(--v2-copy-to-cta-gap) !important;
}

@media (max-width: 900px) {
  body.page2-preview,
  body.home-preview-page {
    --v2-primary-title-size: 42px;
    --v2-primary-title-leading: 1.08;
    --v2-copy-to-cta-gap: 22px;
  }
}

@media (max-width: 600px) {
  body.page2-preview,
  body.home-preview-page {
    --v2-primary-title-size: 34px;
    --v2-primary-title-leading: 1.10;
    --v2-copy-to-cta-gap: 20px;
  }
}

/* P31T50 source: assets/css/public-polish-258.css */
/* Build 255 — public navigation + promoted V2 page consistency.
   Loaded after all legacy/V2 page styles so page-specific layouts win. */

/* ---------- Main navigation ---------- */
.site-header .header-inner {
  width: calc(100% - 56px) !important;
  max-width: none !important;
  min-height: 108px !important;
  margin-inline: auto !important;
}
@media (min-width: 1321px) {
  .site-header .header-inner {
    grid-template-columns: 250px minmax(0,1fr) !important;
    gap: clamp(28px, 2.5vw, 54px) !important;
  }
  .site-header .logo-link { width: 250px !important; }
  .site-header .nav-toggle { display: none !important; }
  .site-header .main-nav {
    position: static !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: clamp(8px, .72vw, 15px) !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    white-space: nowrap !important;
  }
  .site-header .main-nav > a,
  .site-header .main-nav > .nav-dropdown > summary {
    font-size: clamp(.72rem, .66vw, .87rem) !important;
    letter-spacing: .045em !important;
    font-weight: 800 !important;
  }
  .site-header .main-nav > .nav-availability {
    padding: 10px 13px !important;
  }
}
@media (min-width: 1321px) and (max-width: 1500px) {
  .site-header .header-inner { grid-template-columns: 220px minmax(0,1fr) !important; gap: 24px !important; }
  .site-header .logo-link { width: 220px !important; }
  .site-header .main-nav { gap: 8px !important; }
  .site-header .main-nav > a,
  .site-header .main-nav > .nav-dropdown > summary { font-size: .72rem !important; letter-spacing: .025em !important; }
  .site-header .main-nav > .nav-availability { padding: 9px 10px !important; }
}
/* Use the mobile menu before the expanded desktop nav becomes cramped. */
@media (max-width: 1320px) {
  .site-header .header-inner {
    width: calc(100% - 34px) !important;
    min-height: 86px !important;
    grid-template-columns: minmax(180px, 240px) 1fr 46px !important;
    gap: 16px !important;
  }
  .site-header .logo-link { width: min(240px, 100%) !important; }
  .site-header .nav-toggle { display: inline-grid !important; place-items: center !important; justify-self: end !important; }
  .site-header .main-nav {
    position: fixed !important;
    z-index: 130 !important;
    top: 86px !important;
    left: 0 !important;
    right: 0 !important;
    display: none !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    padding: 14px 24px 26px !important;
    background: rgba(0,0,0,.985) !important;
    border-top: 1px solid rgba(210,162,58,.2) !important;
    border-bottom: 1px solid rgba(210,162,58,.28) !important;
    max-height: calc(100vh - 86px) !important;
    overflow-y: auto !important;
  }
  body.nav-open .site-header .main-nav { display: flex !important; }
  .site-header .main-nav > a,
  .site-header .main-nav > .nav-dropdown > summary {
    padding: 14px 0 !important;
    font-size: .91rem !important;
    letter-spacing: .07em !important;
  }
  .site-header .main-nav > .nav-dropdown { border-bottom: 1px solid rgba(210,162,58,.13) !important; }
  .site-header .main-nav > .nav-dropdown > summary { justify-content: space-between !important; }
  .site-header .main-nav > .nav-dropdown > .nav-dropdown-menu {
    position: static !important;
    transform: none !important;
    width: auto !important;
    padding: 0 0 10px 14px !important;
    border: 0 !important;
    border-left: 1px solid rgba(210,162,58,.3) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .site-header .main-nav > .nav-dropdown > .nav-dropdown-menu a { padding: 10px 12px !important; }
  .site-header .main-nav > .nav-availability { margin-top: 12px !important; text-align: center !important; }
}
@media (max-width: 640px) {
  .site-header .header-inner { width: calc(100% - 24px) !important; grid-template-columns: 190px 1fr 44px !important; }
  .site-header .logo-link { width: 190px !important; }
}
/* ---------- About hero ---------- */
@media (min-width: 901px) {
  body.about-page .about-hero.preview-v2-hero { padding: 0 !important; }
  body.about-page .about-hero-grid.preview-v2-hero-split {
    display: grid !important;
    grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr) !important;
    gap: clamp(34px, 4vw, 68px) !important;
    align-items: center !important;
    min-height: 0 !important;
    padding: clamp(42px, 4vw, 64px) var(--public-content-gutter, clamp(28px,4vw,72px)) !important;
  }
  body.about-page .about-hero-copy.preview-v2-hero-copy {
    padding: 0 !important;
    background: transparent !important;
    align-self: center !important;
  }
  body.about-page .about-hero-media.preview-v2-hero-media {
    width: 100% !important;
    height: clamp(340px, 30vw, 455px) !important;
    min-height: 0 !important;
    border: 1px solid var(--line) !important;
    border-radius: 22px !important;
    overflow: hidden !important;
  }
  body.about-page .about-hero-media.preview-v2-hero-media img {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: 50% 35% !important;
  }
}
@media (max-width: 900px) {
  body.about-page .about-hero-grid.preview-v2-hero-split { min-height: 0 !important; }
  body.about-page .about-hero-media.preview-v2-hero-media { min-height: 0 !important; height: clamp(320px, 70vw, 460px) !important; }
  body.about-page .about-hero-media.preview-v2-hero-media img { min-height: 0 !important; height: 100% !important; object-position: 50% 34% !important; }
}
/* ---------- Reviews hero/header consistency ---------- */
@media (min-width: 981px) {
  body.reviews-page .reviews-hero.preview-v2-hero { padding: 0 !important; }
  body.reviews-page .reviews-hero-grid.preview-v2-hero-split {
    display: grid !important;
    grid-template-columns: minmax(0, 1.06fr) minmax(410px, .94fr) !important;
    gap: clamp(36px, 4vw, 70px) !important;
    align-items: center !important;
    min-height: 0 !important;
    padding: 46px var(--public-content-gutter, clamp(28px,4vw,72px)) 62px !important;
  }
  body.reviews-page .reviews-hero-copy.preview-v2-hero-copy {
    padding: 0 !important;
    background: transparent !important;
    align-self: center !important;
  }
  body.reviews-page .reviews-hero-media.preview-v2-hero-media {
    min-height: 0 !important;
    height: auto !important;
    overflow: visible !important;
    padding: 0 !important;
  }
  body.reviews-page .reviews-hero-image { height: clamp(340px, 29vw, 440px) !important; }
  body.reviews-page .reviews-hero-image img {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    object-position: 50% 32% !important;
  }
}
@media (max-width: 980px) {
  body.reviews-page .reviews-hero-grid.preview-v2-hero-split { min-height: 0 !important; }
  body.reviews-page .reviews-hero-media.preview-v2-hero-media { min-height: 0 !important; height: auto !important; overflow: visible !important; }
  body.reviews-page .reviews-hero-image { height: clamp(320px, 62vw, 430px) !important; }
  body.reviews-page .reviews-hero-image img { min-height: 0 !important; height: 100% !important; object-position: 50% 32% !important; }
}
/* ---------- Gallery: restore the intentional collage/grids ---------- */
body.gallery-page .gallery-hero.preview-v2-hero { padding: 0 !important; }
body.gallery-page .gallery-hero-grid.preview-v2-hero-split {
  display: grid !important;
  grid-template-columns: minmax(0, .83fr) minmax(520px, 1.17fr) !important;
  gap: clamp(34px, 4vw, 64px) !important;
  align-items: center !important;
  min-height: 0 !important;
  padding: 46px var(--public-content-gutter, clamp(28px,4vw,72px)) 42px !important;
}
body.gallery-page .gallery-hero-copy.preview-v2-hero-copy {
  padding: 0 !important;
  background: transparent !important;
  align-self: center !important;
  justify-content: center !important;
}
body.gallery-page .gallery-hero-collage.preview-v2-hero-panel {
  display: grid !important;
  grid-template-columns: minmax(0,1.9fr) minmax(190px,.95fr) minmax(140px,.72fr) !important;
  grid-template-rows: 1fr 1fr !important;
  gap: 12px !important;
  width: 100% !important;
  height: clamp(350px, 30vw, 430px) !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  align-items: stretch !important;
  justify-content: stretch !important;
}
body.gallery-page .gallery-hero-collage.preview-v2-hero-panel button { min-width: 0 !important; min-height: 0 !important; }
body.gallery-page .gallery-showcase > .container {
  width: 100% !important; max-width: none !important; padding-inline: var(--public-content-gutter, clamp(28px,4vw,72px)) !important;
}
@media (max-width: 1080px) {
  body.gallery-page .gallery-hero-grid.preview-v2-hero-split { grid-template-columns: 1fr !important; }
  body.gallery-page .gallery-hero-collage.preview-v2-hero-panel { max-width: 900px !important; height: 390px !important; }
}
@media (max-width: 760px) {
  body.gallery-page .gallery-hero-grid.preview-v2-hero-split { padding: 34px var(--public-content-gutter, 20px) 32px !important; }
  body.gallery-page .gallery-hero-collage.preview-v2-hero-panel {
    height: auto !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    grid-template-rows: auto !important;
  }
}

/* Build 258 — public header, scroll-control and Weddings consistency. */
/* One public header presentation everywhere. Page-specific styles are not allowed to
   move, resize or restyle the shell after this file loads. */
html body .site-header {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  background: #050505 !important;
  border-bottom: 1px solid rgba(210,162,58,.24) !important;
  box-shadow: none !important;
}
html body .site-header .header-inner {
  position: relative !important;
  inset: auto !important;
  box-sizing: border-box !important;
  align-items: center !important;
  padding-block: 0 !important;
  transform: none !important;
}
html body .site-header .logo-link {
  display: flex !important;
  align-items: center !important;
  align-self: center !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}
html body .site-header .logo-link img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 88px !important;
  object-fit: contain !important;
  object-position: left center !important;
}
html body .site-header .main-nav {
  margin: 0 !important;
  transform: none !important;
}
html body .site-header .main-nav > a,
html body .site-header .main-nav > .nav-dropdown,
html body .site-header .main-nav > .nav-dropdown > summary {
  align-self: center !important;
}
html body .site-header .main-nav > a,
html body .site-header .main-nav > .nav-dropdown > summary {
  line-height: 1.15 !important;
}
/* Weddings had accumulated page-specific header rules over several V2 passes.
   These selectors deliberately pin it to the same shell as Collaborations. */
html body.weddings-page .site-header,
html body.weddings-page .site-header .header-inner,
html body.weddings-page .site-header .main-nav,
html body.weddings-page .site-header .logo-link {
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
}
/* Wedding package chooser: landscape artwork is supporting navigation, not a hero.
   Keep all five visible at a sensible size on wide screens and never crop the art. */
body.weddings-page #wedding-packages .packages-grid {
  width: 100% !important;
  max-width: 1260px !important;
  margin-inline: auto !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(150px, 220px)) !important;
  justify-content: center !important;
  align-items: start !important;
  gap: clamp(12px, 1.25vw, 20px) !important;
}
body.weddings-page #wedding-packages .package-card {
  width: 100% !important;
  max-width: 220px !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  border-radius: 14px !important;
  overflow: hidden !important;
}
body.weddings-page #wedding-packages .package-card img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 165px !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: contain !important;
  object-position: center !important;
}
@media (max-width: 1180px) {
  body.weddings-page #wedding-packages .packages-grid {
    grid-template-columns: repeat(3, minmax(170px, 230px)) !important;
  }
  body.weddings-page #wedding-packages .package-card { max-width: 230px !important; }
  body.weddings-page #wedding-packages .package-card img { max-height: 173px !important; }
}
@media (max-width: 760px) {
  body.weddings-page #wedding-packages .packages-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    max-width: 560px !important;
  }
  body.weddings-page #wedding-packages .package-card { max-width: 260px !important; }
  body.weddings-page #wedding-packages .package-card img { max-height: 195px !important; }
}
@media (max-width: 470px) {
  body.weddings-page #wedding-packages .packages-grid { grid-template-columns: 1fr !important; max-width: 290px !important; }
  body.weddings-page #wedding-packages .package-card { max-width: 290px !important; }
  body.weddings-page #wedding-packages .package-card img { max-height: 218px !important; }
}
/* One scroll-arrow system everywhere: exactly the dark/gold circular treatment used
   on Collaborations. Page-specific legacy colours/backgrounds are overridden. */
html body .section-scroll-next.preview-v2-scroll-next {
  box-sizing: border-box !important;
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  min-height: 52px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid #d2a23a !important;
  border-radius: 999px !important;
  background: rgba(8,8,8,.94) !important;
  color: #efc767 !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.34) !important;
  opacity: 1 !important;
  filter: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
html body > .section-scroll-next.preview-v2-scroll-next {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: 18px !important;
  z-index: 96 !important;
  transform: translateX(-50%) !important;
}
html body .section-scroll-next.preview-v2-scroll-next svg {
  width: 25px !important;
  height: 25px !important;
  display: block !important;
  overflow: visible !important;
}
html body .section-scroll-next.preview-v2-scroll-next svg path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
html body .section-scroll-next.preview-v2-scroll-next:hover,
html body .section-scroll-next.preview-v2-scroll-next:focus-visible {
  background: #d2a23a !important;
  border-color: #d2a23a !important;
  color: #080808 !important;
  outline: none !important;
}
html body .section-scroll-next.preview-v2-scroll-next:focus-visible {
  box-shadow: 0 0 0 3px rgba(210,162,58,.22), 0 10px 28px rgba(0,0,0,.34) !important;
}
@media (max-width: 720px) {
  html body .section-scroll-next.preview-v2-scroll-next {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
  }
  html body > .section-scroll-next.preview-v2-scroll-next { bottom: 14px !important; }
  html body .section-scroll-next.preview-v2-scroll-next svg { width: 22px !important; height: 22px !important; }
}

/* Build 262 — promoted original public pages: outstanding consistency fixes.
   This layer deliberately changes presentation only. No retired *2 HTML page is targeted. */

/* Wedding Advice: the shared public header changes from 108px to 86px at 1320px.
   Keep the opening hero + header equal to one complete viewport at that same breakpoint. */
html body.resource-page-advice main > .article-hero,
html body.resource-page-advice main > .article-hero > .article-hero-grid {
  min-height: calc(100vh - 108px) !important;
  min-height: calc(100svh - 108px) !important;
}
@media (max-width: 1320px) {
  html body.resource-page-advice main > .article-hero,
  html body.resource-page-advice main > .article-hero > .article-hero-grid {
    min-height: calc(100vh - 86px) !important;
    min-height: calc(100svh - 86px) !important;
  }
}

/* Wedding Advice: make the reading field / guide rail contrast explicit and use the
   exact warm-ivory colour used by the light V2 sections elsewhere on the site. */
html body.resource-page-advice .article-content-section {
  background: #090909 !important;
}
html body.resource-page-advice .article-side-card {
  background: #f4efe7 !important;
  color: #17130e !important;
  border-color: rgba(127,92,23,.38) !important;
  box-shadow: 0 24px 56px rgba(0,0,0,.34) !important;
}
html body.resource-page-advice .article-side-card h2,
html body.resource-page-advice .article-side-card strong {
  color: #17130e !important;
}
html body.resource-page-advice .article-side-card .article-toc-list a,
html body.resource-page-advice .article-side-card .article-side-links a,
html body.resource-page-advice .article-side-card .article-topic-chip {
  color: #30281e !important;
}
html body.resource-page-advice .article-side-card .article-toc-list a:hover,
html body.resource-page-advice .article-side-card .article-toc-list a:focus-visible,
html body.resource-page-advice .article-side-card .article-side-links a:hover,
html body.resource-page-advice .article-side-card .article-side-links a:focus-visible,
html body.resource-page-advice .article-side-card .article-topic-chip:hover,
html body.resource-page-advice .article-side-card .article-topic-chip:focus-visible {
  color: #7f5c17 !important;
}

/* Weddings: the five 4:3 package chooser images are navigation thumbnails, not hero
   artwork. Keep them substantially smaller while preserving the full source image. */
html body.weddings-page #wedding-packages .packages-grid {
  width: 100% !important;
  max-width: 860px !important;
  grid-template-columns: repeat(5, minmax(118px, 150px)) !important;
  justify-content: center !important;
  gap: clamp(10px, .9vw, 14px) !important;
}
html body.weddings-page #wedding-packages .package-card {
  width: 100% !important;
  max-width: 150px !important;
  min-width: 0 !important;
}
html body.weddings-page #wedding-packages .package-card img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 113px !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: contain !important;
  object-position: center !important;
}
@media (max-width: 1180px) {
  html body.weddings-page #wedding-packages .packages-grid {
    max-width: 510px !important;
    grid-template-columns: repeat(3, minmax(120px, 150px)) !important;
  }
  html body.weddings-page #wedding-packages .package-card { max-width: 150px !important; }
  html body.weddings-page #wedding-packages .package-card img { max-height: 113px !important; }
}
@media (max-width: 760px) {
  html body.weddings-page #wedding-packages .packages-grid {
    max-width: 350px !important;
    grid-template-columns: repeat(2, minmax(0, 165px)) !important;
  }
  html body.weddings-page #wedding-packages .package-card { max-width: 165px !important; }
  html body.weddings-page #wedding-packages .package-card img { max-height: 124px !important; }
}
@media (max-width: 470px) {
  html body.weddings-page #wedding-packages .packages-grid {
    max-width: 210px !important;
    grid-template-columns: 1fr !important;
  }
  html body.weddings-page #wedding-packages .package-card { max-width: 210px !important; }
  html body.weddings-page #wedding-packages .package-card img { max-height: 158px !important; }
}

/* Weddings: explicitly pin the promoted original page to the shared Collaborations
   header geometry so older Weddings-specific styles cannot alter the top navigation. */
html body.weddings-page .site-header .header-inner {
  width: calc(100% - 56px) !important;
  max-width: none !important;
  min-height: 108px !important;
  margin-inline: auto !important;
  padding-block: 0 !important;
}
@media (min-width: 1321px) {
  html body.weddings-page .site-header .header-inner {
    grid-template-columns: 250px minmax(0,1fr) !important;
    gap: clamp(28px, 2.5vw, 54px) !important;
  }
  html body.weddings-page .site-header .logo-link { width: 250px !important; }
  html body.weddings-page .site-header .nav-toggle { display: none !important; }
  html body.weddings-page .site-header .main-nav {
    position: static !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: clamp(8px, .72vw, 15px) !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    white-space: nowrap !important;
  }
  html body.weddings-page .site-header .main-nav > a,
  html body.weddings-page .site-header .main-nav > .nav-dropdown > summary {
    font-size: clamp(.72rem, .66vw, .87rem) !important;
    letter-spacing: .045em !important;
    font-weight: 800 !important;
  }
  html body.weddings-page .site-header .main-nav > .nav-availability {
    padding: 10px 13px !important;
  }
}
@media (min-width: 1321px) and (max-width: 1500px) {
  html body.weddings-page .site-header .header-inner {
    grid-template-columns: 220px minmax(0,1fr) !important;
    gap: 24px !important;
  }
  html body.weddings-page .site-header .logo-link { width: 220px !important; }
  html body.weddings-page .site-header .main-nav { gap: 8px !important; }
  html body.weddings-page .site-header .main-nav > a,
  html body.weddings-page .site-header .main-nav > .nav-dropdown > summary {
    font-size: .72rem !important;
    letter-spacing: .025em !important;
  }
  html body.weddings-page .site-header .main-nav > .nav-availability { padding: 9px 10px !important; }
}
@media (max-width: 1320px) {
  html body.weddings-page .site-header .header-inner {
    width: calc(100% - 34px) !important;
    min-height: 86px !important;
    grid-template-columns: minmax(180px, 240px) 1fr 46px !important;
    gap: 16px !important;
  }
  html body.weddings-page .site-header .logo-link { width: min(240px, 100%) !important; }
  html body.weddings-page .site-header .nav-toggle {
    display: inline-grid !important;
    place-items: center !important;
    justify-self: end !important;
  }
  html body.weddings-page .site-header .main-nav {
    position: fixed !important;
    z-index: 130 !important;
    top: 86px !important;
    left: 0 !important;
    right: 0 !important;
    display: none !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    padding: 14px 24px 26px !important;
    background: rgba(0,0,0,.985) !important;
    border-top: 1px solid rgba(210,162,58,.2) !important;
    border-bottom: 1px solid rgba(210,162,58,.28) !important;
    max-height: calc(100vh - 86px) !important;
    overflow-y: auto !important;
    white-space: normal !important;
  }
  html body.weddings-page.nav-open .site-header .main-nav { display: flex !important; }
}
@media (max-width: 640px) {
  html body.weddings-page .site-header .header-inner {
    width: calc(100% - 24px) !important;
    grid-template-columns: 190px 1fr 44px !important;
  }
  html body.weddings-page .site-header .logo-link { width: 190px !important; }
}

/* Scroll controls: use the actual Collaborations visual treatment everywhere.
   Generic V2 arrows remain interactive; Collaborations keeps its own is-visible behaviour. */
html body .section-scroll-next {
  box-sizing: border-box !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
  padding: 0 !important;
  border: 1px solid rgba(244,210,124,.72) !important;
  border-radius: 50% !important;
  background: rgba(5,5,5,.12) !important;
  color: var(--gold-light, #f4d27c) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.18) !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
  opacity: .86 !important;
  pointer-events: auto !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  transition: opacity .2s ease, transform .2s ease, border-color .2s ease, background .2s ease !important;
}
html body > .section-scroll-next {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: max(20px, env(safe-area-inset-bottom)) !important;
  z-index: 9998 !important;
  transform: translate(-50%, 0) !important;
}
html body .section-scroll-next svg {
  width: 23px !important;
  height: 23px !important;
  display: block !important;
  overflow: visible !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.65)) !important;
  transition: transform .18s ease !important;
}
html body .section-scroll-next svg path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
html body .section-scroll-next:hover,
html body .section-scroll-next:focus-visible {
  opacity: 1 !important;
  border-color: var(--gold-light, #f4d27c) !important;
  background: rgba(5,5,5,.28) !important;
  color: var(--gold-light, #f4d27c) !important;
  outline: none !important;
}
html body .section-scroll-next:hover svg,
html body .section-scroll-next:focus-visible svg {
  transform: translateY(2px) !important;
}
html body.page2-preview .section-scroll-next.is-at-end {
  opacity: .38 !important;
}
html body.collaborations-page .section-scroll-next {
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate(-50%, 12px) !important;
}
html body.collaborations-page .section-scroll-next.is-visible {
  opacity: .86 !important;
  pointer-events: auto !important;
  transform: translate(-50%, 0) !important;
}
html body.collaborations-page .section-scroll-next.is-visible:hover,
html body.collaborations-page .section-scroll-next.is-visible:focus-visible {
  opacity: 1 !important;
}
@media (max-width: 640px) {
  html body .section-scroll-next {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
  }
  html body > .section-scroll-next {
    bottom: max(14px, env(safe-area-inset-bottom)) !important;
  }
  html body .section-scroll-next svg {
    width: 20px !important;
    height: 20px !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  html body .section-scroll-next,
  html body .section-scroll-next svg {
    transition: none !important;
  }
}

/* Build 264 — Wedding Advice landing page, built strictly on top of Build 262.
   This is a CSS-only transformation of the existing wedding-advice.php markup:
   full-depth photographic hero, real anchor scroll control, warm-light category rail,
   image-led horizontal advice carousel and deliberate light/dark section contrast. */

/* LANDING HERO — use the same photographic, full-viewport language as the article page. */
html body.resource-page-advice main > .resource-hero {
  position: relative !important;
  min-height: calc(100vh - 108px) !important;
  min-height: calc(100svh - 108px) !important;
  padding: 0 !important;
  display: flex !important;
  align-items: stretch !important;
  overflow: hidden !important;
  isolation: isolate !important;
  border-bottom: 1px solid rgba(210,162,58,.22) !important;
  background:
    linear-gradient(90deg,rgba(4,4,4,.96) 0%,rgba(4,4,4,.87) 28%,rgba(4,4,4,.55) 53%,rgba(4,4,4,.22) 74%,rgba(4,4,4,.12) 100%),
    linear-gradient(180deg,rgba(0,0,0,.14) 0%,rgba(0,0,0,.05) 58%,rgba(0,0,0,.7) 100%),
    url("../img/home-v2/home-hero-ballroom-1536.webp") 64% 45% / cover no-repeat !important;
}
html body.resource-page-advice main > .resource-hero::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg,transparent,rgba(210,162,58,.72),transparent) !important;
  pointer-events: none !important;
}
html body.resource-page-advice main > .resource-hero > .resource-hero-grid {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  max-width: none !important;
  min-height: calc(100vh - 108px) !important;
  min-height: calc(100svh - 108px) !important;
  display: flex !important;
  align-items: center !important;
  padding: clamp(70px,8vh,118px) var(--public-content-gutter,clamp(28px,4vw,72px)) clamp(96px,11vh,142px) !important;
}
html body.resource-page-advice main > .resource-hero .resource-hero-copy {
  position: static !important;
  width: min(790px,58vw) !important;
  max-width: 790px !important;
  min-width: 0 !important;
  padding: clamp(22px,3vw,42px) 0 !important;
  text-shadow: 0 2px 18px rgba(0,0,0,.52) !important;
}
html body.resource-page-advice main > .resource-hero .resource-hero-copy .kicker {
  color: #efc767 !important;
}
html body.resource-page-advice main > .resource-hero .resource-hero-copy h1 {
  max-width: 780px !important;
  margin: .28rem 0 1rem !important;
  color: #fff8ea !important;
  font-size: clamp(2.8rem,4.65vw,5.75rem) !important;
  line-height: .99 !important;
  text-wrap: balance !important;
}
html body.resource-page-advice main > .resource-hero .resource-hero-copy > p:not(.kicker) {
  max-width: 710px !important;
  margin: 0 !important;
  color: rgba(255,248,234,.9) !important;
  font-size: clamp(1.06rem,1.3vw,1.24rem) !important;
  line-height: 1.68 !important;
}
/* The old small graphic is no longer the hero visual; the full bleed wedding photograph is. */
html body.resource-page-advice main > .resource-hero .resource-hero-media {
  display: none !important;
}
html body.resource-page-advice main > .resource-hero .hero-actions {
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  margin-top: 28px !important;
}
html body.resource-page-advice main > .resource-hero .hero-actions > a:not([href="#articles"]) {
  border-color: rgba(244,210,124,.72) !important;
  background: rgba(5,5,5,.42) !important;
  color: #f7e6b0 !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.24) !important;
}
html body.resource-page-advice main > .resource-hero .hero-actions > a:not([href="#articles"]):hover,
html body.resource-page-advice main > .resource-hero .hero-actions > a:not([href="#articles"]):focus-visible {
  background: #d2a23a !important;
  border-color: #d2a23a !important;
  color: #080808 !important;
}

/* Re-use the existing Browse advice anchor as the missing Collaborations-style scroll control. */
html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"] {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: 24px !important;
  z-index: 8 !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  transform: translateX(-50%) !important;
  border: 1px solid rgba(210,162,58,.62) !important;
  border-radius: 50% !important;
  background: rgba(5,5,5,.28) !important;
  color: var(--gold-light,#f4d27c) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.34) !important;
  backdrop-filter: blur(7px) !important;
  -webkit-backdrop-filter: blur(7px) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: -9999px !important;
  overflow: hidden !important;
  opacity: .88 !important;
  transition: opacity .18s ease,border-color .18s ease,background .18s ease !important;
}
html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"]::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 10px !important;
  width: 1.8px !important;
  height: 17px !important;
  border-radius: 2px !important;
  background: currentColor !important;
  transform: translateX(-50%) !important;
}
html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"]::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 20px !important;
  width: 9px !important;
  height: 9px !important;
  border-right: 1.8px solid currentColor !important;
  border-bottom: 1.8px solid currentColor !important;
  transform: translateX(-50%) rotate(45deg) !important;
}
html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"]:hover,
html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"]:focus-visible {
  opacity: 1 !important;
  border-color: var(--gold-light,#f4d27c) !important;
  background: rgba(5,5,5,.42) !important;
  color: var(--gold-light,#f4d27c) !important;
  outline: none !important;
}
html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"]:focus-visible {
  box-shadow: 0 0 0 3px rgba(210,162,58,.22),0 10px 28px rgba(0,0,0,.34) !important;
}

/* ADVICE LIBRARY — dark editorial field with the warm-light guide rail from article pages. */
html body.resource-page-advice main > #articles.resource-section {
  scroll-margin-top: 108px !important;
  padding: clamp(58px,6.2vw,94px) 0 !important;
  background:
    radial-gradient(circle at 8% 8%,rgba(210,162,58,.05),transparent 26%),
    linear-gradient(180deg,#0c0b09 0%,#080808 100%) !important;
  border-bottom: 1px solid rgba(210,162,58,.17) !important;
}
html body.resource-page-advice main > #articles > .container {
  width: 100% !important;
  max-width: none !important;
  display: grid !important;
  grid-template-columns: minmax(285px,350px) minmax(0,1fr) !important;
  grid-template-rows: auto minmax(0,1fr) !important;
  column-gap: clamp(36px,5vw,82px) !important;
  row-gap: 24px !important;
  align-items: start !important;
  padding-left: var(--public-content-gutter,clamp(28px,4vw,72px)) !important;
  padding-right: var(--public-content-gutter,clamp(28px,4vw,72px)) !important;
}
html body.resource-page-advice main > #articles .resource-section-head {
  grid-column: 2 !important;
  grid-row: 1 !important;
  max-width: 880px !important;
  margin: 0 !important;
}
html body.resource-page-advice main > #articles .resource-section-head .kicker {
  color: #efc767 !important;
}
html body.resource-page-advice main > #articles .resource-section-head h2 {
  margin: .15rem 0 .75rem !important;
  color: #fff5e4 !important;
  font-size: clamp(2.2rem,3.35vw,4rem) !important;
  line-height: 1.05 !important;
  text-wrap: balance !important;
}
html body.resource-page-advice main > #articles .resource-section-head p:not(.kicker) {
  max-width: 760px !important;
  color: #cfc6b9 !important;
  font-size: clamp(1rem,1.08vw,1.12rem) !important;
  line-height: 1.72 !important;
}

/* Existing category toolbar becomes the visible light side menu. */
html body.resource-page-advice main > #articles .advice-toolbar {
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
  position: sticky !important;
  top: 122px !important;
  display: grid !important;
  gap: 0 !important;
  align-content: start !important;
  margin: 0 !important;
  padding: clamp(24px,2.4vw,34px) !important;
  border: 1px solid rgba(178,132,38,.42) !important;
  border-radius: 14px !important;
  background: linear-gradient(155deg,#f5f0e7 0%,#eee5d8 100%) !important;
  color: #17130e !important;
  box-shadow: 0 24px 56px rgba(0,0,0,.3) !important;
}
html body.resource-page-advice main > #articles .advice-toolbar::before {
  content: "Browse Wedding Advice" !important;
  display: block !important;
  margin: 0 0 13px !important;
  color: #18130d !important;
  font-family: Lato,Arial,sans-serif !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
}
html body.resource-page-advice main > #articles .advice-toolbar .btn {
  width: 100% !important;
  min-height: 0 !important;
  justify-content: space-between !important;
  padding: 12px 2px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(99,78,47,.14) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #2c241c !important;
  text-align: left !important;
  font-size: .78rem !important;
  line-height: 1.35 !important;
  letter-spacing: .035em !important;
  white-space: normal !important;
}
html body.resource-page-advice main > #articles .advice-toolbar .btn:first-of-type {
  border-top: 1px solid rgba(99,78,47,.14) !important;
}
html body.resource-page-advice main > #articles .advice-toolbar .btn::after {
  content: "→" !important;
  margin-left: 12px !important;
  color: #a57417 !important;
  font-size: 1rem !important;
  line-height: 1 !important;
}
html body.resource-page-advice main > #articles .advice-toolbar .btn:hover,
html body.resource-page-advice main > #articles .advice-toolbar .btn:focus-visible {
  color: #8e6414 !important;
  background: rgba(154,111,26,.055) !important;
  outline: none !important;
}
html body.resource-page-advice main > #articles .advice-toolbar .btn.btn-primary {
  padding-left: 10px !important;
  padding-right: 10px !important;
  background: rgba(154,111,26,.12) !important;
  color: #744f0c !important;
  font-weight: 900 !important;
}

/* The existing article list becomes an image-led horizontal carousel. */
html body.resource-page-advice main > #articles .advice-grid {
  grid-column: 2 !important;
  grid-row: 2 !important;
  position: relative !important;
  display: grid !important;
  grid-template-columns: none !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(350px,46%) !important;
  gap: 20px !important;
  width: 100% !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 0 0 18px !important;
  margin: 0 !important;
  scroll-snap-type: x mandatory !important;
  scroll-padding-inline: 2px !important;
  scroll-behavior: smooth !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(210,162,58,.72) rgba(255,255,255,.055) !important;
  overscroll-behavior-inline: contain !important;
}
html body.resource-page-advice main > #articles .advice-grid::-webkit-scrollbar {
  height: 7px !important;
}
html body.resource-page-advice main > #articles .advice-grid::-webkit-scrollbar-track {
  background: rgba(255,255,255,.05) !important;
  border-radius: 999px !important;
}
html body.resource-page-advice main > #articles .advice-grid::-webkit-scrollbar-thumb {
  background: rgba(210,162,58,.72) !important;
  border-radius: 999px !important;
}
html body.resource-page-advice main > #articles .advice-card {
  position: relative !important;
  min-height: 520px !important;
  padding: 0 0 26px !important;
  overflow: hidden !important;
  scroll-snap-align: start !important;
  border: 1px solid rgba(210,162,58,.27) !important;
  border-radius: 18px !important;
  background: linear-gradient(155deg,rgba(20,17,12,.98),rgba(7,7,7,.99)) !important;
  box-shadow: 0 20px 46px rgba(0,0,0,.28) !important;
  transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease !important;
}
html body.resource-page-advice main > #articles .advice-card:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(210,162,58,.52) !important;
  box-shadow: 0 26px 58px rgba(0,0,0,.38) !important;
}
html body.resource-page-advice main > #articles .advice-card::before {
  content: "" !important;
  display: block !important;
  width: 100% !important;
  height: clamp(205px,16vw,270px) !important;
  background-position: center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  border-bottom: 1px solid rgba(210,162,58,.24) !important;
}
html body.resource-page-advice main > #articles .advice-card::after {
  content: "" !important;
  position: absolute !important;
  z-index: 1 !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  height: clamp(205px,16vw,270px) !important;
  background: linear-gradient(180deg,rgba(0,0,0,.02) 48%,rgba(7,7,7,.5) 100%) !important;
  pointer-events: none !important;
}
html body.resource-page-advice main > #articles .advice-card:nth-child(8n+1)::before { background-image: url("../img/optimized/qa-image-pass-107/site-content/weddings-v2/wedding-ceremony-barn-800.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(8n+2)::before { background-image: url("../img/optimized/qa-image-pass-107/site-content/weddings-v2/wedding-ceremony-editorial-close-800.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(8n+3)::before { background-image: url("../img/optimized/qa-image-pass-107/gallery-v3/wedding-barn-800.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(8n+4)::before { background-image: url("../img/home-v2/home-hero-ballroom-800.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(8n+5)::before { background-image: url("../img/optimized/qa-image-pass-107/gallery-v3/wedding-church-800.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(8n+6)::before { background-image: url("../img/optimized/qa3/heroes/wedding-ceremony-church-hero-800.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(8n+7)::before { background-image: url("../img/optimized/qa-image-pass-107/site-content/weddings-v2/wedding-ceremony-editorial-full-800.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(8n+8)::before { background-image: url("../img/optimized/qa3/heroes/james-performance-800.webp") !important; }
html body.resource-page-advice main > #articles .advice-card > * {
  position: relative !important;
  z-index: 2 !important;
}
html body.resource-page-advice main > #articles .advice-card > div:first-child {
  margin: 22px 24px 0 !important;
}
html body.resource-page-advice main > #articles .advice-card h2 {
  margin: .55rem 24px .7rem !important;
  color: #fff4df !important;
  font-size: clamp(1.55rem,2vw,2.15rem) !important;
  line-height: 1.14 !important;
  text-wrap: balance !important;
}
html body.resource-page-advice main > #articles .advice-card > p {
  margin: 0 24px !important;
  color: #d2c9bc !important;
  line-height: 1.68 !important;
}
html body.resource-page-advice main > #articles .advice-card .resource-meta {
  margin: 16px 24px 0 !important;
}
html body.resource-page-advice main > #articles .advice-card .text-link {
  margin: auto 24px 0 !important;
  padding-top: 18px !important;
  color: #efc767 !important;
}
html body.resource-page-advice main > #articles .resource-empty {
  grid-column: 2 !important;
  grid-row: 2 !important;
}

/* Chromium's native generated scroll buttons make the CSS-only carousel controllable
   without touching the PHP or any shared JavaScript. Other browsers retain touch/trackpad scroll. */
@supports selector(.advice-grid::scroll-button(right)) {
  html body.resource-page-advice main > #articles .advice-grid {
    padding-bottom: 26px !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left),
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right) {
    width: 42px !important;
    height: 42px !important;
    border: 1px solid rgba(210,162,58,.56) !important;
    border-radius: 50% !important;
    background: rgba(6,6,6,.88) !important;
    color: #f4d27c !important;
    box-shadow: 0 10px 26px rgba(0,0,0,.3) !important;
    font: 700 24px/1 Georgia,serif !important;
    cursor: pointer !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left) { content: "‹" !important; }
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right) { content: "›" !important; }
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left):disabled,
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right):disabled {
    opacity: .28 !important;
    cursor: default !important;
  }
}

/* FINAL CTA — a genuine light section so the page does not become one endless black field. */
html body.resource-page-advice main > .resource-cta.resource-section-alt {
  padding: clamp(58px,6vw,88px) 0 !important;
  background: #f4efe7 !important;
  color: #17130e !important;
  border-top: 1px solid rgba(127,92,23,.26) !important;
  border-bottom: 0 !important;
}
html body.resource-page-advice main > .resource-cta .resource-cta-shell {
  border-color: rgba(127,92,23,.38) !important;
  background: linear-gradient(135deg,#fbf7ef 0%,#eee4d5 100%) !important;
  box-shadow: 0 24px 56px rgba(47,33,12,.13) !important;
}
html body.resource-page-advice main > .resource-cta .kicker { color: #8f6516 !important; }
html body.resource-page-advice main > .resource-cta h2 { color: #17130e !important; }
html body.resource-page-advice main > .resource-cta p { color: #50483e !important; }
html body.resource-page-advice main > .resource-cta .btn:not(.btn-primary) {
  border-color: rgba(99,78,47,.38) !important;
  color: #241e17 !important;
  background: rgba(255,255,255,.38) !important;
}

@media (max-width: 1320px) {
  html body.resource-page-advice main > .resource-hero,
  html body.resource-page-advice main > .resource-hero > .resource-hero-grid {
    min-height: calc(100vh - 86px) !important;
    min-height: calc(100svh - 86px) !important;
  }
  html body.resource-page-advice main > #articles.resource-section { scroll-margin-top: 86px !important; }
}

@media (max-width: 980px) {
  html body.resource-page-advice main > .resource-hero {
    background-position: 60% 48% !important;
  }
  html body.resource-page-advice main > .resource-hero .resource-hero-copy {
    width: min(760px,82vw) !important;
  }
  html body.resource-page-advice main > #articles > .container {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto auto !important;
    row-gap: 24px !important;
  }
  html body.resource-page-advice main > #articles .resource-section-head {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }
  html body.resource-page-advice main > #articles .advice-toolbar {
    grid-column: 1 !important;
    grid-row: 2 !important;
    position: static !important;
    display: flex !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    padding: 22px !important;
  }
  html body.resource-page-advice main > #articles .advice-toolbar::before {
    width: 100% !important;
    margin-bottom: 3px !important;
  }
  html body.resource-page-advice main > #articles .advice-toolbar .btn {
    width: auto !important;
    padding: 9px 12px !important;
    border: 1px solid rgba(99,78,47,.2) !important;
    border-radius: 999px !important;
  }
  html body.resource-page-advice main > #articles .advice-toolbar .btn:first-of-type {
    border-top: 1px solid rgba(99,78,47,.2) !important;
  }
  html body.resource-page-advice main > #articles .advice-toolbar .btn::after { display: none !important; }
  html body.resource-page-advice main > #articles .advice-grid,
  html body.resource-page-advice main > #articles .resource-empty {
    grid-column: 1 !important;
    grid-row: 3 !important;
  }
  html body.resource-page-advice main > #articles .advice-grid {
    grid-auto-columns: minmax(320px,72%) !important;
  }
}

@media (max-width: 640px) {
  html body.resource-page-advice main > .resource-hero {
    background:
      linear-gradient(90deg,rgba(4,4,4,.93) 0%,rgba(4,4,4,.76) 48%,rgba(4,4,4,.44) 100%),
      linear-gradient(180deg,rgba(0,0,0,.1) 0%,rgba(0,0,0,.04) 58%,rgba(0,0,0,.72) 100%),
      url("../img/home-v2/home-hero-ballroom-800.webp") 63% 50% / cover no-repeat !important;
  }
  html body.resource-page-advice main > .resource-hero > .resource-hero-grid {
    padding: 48px 22px 92px !important;
  }
  html body.resource-page-advice main > .resource-hero .resource-hero-copy {
    width: 100% !important;
    max-width: 560px !important;
  }
  html body.resource-page-advice main > .resource-hero .resource-hero-copy h1 {
    font-size: clamp(2.45rem,12vw,4rem) !important;
  }
  html body.resource-page-advice main > .resource-hero .hero-actions > a:not([href="#articles"]) {
    width: 100% !important;
    justify-content: center !important;
  }
  html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"] {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    bottom: 16px !important;
  }
  html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"]::before {
    top: 9px !important;
    height: 16px !important;
  }
  html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"]::after {
    top: 18px !important;
  }
  html body.resource-page-advice main > #articles > .container {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  html body.resource-page-advice main > #articles .advice-toolbar {
    padding: 19px !important;
  }
  html body.resource-page-advice main > #articles .advice-grid {
    grid-auto-columns: minmax(286px,88%) !important;
    gap: 14px !important;
  }
  html body.resource-page-advice main > #articles .advice-card {
    min-height: 495px !important;
  }
  html body.resource-page-advice main > #articles .advice-card::before,
  html body.resource-page-advice main > #articles .advice-card::after {
    height: 205px !important;
  }
  html body.resource-page-advice main > #articles .advice-card > div:first-child,
  html body.resource-page-advice main > #articles .advice-card h2,
  html body.resource-page-advice main > #articles .advice-card > p,
  html body.resource-page-advice main > #articles .advice-card .resource-meta,
  html body.resource-page-advice main > #articles .advice-card .text-link {
    margin-left: 20px !important;
    margin-right: 20px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.resource-page-advice main > #articles .advice-grid { scroll-behavior: auto !important; }
  html body.resource-page-advice main > #articles .advice-card { transition: none !important; }
}


/* Build 265 — Wedding Advice landing refinements after live QA */
html body.resource-page-advice,
html body.resource-page-advice main,
html body.resource-page-advice main > #articles,
html body.resource-page-advice main > #articles > .container {
  overflow-x: clip !important;
}

html body.resource-page-advice main > .resource-hero {
  overflow: clip !important;
}
html body.resource-page-advice main > .resource-hero .hero-actions {
  position: static !important;
}
html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"] {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: 20px !important;
  transform: translateX(-50%) !important;
  margin: 0 !important;
  z-index: 5 !important;
}

html body.resource-page-advice main > #articles > .container {
  grid-template-columns: minmax(280px,360px) minmax(0,1fr) !important;
  column-gap: clamp(24px,2.4vw,38px) !important;
  max-width: min(1760px, calc(100vw - 48px)) !important;
}

html body.resource-page-advice main > #articles .advice-toolbar {
  font-size: 0 !important;
  padding: 28px 34px !important;
}
html body.resource-page-advice main > #articles .advice-toolbar::before {
  font-size: .96rem !important;
  letter-spacing: .12em !important;
}
html body.resource-page-advice main > #articles .advice-toolbar .btn {
  padding: 16px 18px !important;
  font-size: .99rem !important;
  font-weight: 700 !important;
  letter-spacing: .035em !important;
}
html body.resource-page-advice main > #articles .advice-toolbar .btn span,
html body.resource-page-advice main > #articles .advice-toolbar .btn {
  line-height: 1.25 !important;
}

html body.resource-page-advice main > #articles .advice-grid {
  display: flex !important;
  align-items: stretch !important;
  gap: 22px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 4px 2px 24px !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-inline: contain !important;
  scroll-snap-type: x proximity !important;
  scroll-padding-inline: 2px !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  box-sizing: border-box !important;
}
html body.resource-page-advice main > #articles .advice-grid::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}
@supports selector(.advice-grid::scroll-button(right)) {
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left),
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right) {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    content: "" !important;
  }
}

html body.resource-page-advice main > #articles .advice-card {
  flex: 0 0 clamp(320px,31vw,408px) !important;
  width: clamp(320px,31vw,408px) !important;
  min-width: clamp(320px,31vw,408px) !important;
  min-height: 540px !important;
  display: flex !important;
  flex-direction: column !important;
  cursor: pointer !important;
}
html body.resource-page-advice main > #articles .advice-card:focus-within {
  border-color: rgba(210,162,58,.62) !important;
  box-shadow: 0 0 0 1px rgba(210,162,58,.22), 0 26px 58px rgba(0,0,0,.38) !important;
}
html body.resource-page-advice main > #articles .advice-card::before,
html body.resource-page-advice main > #articles .advice-card::after {
  height: clamp(220px,17vw,280px) !important;
}
html body.resource-page-advice main > #articles .advice-card > div:first-child {
  margin-top: 20px !important;
}
html body.resource-page-advice main > #articles .advice-card h2 {
  margin-bottom: .9rem !important;
}
html body.resource-page-advice main > #articles .advice-card > p {
  margin-bottom: 0 !important;
}
html body.resource-page-advice main > #articles .advice-card .resource-meta {
  margin-top: 18px !important;
  pointer-events: none !important;
}
html body.resource-page-advice main > #articles .advice-card .text-link {
  position: absolute !important;
  inset: 0 !important;
  z-index: 4 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  color: transparent !important;
  font-size: 0 !important;
  text-indent: -9999px !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
}
html body.resource-page-advice main > #articles .advice-card .text-link::after {
  content: "READ ARTICLE →" !important;
  position: absolute !important;
  left: 24px !important;
  right: auto !important;
  bottom: 24px !important;
  text-indent: 0 !important;
  overflow: visible !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  letter-spacing: .045em !important;
  color: #efc767 !important;
  white-space: nowrap !important;
}
html body.resource-page-advice main > #articles .advice-card .text-link:focus-visible {
  outline: none !important;
}
html body.resource-page-advice main > #articles .advice-card .text-link:focus-visible::before {
  content: "" !important;
  position: absolute !important;
  inset: 8px !important;
  border-radius: 14px !important;
  box-shadow: inset 0 0 0 2px rgba(240,205,117,.78) !important;
}

html body.resource-page-advice main > #articles .advice-card:nth-child(10n+1)::before { background-image: url("../img/generated/wedding-advice-265/01-songs-and-requests.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(10n+2)::before { background-image: url("../img/generated/wedding-advice-265/02-supplier-checklist.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(10n+3)::before { background-image: url("../img/generated/wedding-advice-265/03-electric-violin-backing-tracks.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(10n+4)::before { background-image: url("../img/generated/wedding-advice-265/04-behind-the-scenes-setup.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(10n+5)::before { background-image: url("../img/generated/wedding-advice-265/05-yorkshire-venue.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(10n+6)::before { background-image: url("../img/generated/wedding-advice-265/06-live-music-venue-planning.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(10n+7)::before { background-image: url("../img/generated/wedding-advice-265/07-dj-live-musician-both.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(10n+8)::before { background-image: url("../img/generated/wedding-advice-265/08-drinks-reception-live-music.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(10n+9)::before { background-image: url("../img/generated/wedding-advice-265/09-civil-church-celebrant.webp") !important; }
html body.resource-page-advice main > #articles .advice-card:nth-child(10n+10)::before { background-image: url("../img/generated/wedding-advice-265/10-aisle-song-timing.webp") !important; }

@media (max-width: 1180px) {
  html body.resource-page-advice main > #articles > .container {
    grid-template-columns: 320px minmax(0,1fr) !important;
    max-width: min(100vw - 32px, 1600px) !important;
  }
  html body.resource-page-advice main > #articles .advice-card {
    flex-basis: clamp(312px,46vw,390px) !important;
    width: clamp(312px,46vw,390px) !important;
    min-width: clamp(312px,46vw,390px) !important;
  }
}

@media (max-width: 980px) {
  html body.resource-page-advice main > #articles > .container {
    max-width: min(100vw - 24px, 1200px) !important;
  }
  html body.resource-page-advice main > #articles .advice-toolbar {
    font-size: initial !important;
    padding: 24px !important;
  }
  html body.resource-page-advice main > #articles .advice-toolbar::before {
    width: 100% !important;
    margin-bottom: 6px !important;
  }
  html body.resource-page-advice main > #articles .advice-toolbar .btn {
    font-size: .95rem !important;
    padding: 11px 14px !important;
  }
  html body.resource-page-advice main > #articles .advice-grid {
    padding-bottom: 8px !important;
  }
}

@media (max-width: 640px) {
  html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"] {
    bottom: 18px !important;
  }
  html body.resource-page-advice main > #articles > .container {
    max-width: calc(100vw - 12px) !important;
  }
  html body.resource-page-advice main > #articles .advice-toolbar {
    padding: 20px !important;
  }
  html body.resource-page-advice main > #articles .advice-toolbar .btn {
    font-size: .92rem !important;
  }
  html body.resource-page-advice main > #articles .advice-card {
    flex-basis: min(86vw, 340px) !important;
    width: min(86vw, 340px) !important;
    min-width: min(86vw, 340px) !important;
    min-height: 510px !important;
  }
  html body.resource-page-advice main > #articles .advice-card::before,
  html body.resource-page-advice main > #articles .advice-card::after {
    height: 205px !important;
  }
}


/* Build 266 — Wedding Advice live QA corrections.
   Corrects the remaining interaction/layout defects without changing page data. */

/* 1. The hero arrow must behave like the site's fixed section control, not as an
   absolutely positioned ornament inside the hero. */
html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"] {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: max(20px, env(safe-area-inset-bottom)) !important;
  z-index: 9998 !important;
  transform: translateX(-50%) !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
  opacity: .86 !important;
}
@media (max-width: 640px) {
  html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"] {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    bottom: max(14px, env(safe-area-inset-bottom)) !important;
  }
}
/* Fade the hero-only anchor away once its hero leaves the viewport, so it cannot
   become a stale "jump back up" control further down the page. */
@supports (animation-timeline: view()) {
  html body.resource-page-advice main > .resource-hero {
    view-timeline-name: --wedding-advice-hero !important;
    view-timeline-axis: block !important;
  }
  html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"] {
    animation-name: wedding-advice-hero-arrow-visibility !important;
    animation-duration: 1ms !important;
    animation-timing-function: linear !important;
    animation-fill-mode: both !important;
    animation-timeline: --wedding-advice-hero !important;
    animation-range: exit 0% exit 42% !important;
  }
  @keyframes wedding-advice-hero-arrow-visibility {
    from { opacity: .86; visibility: visible; pointer-events: auto; }
    to { opacity: 0; visibility: hidden; pointer-events: none; }
  }
}

/* 2. Keep the side menu genuinely interactive and above the scrolling article rail. */
html body.resource-page-advice main > #articles .advice-toolbar {
  z-index: 30 !important;
  isolation: isolate !important;
  overflow: visible !important;
  pointer-events: auto !important;
}
html body.resource-page-advice main > #articles .advice-toolbar .btn {
  position: relative !important;
  z-index: 31 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
}
html body.resource-page-advice main > #articles .advice-grid {
  z-index: 1 !important;
}

/* 3. Carousel geometry: the rail owns its own overflow; the page never does.
   Snap every movement to a whole card, so no article is left half-cut-off. */
html body.resource-page-advice,
html body.resource-page-advice body,
html body.resource-page-advice main {
  max-width: 100% !important;
  overflow-x: clip !important;
}
html body.resource-page-advice main > #articles > .container {
  min-width: 0 !important;
  max-width: min(1760px, calc(100vw - 48px)) !important;
  box-sizing: border-box !important;
}
html body.resource-page-advice main > #articles .advice-grid {
  position: relative !important;
  display: flex !important;
  align-items: stretch !important;
  gap: 22px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 4px 2px 72px !important;
  margin: 0 !important;
  scroll-snap-type: x mandatory !important;
  scroll-padding-inline: 2px !important;
  overscroll-behavior-inline: contain !important;
  scroll-behavior: smooth !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  box-sizing: border-box !important;
}
html body.resource-page-advice main > #articles .advice-grid::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}
html body.resource-page-advice main > #articles .advice-card {
  flex: 0 0 clamp(330px, 31.5%, 400px) !important;
  width: clamp(330px, 31.5%, 400px) !important;
  min-width: clamp(330px, 31.5%, 400px) !important;
  max-width: 400px !important;
  min-height: 560px !important;
  scroll-snap-align: start !important;
  scroll-snap-stop: always !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
html body.resource-page-advice main > #articles .advice-card h2,
html body.resource-page-advice main > #articles .advice-card > p,
html body.resource-page-advice main > #articles .advice-card .resource-meta {
  min-width: 0 !important;
  max-width: calc(100% - 48px) !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}

/* 4. Bring back visible carousel controls, but anchor them to the actual rail.
   Chrome exposes CSS scroll buttons here; reserve the bottom strip so they never
   float away from the carousel or cover article content. */
@supports selector(.advice-grid::scroll-button(right)) {
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left),
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right) {
    display: grid !important;
    place-items: center !important;
    position: absolute !important;
    top: auto !important;
    bottom: 12px !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    border: 1px solid rgba(244,210,124,.72) !important;
    border-radius: 50% !important;
    background: rgba(5,5,5,.9) !important;
    color: #f4d27c !important;
    box-shadow: 0 8px 22px rgba(0,0,0,.32) !important;
    font: 700 26px/1 Georgia,serif !important;
    cursor: pointer !important;
    z-index: 20 !important;
    opacity: 1 !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left) {
    content: "‹" !important;
    left: calc(50% - 52px) !important;
    right: auto !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right) {
    content: "›" !important;
    left: calc(50% + 8px) !important;
    right: auto !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left):hover,
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right):hover,
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left):focus-visible,
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right):focus-visible {
    background: #d2a23a !important;
    border-color: #d2a23a !important;
    color: #080808 !important;
    outline: none !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left):disabled,
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right):disabled {
    opacity: .28 !important;
    cursor: default !important;
  }
}

/* Ensure the full-card article link remains clickable without swallowing the side menu. */
html body.resource-page-advice main > #articles .advice-card .text-link {
  z-index: 4 !important;
}

@media (max-width: 1180px) {
  html body.resource-page-advice main > #articles > .container {
    max-width: min(100vw - 32px, 1600px) !important;
  }
  html body.resource-page-advice main > #articles .advice-card {
    flex-basis: clamp(320px, 46%, 380px) !important;
    width: clamp(320px, 46%, 380px) !important;
    min-width: clamp(320px, 46%, 380px) !important;
  }
}
@media (max-width: 980px) {
  html body.resource-page-advice main > #articles > .container {
    max-width: calc(100vw - 24px) !important;
  }
  html body.resource-page-advice main > #articles .advice-grid {
    padding-bottom: 70px !important;
  }
  html body.resource-page-advice main > #articles .advice-card {
    flex-basis: min(72vw, 360px) !important;
    width: min(72vw, 360px) !important;
    min-width: min(72vw, 360px) !important;
  }
}
@media (max-width: 640px) {
  html body.resource-page-advice main > #articles > .container {
    max-width: calc(100vw - 12px) !important;
  }
  html body.resource-page-advice main > #articles .advice-grid {
    gap: 14px !important;
    padding-bottom: 68px !important;
  }
  html body.resource-page-advice main > #articles .advice-card {
    flex-basis: min(86vw, 340px) !important;
    width: min(86vw, 340px) !important;
    min-width: min(86vw, 340px) !important;
    min-height: 520px !important;
  }
  @supports selector(.advice-grid::scroll-button(right)) {
    html body.resource-page-advice main > #articles .advice-grid::scroll-button(left),
    html body.resource-page-advice main > #articles .advice-grid::scroll-button(right) {
      width: 42px !important;
      height: 42px !important;
      min-width: 42px !important;
      min-height: 42px !important;
      bottom: 10px !important;
    }
    html body.resource-page-advice main > #articles .advice-grid::scroll-button(left) {
      left: calc(50% - 49px) !important;
    }
    html body.resource-page-advice main > #articles .advice-grid::scroll-button(right) {
      left: calc(50% + 7px) !important;
    }
  }
}


/* Build 267 — Wedding Advice carousel, sidebar, viewport-scroll and article-guide QA fixes. */

/* Restore the normal document scrollbar. Horizontal containment belongs to the page
   content, not the viewport scrolling mechanism. */
html {
  overflow-x: hidden !important;
  overflow-y: scroll !important;
}
html body.resource-page-advice {
  overflow: visible !important;
  max-width: 100% !important;
}
html body.resource-page-advice main {
  overflow-x: clip !important;
  overflow-y: visible !important;
  max-width: 100% !important;
}
html body.resource-page-advice main > #articles,
html body.resource-page-advice main > #articles > .container {
  overflow: visible !important;
}

/* Landing-page hero scroll control: use the same fixed bottom-centre geometry as the
   public home-page control rather than locating it relative to the hero content. */
html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"] {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: 18px !important;
  z-index: 96 !important;
  transform: translateX(-50%) !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
}
@media (max-width: 640px) {
  html body.resource-page-advice main > .resource-hero .hero-actions > a[href="#articles"] {
    bottom: 14px !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
  }
}

/* Article-page scroll control: resources-hub placed this absolutely inside the hero.
   Override it to the same fixed viewport position used on the home page. */
html body.resource-page-advice main > .article-hero .article-hero-scroll.section-scroll-next {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: 18px !important;
  z-index: 96 !important;
  transform: translateX(-50%) !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
}
@media (max-width: 640px) {
  html body.resource-page-advice main > .article-hero .article-hero-scroll.section-scroll-next {
    bottom: 14px !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
  }
}
/* Keep the article-only control from becoming a stale button after the opening hero. */
@supports (animation-timeline: view()) {
  html body.resource-page-advice main > .article-hero {
    view-timeline-name: --wedding-article-hero !important;
    view-timeline-axis: block !important;
  }
  html body.resource-page-advice main > .article-hero .article-hero-scroll.section-scroll-next {
    animation-name: wedding-article-scroll-visibility !important;
    animation-duration: 1ms !important;
    animation-timing-function: linear !important;
    animation-fill-mode: both !important;
    animation-timeline: --wedding-article-hero !important;
    animation-range: exit 0% exit 42% !important;
  }
  @keyframes wedding-article-scroll-visibility {
    from { opacity: .86; visibility: visible; pointer-events: auto; }
    to { opacity: 0; visibility: hidden; pointer-events: none; }
  }
}

/* The warm article guide was visually right but undersized. Increase all reading and
   navigation text without making the box feel oversized. */
html body.resource-page-advice .article-side-card {
  font-size: 1rem !important;
}
html body.resource-page-advice .article-side-section h2 {
  font-size: 1rem !important;
  line-height: 1.25 !important;
  letter-spacing: .075em !important;
  margin-bottom: 15px !important;
}
html body.resource-page-advice .article-toc-list a {
  padding: 8px 0 8px 14px !important;
  font-size: .98rem !important;
  line-height: 1.48 !important;
}
html body.resource-page-advice .article-toc-list li.is-subheading a {
  padding-left: 27px !important;
  font-size: .9rem !important;
  line-height: 1.46 !important;
}
html body.resource-page-advice .article-topic-chip {
  min-height: 34px !important;
  padding: 6px 12px !important;
  font-size: .84rem !important;
  line-height: 1.25 !important;
}
html body.resource-page-advice .article-side-links a {
  padding: 14px 0 !important;
  font-size: .98rem !important;
  line-height: 1.4 !important;
}

/* Sidebar hit-area correction. Keep the carousel paint and pointer area strictly
   inside its own grid column so it cannot sit invisibly on top of the category links. */
html body.resource-page-advice main > #articles > .container {
  position: relative !important;
  isolation: isolate !important;
}
html body.resource-page-advice main > #articles .advice-toolbar {
  position: sticky !important;
  top: 122px !important;
  z-index: 20 !important;
  pointer-events: auto !important;
}
html body.resource-page-advice main > #articles .advice-toolbar a.btn {
  position: relative !important;
  z-index: 21 !important;
  display: flex !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
  text-decoration: none !important;
}
html body.resource-page-advice main > #articles .advice-toolbar a.btn::before {
  content: none !important;
}

/* Carousel owns only its own column and scrollport. Clipping here prevents an
   invisible full-card anchor or generated control from stealing clicks from the rail. */
html body.resource-page-advice main > #articles .advice-grid {
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate !important;
  contain: layout style !important;
  clip-path: inset(0 round 18px) !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 4px 2px 70px !important;
  margin: 0 !important;
  scroll-snap-type: x mandatory !important;
  scroll-padding-inline: 2px !important;
  scroll-behavior: smooth !important;
  overscroll-behavior-inline: contain !important;
  anchor-name: --wedding-advice-carousel !important;
  box-sizing: border-box !important;
}
html body.resource-page-advice main > #articles .advice-card {
  scroll-snap-align: start !important;
  scroll-snap-stop: always !important;
}

/* 266 positioned experimental browser-generated scroll buttons against the wrong
   containing block. Anchor them explicitly to the carousel's own box instead. */
@supports (anchor-name: --wedding-advice-carousel) and selector(.advice-grid::scroll-button(right)) {
  html body.resource-page-advice main > #articles .advice-grid {
    scrollbar-width: none !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left),
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right) {
    display: grid !important;
    place-items: center !important;
    position: absolute !important;
    position-anchor: --wedding-advice-carousel !important;
    top: calc(anchor(bottom) - 56px) !important;
    bottom: auto !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(244,210,124,.72) !important;
    border-radius: 50% !important;
    background: rgba(5,5,5,.92) !important;
    color: #f4d27c !important;
    box-shadow: 0 8px 22px rgba(0,0,0,.32) !important;
    font: 700 25px/1 Georgia,serif !important;
    cursor: pointer !important;
    z-index: 8 !important;
    opacity: 1 !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left) {
    content: "‹" / "Previous articles" !important;
    right: calc(anchor(center) + 8px) !important;
    left: auto !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right) {
    content: "›" / "Next articles" !important;
    left: calc(anchor(center) + 8px) !important;
    right: auto !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left):hover,
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right):hover,
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left):focus-visible,
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right):focus-visible {
    background: #d2a23a !important;
    border-color: #d2a23a !important;
    color: #080808 !important;
    outline: none !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(left):disabled,
  html body.resource-page-advice main > #articles .advice-grid::scroll-button(right):disabled {
    opacity: .3 !important;
    cursor: default !important;
  }
}

/* Fallback for browsers without the CSS-carousel controls: retain a small, contained
   horizontal rail scrollbar rather than removing all indication that the rail scrolls. */
@supports not ((anchor-name: --wedding-advice-carousel) and selector(.advice-grid::scroll-button(right))) {
  html body.resource-page-advice main > #articles .advice-grid {
    scrollbar-width: thin !important;
    scrollbar-color: rgba(210,162,58,.72) rgba(255,255,255,.055) !important;
    padding-bottom: 24px !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::-webkit-scrollbar {
    display: block !important;
    height: 7px !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::-webkit-scrollbar-track {
    background: rgba(255,255,255,.05) !important;
    border-radius: 999px !important;
  }
  html body.resource-page-advice main > #articles .advice-grid::-webkit-scrollbar-thumb {
    background: rgba(210,162,58,.72) !important;
    border-radius: 999px !important;
  }
}

/* Full-card links remain inside each card and cannot bleed outside the clipped rail. */
html body.resource-page-advice main > #articles .advice-card {
  position: relative !important;
  overflow: hidden !important;
}
html body.resource-page-advice main > #articles .advice-card .text-link {
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
}

@media (max-width: 980px) {
  html body.resource-page-advice main > #articles .advice-toolbar {
    position: static !important;
    top: auto !important;
  }
}
@media (max-width: 640px) {
  html body.resource-page-advice main > #articles .advice-grid {
    padding-bottom: 66px !important;
  }
  @supports (anchor-name: --wedding-advice-carousel) and selector(.advice-grid::scroll-button(right)) {
    html body.resource-page-advice main > #articles .advice-grid::scroll-button(left),
    html body.resource-page-advice main > #articles .advice-grid::scroll-button(right) {
      width: 42px !important;
      height: 42px !important;
      min-width: 42px !important;
      min-height: 42px !important;
      top: calc(anchor(bottom) - 53px) !important;
    }
    html body.resource-page-advice main > #articles .advice-grid::scroll-button(left) {
      right: calc(anchor(center) + 7px) !important;
    }
    html body.resource-page-advice main > #articles .advice-grid::scroll-button(right) {
      left: calc(anchor(center) + 7px) !important;
    }
  }
}

/* P31T50 source: assets/css/public-components-438.css */
/* Build 438 — canonical public actions + landing-divider system.
   Presentation only. This is deliberately a late cascade layer so the public
   site can converge on one action language without deleting legacy CSS yet.
   Filters/tabs keep their functional state attributes; a later dedicated pass
   can consolidate those modules further. */

:root {
  --jt-action-gold: #d2a23a;
  --jt-action-gold-light: #e7bf61;
  --jt-action-gold-bright: #f3cf78;
  --jt-action-ink: #080704;
  --jt-action-light-ink: #674a11;
  --jt-action-light-border: #8b681f;
  --jt-action-focus: rgba(242,196,100,.42);
  --jt-divider-bg: #e9e0d3;
  --jt-divider-ink: #17130e;
  --jt-divider-muted: #625b52;
  --jt-divider-gold: #8b681f;
  --jt-divider-line: rgba(76,60,38,.18);
}

/* -------------------------------------------------------------------------
   1. PUBLIC BUTTON / CTA CONTRACT
   Primary   = filled gold pill
   Secondary = gold outline pill
   Quiet     = lower-emphasis outline
   Text      = .text-link
   ------------------------------------------------------------------------- */
html body .btn {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 50px !important;
  padding: 11px 26px !important;
  border: 1px solid var(--jt-action-gold) !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: var(--jt-action-gold-light) !important;
  box-shadow: none !important;
  font-family: Lato, Arial, sans-serif !important;
  font-size: clamp(.78rem,.78vw,.88rem) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: .105em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: normal !important;
  cursor: pointer !important;
  -webkit-tap-highlight-color: transparent;
  transition: transform .18s ease, border-color .18s ease, background-color .18s ease, color .18s ease, box-shadow .18s ease !important;
}

html body .btn.btn-primary {
  border-color: #d3a437 !important;
  background: linear-gradient(135deg,#a86f18 0%,#efc45f 100%) !important;
  color: var(--jt-action-ink) !important;
  box-shadow: 0 12px 28px rgba(164,112,26,.18) !important;
}

html body .btn.btn-quiet {
  border-color: rgba(210,162,58,.46) !important;
  background: rgba(210,162,58,.025) !important;
  color: #cdbb8b !important;
  box-shadow: none !important;
}

html body .btn.btn-small {
  min-height: 42px !important;
  padding: 9px 18px !important;
  font-size: .74rem !important;
  letter-spacing: .09em !important;
}

/* Functional selected states for existing button-backed browse/filter controls. */
html body .btn.is-active:not(.btn-primary),
html body .btn[aria-pressed="true"]:not(.btn-primary),
html body .btn[aria-current="true"]:not(.btn-primary) {
  border-color: var(--jt-action-gold) !important;
  background: rgba(210,162,58,.14) !important;
  color: var(--jt-action-gold-bright) !important;
}

html body .btn:disabled,
html body .btn[disabled],
html body .btn[aria-disabled="true"] {
  opacity: .48 !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}

html body .btn:focus-visible,
html body .text-link:focus-visible {
  outline: 3px solid var(--jt-action-focus) !important;
  outline-offset: 3px !important;
}

@media (hover:hover) and (pointer:fine) {
  html body .btn:not(:disabled):not([disabled]):not([aria-disabled="true"]):hover {
    transform: translateY(-2px) !important;
    border-color: #e3b84f !important;
    background: rgba(210,162,58,.10) !important;
    color: #f2cf7a !important;
  }
  html body .btn.btn-primary:not(:disabled):not([disabled]):not([aria-disabled="true"]):hover {
    border-color: #e0b44c !important;
    background: linear-gradient(135deg,#bb7f1c 0%,#f4cf75 100%) !important;
    color: #080704 !important;
    box-shadow: 0 14px 32px rgba(164,112,26,.24) !important;
  }
  html body .btn.btn-quiet:not(:disabled):not([disabled]):not([aria-disabled="true"]):hover {
    border-color: rgba(210,162,58,.72) !important;
    background: rgba(210,162,58,.07) !important;
    color: #e6cc8d !important;
  }
}

/* Light public surfaces need the same secondary hierarchy but with darker ink. */
html body .preview-v2-light .btn:not(.btn-primary),
html body .preview-light-section .btn:not(.btn-primary),
html body .legal-section .btn:not(.btn-primary),
html body .jt-landing-divider .btn:not(.btn-primary) {
  border-color: var(--jt-action-light-border) !important;
  background: transparent !important;
  color: var(--jt-action-light-ink) !important;
}
html body .preview-v2-light .btn.btn-quiet,
html body .preview-light-section .btn.btn-quiet,
html body .legal-section .btn.btn-quiet {
  border-color: rgba(103,74,17,.46) !important;
  background: rgba(139,104,31,.025) !important;
  color: #786d54 !important;
}

html body .preview-v2-light .btn.is-active:not(.btn-primary),
html body .preview-v2-light .btn[aria-pressed="true"]:not(.btn-primary),
html body .preview-v2-light .btn[aria-current="true"]:not(.btn-primary),
html body .legal-section .btn.is-active:not(.btn-primary) {
  border-color: #80601e !important;
  background: rgba(139,104,31,.10) !important;
  color: #4f390d !important;
}
@media (hover:hover) and (pointer:fine) {
  html body .preview-v2-light .btn:not(.btn-primary):hover,
  html body .preview-light-section .btn:not(.btn-primary):hover,
  html body .legal-section .btn:not(.btn-primary):hover,
  html body .jt-landing-divider .btn:not(.btn-primary):hover {
    border-color: #725210 !important;
    background: rgba(139,104,31,.08) !important;
    color: #4e370b !important;
  }
}

/* Existing hero buttons already use these exact dimensions/colours. Keep this
   explicit parity so the hero-specific layer and the global action layer agree. */
html body #main-content > .jt-standard-hero .btn {
  min-height: 50px !important;
  padding: 11px 26px !important;
  border-radius: 999px !important;
}

/* Tertiary action language. Existing page-specific spacing is preserved. */
html body .text-link {
  color: var(--jt-action-gold-light) !important;
  font-weight: 800 !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 4px !important;
  transition: color .18s ease, text-decoration-color .18s ease !important;
}
html body .preview-v2-light .text-link,
html body .preview-light-section .text-link,
html body .legal-section .text-link {
  color: #765719 !important;
}
@media (hover:hover) and (pointer:fine) {
  html body .text-link:hover { color: #fff0bc !important; }
  html body .preview-v2-light .text-link:hover,
  html body .preview-light-section .text-link:hover,
  html body .legal-section .text-link:hover { color: #3f2a0a !important; }
}

/* Action groups: consistent spacing while allowing each page to decide where
   the group sits. */
html body .hero-actions,
html body .resource-cta-actions,
html body .cta-actions {
  gap: 12px !important;
}

/* Do not turn all functional/filter buttons into full-width mobile bars. Only
   primary action groups stack to easy touch targets on narrow phones. */
@media (max-width:640px) {
  html body .btn {
    min-height: 48px !important;
    padding: 10px 21px !important;
    font-size: .78rem !important;
  }
  html body .btn.btn-small {
    min-height: 42px !important;
    padding: 9px 17px !important;
    font-size: .72rem !important;
  }
  html body .hero-actions,
  html body .resource-cta-actions,
  html body .cta-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    gap: 10px !important;
  }
  html body .hero-actions > .btn,
  html body .resource-cta-actions > .btn,
  html body .cta-actions > .btn,
  html body .booking-submit-row > .btn,
  html body .contact-form-footer .btn[type="submit"] {
    width: 100% !important;
  }
}

@media (prefers-reduced-motion:reduce) {
  html body .btn { transition: none !important; }
  html body .btn:hover { transform: none !important; }
}

/* -------------------------------------------------------------------------
   2. CANONICAL LANDING DIVIDER CONTRACT
   Approved Occasions / Recommended Suppliers visual language.
   Desktop = 4 across. Tablet/phone = 2 x 2. No cards, no shadow, no radius.
   ------------------------------------------------------------------------- */
html body .jt-landing-divider {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  overflow: hidden !important;
  border-top: 1px solid rgba(76,60,38,.20) !important;
  border-right: 0 !important;
  border-bottom: 1px solid rgba(76,60,38,.20) !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  background: var(--jt-divider-bg) !important;
  color: var(--jt-divider-ink) !important;
  box-shadow: none !important;
}

html body .jt-landing-divider .jt-landing-divider-grid {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(4,minmax(0,1fr)) !important;
  gap: 0 !important;
  align-items: stretch !important;
}

html body .jt-landing-divider .jt-landing-divider-item {
  box-sizing: border-box !important;
  min-width: 0 !important;
  min-height: 100px !important;
  margin: 0 !important;
  padding: 16px clamp(20px,2.5vw,44px) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  gap: 0 !important;
  border: 0 !important;
  border-right: 1px solid var(--jt-divider-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--jt-divider-ink) !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transform: none !important;
}
html body .jt-landing-divider .jt-landing-divider-item:last-child { border-right: 0 !important; }

html body .jt-landing-divider .jt-landing-divider-item > span:first-child {
  display: block !important;
  margin: 0 0 5px !important;
  padding: 0 !important;
  color: var(--jt-divider-gold) !important;
  font-family: Lato,Arial,sans-serif !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
}
html body .jt-landing-divider .jt-landing-divider-item > strong {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--jt-divider-ink) !important;
  font-family: Marcellus,Georgia,serif !important;
  font-size: clamp(1.02rem,1.15vw,1.24rem) !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}
html body .jt-landing-divider .jt-landing-divider-item > small {
  display: block !important;
  margin: 5px 0 0 !important;
  padding: 0 !important;
  color: var(--jt-divider-muted) !important;
  font-family: Lato,Arial,sans-serif !important;
  font-size: .78rem !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}

@media (hover:hover) and (pointer:fine) {
  html body .jt-landing-divider a.jt-landing-divider-item:hover {
    background: rgba(139,104,31,.07) !important;
  }
}
html body .jt-landing-divider a.jt-landing-divider-item:focus-visible {
  position: relative !important;
  z-index: 1 !important;
  outline: 3px solid rgba(139,104,31,.35) !important;
  outline-offset: -3px !important;
  background: rgba(139,104,31,.07) !important;
}

@media (max-width:1000px) {
  html body .jt-landing-divider .jt-landing-divider-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  html body .jt-landing-divider .jt-landing-divider-item:nth-child(2n) { border-right: 0 !important; }
  html body .jt-landing-divider .jt-landing-divider-item:nth-child(-n+2) { border-bottom: 1px solid var(--jt-divider-line) !important; }
}
@media (max-width:640px) {
  html body .jt-landing-divider .jt-landing-divider-item {
    min-height: 90px !important;
    padding: 14px 18px !important;
  }
}

/* Recommended Suppliers used the approved divider design before the shared
   class existed. Build 438 adds the shared classes in markup; these aliases
   keep the intent explicit while old supplier CSS is still present. */
html body.resource-page-suppliers .supplier-proof-strip.jt-landing-divider,
html body.resource-page-suppliers .supplier-proof-grid.jt-landing-divider-grid,
html body.resource-page-suppliers .supplier-proof-item.jt-landing-divider-item {
  box-sizing: border-box !important;
}

@media (forced-colors:active) {
  html body .btn { border: 1px solid ButtonText !important; }
  html body .btn:focus-visible { outline: 2px solid Highlight !important; }
  html body .jt-landing-divider .jt-landing-divider-item { border-color: CanvasText !important; }
}

/* P31T50 source: assets/css/public-cards-typography-440.css */
/* Build 440 — shared public card + typography system.
   Presentation only. This layer is deliberately late in the cascade and scoped
   to public main content. It standardises rhythm and card families without
   touching navigation, footer, hero crop/fade geometry, forms, tabs or filters.

   Card families:
   - elevated content cards: rounded, lightly bordered surfaces
   - compact interactive cards: smaller radius, no heavy shadow
   - integrated tiles: keep connected grid/separator geometry; only type rhythm
   Special image selectors/forms (Wedding packages, Booking, Credentials request)
   are intentionally excluded and remain owned by their specialist CSS. */

:root {
  --jt-type-section-title: clamp(2rem, 2.75vw, 3.25rem);
  --jt-type-card-title: clamp(1.18rem, 1.25vw, 1.46rem);
  --jt-type-body: clamp(.98rem, .86vw, 1.08rem);
  --jt-type-card-body: clamp(.92rem, .78vw, 1rem);
  --jt-type-kicker: .76rem;
  --jt-type-body-line: 1.66;
  --jt-type-card-line: 1.58;
  --jt-copy-measure: 68ch;

  --jt-card-radius: 16px;
  --jt-card-radius-compact: 10px;
  --jt-card-border-dark: rgba(210,162,58,.23);
  --jt-card-border-dark-hover: rgba(231,191,97,.52);
  --jt-card-border-light: rgba(61,48,31,.19);
  --jt-card-border-light-hover: rgba(126,90,24,.42);
  --jt-card-shadow-dark: 0 12px 30px rgba(0,0,0,.16);
  --jt-card-shadow-light: 0 10px 26px rgba(61,48,31,.07);
  --jt-card-focus: rgba(242,196,100,.42);
}

/* -------------------------------------------------------------------------
   1. TYPOGRAPHY CONTRACT
   ------------------------------------------------------------------------- */

/* Section headings only. Hero typography remains owned by Build 437. */
html body #main-content :is(
  .section-head,
  .resource-section-head,
  .contact-section-head,
  .reviews-section-head,
  .about-section-head,
  .collab-section-head,
  .occasions-section-head,
  .thov-section-head
) > h2 {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
  max-width: 18ch;
  font-family: Marcellus, Georgia, serif !important;
  font-size: var(--jt-type-section-title) !important;
  font-weight: 400 !important;
  line-height: 1.08 !important;
  letter-spacing: .006em !important;
  text-wrap: balance;
}

html body #main-content :is(
  .section-head,
  .resource-section-head,
  .contact-section-head,
  .reviews-section-head,
  .about-section-head,
  .collab-section-head,
  .occasions-section-head,
  .thov-section-head
) > p:not(.kicker):not(.preview-section-eyebrow):not(.preview-eyebrow) {
  max-width: var(--jt-copy-measure) !important;
  margin-top: 0 !important;
  font-size: var(--jt-type-body) !important;
  line-height: var(--jt-type-body-line) !important;
  text-wrap: pretty;
}

/* Shared eyebrow/kicker rhythm inside normal section-heading wrappers only.
   Hero kickers remain completely owned by Build 437 and page-specific hero CSS. */
html body #main-content :is(
  .section-head,
  .resource-section-head,
  .contact-section-head,
  .reviews-section-head,
  .about-section-head,
  .collab-section-head,
  .occasions-section-head,
  .thov-section-head,
  .about-craft-head,
  .gig-snapshot-heading
) > :is(.kicker,.preview-section-eyebrow,.preview-eyebrow) {
  margin-top: 0 !important;
  margin-bottom: 10px !important;
  font-family: Lato, Arial, sans-serif !important;
  font-size: var(--jt-type-kicker) !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}

/* Ordinary long-form links should remain recognisable without turning every
   inline link into a CTA. Header/footer/navigation are outside #main-content. */
html body #main-content p a:not(.btn):not(.text-link):not([class*="chip"]),
html body #main-content li a:not(.btn):not(.text-link):not([class*="chip"]) {
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

/* -------------------------------------------------------------------------
   2. ELEVATED CONTENT-CARD FAMILY
   ------------------------------------------------------------------------- */
html body #main-content :is(
  .review-card,
  .supplier-card,
  .advice-card,
  .article-carousel-card,
  .credential-quick-card,
  .listen-featured-card,
  .preview-repertoire-card,
  .info-card,
  .setup-product-card
) {
  box-sizing: border-box;
  border-radius: var(--jt-card-radius) !important;
  border-color: var(--jt-card-border-dark) !important;
  box-shadow: var(--jt-card-shadow-dark) !important;
}

/* Light sections keep the same card shape but use quieter neutral borders. */
html body #main-content :is(.preview-v2-light,.preview-light-section,.reviews-featured) :is(
  .review-card,
  .supplier-card,
  .advice-card,
  .article-carousel-card,
  .credential-quick-card,
  .listen-featured-card,
  .preview-repertoire-card,
  .info-card,
  .setup-product-card
) {
  border-color: var(--jt-card-border-light) !important;
  box-shadow: var(--jt-card-shadow-light) !important;
}

/* Cards with independent text insets share one title/copy rhythm. Image-led
   card internals retain their own media dimensions and padding. */
html body #main-content :is(
  .supplier-card,
  .credential-quick-card,
  .listen-featured-card,
  .article-carousel-card
) :is(h2,h3) {
  font-family: Marcellus, Georgia, serif !important;
  font-size: var(--jt-type-card-title) !important;
  font-weight: 400 !important;
  line-height: 1.22 !important;
  letter-spacing: .004em !important;
  text-wrap: balance;
}

html body #main-content :is(
  .supplier-card,
  .credential-quick-card,
  .listen-featured-card,
  .article-carousel-card
) p:not(.kicker):not(.supplier-category):not(.listen-song-eyebrow) {
  font-size: var(--jt-type-card-body) !important;
  line-height: var(--jt-type-card-line) !important;
}

/* Review copy uses a readable editorial measure and one consistent rhythm. */
html body #main-content .review-card blockquote {
  margin-top: 0 !important;
  margin-bottom: 18px !important;
  font-size: clamp(.98rem,.82vw,1.06rem) !important;
  line-height: 1.66 !important;
  text-wrap: pretty;
}
html body #main-content .review-card footer {
  font-size: .9rem;
  line-height: 1.45;
}

/* Wedding Advice titles are H2s by design and can run longer than ordinary
   card titles. Keep them larger but within a consistent editorial range. */
html body.resource-page-advice #main-content .advice-card h2 {
  font-family: Marcellus, Georgia, serif !important;
  font-size: clamp(1.3rem,1.55vw,1.72rem) !important;
  line-height: 1.2 !important;
  letter-spacing: .003em !important;
  text-wrap: balance;
}
html body.resource-page-advice #main-content .advice-card__excerpt {
  font-size: clamp(.94rem,.8vw,1rem) !important;
  line-height: 1.62 !important;
  text-wrap: pretty;
}

/* -------------------------------------------------------------------------
   3. INTERACTIVE-CARD STATES
   ------------------------------------------------------------------------- */
html body #main-content :is(
  .supplier-card,
  .advice-card,
  .article-carousel-card,
  .setup-product-card
) {
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}

@media (hover:hover) and (pointer:fine) {
  html body #main-content :is(
    .supplier-card,
    .advice-card,
    .article-carousel-card,
    .setup-product-card
  ):hover {
    transform: translateY(-2px) !important;
    border-color: var(--jt-card-border-dark-hover) !important;
    box-shadow: 0 16px 34px rgba(0,0,0,.20) !important;
  }
  html body #main-content :is(.preview-v2-light,.preview-light-section) :is(
    .supplier-card,
    .advice-card,
    .article-carousel-card,
    .setup-product-card
  ):hover {
    border-color: var(--jt-card-border-light-hover) !important;
    box-shadow: 0 14px 30px rgba(61,48,31,.10) !important;
  }
}

html body #main-content :is(.supplier-card,.setup-product-card):focus-visible,
html body #main-content :is(.advice-card,.article-carousel-card):focus-within {
  outline: 3px solid var(--jt-card-focus) !important;
  outline-offset: 3px !important;
}

/* Compact utility cards intentionally do not receive the elevated 16px look. */
html body #main-content .performance-map-venue-card {
  border-radius: var(--jt-card-radius-compact) !important;
  transition: transform .16s ease, border-color .16s ease, background-color .16s ease, box-shadow .16s ease !important;
}
@media (hover:hover) and (pointer:fine) {
  html body #main-content .performance-map-venue-card:hover {
    transform: translateY(-1px);
  }
}
html body #main-content .performance-map-venue-card:focus-visible {
  outline: 3px solid rgba(126,90,24,.28) !important;
  outline-offset: 2px !important;
}

/* -------------------------------------------------------------------------
   4. INTEGRATED TILE FAMILY
   These are intentionally connected grids, not floating cards. Preserve their
   straight separators/edge-to-edge geometry while standardising text rhythm.
   ------------------------------------------------------------------------- */
html body #main-content :is(.occasion-type-card,.occasions-flow-card) h3 {
  margin-top: 0;
  margin-bottom: 8px !important;
  font-family: Marcellus, Georgia, serif !important;
  font-size: clamp(1.2rem,1.35vw,1.5rem) !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  letter-spacing: .003em !important;
  text-wrap: balance;
}
html body #main-content :is(.occasion-type-card,.occasions-flow-card) p {
  font-size: clamp(.94rem,.8vw,1rem) !important;
  line-height: 1.58 !important;
  text-wrap: pretty;
}

/* THOV's lineup is intentionally more editorial and keeps its larger title scale. */
html body #main-content .thov-lineup-card h3 {
  margin-bottom: 8px !important;
  font-family: Marcellus, Georgia, serif !important;
  font-size: clamp(1.45rem,1.7vw,1.9rem) !important;
  font-weight: 400 !important;
  line-height: 1.18 !important;
  text-wrap: balance;
}
html body #main-content .thov-lineup-card p:last-child {
  font-size: 1rem !important;
  line-height: 1.58 !important;
  text-wrap: pretty;
}

/* Gigs use compact schedule rows rather than floating cards. Keep their row
   geometry intact and only align the title/supporting-copy hierarchy. */
html body #main-content .schedule-card .event-info h3 {
  margin: 0 0 3px !important;
  font-family: Marcellus, Georgia, serif !important;
  font-size: clamp(1.02rem,1.05vw,1.18rem) !important;
  font-weight: 400 !important;
  line-height: 1.28 !important;
  letter-spacing: .002em !important;
}
html body #main-content .schedule-card .event-info p,
html body #main-content .schedule-card .event-date span {
  font-size: clamp(.82rem,.74vw,.9rem) !important;
  line-height: 1.42 !important;
}

/* Preserve specialist surfaces owned by later roadmap stages. */
html body #main-content :is(
  .booking-form-card,
  .booking-radio-card,
  .booking-person-card,
  .credentials-form-card,
  .package-card,
  .calendar-gig-dialog-card
) {
  /* Explicitly no card-system geometry here. */
}

/* -------------------------------------------------------------------------
   5. RESPONSIVE TYPE / CARD RHYTHM
   ------------------------------------------------------------------------- */
@media (max-width: 760px) {
  :root {
    --jt-type-section-title: clamp(1.78rem,7.8vw,2.35rem);
    --jt-type-body: 1rem;
    --jt-type-card-title: clamp(1.15rem,5.5vw,1.38rem);
    --jt-type-card-body: .96rem;
    --jt-card-radius: 14px;
  }

  html body #main-content :is(
    .section-head,
    .resource-section-head,
    .contact-section-head,
    .reviews-section-head,
    .about-section-head,
    .collab-section-head,
    .occasions-section-head,
    .thov-section-head
  ) > h2 {
    max-width: 22ch;
    margin-bottom: 10px !important;
  }

  html body #main-content .review-card blockquote {
    font-size: .98rem !important;
    line-height: 1.62 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body #main-content :is(.supplier-card,.advice-card,.article-carousel-card,.setup-product-card,.performance-map-venue-card) {
    transition: none !important;
  }
  html body #main-content :is(.supplier-card,.advice-card,.article-carousel-card,.setup-product-card,.performance-map-venue-card):hover {
    transform: none !important;
  }
}

/* P31T50 source: assets/css/public-navigation-445.css */
/* Build 445 — canonical public navigation with direct Booking, grouped Contact routes and a permanent desktop availability CTA.
   Desktop: Weddings, Occasions, Listen, Live, About, Explore, Booking, Contact, then a gold Check availability pill.
   Contact still provides Check Availability, Ask a Question, Complete a Booking and Request Documentation.
   One breakpoint (1220px) remains shared with public-navigation-422.js. */

:root {
  --jt-nav-breakpoint: 1220px;
  --jt-nav-bg: #000000;
  --jt-nav-panel: #0a0a0a;
  --jt-nav-gold: #d2a23a;
  --jt-nav-gold-light: #e8c56a;
  --jt-nav-cream: #f5efe2;
  --jt-nav-muted: #bdb5a5;
  --jt-nav-line: rgba(210, 162, 58, .22);
}

/* Shared accessibility helper for every public page. */
.jt-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] {
  position: relative !important;
  inset: auto !important;
  z-index: 500 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #000000 !important;
  border-bottom: 1px solid var(--jt-nav-line) !important;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .16) !important;
  backdrop-filter: blur(14px) !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .header-inner {
  position: relative !important;
  width: min(1540px, calc(100% - 44px)) !important;
  min-height: 98px !important;
  margin-inline: auto !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: 238px minmax(0, 1fr) !important;
  gap: clamp(28px, 3vw, 58px) !important;
  align-items: center !important;
  box-sizing: border-box !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .logo-link {
  width: 238px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  transform: none !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .logo-link img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 78px !important;
  object-fit: contain !important;
  object-position: left center !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .main-nav {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: clamp(11px, 1.05vw, 21px) !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  white-space: nowrap !important;
  transform: none !important;
}


html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown {
  flex: 0 0 auto !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown > summary {
  position: relative !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 14px 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--jt-nav-cream) !important;
  font: 800 clamp(.73rem, .72vw, .84rem)/1.1 Lato, Arial, sans-serif !important;
  letter-spacing: .075em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  cursor: pointer !important;
  list-style: none !important;
  transition: color .18s ease !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown > summary::-webkit-details-marker {
  display: none !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a::after,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown > summary::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 7px !important;
  height: 1px !important;
  background: var(--jt-nav-gold) !important;
  transform: scaleX(0) !important;
  transform-origin: center !important;
  transition: transform .18s ease !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a:hover,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a:focus-visible,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a.active,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown > summary:hover,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown > summary:focus-visible,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown[open] > summary,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown.is-current > summary {
  color: var(--jt-nav-gold-light) !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a:hover::after,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a:focus-visible::after,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a.active::after,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown > summary:hover::after,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown > summary:focus-visible::after,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown[open] > summary::after,
html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown.is-current > summary::after {
  transform: scaleX(1) !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown {
  position: relative !important;
  display: block !important;
  align-self: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown-chevron {
  width: 9px !important;
  height: 9px !important;
  display: inline-block !important;
  border-right: 1.5px solid currentColor !important;
  border-bottom: 1.5px solid currentColor !important;
  transform: translateY(-2px) rotate(45deg) !important;
  transition: transform .18s ease !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown[open] .nav-dropdown-chevron {
  transform: translateY(2px) rotate(225deg) !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown-menu {
  position: absolute !important;
  top: calc(100% + 14px) !important;
  left: 50% !important;
  z-index: 520 !important;
  width: min(650px, 72vw) !important;
  padding: 18px !important;
  display: none !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  transform: translateX(-50%) !important;
  border: 1px solid rgba(210, 162, 58, .28) !important;
  border-radius: 18px !important;
  background: linear-gradient(145deg, rgba(18, 18, 18, .995), rgba(7, 7, 7, .995)) !important;
  box-shadow: 0 26px 70px rgba(0, 0, 0, .48) !important;
  overflow: hidden !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown--explore .nav-dropdown-menu {
  left: auto !important;
  right: 0 !important;
  width: min(720px, 76vw) !important;
  transform: none !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown--contact .nav-dropdown-menu {
  left: auto !important;
  right: 0 !important;
  width: min(430px, 84vw) !important;
  grid-template-columns: 1fr !important;
  transform: none !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown--contact .nav-mega-column {
  padding: 7px !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown[open] > .nav-dropdown-menu {
  display: grid !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-column {
  min-width: 0 !important;
  padding: 7px !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-heading {
  display: block !important;
  margin: 0 0 8px !important;
  padding: 0 8px 8px !important;
  border-bottom: 1px solid rgba(210, 162, 58, .18) !important;
  color: var(--jt-nav-gold-light) !important;
  font: 800 .68rem/1.2 Lato, Arial, sans-serif !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-link {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 10px 11px !important;
  display: block !important;
  border: 1px solid transparent !important;
  border-radius: 11px !important;
  color: var(--jt-nav-cream) !important;
  text-decoration: none !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  transition: background .16s ease, border-color .16s ease, color .16s ease !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-link::after {
  display: none !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-link strong {
  display: block !important;
  color: inherit !important;
  font: 700 .92rem/1.25 Lato, Arial, sans-serif !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-link small {
  display: block !important;
  margin-top: 3px !important;
  color: var(--jt-nav-muted) !important;
  font: 500 .76rem/1.38 Lato, Arial, sans-serif !important;
  white-space: normal !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-link:hover,
html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-link:focus-visible,
html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-link[aria-current="page"] {
  color: #fff !important;
  border-color: rgba(210, 162, 58, .22) !important;
  background: rgba(210, 162, 58, .08) !important;
  outline: 0 !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-toggle,
html body .site-header.jt-public-header[data-jt-public-shell] .nav-close,
html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-head,
html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-priority,
html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-footer {
  display: none !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-toggle {
  width: 46px !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  place-items: center !important;
  border: 1px solid rgba(210, 162, 58, .34) !important;
  border-radius: 12px !important;
  background: rgba(210, 162, 58, .035) !important;
  color: var(--jt-nav-gold-light) !important;
  cursor: pointer !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-toggle-bars,
html body .site-header.jt-public-header[data-jt-public-shell] .nav-toggle-bars::before,
html body .site-header.jt-public-header[data-jt-public-shell] .nav-toggle-bars::after {
  width: 20px !important;
  height: 1.5px !important;
  display: block !important;
  border-radius: 999px !important;
  background: currentColor !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-toggle-bars {
  position: relative !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-toggle-bars::before,
html body .site-header.jt-public-header[data-jt-public-shell] .nav-toggle-bars::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
}

html body .site-header.jt-public-header[data-jt-public-shell] .nav-toggle-bars::before { top: -6px !important; }
html body .site-header.jt-public-header[data-jt-public-shell] .nav-toggle-bars::after { top: 6px !important; }

/* Tablet/mobile drawer. This exact breakpoint is mirrored in JS. */
@media (max-width: 1220px) {
  html body .site-header.jt-public-header[data-jt-public-shell] .header-inner {
    width: min(100% - 30px, 1180px) !important;
    min-height: 82px !important;
    grid-template-columns: minmax(180px, 232px) 1fr 46px !important;
    gap: 16px !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .logo-link {
    width: min(232px, 100%) !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .logo-link img {
    max-height: 68px !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-toggle {
    display: grid !important;
    grid-column: 3 !important;
    justify-self: end !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2000 !important;
    width: 100% !important;
    height: 100vh !important;
    min-height: 100vh !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 max(22px, env(safe-area-inset-right)) max(28px, env(safe-area-inset-bottom)) max(22px, env(safe-area-inset-left)) !important;
    display: none !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    white-space: normal !important;
    background:
      radial-gradient(circle at 84% 3%, rgba(210, 162, 58, .13), transparent 29%),
      linear-gradient(180deg, #080808 0%, #040404 100%) !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  @supports (height: 100dvh) {
    html body .site-header.jt-public-header[data-jt-public-shell] .main-nav {
      height: 100dvh !important;
      min-height: 100dvh !important;
    }
  }

  html body.nav-open {
    overflow: hidden !important;
    overscroll-behavior: none !important;
  }

  html body.nav-open .site-header.jt-public-header[data-jt-public-shell] .main-nav {
    display: flex !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-head {
    width: min(100%, 760px) !important;
    min-height: 82px !important;
    margin: 0 auto !important;
    padding-top: max(0px, env(safe-area-inset-top)) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    border-bottom: 1px solid rgba(210, 162, 58, .16) !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-brand {
    width: min(220px, 62vw) !important;
    display: block !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-brand img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: 67px !important;
    object-fit: contain !important;
    object-position: left center !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-close {
    flex: 0 0 46px !important;
    width: 46px !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    border: 1px solid rgba(210, 162, 58, .32) !important;
    border-radius: 12px !important;
    background: rgba(210, 162, 58, .035) !important;
    color: var(--jt-nav-gold-light) !important;
    font: 300 2rem/1 Arial, sans-serif !important;
    cursor: pointer !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-priority {
    width: min(100%, 760px) !important;
    margin: 24px auto 14px !important;
    display: grid !important;
    gap: 10px !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-availability {
    min-height: 50px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid var(--jt-nav-gold-light) !important;
    border-radius: 999px !important;
    background: var(--jt-nav-gold-light) !important;
    color: #080808 !important;
    font: 800 .78rem/1 Lato, Arial, sans-serif !important;
    letter-spacing: .1em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-booking {
    display: inline-flex !important;
    justify-content: center !important;
    padding: 8px 12px !important;
    color: #d9d1c2 !important;
    font: 600 .82rem/1.3 Lato, Arial, sans-serif !important;
    text-decoration: none !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a,
  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown,
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-footer {
    width: min(100%, 760px) !important;
    margin-inline: auto !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a,
  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown > summary {
    width: 100% !important;
    min-height: 56px !important;
    padding: 17px 2px !important;
    justify-content: flex-start !important;
    border-bottom: 1px solid rgba(210, 162, 58, .14) !important;
    color: #f4eee1 !important;
    font-size: .9rem !important;
    letter-spacing: .085em !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a::after,
  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > .nav-dropdown > summary::after {
    display: none !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-item-weddings { order: 10 !important; }
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-item-occasions { order: 20 !important; }
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-item-listen { order: 30 !important; }
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-item-about { order: 40 !important; }
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown--live { order: 50 !important; }
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown--explore { order: 60 !important; }
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-item-booking { order: 70 !important; }
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown--contact { order: 80 !important; }
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-head { order: 1 !important; }
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-priority { order: 2 !important; }
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-footer { order: 90 !important; }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown {
    border-bottom: 0 !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown > summary {
    justify-content: space-between !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown-menu,
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown--explore .nav-dropdown-menu,
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-dropdown--contact .nav-dropdown-menu {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 7px 0 14px 14px !important;
    grid-template-columns: 1fr !important;
    gap: 5px !important;
    transform: none !important;
    border: 0 !important;
    border-left: 1px solid rgba(210, 162, 58, .27) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-column {
    padding: 3px 0 7px 10px !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-heading {
    margin: 3px 0 4px !important;
    padding: 5px 8px !important;
    border: 0 !important;
    color: #a99c86 !important;
    font-size: .62rem !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-link {
    padding: 9px 8px !important;
    border-radius: 9px !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-link strong {
    font-size: .88rem !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mega-link small {
    font-size: .75rem !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-footer {
    margin-top: 20px !important;
    padding: 18px 0 4px !important;
    display: grid !important;
    gap: 14px !important;
    border-top: 1px solid rgba(210, 162, 58, .18) !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-contact {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px 16px !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-contact a {
    color: #d9d1c2 !important;
    font: 600 .78rem/1.35 Lato, Arial, sans-serif !important;
    text-decoration: none !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-social {
    display: flex !important;
    gap: 9px !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-social a {
    width: 40px !important;
    height: 40px !important;
    display: grid !important;
    place-items: center !important;
    border: 1px solid rgba(210, 162, 58, .24) !important;
    border-radius: 50% !important;
    color: var(--jt-nav-gold-light) !important;
    text-decoration: none !important;
    font: 800 .72rem/1 Lato, Arial, sans-serif !important;
  }
}

@media (max-width: 560px) {
  html body .site-header.jt-public-header[data-jt-public-shell] .header-inner {
    width: calc(100% - 24px) !important;
    min-height: 74px !important;
    grid-template-columns: minmax(160px, 205px) 1fr 44px !important;
    gap: 10px !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .logo-link {
    width: min(205px, 100%) !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .logo-link img {
    max-height: 60px !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-toggle,
  html body .site-header.jt-public-header[data-jt-public-shell] .nav-close {
    width: 44px !important;
    height: 44px !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav {
    padding-inline: max(17px, env(safe-area-inset-left)) max(17px, env(safe-area-inset-right)) !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-head {
    min-height: 74px !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .nav-mobile-brand {
    width: min(205px, 61vw) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body .site-header.jt-public-header[data-jt-public-shell] *,
  html body .site-header.jt-public-header[data-jt-public-shell] *::before,
  html body .site-header.jt-public-header[data-jt-public-shell] *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}


/* -------------------------------------------------------------------------
   Build 445 — permanent desktop availability CTA.
   It deliberately duplicates Contact > Check Availability because availability
   is the site's primary conversion action.  The mobile drawer already has its
   own priority availability pill, so this desktop CTA is hidden at <=1220px.
   ------------------------------------------------------------------------- */
@media (min-width: 1221px) {
  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a.nav-availability-cta {
    box-sizing: border-box !important;
    min-height: 46px !important;
    padding: 0 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #d3a437 !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg,#a86f18 0%,#efc45f 100%) !important;
    color: #080704 !important;
    box-shadow: 0 10px 24px rgba(164,112,26,.18) !important;
    font-family: Lato, Arial, sans-serif !important;
    font-size: clamp(.72rem,.70vw,.82rem) !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: .085em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a.nav-availability-cta::after {
    display: none !important;
    content: none !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a.nav-availability-cta:hover,
  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a.nav-availability-cta:focus-visible,
  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a.nav-availability-cta:active {
    border-color: #e0b44c !important;
    background: linear-gradient(135deg,#bb7f1c 0%,#f4cf75 100%) !important;
    color: #080704 !important;
    box-shadow: 0 13px 30px rgba(164,112,26,.24) !important;
    transform: translateY(-1px) !important;
  }

  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a.nav-availability-cta:focus-visible {
    outline: 3px solid rgba(242,196,100,.42) !important;
    outline-offset: 3px !important;
  }
}

@media (max-width: 1220px) {
  html body .site-header.jt-public-header[data-jt-public-shell] .main-nav > a.nav-availability-cta {
    display: none !important;
  }
}

/* P31T50 source: assets/css/public-footer-432.css */
/* Build 432 — compact canonical public footer.
   Mirrors the simplified public navigation while preserving the established
   black/gold James Taylor visual language. Loaded after page-specific CSS so
   old page footer rules cannot reintroduce inconsistent layouts. */

.site-footer.footer-v432 {
  margin: 0;
  padding: 46px 0 24px;
  border-top: 1px solid rgba(210, 162, 58, .28);
  background: #000000;
  color: #f4efe5;
}

.site-footer.footer-v432 .footer-b-shell {
  width: min(calc(100% - 64px), 1480px);
  max-width: none;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

.site-footer.footer-v432 .footer-b-main {
  display: grid;
  grid-template-columns: minmax(245px, 305px) minmax(0, 1fr);
  gap: clamp(48px, 6vw, 92px);
  align-items: start;
  padding: 0 0 34px;
}

.site-footer.footer-v432 .footer-b-brand-panel {
  min-width: 0;
  padding-right: clamp(28px, 3vw, 46px);
  border-right: 1px solid rgba(210, 162, 58, .24);
}

.site-footer.footer-v432 .footer-b-brand {
  display: block;
  min-height: 0;
  padding: 0;
  border: 0;
}

.site-footer.footer-v432 .footer-b-brand img {
  display: block;
  width: min(100%, 255px);
  height: auto;
}

.site-footer.footer-v432 .footer-b-tagline {
  max-width: 31ch;
  margin: 19px 0 20px;
  color: #b8afa1;
  font: 500 .9rem/1.65 Lato, Arial, sans-serif;
}

.site-footer.footer-v432 .footer-b-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 18px;
  border: 1px solid #d2a23a;
  border-radius: 999px;
  background: #e4bc58;
  color: #090806;
  font: 900 .76rem/1.1 Lato, Arial, sans-serif;
  letter-spacing: .07em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.site-footer.footer-v432 .footer-b-primary:hover,
.site-footer.footer-v432 .footer-b-primary:focus-visible {
  border-color: #f4d27c;
  background: #f4d27c;
  color: #090806;
  transform: translateY(-1px);
  box-shadow: 0 10px 28px rgba(210, 162, 58, .14);
  outline: none;
}

.site-footer.footer-v432 .footer-b-nav {
  display: grid;
  grid-template-columns: 1.15fr 1fr .8fr;
  gap: clamp(30px, 4vw, 64px);
  align-items: start;
  padding: 3px 0 0;
}

.site-footer.footer-v432 .footer-b-nav-group {
  min-width: 0;
  border: 0;
}

.site-footer.footer-v432 .footer-b-nav-toggle {
  width: 100%;
  min-height: 0;
  margin: 0 0 15px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #e4bc58;
  font: 900 .74rem/1.2 Lato, Arial, sans-serif;
  text-align: left;
  text-transform: uppercase;
  letter-spacing: .18em;
  cursor: default;
}

.site-footer.footer-v432 .footer-b-chevron {
  display: none;
}

.site-footer.footer-v432 .footer-b-links {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  padding: 0;
}

.site-footer.footer-v432 .footer-b-links a {
  position: relative;
  width: max-content;
  max-width: 100%;
  padding: 5px 0;
  color: #c5bdae;
  font: 500 .9rem/1.45 Lato, Arial, sans-serif;
  text-decoration: none;
  transition: color .18s ease;
}

.site-footer.footer-v432 .footer-b-links a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: 3px;
  height: 1px;
  background: #d2a23a;
  transition: right .18s ease;
}

.site-footer.footer-v432 .footer-b-links a:hover,
.site-footer.footer-v432 .footer-b-links a:focus-visible,
.site-footer.footer-v432 .footer-b-links a[aria-current="page"] {
  color: #fff8e9;
  outline: none;
}

.site-footer.footer-v432 .footer-b-links a:hover::after,
.site-footer.footer-v432 .footer-b-links a:focus-visible::after,
.site-footer.footer-v432 .footer-b-links a[aria-current="page"]::after {
  right: 0;
}

.site-footer.footer-v432 .footer-b-contact-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 20px 0;
  border-top: 1px solid rgba(210, 162, 58, .21);
  border-bottom: 1px solid rgba(210, 162, 58, .14);
  background: transparent;
}

.site-footer.footer-v432 .footer-b-contact-actions {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 28px;
  min-width: 0;
}

.site-footer.footer-v432 .footer-b-contact-pill {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 36px;
  width: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #ded6c7;
  font: 500 .86rem/1.3 Lato, Arial, sans-serif;
  white-space: nowrap;
  text-decoration: none;
  transition: color .18s ease, transform .18s ease;
}

.site-footer.footer-v432 .footer-b-contact-pill svg {
  width: 21px;
  height: 21px;
  flex: 0 0 21px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  fill: none;
  stroke: #d2a23a;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.site-footer.footer-v432 .footer-b-contact-pill:hover,
.site-footer.footer-v432 .footer-b-contact-pill:focus-visible {
  border: 0;
  background: transparent;
  color: #f4d27c;
  transform: none;
  outline: none;
}

.site-footer.footer-v432 .footer-b-socials {
  display: flex;
  flex: 0 0 auto;
  gap: 10px;
}

.site-footer.footer-v432 .footer-b-social {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(210, 162, 58, .42);
  border-radius: 50%;
  background: transparent;
  color: #d9b55c;
  transition: border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease;
}

.site-footer.footer-v432 .footer-b-social svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.site-footer.footer-v432 .footer-b-social:last-child svg {
  fill: currentColor;
  stroke: none;
}

.site-footer.footer-v432 .footer-b-social--instagram,
.site-footer.footer-v432 .footer-b-social--facebook {
  color: #d9b55c;
  border-color: rgba(210, 162, 58, .42);
  background: transparent;
}

.site-footer.footer-v432 .footer-b-social:hover,
.site-footer.footer-v432 .footer-b-social:focus-visible,
.site-footer.footer-v432 .footer-b-social--instagram:hover,
.site-footer.footer-v432 .footer-b-social--instagram:focus-visible,
.site-footer.footer-v432 .footer-b-social--facebook:hover,
.site-footer.footer-v432 .footer-b-social--facebook:focus-visible {
  border-color: #f4d27c;
  background: rgba(210, 162, 58, .09);
  color: #f4d27c;
  transform: translateY(-1px);
  outline: none;
}

.site-footer.footer-v432 .footer-b-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 0;
  padding: 16px 0 0;
  border: 0;
  color: #948b7d;
  font: 500 .75rem/1.45 Lato, Arial, sans-serif;
  letter-spacing: .01em;
  text-align: left;
}

.site-footer.footer-v432 .footer-b-bottom-separator {
  display: none;
}

.site-footer.footer-v432 .footer-b-legal {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 3px 12px;
  margin: 0;
}

.site-footer.footer-v432 .footer-b-legal span {
  display: none;
}

.site-footer.footer-v432 .footer-b-legal a {
  color: #a59c8e;
  text-decoration: none;
  transition: color .18s ease;
}

.site-footer.footer-v432 .footer-b-legal a:hover,
.site-footer.footer-v432 .footer-b-legal a:focus-visible,
.site-footer.footer-v432 .footer-b-legal a[aria-current="page"] {
  color: #f4d27c;
  outline: none;
}

@media (max-width: 1040px) {
  .site-footer.footer-v432 .footer-b-shell {
    width: min(calc(100% - 48px), 1480px);
  }

  .site-footer.footer-v432 .footer-b-main {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .site-footer.footer-v432 .footer-b-brand-panel {
    display: grid;
    grid-template-columns: minmax(210px, 255px) minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px;
    padding: 0 0 26px;
    border-right: 0;
    border-bottom: 1px solid rgba(210, 162, 58, .2);
  }

  .site-footer.footer-v432 .footer-b-tagline {
    margin: 0;
    max-width: 45ch;
  }

  .site-footer.footer-v432 .footer-b-nav {
    grid-template-columns: 1.2fr 1fr .8fr;
    gap: 34px;
  }
}

@media (max-width: 700px) {
  .site-footer.footer-v432 {
    padding: 30px 0 18px;
  }

  .site-footer.footer-v432 .footer-b-shell {
    width: min(calc(100% - 32px), 1480px);
  }

  .site-footer.footer-v432 .footer-b-main {
    display: block;
    padding: 0 0 18px;
  }

  .site-footer.footer-v432 .footer-b-brand-panel {
    display: block;
    padding: 0 0 22px;
    border-bottom: 1px solid rgba(210, 162, 58, .2);
    text-align: center;
  }

  .site-footer.footer-v432 .footer-b-brand {
    display: flex;
    justify-content: center;
  }

  .site-footer.footer-v432 .footer-b-brand img {
    width: min(100%, 230px);
  }

  .site-footer.footer-v432 .footer-b-tagline {
    max-width: 34ch;
    margin: 16px auto 18px;
    font-size: .86rem;
  }

  .site-footer.footer-v432 .footer-b-primary {
    width: min(100%, 320px);
    min-height: 44px;
  }

  .site-footer.footer-v432 .footer-b-nav {
    display: block;
    padding: 8px 0 0;
  }

  .site-footer.footer-v432 .footer-b-nav-group {
    border-bottom: 1px solid rgba(210, 162, 58, .17);
  }

  .site-footer.footer-v432 .footer-b-nav-group:last-child {
    border-bottom: 0;
  }

  .site-footer.footer-v432 .footer-b-nav-toggle {
    min-height: 50px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    color: #e4bc58;
    cursor: pointer;
  }

  .site-footer.footer-v432 .footer-b-chevron {
    width: 18px;
    height: 18px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform .18s ease;
  }

  .site-footer.footer-v432 .footer-b-nav-toggle[aria-expanded="true"] .footer-b-chevron {
    transform: rotate(180deg);
  }

  .site-footer.footer-v432 .footer-b-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 18px;
    padding: 0 0 14px;
  }

  .site-footer.footer-v432 .footer-b-links a {
    width: auto;
    padding: 8px 0;
    font-size: .87rem;
  }

  .site-footer.footer-v432 .footer-b-nav-group.is-collapsed .footer-b-links {
    display: none;
  }

  .site-footer.footer-v432 .footer-b-contact-row {
    display: block;
    padding: 18px 0;
  }

  .site-footer.footer-v432 .footer-b-contact-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2px;
  }

  .site-footer.footer-v432 .footer-b-contact-pill {
    width: 100%;
    min-height: 42px;
    justify-content: flex-start;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .site-footer.footer-v432 .footer-b-socials {
    justify-content: center;
    margin-top: 14px;
  }

  .site-footer.footer-v432 .footer-b-bottom {
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 14px 0 0;
    text-align: center;
  }

  .site-footer.footer-v432 .footer-b-legal {
    justify-content: center;
    gap: 5px 13px;
  }
}

@media (max-width: 430px) {
  .site-footer.footer-v432 .footer-b-links {
    grid-template-columns: 1fr;
  }
}



/* Build 432 density pass.
   Preserve the approved phone accordion at <=700px, but make the desktop/tablet
   footer feel like a footer rather than another full content section. */
@media (min-width: 701px) {
  .site-footer.footer-v432 {
    padding-top: 32px;
    padding-bottom: 16px;
  }

  .site-footer.footer-v432 .footer-b-main {
    gap: clamp(28px, 4vw, 62px);
    padding-bottom: 20px;
  }

  .site-footer.footer-v432 .footer-b-brand-panel {
    padding-right: clamp(20px, 2.4vw, 34px);
  }

  .site-footer.footer-v432 .footer-b-brand img {
    width: min(100%, 220px);
  }

  .site-footer.footer-v432 .footer-b-tagline {
    margin: 11px 0 12px;
    font-size: .84rem;
    line-height: 1.5;
  }

  .site-footer.footer-v432 .footer-b-primary {
    min-height: 36px;
    padding: 8px 15px;
    font-size: .72rem;
  }

  .site-footer.footer-v432 .footer-b-nav {
    gap: clamp(24px, 3vw, 46px);
    padding-top: 0;
  }

  .site-footer.footer-v432 .footer-b-nav-toggle {
    margin-bottom: 10px;
  }

  .site-footer.footer-v432 .footer-b-links a {
    padding: 3px 0;
    font-size: .86rem;
    line-height: 1.35;
  }

  .site-footer.footer-v432 .footer-b-links a::after {
    bottom: 1px;
  }

  .site-footer.footer-v432 .footer-b-contact-row {
    gap: 20px;
    padding: 12px 0;
  }

  .site-footer.footer-v432 .footer-b-contact-actions {
    gap: 6px 24px;
  }

  .site-footer.footer-v432 .footer-b-contact-pill {
    min-height: 32px;
    font-size: .84rem;
  }

  .site-footer.footer-v432 .footer-b-contact-pill svg {
    width: 19px;
    height: 19px;
    flex-basis: 19px;
  }

  .site-footer.footer-v432 .footer-b-social {
    width: 36px;
    height: 36px;
  }

  .site-footer.footer-v432 .footer-b-social svg {
    width: 16px;
    height: 16px;
  }

  .site-footer.footer-v432 .footer-b-bottom {
    gap: 16px;
    padding-top: 9px;
    font-size: .72rem;
  }
}

@media (min-width: 1041px) {
  .site-footer.footer-v432 .footer-b-main {
    grid-template-columns: minmax(210px, 260px) minmax(0, 1fr);
  }

  .site-footer.footer-v432 .footer-b-nav {
    grid-template-columns: 1.4fr 1fr .8fr;
  }

  /* Performances has eight links; split only this desktop group into two
     columns so it no longer dictates the full footer height. */
  .site-footer.footer-v432 .footer-b-nav-group:first-child .footer-b-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: clamp(18px, 2vw, 30px);
  }

  .site-footer.footer-v432 .footer-b-nav-group:first-child .footer-b-links a {
    width: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-footer.footer-v432 .footer-b-primary,
  .site-footer.footer-v432 .footer-b-links a,
  .site-footer.footer-v432 .footer-b-links a::after,
  .site-footer.footer-v432 .footer-b-contact-pill,
  .site-footer.footer-v432 .footer-b-social,
  .site-footer.footer-v432 .footer-b-chevron {
    transition: none;
  }
}

/* P31T50 source: assets/css/public-hero-standard-295.css */
/* Build 295 — site-wide public hero standard.
   Canonical reference: Recommended Suppliers Build 294.
   The rules below deliberately reproduce that hero's geometry, type scale,
   full-width image treatment, left fade and 102px landing divider. */

:root {
  --jt-landing-divider-height: 102px;
}

body .jt-standard-hero {
  position: relative !important;
  isolation: isolate;
  display: grid !important;
  align-items: center !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
  background: #050505 !important;
  color: #f7f1e7 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(210,162,58,.28) !important;
}

body .jt-standard-hero::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg,
      rgba(3,3,3,.995) 0%,
      rgba(3,3,3,.985) 17%,
      rgba(3,3,3,.95) 30%,
      rgba(3,3,3,.84) 42%,
      rgba(3,3,3,.58) 54%,
      rgba(3,3,3,.27) 67%,
      rgba(3,3,3,.10) 80%,
      rgba(3,3,3,.04) 100%),
    linear-gradient(180deg,rgba(0,0,0,.13) 0%,rgba(0,0,0,.05) 58%,rgba(0,0,0,.30) 100%);
}

body .jt-standard-hero::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 72% 42%,rgba(210,162,58,.10),transparent 35%);
}

body .jt-standard-hero-inner {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  position: static !important;
}

body .jt-standard-hero-copy {
  position: relative !important;
  z-index: 2 !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  background: none !important;
  text-shadow: none !important;
}

body .jt-standard-hero-copy .kicker,
body .jt-standard-hero-copy .preview-eyebrow {
  margin: 0 0 10px !important;
  color: #efc767 !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
}

body .jt-standard-hero-copy h1 {
  max-width: 19ch !important;
  margin: 0 0 14px !important;
  color: #f7f1e7 !important;
  font-family: Marcellus, Georgia, serif !important;
  font-size: clamp(2.35rem,3vw,3.55rem) !important;
  font-weight: 400 !important;
  line-height: 1.04 !important;
  letter-spacing: .012em !important;
  text-wrap: balance;
}

body .jt-standard-hero-copy h1 .gold,
body .jt-standard-hero-copy h1 .gold-line,
body .jt-standard-hero-copy h1 > span {
  color: #edcf83 !important;
}

body .jt-standard-hero-copy > p:not(.kicker):not(.preview-eyebrow) {
  max-width: 66ch !important;
  margin: 0 0 10px !important;
  color: rgba(255,255,255,.82) !important;
  font-size: clamp(.96rem,1vw,1.04rem) !important;
  line-height: 1.5 !important;
}
body .jt-standard-hero-copy > p:not(.kicker):not(.preview-eyebrow):last-of-type {
  margin-bottom: 0 !important;
}
body .jt-standard-hero-copy p a {
  color: #efc767 !important;
}

body .jt-standard-hero-copy .hero-actions,
body .jt-standard-hero-copy .preview-hero-actions,
body .jt-standard-hero-copy .reviews-hero-actions,
body .jt-standard-hero-copy .contact-hero-actions,
body .jt-standard-hero-copy .about-hero-actions,
body .jt-standard-hero-copy .occasions-hero-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  margin-top: 24px !important;
}

body .jt-standard-hero-copy > .btn {
  margin-top: 24px !important;
  align-self: flex-start !important;
}

body .jt-standard-hero .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 50px !important;
  padding: 12px 27px !important;
  border: 1px solid #d2a23a !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #e7bf61 !important;
  box-shadow: none !important;
  font-size: clamp(.78rem,.78vw,.88rem) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: .105em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}
body .jt-standard-hero .btn.btn-primary {
  border-color: #d3a437 !important;
  background: linear-gradient(135deg,#a86f18 0%,#efc45f 100%) !important;
  color: #080704 !important;
  box-shadow: 0 12px 28px rgba(164,112,26,.18) !important;
}
@media (hover:hover) and (pointer:fine) {
  body .jt-standard-hero .btn:hover,
  body .jt-standard-hero .btn:focus-visible {
    transform: translateY(-2px);
    background: rgba(210,162,58,.10) !important;
  }
  body .jt-standard-hero .btn.btn-primary:hover,
  body .jt-standard-hero .btn.btn-primary:focus-visible {
    background: linear-gradient(135deg,#bb7f1c 0%,#f4cf75 100%) !important;
  }
}

body .jt-standard-hero-media {
  position: absolute !important;
  z-index: 0 !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #090806 !important;
  box-shadow: none !important;
}
body .jt-standard-hero-media picture,
body .jt-standard-hero-media > img,
body .jt-standard-hero-media > picture > img,
body .jt-standard-hero-media figure,
body .jt-standard-hero-media figure > img {
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
}
body .jt-standard-hero-media > img,
body .jt-standard-hero-media > picture > img,
body .jt-standard-hero-media figure > img {
  display: block !important;
  object-fit: cover !important;
  object-position: var(--jt-hero-position,58% 50%) !important;
  filter: saturate(.92) contrast(1.04) brightness(.82) !important;
  transform: scale(1.012) !important;
}
body .jt-standard-hero-media figcaption {
  position: absolute !important;
  z-index: 2 !important;
  right: clamp(18px,2.6vw,44px) !important;
  bottom: 16px !important;
  left: auto !important;
  max-width: min(38vw,520px) !important;
  padding: 8px 12px !important;
  border: 0 !important;
  border-left: 2px solid #d2a23a !important;
  border-radius: 0 !important;
  background: rgba(0,0,0,.68) !important;
  color: #f7f1e7 !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: .03em !important;
  text-align: left !important;
  text-transform: none !important;
}

/* Page-specific media containers that previously used nested cards/collages. */
body.reviews-page .jt-standard-hero-media .reviews-hero-image {
  position: absolute !important;
  inset: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
body.reviews-page .jt-standard-hero-media .reviews-hero-quotes {
  display: none !important;
}
body.collaborations-page .jt-standard-hero-media .collab-hero-photo-grid {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
body.collaborations-page .jt-standard-hero-media .collab-hero-photo-grid img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  object-fit: cover !important;
  filter: saturate(.92) contrast(1.04) brightness(.82) !important;
}
body.gallery-page .jt-standard-hero-media {
  pointer-events: none !important;
}
body.gallery-page .jt-standard-hero-media .gallery-hero-main {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
}
body.gallery-page .jt-standard-hero-media .gallery-hero-main img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: var(--jt-hero-position,58% 45%) !important;
  filter: saturate(.92) contrast(1.04) brightness(.82) !important;
  transform: scale(1.012) !important;
}
body.gallery-page .jt-standard-hero-media .gallery-hero-mini {
  display: none !important;
}

/* Compact supporting hero-only details without changing the standard copy anchor. */
body .jt-standard-hero-copy .thov-members,
body .jt-standard-hero-copy .reviews-chip-row {
  margin-top: 16px !important;
}
body .jt-standard-hero-copy .thov-members {
  gap: 10px !important;
}
body .jt-standard-hero-copy .thov-members > div {
  padding: 8px 10px !important;
  background: rgba(8,8,8,.44) !important;
  border-color: rgba(210,162,58,.24) !important;
}
body .jt-standard-hero-copy .thov-members strong,
body .jt-standard-hero-copy .thov-members span,
body .jt-standard-hero-copy .reviews-chip-row span {
  font-size: .73rem !important;
  line-height: 1.3 !important;
}

/* Image focal points: revised in Build 296 to prioritise the performer's face and
   the strongest part of each source image now that every hero uses the shared
   full-width Suppliers geometry. */
body.home-page { --jt-hero-position: 74% 46%; }
body.weddings-page { --jt-hero-position: 70% 47%; }
body.occasions-page { --jt-hero-position: 72% 34%; }
body.performances-page { --jt-hero-position: 68% 42%; }
body.past-gigs-page { --jt-hero-position: 72% 36%; }
body.performance-map-page { --jt-hero-position: 63% 50%; }
body.reviews-page { --jt-hero-position: 74% 32%; }
body.thov-page { --jt-hero-position: 62% 42%; }
body.about-page { --jt-hero-position: 76% 34%; }
body.contact-page { --jt-hero-position: 78% 34%; }
body.booking-page { --jt-hero-position: 78% 34%; }
body.gallery-page { --jt-hero-position: 66% 42%; }
body.setup-page { --jt-hero-position: 54% 50%; }
body.resource-page-listen { --jt-hero-position: 70% 44%; }
body.resource-page-advice { --jt-hero-position: 70% 44%; }

/* Canonical first divider: exact Build 293/294 Recommended Suppliers treatment. */
body .jt-landing-divider {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #e9e0d3 !important;
  color: #17130e !important;
  border-block: 1px solid rgba(76,60,38,.20) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
body .jt-landing-divider-grid {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(4,minmax(0,1fr)) !important;
}
body .jt-landing-divider-item {
  min-width: 0 !important;
  min-height: 100px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  box-sizing: border-box !important;
  padding: 16px clamp(20px,2.5vw,44px) !important;
  border: 0 !important;
  border-right: 1px solid rgba(76,60,38,.18) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #17130e !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
body .jt-landing-divider-item:last-child {
  border-right: 0 !important;
}
body .jt-landing-divider-item > span:first-child {
  display: block !important;
  margin: 0 0 5px !important;
  color: #8b681f !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  letter-spacing: .15em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}
body .jt-landing-divider-item strong {
  display: block !important;
  margin: 0 !important;
  color: #17130e !important;
  font-family: Marcellus, Georgia, serif !important;
  font-size: clamp(1.02rem,1.15vw,1.24rem) !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}
body .jt-landing-divider-item small {
  display: block !important;
  margin: 5px 0 0 !important;
  color: #625b52 !important;
  font-size: .78rem !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}
@media (hover:hover) and (pointer:fine) {
  body a.jt-landing-divider-item:hover,
  body a.jt-landing-divider-item:focus-visible {
    background: rgba(139,104,31,.07) !important;
    outline: none !important;
  }
}

@media (min-width:1001px) {
  body .jt-standard-hero {
    min-height: calc(100svh - 112px - var(--jt-landing-divider-height)) !important;
    height: auto !important;
    max-height: none !important;
  }
  body .jt-standard-hero-inner {
    min-height: calc(100svh - 112px - var(--jt-landing-divider-height)) !important;
    height: auto !important;
    max-height: none !important;
    display: grid !important;
    grid-template-columns: minmax(0,45%) minmax(0,55%) !important;
    align-items: stretch !important;
    padding: 0 !important;
  }
  body .jt-standard-hero-copy {
    grid-column: 1 !important;
    width: 100% !important;
    max-width: none !important;
    align-self: stretch !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: clamp(26px,3vh,38px) clamp(28px,5vw,96px) !important;
  }
}

@media (min-width:641px) and (max-width:1000px) {
  body .jt-standard-hero {
    min-height: clamp(540px,75svh,700px) !important;
    height: auto !important;
    max-height: none !important;
  }
  body .jt-standard-hero-inner {
    min-height: inherit !important;
    display: flex !important;
    align-items: center !important;
    padding: 52px clamp(24px,4.5vw,54px) !important;
  }
  body .jt-standard-hero-copy {
    width: min(620px,78vw) !important;
    max-width: 620px !important;
    padding: 0 !important;
  }
  body .jt-standard-hero-copy h1 {
    max-width: 18ch !important;
    font-size: clamp(2.35rem,5.4vw,3.55rem) !important;
  }
  body .jt-standard-hero-copy > p:not(.kicker):not(.preview-eyebrow) {
    font-size: 1rem !important;
    line-height: 1.5 !important;
  }
  body .jt-standard-hero::before {
    background:
      linear-gradient(90deg,rgba(3,3,3,.99) 0%,rgba(3,3,3,.95) 26%,rgba(3,3,3,.78) 48%,rgba(3,3,3,.36) 72%,rgba(3,3,3,.15) 100%),
      linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.32));
  }
}

@media (max-width:980px) {
  body .jt-landing-divider-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  body .jt-landing-divider-item:nth-child(2) {
    border-right: 0 !important;
  }
  body .jt-landing-divider-item:nth-child(-n+2) {
    border-bottom: 1px solid rgba(76,60,38,.18) !important;
  }
}

@media (max-width:640px) {
  body .jt-standard-hero {
    min-height: clamp(570px,82svh,720px) !important;
    height: auto !important;
    max-height: none !important;
    align-items: center !important;
  }
  body .jt-standard-hero-inner {
    min-height: inherit !important;
    display: flex !important;
    align-items: center !important;
    padding: 44px 22px !important;
  }
  body .jt-standard-hero-copy {
    width: 100% !important;
    max-width: 540px !important;
    padding: 0 !important;
  }
  body .jt-standard-hero-copy h1 {
    max-width: 18ch !important;
    font-size: clamp(2.15rem,10vw,3rem) !important;
  }
  body .jt-standard-hero-copy > p:not(.kicker):not(.preview-eyebrow) {
    font-size: .96rem !important;
    line-height: 1.5 !important;
  }
  body .jt-standard-hero-copy .hero-actions,
  body .jt-standard-hero-copy .preview-hero-actions,
  body .jt-standard-hero-copy .reviews-hero-actions,
  body .jt-standard-hero-copy .contact-hero-actions,
  body .jt-standard-hero-copy .about-hero-actions,
  body .jt-standard-hero-copy .occasions-hero-actions {
    gap: 12px !important;
  }
  body .jt-standard-hero .btn {
    min-height: 48px !important;
    padding: 11px 22px !important;
  }
  body .jt-standard-hero::before {
    background:
      linear-gradient(90deg,rgba(3,3,3,.97) 0%,rgba(3,3,3,.91) 38%,rgba(3,3,3,.64) 68%,rgba(3,3,3,.34) 100%),
      linear-gradient(180deg,rgba(3,3,3,.30) 0%,rgba(3,3,3,.18) 36%,rgba(3,3,3,.76) 82%,rgba(3,3,3,.94) 100%);
  }
  body .jt-standard-hero-media figcaption {
    right: 16px !important;
    bottom: 12px !important;
    max-width: calc(100% - 32px) !important;
  }
  body .jt-landing-divider-item {
    min-height: 90px !important;
    padding: 14px 18px !important;
  }
}

/* Final Build 295 parity lock -------------------------------------------------
   These selectors intentionally include #main-content so older page-specific
   hero/divider fixes cannot override the Build 294 Suppliers reference. */
@media (min-width:1001px) {
  html body #main-content > .jt-standard-hero {
    box-sizing: content-box !important;
    width: 100% !important;
    min-width: 0 !important;
    height: calc(100svh - 112px - 102px) !important;
    min-height: calc(100svh - 112px - 102px) !important;
    max-height: calc(100svh - 112px - 102px) !important;
    padding: 0 !important;
    margin: 0 !important;
    display: grid !important;
    align-items: center !important;
    overflow: hidden !important;
  }

  html body #main-content > .jt-standard-hero > .jt-standard-hero-inner,
  html body #main-content > .jt-standard-hero .jt-standard-hero-inner {
    position: static !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    height: calc(100svh - 112px - 102px) !important;
    min-height: calc(100svh - 112px - 102px) !important;
    max-height: calc(100svh - 112px - 102px) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0,45%) minmax(0,55%) !important;
    grid-template-rows: minmax(0,1fr) !important;
    align-items: stretch !important;
    gap: 0 !important;
    overflow: visible !important;
  }

  html body #main-content > .jt-standard-hero .jt-standard-hero-copy {
    position: relative !important;
    z-index: 2 !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: stretch !important;
    justify-self: stretch !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: clamp(26px,3vh,38px) clamp(28px,5vw,96px) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    gap: 0 !important;
    overflow: visible !important;
    background: none !important;
    transform: none !important;
  }

  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .kicker,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .preview-eyebrow {
    margin: 0 0 10px !important;
    padding: 0 !important;
    color: #efc767 !important;
    font-family: Lato, Arial, sans-serif !important;
    font-size: .72rem !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
  }

  html body #main-content > .jt-standard-hero .jt-standard-hero-copy h1 {
    width: auto !important;
    max-width: 19ch !important;
    min-width: 0 !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    color: #f7f1e7 !important;
    font-family: Marcellus, Georgia, serif !important;
    font-size: clamp(2.35rem,3vw,3.55rem) !important;
    font-weight: 400 !important;
    line-height: 1.04 !important;
    letter-spacing: .012em !important;
    text-align: left !important;
    text-transform: none !important;
  }

  html body #main-content > .jt-standard-hero .jt-standard-hero-copy > p:not(.kicker):not(.preview-eyebrow) {
    width: auto !important;
    max-width: 66ch !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
    color: rgba(255,255,255,.82) !important;
    font-family: Lato, Arial, sans-serif !important;
    font-size: clamp(.96rem,1vw,1.04rem) !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    letter-spacing: normal !important;
    text-align: left !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy > p:not(.kicker):not(.preview-eyebrow):last-of-type {
    margin-bottom: 0 !important;
  }

  html body #main-content > .jt-standard-hero .jt-standard-hero-media {
    position: absolute !important;
    z-index: 0 !important;
    inset: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #090806 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html body #main-content > .jt-standard-hero .jt-standard-hero-media > img,
  html body #main-content > .jt-standard-hero .jt-standard-hero-media > picture,
  html body #main-content > .jt-standard-hero .jt-standard-hero-media > picture > img,
  html body #main-content > .jt-standard-hero .jt-standard-hero-media figure,
  html body #main-content > .jt-standard-hero .jt-standard-hero-media figure > img {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-media > img,
  html body #main-content > .jt-standard-hero .jt-standard-hero-media > picture > img,
  html body #main-content > .jt-standard-hero .jt-standard-hero-media figure > img {
    display: block !important;
    object-fit: cover !important;
    object-position: var(--jt-hero-position,58% 50%) !important;
    filter: saturate(.92) contrast(1.04) brightness(.82) !important;
    transform: scale(1.012) !important;
  }

  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .preview-hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .reviews-hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .contact-hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .about-hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .occasions-hero-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    width: auto !important;
    margin: 24px 0 0 !important;
    padding: 0 !important;
  }

  html body #main-content > .jt-standard-hero .btn {
    box-sizing: border-box !important;
    min-width: 0 !important;
    min-height: 50px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 12px 27px !important;
    border: 1px solid #d2a23a !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: #e7bf61 !important;
    box-shadow: none !important;
    font-family: Lato, Arial, sans-serif !important;
    font-size: clamp(.78rem,.78vw,.88rem) !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: .105em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
  }
  html body #main-content > .jt-standard-hero .btn.btn-primary {
    border-color: #d3a437 !important;
    background: linear-gradient(135deg,#a86f18 0%,#efc45f 100%) !important;
    color: #080704 !important;
    box-shadow: 0 12px 28px rgba(164,112,26,.18) !important;
  }

  /* Lock the landing divider to the same 100px + two 1px borders as Build 294. */
  html body #main-content > .jt-landing-divider {
    box-sizing: content-box !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 100px !important;
    min-height: 100px !important;
    max-height: 100px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    overflow: hidden !important;
    border-top: 1px solid rgba(76,60,38,.20) !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(76,60,38,.20) !important;
    border-left: 0 !important;
    border-radius: 0 !important;
    background: #e9e0d3 !important;
    color: #17130e !important;
    box-shadow: none !important;
  }
  html body #main-content > .jt-landing-divider > .jt-landing-divider-grid,
  html body #main-content > .jt-landing-divider .jt-landing-divider-grid {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 100px !important;
    min-height: 100px !important;
    max-height: 100px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    grid-template-rows: 100px !important;
    gap: 0 !important;
    align-items: stretch !important;
    overflow: hidden !important;
  }
  html body #main-content > .jt-landing-divider .jt-landing-divider-item {
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    height: 100px !important;
    min-height: 100px !important;
    max-height: 100px !important;
    margin: 0 !important;
    padding: 16px clamp(20px,2.5vw,44px) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    gap: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-right: 1px solid rgba(76,60,38,.18) !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #17130e !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transform: none !important;
  }
  html body #main-content > .jt-landing-divider .jt-landing-divider-item:last-child {
    border-right: 0 !important;
  }
  html body #main-content > .jt-landing-divider .jt-landing-divider-item > span:first-child {
    display: block !important;
    width: auto !important;
    margin: 0 0 5px !important;
    padding: 0 !important;
    color: #8b681f !important;
    font-family: Lato, Arial, sans-serif !important;
    font-size: .72rem !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    letter-spacing: .15em !important;
    text-transform: uppercase !important;
  }
  html body #main-content > .jt-landing-divider .jt-landing-divider-item > strong {
    display: block !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #17130e !important;
    font-family: Marcellus, Georgia, serif !important;
    font-size: clamp(1.02rem,1.15vw,1.24rem) !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
  }
  html body #main-content > .jt-landing-divider .jt-landing-divider-item > small {
    display: block !important;
    width: auto !important;
    margin: 5px 0 0 !important;
    padding: 0 !important;
    color: #625b52 !important;
    font-family: Lato, Arial, sans-serif !important;
    font-size: .78rem !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
  }

  /* Nested legacy media structures: keep the existing imagery, but make the
     selected hero image(s) occupy the same full-width plane. */
  html body.collaborations-page #main-content > .jt-standard-hero .jt-standard-hero-media .collab-hero-photo-grid {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 0 !important;
  }
  html body.collaborations-page #main-content > .jt-standard-hero .jt-standard-hero-media .collab-hero-photo-grid img {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    object-fit: cover !important;
    filter: saturate(.92) contrast(1.04) brightness(.82) !important;
  }
  html body.reviews-page #main-content > .jt-standard-hero .jt-standard-hero-media .reviews-hero-image {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  html body.reviews-page #main-content > .jt-standard-hero .jt-standard-hero-media .reviews-hero-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: var(--jt-hero-position,70% 45%) !important;
    filter: saturate(.92) contrast(1.04) brightness(.82) !important;
    transform: scale(1.012) !important;
  }
  html body.reviews-page #main-content > .jt-standard-hero .jt-standard-hero-media .reviews-hero-quotes {
    display: none !important;
  }
  html body.gallery-page #main-content > .jt-standard-hero .jt-standard-hero-media .gallery-hero-main {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    border: 0 !important;
    border-radius: 0 !important;
  }
  html body.gallery-page #main-content > .jt-standard-hero .jt-standard-hero-media .gallery-hero-main img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: var(--jt-hero-position,58% 45%) !important;
    filter: saturate(.92) contrast(1.04) brightness(.82) !important;
    transform: scale(1.012) !important;
  }
  html body.gallery-page #main-content > .jt-standard-hero .jt-standard-hero-media .gallery-hero-mini {
    display: none !important;
  }
}

/* Tablet/mobile parity with the same Suppliers reference. */
@media (min-width:641px) and (max-width:1000px) {
  html body #main-content > .jt-standard-hero {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: clamp(540px,75svh,700px) !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    align-items: center !important;
    overflow: hidden !important;
  }
  html body #main-content > .jt-standard-hero > .jt-standard-hero-inner,
  html body #main-content > .jt-standard-hero .jt-standard-hero-inner {
    position: static !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 52px clamp(24px,4.5vw,54px) !important;
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy {
    position: relative !important;
    z-index: 2 !important;
    box-sizing: border-box !important;
    display: block !important;
    width: min(620px,78vw) !important;
    max-width: 620px !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    align-self: auto !important;
    transform: none !important;
    background: none !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy h1 {
    width: auto !important;
    max-width: 18ch !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    color: #f7f1e7 !important;
    font-family: Marcellus, Georgia, serif !important;
    font-size: clamp(2.35rem,5.4vw,3.55rem) !important;
    font-weight: 400 !important;
    line-height: 1.04 !important;
    letter-spacing: .012em !important;
    text-align: left !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .kicker,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .preview-eyebrow {
    margin: 0 0 10px !important;
    padding: 0 !important;
    color: #efc767 !important;
    font-family: Lato, Arial, sans-serif !important;
    font-size: .72rem !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy > p:not(.kicker):not(.preview-eyebrow) {
    max-width: 66ch !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
    color: rgba(255,255,255,.82) !important;
    font-family: Lato, Arial, sans-serif !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    letter-spacing: normal !important;
    text-align: left !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy > p:not(.kicker):not(.preview-eyebrow):last-of-type { margin-bottom: 0 !important; }
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .preview-hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .reviews-hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .contact-hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .about-hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .occasions-hero-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    margin: 24px 0 0 !important;
    padding: 0 !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-media {
    position: absolute !important;
    z-index: 0 !important;
    inset: 0 !important;
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: calc(100% - 1px) !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    transform: none !important;
  }
}

@media (max-width:640px) {
  html body #main-content > .jt-standard-hero {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: clamp(570px,82svh,720px) !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    align-items: center !important;
    overflow: hidden !important;
  }
  html body #main-content > .jt-standard-hero > .jt-standard-hero-inner,
  html body #main-content > .jt-standard-hero .jt-standard-hero-inner {
    position: static !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 44px 22px !important;
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy {
    position: relative !important;
    z-index: 2 !important;
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    max-width: 540px !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    align-self: auto !important;
    transform: none !important;
    background: none !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy h1 {
    width: auto !important;
    max-width: 18ch !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    color: #f7f1e7 !important;
    font-family: Marcellus, Georgia, serif !important;
    font-size: clamp(2.15rem,10vw,3rem) !important;
    font-weight: 400 !important;
    line-height: 1.04 !important;
    letter-spacing: .012em !important;
    text-align: left !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .kicker,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .preview-eyebrow {
    margin: 0 0 10px !important;
    padding: 0 !important;
    color: #efc767 !important;
    font-family: Lato, Arial, sans-serif !important;
    font-size: .72rem !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy > p:not(.kicker):not(.preview-eyebrow) {
    max-width: 66ch !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
    color: rgba(255,255,255,.82) !important;
    font-family: Lato, Arial, sans-serif !important;
    font-size: .96rem !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    letter-spacing: normal !important;
    text-align: left !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy > p:not(.kicker):not(.preview-eyebrow):last-of-type { margin-bottom: 0 !important; }
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .preview-hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .reviews-hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .contact-hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .about-hero-actions,
  html body #main-content > .jt-standard-hero .jt-standard-hero-copy .occasions-hero-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    margin: 24px 0 0 !important;
    padding: 0 !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-media {
    position: absolute !important;
    z-index: 0 !important;
    inset: 0 !important;
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: calc(100% - 1px) !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    transform: none !important;
  }
  html body #main-content > .jt-standard-hero .btn {
    min-height: 48px !important;
    padding: 11px 22px !important;
  }
}

/* Responsive divider lock: same two-column behaviour and typography as the
   approved Suppliers bar, while allowing extra height only when copy wraps. */
@media (max-width:1000px) {
  html body #main-content > .jt-landing-divider {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    overflow: hidden !important;
    border-top: 1px solid rgba(76,60,38,.20) !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(76,60,38,.20) !important;
    border-left: 0 !important;
    border-radius: 0 !important;
    background: #e9e0d3 !important;
    color: #17130e !important;
    box-shadow: none !important;
  }
  html body #main-content > .jt-landing-divider > .jt-landing-divider-grid,
  html body #main-content > .jt-landing-divider .jt-landing-divider-grid {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 0 !important;
    align-items: stretch !important;
    overflow: visible !important;
  }
  html body #main-content > .jt-landing-divider .jt-landing-divider-item {
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 100px !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 16px clamp(20px,2.5vw,44px) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    gap: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-right: 1px solid rgba(76,60,38,.18) !important;
    border-bottom: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #17130e !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transform: none !important;
  }
  html body #main-content > .jt-landing-divider .jt-landing-divider-item:nth-child(2n) { border-right: 0 !important; }
  html body #main-content > .jt-landing-divider .jt-landing-divider-item:nth-child(-n+2) { border-bottom: 1px solid rgba(76,60,38,.18) !important; }
  html body #main-content > .jt-landing-divider .jt-landing-divider-item > span:first-child {
    display: block !important;
    margin: 0 0 5px !important;
    padding: 0 !important;
    color: #8b681f !important;
    font-family: Lato,Arial,sans-serif !important;
    font-size: .72rem !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    letter-spacing: .15em !important;
    text-transform: uppercase !important;
  }
  html body #main-content > .jt-landing-divider .jt-landing-divider-item > strong {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #17130e !important;
    font-family: Marcellus,Georgia,serif !important;
    font-size: clamp(1.02rem,1.15vw,1.24rem) !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
  }
  html body #main-content > .jt-landing-divider .jt-landing-divider-item > small {
    display: block !important;
    margin: 5px 0 0 !important;
    padding: 0 !important;
    color: #625b52 !important;
    font-family: Lato,Arial,sans-serif !important;
    font-size: .78rem !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
  }
}
@media (max-width:640px) {
  html body #main-content > .jt-landing-divider .jt-landing-divider-item {
    min-height: 90px !important;
    padding: 14px 18px !important;
  }
}

@media (min-width:1001px) and (max-height:740px) {
  html body.reviews-page #main-content > .jt-standard-hero .reviews-chip-row { margin-top: 8px !important; }
}

/* Final visual parity: one fade layer only, and the existing hero captions keep
   the approved Weddings hero treatment. */
html body #main-content > .jt-standard-hero::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 1 !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg,
      rgba(3,3,3,.995) 0%,
      rgba(3,3,3,.985) 17%,
      rgba(3,3,3,.95) 30%,
      rgba(3,3,3,.84) 42%,
      rgba(3,3,3,.58) 54%,
      rgba(3,3,3,.27) 67%,
      rgba(3,3,3,.10) 80%,
      rgba(3,3,3,.04) 100%),
    linear-gradient(180deg,rgba(0,0,0,.13) 0%,rgba(0,0,0,.05) 58%,rgba(0,0,0,.30) 100%) !important;
}
html body #main-content > .jt-standard-hero::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 1 !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: radial-gradient(circle at 72% 42%,rgba(210,162,58,.10),transparent 35%) !important;
}
html body #main-content > .jt-standard-hero .jt-standard-hero-media::before,
html body #main-content > .jt-standard-hero .jt-standard-hero-media::after {
  content: none !important;
  display: none !important;
}
html body #main-content > .jt-standard-hero .jt-standard-hero-media figcaption {
  position: absolute !important;
  z-index: 2 !important;
  left: 18px !important;
  right: auto !important;
  bottom: 14px !important;
  max-width: min(44vw,520px) !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  border: 0 !important;
  border-left: 2px solid #d2a23a !important;
  border-radius: 0 !important;
  background: rgba(0,0,0,.68) !important;
  color: #f7f1e7 !important;
  font-family: Lato,Arial,sans-serif !important;
  font-size: .8rem !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  letter-spacing: normal !important;
  text-align: left !important;
  text-transform: none !important;
  opacity: 1 !important;
}

@media (min-width:641px) and (max-width:1000px) {
  html body #main-content > .jt-standard-hero .jt-standard-hero-media {
    height: 100% !important;
  }
  html body #main-content > .jt-standard-hero::before {
    background:
      linear-gradient(90deg,rgba(3,3,3,.99) 0%,rgba(3,3,3,.95) 26%,rgba(3,3,3,.78) 48%,rgba(3,3,3,.36) 72%,rgba(3,3,3,.15) 100%),
      linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.32)) !important;
  }
}
@media (max-width:640px) {
  html body #main-content > .jt-standard-hero .jt-standard-hero-media {
    height: 100% !important;
  }
}
@media (max-width:600px) {
  html body #main-content > .jt-standard-hero::before {
    background:
      linear-gradient(90deg,rgba(3,3,3,.97) 0%,rgba(3,3,3,.91) 38%,rgba(3,3,3,.64) 68%,rgba(3,3,3,.34) 100%),
      linear-gradient(180deg,rgba(3,3,3,.30) 0%,rgba(3,3,3,.18) 36%,rgba(3,3,3,.76) 82%,rgba(3,3,3,.94) 100%) !important;
  }
  html body #main-content > .jt-standard-hero .jt-standard-hero-media > img,
  html body #main-content > .jt-standard-hero .jt-standard-hero-media > picture > img,
  html body #main-content > .jt-standard-hero .jt-standard-hero-media figure > img,
  html body.reviews-page #main-content > .jt-standard-hero .jt-standard-hero-media .reviews-hero-image img,
  html body.gallery-page #main-content > .jt-standard-hero .jt-standard-hero-media .gallery-hero-main img,
  html body.collaborations-page #main-content > .jt-standard-hero .jt-standard-hero-media .collab-hero-photo-grid img {
    filter: saturate(.88) contrast(1.04) brightness(.68) !important;
  }
}

@media (max-width:1000px) {
  html body #main-content > .jt-landing-divider .jt-landing-divider-grid {
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
}

/* Keep captions above the fade while the hero copy remains the top content layer. */
html body #main-content > .jt-standard-hero .jt-standard-hero-media { z-index: auto !important; }
html body #main-content > .jt-standard-hero .jt-standard-hero-copy { z-index: 3 !important; }
html body #main-content > .jt-standard-hero .jt-standard-hero-media figcaption { z-index: 2 !important; }

/* Build 298 — Hero Manager optional subtitle. The rest of the hero geometry
   remains the approved Suppliers/Build 295 standard. */
html body #main-content > .jt-standard-hero .jt-standard-hero-copy > p.jt-hero-subtitle,
html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-copy > p.jt-hero-subtitle {
  display: block !important;
  max-width: 54ch !important;
  margin: -2px 0 11px !important;
  color: #efc767 !important;
  font-family: Lato, Arial, sans-serif !important;
  font-size: clamp(1rem,1.08vw,1.12rem) !important;
  font-weight: 800 !important;
  line-height: 1.38 !important;
  letter-spacing: .01em !important;
}

/* Build 328: managed captions must be the SAME caption component as the
   established hero figcaption. Build 327 accidentally gave generated captions
   a second right-aligned variant; remove that divergence completely. */
body .jt-standard-hero-media > .jt-hero-managed-caption {
  position: absolute !important;
  z-index: 2 !important;
  display: block !important;
  left: 18px !important;
  right: auto !important;
  bottom: 14px !important;
  max-width: min(44vw,520px) !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  border: 0 !important;
  border-left: 2px solid #d2a23a !important;
  border-radius: 0 !important;
  background: rgba(0,0,0,.68) !important;
  color: #f7f1e7 !important;
  font-family: Lato,Arial,sans-serif !important;
  font-size: .8rem !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  letter-spacing: normal !important;
  text-align: left !important;
  text-transform: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
}
body .jt-standard-hero-media > .jt-hero-managed-caption > * {
  color: inherit !important;
  font: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  text-transform: inherit !important;
}

/* Build 329 — Credentials no longer has any caption-specific visual override.
   Its legacy label is normalised to a clean FIGCAPTION by the hero runtime, so
   it inherits the exact same shared caption CSS as every other standard hero. */


/* Build 330 — one hero-caption component, anchored to the RIGHT of the image
   plane on every managed page. This is deliberately the final caption rule in
   the shared stylesheet so older page-specific left/badge/uppercase rules
   cannot win the cascade. */
html body #main-content > .jt-standard-hero .jt-standard-hero-media > figcaption,
html body #main-content > .jt-standard-hero .jt-standard-hero-media > .jt-standard-hero-caption,
html body #main-content > .jt-standard-hero .jt-standard-hero-media > .jt-hero-managed-caption,
html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-media > figcaption,
html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-media > .jt-standard-hero-caption,
html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-media > .jt-hero-managed-caption {
  position: absolute !important;
  z-index: 4 !important;
  display: block !important;
  left: auto !important;
  right: clamp(18px,2.6vw,44px) !important;
  bottom: 16px !important;
  width: auto !important;
  max-width: min(38vw,520px) !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  border: 0 !important;
  border-left: 2px solid #d2a23a !important;
  border-radius: 0 !important;
  background: rgba(0,0,0,.68) !important;
  color: #f7f1e7 !important;
  font-family: Lato,Arial,sans-serif !important;
  font-size: .8rem !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  letter-spacing: normal !important;
  text-align: left !important;
  text-transform: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
}
html body #main-content > .jt-standard-hero .jt-standard-hero-media > [data-jt-hero-caption][hidden],
html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-media > [data-jt-hero-caption][hidden] {
  display: none !important;
}
@media (max-width: 640px) {
  html body #main-content > .jt-standard-hero .jt-standard-hero-media > figcaption,
  html body #main-content > .jt-standard-hero .jt-standard-hero-media > .jt-standard-hero-caption,
  html body #main-content > .jt-standard-hero .jt-standard-hero-media > .jt-hero-managed-caption,
  html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-media > figcaption,
  html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-media > .jt-standard-hero-caption,
  html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-media > .jt-hero-managed-caption {
    right: 14px !important;
    bottom: 12px !important;
    max-width: min(72vw,420px) !important;
    font-size: .74rem !important;
  }
}

/* P31T50 source: assets/css/public-hero-image-plane-300.css */
/* Build 300 — site-wide desktop hero image plane.
   Approved from the Build 299 Home prototype. On desktop the hero image occupies
   the right-hand 70% of the hero, leaving a clean dark copy area on the left.
   The fade spans the join so the transition remains smooth. Tablet/mobile retain
   the existing responsive treatment. Hero Manager measures the real media plane,
   so its resizable crop frame automatically uses this 70% desktop aspect ratio. */

@media (min-width: 1001px) {
  html body #main-content > .jt-standard-hero .jt-standard-hero-media,
  html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-media {
    inset: 0 0 0 30% !important;
    left: 30% !important;
    right: 0 !important;
    width: 70% !important;
    max-width: 70% !important;
  }

  html body #main-content > .jt-standard-hero::before {
    background:
      linear-gradient(90deg,
        rgba(3,3,3,1) 0%,
        rgba(3,3,3,1) 27%,
        rgba(3,3,3,.97) 31%,
        rgba(3,3,3,.88) 36%,
        rgba(3,3,3,.70) 42%,
        rgba(3,3,3,.46) 49%,
        rgba(3,3,3,.24) 56%,
        rgba(3,3,3,.10) 64%,
        rgba(3,3,3,.04) 72%,
        rgba(3,3,3,.02) 100%),
      linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.04) 58%,rgba(0,0,0,.28) 100%) !important;
  }

  html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-shade {
    background:
      linear-gradient(90deg,
        rgba(3,3,3,1) 0%,
        rgba(3,3,3,1) 27%,
        rgba(3,3,3,.97) 31%,
        rgba(3,3,3,.88) 36%,
        rgba(3,3,3,.70) 42%,
        rgba(3,3,3,.46) 49%,
        rgba(3,3,3,.24) 56%,
        rgba(3,3,3,.10) 64%,
        rgba(3,3,3,.04) 72%,
        rgba(3,3,3,.02) 100%),
      linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.04) 58%,rgba(0,0,0,.28) 100%) !important;
  }
}
/* Build 305 — Wedding Advice parity fix.
   public-polish-258 still gave this legacy resource hero its own full-bleed
   background image and hid the real media element. That sat underneath the new
   70% hero system, so Wedding Advice could not visually match the shared fade.
   Remove the legacy background and force the managed media plane back on. */
html body.resource-page-advice #main-content > .resource-hero.jt-standard-hero {
  background: #050505 !important;
  background-image: none !important;
}
html body.resource-page-advice #main-content > .resource-hero.jt-standard-hero .resource-hero-media.jt-standard-hero-media {
  display: block !important;
}



/* Build 306 — Wedding Advice uses the same DOM layering as the working heroes.
   Keep its media as a direct hero child so the shared hero fade sits above the
   image and below the copy instead of being trapped behind the old resource grid. */
@media (min-width: 1001px) {
  html body.resource-page-advice #main-content > .resource-hero.jt-standard-hero > .resource-hero-media.jt-standard-hero-media {
    position: absolute !important;
    z-index: 0 !important;
    inset: 0 0 0 30% !important;
    left: 30% !important;
    right: 0 !important;
    width: 70% !important;
    max-width: 70% !important;
    height: 100% !important;
    overflow: hidden !important;
  }
  html body.resource-page-advice #main-content > .resource-hero.jt-standard-hero > .resource-hero-grid.jt-standard-hero-inner {
    position: relative !important;
    z-index: 2 !important;
    background: transparent !important;
  }
  html body.resource-page-advice #main-content > .resource-hero.jt-standard-hero::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    z-index: 1 !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
      linear-gradient(90deg,
        rgba(3,3,3,1) 0%,
        rgba(3,3,3,1) 27%,
        rgba(3,3,3,.97) 31%,
        rgba(3,3,3,.88) 36%,
        rgba(3,3,3,.70) 42%,
        rgba(3,3,3,.46) 49%,
        rgba(3,3,3,.24) 56%,
        rgba(3,3,3,.10) 64%,
        rgba(3,3,3,.04) 72%,
        rgba(3,3,3,.02) 100%),
      linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.04) 58%,rgba(0,0,0,.28) 100%) !important;
  }
}



/* Build 309 — exact crop first paint.
   Hero Manager's X/Y/zoom values describe the exact draggable source rectangle.
   The public runtime now applies that same proportional crop before revealing the
   proxy image. This avoids both the Build 308 approximate object-fit/transform
   interpretation and the visible load-then-jump that Build 307 suffered from. */
html body #main-content > .jt-standard-hero .jt-standard-hero-media img[data-jt-hero-proxy],
html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-media img[data-jt-hero-proxy] {
  position: absolute !important;
  display: block !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: 50% 50% !important;
  transform: none !important;
  transform-origin: 50% 50% !important;
  opacity: 0 !important;
  transition: none !important;
}
html body #main-content > .jt-standard-hero .jt-standard-hero-media img[data-jt-hero-proxy][data-jt-crop-ready="1"],
html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-media img[data-jt-hero-proxy][data-jt-crop-ready="1"] {
  opacity: 1 !important;
}


/* Build 311 — lighter portrait-mobile hero fade.
   On phones the image already fills the hero behind the copy, so the previous
   desktop-strength overlay hid too much of the photograph. Keep enough contrast
   behind the left-aligned text, but reveal substantially more of the image.
   Landscape mobile/tablet and desktop are intentionally unchanged. */
@media (max-width: 640px) and (orientation: portrait) {
  html body #main-content > .jt-standard-hero::before {
    background:
      linear-gradient(90deg,
        rgba(3,3,3,.78) 0%,
        rgba(3,3,3,.62) 28%,
        rgba(3,3,3,.38) 52%,
        rgba(3,3,3,.16) 74%,
        rgba(3,3,3,.05) 100%),
      linear-gradient(180deg,
        rgba(0,0,0,.06) 0%,
        rgba(0,0,0,.02) 56%,
        rgba(0,0,0,.30) 100%) !important;
  }

  html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-shade {
    background:
      linear-gradient(90deg,
        rgba(3,3,3,.78) 0%,
        rgba(3,3,3,.62) 28%,
        rgba(3,3,3,.38) 52%,
        rgba(3,3,3,.16) 74%,
        rgba(3,3,3,.05) 100%),
      linear-gradient(180deg,
        rgba(0,0,0,.06) 0%,
        rgba(0,0,0,.02) 56%,
        rgba(0,0,0,.30) 100%) !important;
  }
}

/* Build 328 — Credentials uses the exact same desktop fade as the other
   standard landing heroes. The selector is deliberately more specific than
   the legacy Credentials stylesheet so that older resource-page rules cannot
   replace the shared fade when they are loaded later. */
@media (min-width: 1001px) {
  html body.credentials-page #main-content > .jt-credentials-standard-hero.jt-standard-hero::before,
  html body.resource-page-credentials.credentials-page #main-content > .jt-standard-hero.jt-credentials-standard-hero::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    z-index: 1 !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
      linear-gradient(90deg,
        rgba(3,3,3,1) 0%,
        rgba(3,3,3,1) 27%,
        rgba(3,3,3,.97) 31%,
        rgba(3,3,3,.88) 36%,
        rgba(3,3,3,.70) 42%,
        rgba(3,3,3,.46) 49%,
        rgba(3,3,3,.24) 56%,
        rgba(3,3,3,.10) 64%,
        rgba(3,3,3,.04) 72%,
        rgba(3,3,3,.02) 100%),
      linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.04) 58%,rgba(0,0,0,.28) 100%) !important;
  }

  html body.credentials-page #main-content > .jt-credentials-standard-hero.jt-standard-hero .jt-standard-hero-media {
    inset: 0 0 0 30% !important;
    left: 30% !important;
    right: 0 !important;
    width: 70% !important;
    max-width: 70% !important;
  }
}

/* Build 329 — one desktop hero fade rule for the whole public site.
   The image plane begins at 30vw. Keep the overlay fully black beyond that join,
   then reveal the photograph progressively across a longer gradient. This removes
   the visible vertical image edge and makes the same fade treatment authoritative
   for Home, Weddings, Occasions, Listen, THOV, Collaborations, Gigs, Reviews,
   Gallery, About, Contact, Booking, Wedding Advice, Suppliers, Setup and Credentials. */
@media (min-width: 1001px) {
  html {
    --jt-public-hero-desktop-fade:
      linear-gradient(90deg,
        rgba(0,0,0,1) 0%,
        rgba(0,0,0,1) 34%,
        rgba(0,0,0,.995) 38%,
        rgba(0,0,0,.965) 43%,
        rgba(0,0,0,.87) 49%,
        rgba(0,0,0,.68) 56%,
        rgba(0,0,0,.46) 63%,
        rgba(0,0,0,.27) 70%,
        rgba(0,0,0,.13) 79%,
        rgba(0,0,0,.055) 90%,
        rgba(0,0,0,.02) 100%),
      linear-gradient(180deg,
        rgba(0,0,0,.14) 0%,
        rgba(0,0,0,.05) 58%,
        rgba(0,0,0,.30) 100%);
  }

  html body #main-content > .jt-standard-hero::before,
  html body.resource-page-advice #main-content > .resource-hero.jt-standard-hero::before,
  html body.credentials-page #main-content > .jt-credentials-standard-hero.jt-standard-hero::before,
  html body.resource-page-credentials.credentials-page #main-content > .jt-standard-hero.jt-credentials-standard-hero::before {
    background: var(--jt-public-hero-desktop-fade) !important;
  }

  html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-shade {
    background: var(--jt-public-hero-desktop-fade) !important;
  }
}

/* Build 331 — shared hero image vibrancy.
   The source images are unchanged. Keep the strong left fade for copy contrast,
   but stop dimming the whole photograph: restore brightness/saturation and let
   the far-right image plane read much closer to the original image. */
html {
  --jt-public-hero-image-filter: brightness(1.10) saturate(1.12) contrast(1.03);
}
html body #main-content > .jt-standard-hero .jt-standard-hero-media > img,
html body #main-content > .jt-standard-hero .jt-standard-hero-media > picture > img,
html body #main-content > .jt-standard-hero .jt-standard-hero-media figure > img,
html body.reviews-page #main-content > .jt-standard-hero .jt-standard-hero-media .reviews-hero-image img,
html body.gallery-page #main-content > .jt-standard-hero .jt-standard-hero-media .gallery-hero-main img,
html body.collaborations-page #main-content > .jt-standard-hero .jt-standard-hero-media .collab-hero-photo-grid img,
html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-media img {
  filter: var(--jt-public-hero-image-filter) !important;
}

@media (min-width:1001px) {
  html {
    --jt-public-hero-desktop-fade:
      linear-gradient(90deg,
        rgba(0,0,0,1) 0%,
        rgba(0,0,0,1) 34%,
        rgba(0,0,0,.995) 38%,
        rgba(0,0,0,.965) 43%,
        rgba(0,0,0,.87) 49%,
        rgba(0,0,0,.68) 56%,
        rgba(0,0,0,.46) 63%,
        rgba(0,0,0,.27) 70%,
        rgba(0,0,0,.11) 79%,
        rgba(0,0,0,.035) 90%,
        rgba(0,0,0,.008) 100%),
      linear-gradient(180deg,
        rgba(0,0,0,.08) 0%,
        rgba(0,0,0,.02) 58%,
        rgba(0,0,0,.18) 100%);
  }
}

@media (min-width:641px) and (max-width:1000px) {
  html body #main-content > .jt-standard-hero::before {
    background:
      linear-gradient(90deg,rgba(3,3,3,.99) 0%,rgba(3,3,3,.94) 26%,rgba(3,3,3,.75) 48%,rgba(3,3,3,.30) 72%,rgba(3,3,3,.06) 100%),
      linear-gradient(180deg,rgba(0,0,0,.10),rgba(0,0,0,.20)) !important;
  }
  html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-shade {
    background:
      linear-gradient(90deg,rgba(3,3,3,.99) 0%,rgba(3,3,3,.94) 26%,rgba(3,3,3,.75) 48%,rgba(3,3,3,.30) 72%,rgba(3,3,3,.06) 100%),
      linear-gradient(180deg,rgba(0,0,0,.10),rgba(0,0,0,.20)) !important;
  }
}

@media (max-width:640px) and (orientation:portrait) {
  html body #main-content > .jt-standard-hero::before,
  html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-shade {
    background:
      linear-gradient(90deg,
        rgba(3,3,3,.78) 0%,
        rgba(3,3,3,.62) 28%,
        rgba(3,3,3,.38) 52%,
        rgba(3,3,3,.14) 74%,
        rgba(3,3,3,.03) 100%),
      linear-gradient(180deg,
        rgba(0,0,0,.04) 0%,
        rgba(0,0,0,.01) 56%,
        rgba(0,0,0,.20) 100%) !important;
  }
}

/* Build 342 - authoritative desktop fade geometry.
   The photograph is now left clean across the right-hand side of the hero.
   Moving from right to left, the fade does not begin until the 70% point; it
   then tightens quickly and is fully black by the 30% image/copy boundary. */
@media (min-width:1001px) {
  html {
    --jt-public-hero-desktop-fade:
      linear-gradient(90deg,
        rgba(0,0,0,1) 0%,
        rgba(0,0,0,1) 30%,
        rgba(0,0,0,1) 36%,
        rgba(0,0,0,.97) 43%,
        rgba(0,0,0,.86) 49%,
        rgba(0,0,0,.60) 55%,
        rgba(0,0,0,.28) 61%,
        rgba(0,0,0,.08) 66%,
        rgba(0,0,0,.01) 70%,
        rgba(0,0,0,0) 72%,
        rgba(0,0,0,0) 100%),
      linear-gradient(180deg,
        rgba(0,0,0,.08) 0%,
        rgba(0,0,0,.02) 58%,
        rgba(0,0,0,.18) 100%);
  }

  html body #main-content > .jt-standard-hero::before,
  html body.resource-page-advice #main-content > .resource-hero.jt-standard-hero::before,
  html body.credentials-page #main-content > .jt-credentials-standard-hero.jt-standard-hero::before,
  html body.resource-page-credentials.credentials-page #main-content > .jt-standard-hero.jt-credentials-standard-hero::before,
  html body.resource-page.resource-page-advice #main-content > .article-hero > .article-hero-shade {
    background: var(--jt-public-hero-desktop-fade) !important;
  }

  html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-shade {
    background: var(--jt-public-hero-desktop-fade) !important;
  }
}

/* Build 343 - corrected desktop fade timing.
   The visible darkening now starts at exactly 70% of the full hero width and
   completes much more quickly. The image remains clean from 70%-100%, then
   transitions through a compact 20% band and is fully black by 50%, well before
   the 30% media/copy join. This is the authoritative desktop rule for every
   managed hero variant. */
@media (min-width:1001px) {
  html {
    --jt-public-hero-desktop-fade:
      linear-gradient(90deg,
        rgba(0,0,0,1) 0%,
        rgba(0,0,0,1) 50%,
        rgba(0,0,0,.985) 52%,
        rgba(0,0,0,.90) 54%,
        rgba(0,0,0,.72) 56%,
        rgba(0,0,0,.50) 58%,
        rgba(0,0,0,.30) 60%,
        rgba(0,0,0,.15) 62%,
        rgba(0,0,0,.07) 64%,
        rgba(0,0,0,.025) 66%,
        rgba(0,0,0,.008) 68%,
        rgba(0,0,0,0) 70%,
        rgba(0,0,0,0) 100%),
      linear-gradient(180deg,
        rgba(0,0,0,.05) 0%,
        rgba(0,0,0,.01) 58%,
        rgba(0,0,0,.14) 100%);
  }

  html body #main-content > .jt-standard-hero::before,
  html body.resource-page-advice #main-content > .resource-hero.jt-standard-hero::before,
  html body.credentials-page #main-content > .jt-credentials-standard-hero.jt-standard-hero::before,
  html body.resource-page-credentials.credentials-page #main-content > .jt-standard-hero.jt-credentials-standard-hero::before,
  html body.resource-page.resource-page-advice #main-content > .article-hero > .article-hero-shade {
    background: var(--jt-public-hero-desktop-fade) !important;
  }

  html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-shade {
    background: var(--jt-public-hero-desktop-fade) !important;
  }
}

/* Build 344 - 70% of the IMAGE PLANE stays clear.
   Desktop hero media occupies the right-hand 70% of the full hero (30%-100%).
   The previous rule incorrectly treated 70% as a full-hero coordinate, which
   darkened far too much of the photograph. This rule fades only across the
   LEFTMOST 30% of that 70%-wide image plane: full black at the 30% copy/image
   join, fully clear by 51% of the full hero. Therefore the remaining 49% of the
   full hero = exactly 70% of the image plane, untouched by the horizontal fade. */
@media (min-width:1001px) {
  html {
    --jt-public-hero-desktop-fade:
      linear-gradient(90deg,
        rgba(0,0,0,1) 0%,
        rgba(0,0,0,1) 30%,
        rgba(0,0,0,.99) 32%,
        rgba(0,0,0,.90) 34%,
        rgba(0,0,0,.72) 37%,
        rgba(0,0,0,.48) 40%,
        rgba(0,0,0,.27) 43%,
        rgba(0,0,0,.12) 46%,
        rgba(0,0,0,.045) 48%,
        rgba(0,0,0,0) 51%,
        rgba(0,0,0,0) 100%);
  }

  html body #main-content > .jt-standard-hero::before,
  html body.resource-page-advice #main-content > .resource-hero.jt-standard-hero::before,
  html body.credentials-page #main-content > .jt-credentials-standard-hero.jt-standard-hero::before,
  html body.resource-page-credentials.credentials-page #main-content > .jt-standard-hero.jt-credentials-standard-hero::before,
  html body.resource-page.resource-page-advice #main-content > .article-hero > .article-hero-shade,
  html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-shade {
    background: var(--jt-public-hero-desktop-fade) !important;
  }
}

/* Build 427 - authoritative phone/portrait hero fade.
   The desktop hero already fades the managed image into the black copy plane.
   Phones use a full-bleed image, so give the portrait treatment its own visible
   side-and-bottom fade instead of leaving the photograph visually unblended.
   This rule covers standard managed heroes, Recommended Suppliers and Wedding
   Advice articles. It deliberately does not alter desktop/tablet geometry. */
@media (max-width:640px) {
  html {
    --jt-public-hero-mobile-fade:
      linear-gradient(90deg,
        rgba(3,3,3,.94) 0%,
        rgba(3,3,3,.88) 20%,
        rgba(3,3,3,.72) 40%,
        rgba(3,3,3,.48) 60%,
        rgba(3,3,3,.24) 78%,
        rgba(3,3,3,.08) 91%,
        rgba(3,3,3,0) 100%),
      linear-gradient(180deg,
        rgba(0,0,0,.12) 0%,
        rgba(0,0,0,.04) 44%,
        rgba(0,0,0,.24) 70%,
        rgba(0,0,0,.68) 100%);
  }

  html body #main-content > .jt-standard-hero::before,
  html body.resource-page-advice #main-content > .resource-hero.jt-standard-hero::before,
  html body.credentials-page #main-content > .jt-credentials-standard-hero.jt-standard-hero::before,
  html body.resource-page-credentials.credentials-page #main-content > .jt-standard-hero.jt-credentials-standard-hero::before,
  html body.resource-page-suppliers #main-content > .supplier-page-hero .supplier-hero-shade,
  html body.resource-page.resource-page-advice #main-content > .article-hero > .article-hero-shade {
    background: var(--jt-public-hero-mobile-fade) !important;
  }
}