/* JT P31T39 bundle 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}

/* JT P31T39 bundle source: assets/css/public-refinements-103.css */
/* Build 103: public refinements — home hero scale/crop and tuition holding modal. */
@media (min-width: 901px) {
  .home-page .home-hero-grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(330px, .8fr);
    gap: 48px;
    align-items: center;
  }
  .home-page .home-hero-media {
    width: min(100%, 440px);
    min-height: 390px;
    justify-self: end;
  }
  .home-page .home-hero-media img {
    min-height: 390px;
    object-position: center 63%;
  }
}
@media (max-width: 900px) {
  .home-page .home-hero-media img { object-position: center 60%; }
}
.tuition-coming-soon-modal {
  width: min(92vw, 620px);
  padding: 0;
  border: 1px solid rgba(210,162,58,.7);
  border-radius: 20px;
  background: #080808;
  color: #f7f1df;
  box-shadow: 0 28px 80px rgba(0,0,0,.72);
}
.tuition-coming-soon-modal::backdrop { background: rgba(0,0,0,.78); backdrop-filter: blur(3px); }
.tuition-coming-soon-card { position: relative; padding: clamp(28px,5vw,46px); }
.tuition-coming-soon-card h2 { margin: .25rem 2.5rem .85rem 0; color: #fff7dc; font-size: clamp(1.65rem,4vw,2.35rem); }
.tuition-coming-soon-card p:not(.kicker) { margin: 0 0 1.35rem; color: #d7d0bd; font-size: 1.05rem; line-height: 1.7; }
.tuition-coming-soon-close:not(.btn) { position:absolute; top:16px; right:16px; width:40px; height:40px; border:1px solid rgba(210,162,58,.45); border-radius:50%; background:#111; color:#f4d27c; font-size:1.65rem; line-height:1; cursor:pointer; }
.tuition-coming-soon-close:not(.btn):hover,.tuition-coming-soon-close:not(.btn):focus-visible { border-color:#f4d27c; color:#fff7dc; }

/* JT P31T39 bundle source: assets/css/home-preview-116.css */
/* Build 116 homepage redesign preview only. index.html is intentionally untouched. */
body.home-preview-page {
  --preview-ivory: #f1ece4;
  --preview-ivory-2: #e7dfd4;
  --preview-ink: #11100e;
  --preview-charcoal: #0a0a09;
  --preview-gold: #c99b35;
  --preview-gold-soft: #e2bd68;
  background: var(--preview-charcoal);
}

.home-preview-page .site-header {
  background: #070707;
  border-bottom: 1px solid rgba(201, 155, 53, .34);
}

.home-preview-page .main-nav > a,
.home-preview-page .main-nav > .nav-dropdown > summary {
  font-size: .94rem;
  letter-spacing: .025em;
}

.home-preview-page .nav-dropdown-menu {
  min-width: 285px;
  padding: .55rem;
  border: 1px solid rgba(201, 155, 53, .42);
  background: rgba(12, 12, 12, .98);
  box-shadow: 0 24px 55px rgba(0, 0, 0, .42);
}

.home-preview-page .nav-dropdown-menu a {
  padding: .82rem .9rem;
  font-size: .93rem;
}

.home-preview-page .nav-dropdown-menu a small {
  margin-top: .22rem;
  font-size: .73rem;
  line-height: 1.35;
  opacity: .7;
}

.preview-hero {
  position: relative;
  isolation: isolate;
  min-height: clamp(560px, 76vh, 790px);
  display: grid;
  align-items: center;
  overflow: hidden;
  border-bottom: 1px solid rgba(201, 155, 53, .25);
}

.preview-hero-media,
.preview-hero-media::before,
.preview-hero-media::after {
  position: absolute;
  inset: 0;
}

.preview-hero-media { z-index: -2; }
.preview-hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 63% 44%;
  filter: saturate(.86) contrast(1.02) brightness(.72);
}
.preview-hero-media::before {
  content: "";
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(3,3,3,.98) 0%, rgba(3,3,3,.93) 28%, rgba(3,3,3,.62) 54%, rgba(3,3,3,.22) 76%, rgba(3,3,3,.2) 100%),
    linear-gradient(180deg, rgba(0,0,0,.14), rgba(0,0,0,.4));
}
.preview-hero-media::after {
  content: "";
  z-index: 2;
  background: radial-gradient(circle at 73% 44%, rgba(201,155,53,.14), transparent 36%);
  pointer-events: none;
}

.preview-hero .container {
  width: min(1180px, calc(100% - 48px));
  padding-block: clamp(4.5rem, 10vw, 8rem);
}

.preview-hero-copy {
  width: min(650px, 58vw);
}
.preview-eyebrow,
.preview-section-eyebrow {
  margin: 0 0 .9rem;
  color: var(--preview-gold-soft);
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .2em;
  text-transform: uppercase;
}
.preview-hero h1 {
  max-width: 760px;
  margin: 0;
  color: #fff;
  font-family: "Marcellus", serif;
  font-size: clamp(3.1rem, 6.1vw, 6.2rem);
  font-weight: 400;
  line-height: .96;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.preview-hero h1 .gold-line { color: var(--preview-gold-soft); }
.preview-hero-lead {
  max-width: 590px;
  margin: 1.5rem 0 0;
  color: rgba(255,255,255,.82);
  font-size: clamp(1.02rem, 1.55vw, 1.24rem);
  line-height: 1.68;
}
.preview-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .85rem;
  margin-top: 1.9rem;
}
.preview-hero-actions .btn { min-width: 182px; }
.preview-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 1.1rem 2rem;
  margin-top: 2.2rem;
  padding-top: 1.2rem;
  border-top: 1px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.72);
  font-size: .85rem;
}
.preview-hero-meta strong { color: #fff; font-weight: 700; }

.preview-primary-routes {
  background: #080808;
  padding: 0;
}
.preview-primary-routes-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: 100%;
}
.preview-route {
  position: relative;
  min-height: 390px;
  overflow: hidden;
  color: #fff;
  border-right: 1px solid rgba(201,155,53,.28);
  text-decoration: none;
}
.preview-route:last-child { border-right: 0; }
.preview-route img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .55s ease, filter .55s ease;
  filter: brightness(.6) saturate(.78);
}
.preview-route--weddings img { object-position: 50% 35%; }
.preview-route--occasions img { object-position: 50% 37%; }
.preview-route--gigs img { object-position: 50% 30%; }
.preview-route::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.05) 20%, rgba(0,0,0,.82) 100%);
}
.preview-route-copy {
  position: absolute;
  z-index: 2;
  inset: auto clamp(1.5rem, 3vw, 3rem) clamp(1.8rem, 4vw, 3.6rem);
}
.preview-route-copy span {
  display: block;
  margin-bottom: .55rem;
  color: var(--preview-gold-soft);
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.preview-route-copy h2 {
  margin: 0;
  font-size: clamp(2rem, 3.2vw, 3.35rem);
  line-height: 1;
  color: #fff;
}
.preview-route-copy p {
  max-width: 34ch;
  margin: .8rem 0 0;
  color: rgba(255,255,255,.78);
  line-height: 1.55;
}
.preview-route-copy strong {
  display: inline-block;
  margin-top: 1rem;
  color: var(--preview-gold-soft);
  font-size: .82rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}
@media (hover:hover) and (pointer:fine) {
  .preview-route:hover img { transform: scale(1.035); filter: brightness(.7) saturate(.9); }
}

.preview-light-section {
  background: var(--preview-ivory);
  color: var(--preview-ink);
}
.preview-dark-section {
  background: #0a0a09;
  color: #f8f4ec;
}
.preview-section-pad { padding: clamp(4.4rem, 8vw, 7.4rem) 0; }
.preview-section-pad .container { width: min(1180px, calc(100% - 48px)); }
.preview-light-section .preview-section-eyebrow { color: #8b681f; }
.preview-light-section h2,
.preview-light-section h3 { color: #11100e; }
.preview-light-section p { color: #4e4941; }

.preview-wedding-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: clamp(2.5rem, 6vw, 6rem);
  align-items: center;
}
.preview-wedding-copy h2,
.preview-listen-copy h2,
.preview-about-copy h2 {
  margin: 0;
  font-size: clamp(2.7rem, 4.8vw, 5.3rem);
  line-height: 1.02;
  text-wrap: balance;
}
.preview-wedding-copy > p:not(.preview-section-eyebrow),
.preview-listen-copy > p:not(.preview-section-eyebrow),
.preview-about-copy > p:not(.preview-section-eyebrow) {
  max-width: 58ch;
  font-size: 1.03rem;
  line-height: 1.72;
}
.preview-chapters {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin-top: 2rem;
  border-top: 1px solid rgba(17,16,14,.16);
  border-left: 1px solid rgba(17,16,14,.16);
}
.preview-chapter {
  padding: 1.15rem 1.2rem 1.25rem;
  border-right: 1px solid rgba(17,16,14,.16);
  border-bottom: 1px solid rgba(17,16,14,.16);
}
.preview-chapter strong {
  display: block;
  margin-bottom: .3rem;
  font-family: "Marcellus", serif;
  font-size: 1.12rem;
}
.preview-chapter span { font-size: .86rem; line-height: 1.5; color: #655e55; }
.preview-editorial-image {
  position: relative;
  min-height: 560px;
  overflow: hidden;
}
.preview-editorial-image img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.preview-editorial-image::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(201,155,53,.55);
  pointer-events: none;
}

.preview-review {
  text-align: center;
  background:
    radial-gradient(circle at 50% -20%, rgba(201,155,53,.14), transparent 48%),
    #090909;
  border-block: 1px solid rgba(201,155,53,.22);
}
.preview-review-inner { max-width: 920px; margin: 0 auto; }
.preview-review-stars { color: var(--preview-gold-soft); letter-spacing: .24em; font-size: 1.15rem; }
.preview-review blockquote {
  margin: 1.2rem auto 1rem;
  color: #f6f1e8;
  font-family: "Marcellus", serif;
  font-size: clamp(1.6rem, 3vw, 2.65rem);
  line-height: 1.42;
}
.preview-review .review-source { color: var(--preview-gold-soft); font-size: .86rem; letter-spacing: .12em; text-transform: uppercase; }
.preview-review .text-link { display: inline-block; margin-top: 1.35rem; }

.preview-listen-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  min-height: 610px;
}
.preview-listen-media { position: relative; overflow: hidden; }
.preview-listen-media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; filter: saturate(.8); }
.preview-listen-media::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, transparent 55%, rgba(10,10,9,.74)); }
.preview-listen-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(3rem, 6vw, 6rem);
}
.preview-listen-copy h2 { color: #fff; }
.preview-listen-copy p { color: rgba(255,255,255,.72); }
.preview-song-lines { margin: 1.5rem 0 1.75rem; border-top: 1px solid rgba(255,255,255,.15); }
.preview-song-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .92rem 0;
  border-bottom: 1px solid rgba(255,255,255,.15);
}
.preview-song-line span:first-child { font-family: "Marcellus", serif; font-size: 1.05rem; }
.preview-song-line span:last-child { color: var(--preview-gold-soft); font-size: .76rem; text-transform: uppercase; letter-spacing: .08em; }

.preview-gallery-strip { display: grid; grid-template-columns: 1.2fr .9fr .9fr 1.1fr; height: clamp(260px, 30vw, 430px); }
.preview-gallery-strip a { display:block; overflow:hidden; position:relative; }
.preview-gallery-strip img { width:100%; height:100%; object-fit:cover; filter:saturate(.75) brightness(.8); transition:transform .45s ease, filter .45s ease; }
.preview-gallery-strip a:nth-child(1) img { object-position:50% 38%; }
.preview-gallery-strip a:nth-child(2) img { object-position:50% 30%; }
.preview-gallery-strip a:nth-child(3) img { object-position:50% 40%; }
.preview-gallery-strip a:nth-child(4) img { object-position:50% 36%; }
.preview-gallery-strip a::after { content:""; position:absolute; inset:0; border-right:1px solid rgba(255,255,255,.12); }
@media (hover:hover) and (pointer:fine) { .preview-gallery-strip a:hover img { transform:scale(1.035); filter:saturate(.95) brightness(.95); } }

.preview-resource-head { display:flex; align-items:end; justify-content:space-between; gap:2rem; margin-bottom:2rem; }
.preview-resource-head h2 { margin:0; font-size:clamp(2.3rem,4vw,4.2rem); }
.preview-resource-head p { max-width:48ch; margin:0; }
.preview-resources-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(17,16,14,.16); border:1px solid rgba(17,16,14,.16); }
.preview-resource-card { background:#f7f3ec; color:#11100e; text-decoration:none; }
.preview-resource-card img { width:100%; aspect-ratio:16/8; object-fit:cover; filter:saturate(.78); }
.preview-resource-card-body { padding:1.4rem 1.45rem 1.6rem; }
.preview-resource-card h3 { margin:.15rem 0 .45rem; font-size:1.55rem; }
.preview-resource-card p { margin:0; min-height:3.2em; font-size:.9rem; line-height:1.55; }
.preview-resource-card strong { display:inline-block; margin-top:1rem; color:#8b681f; font-size:.78rem; letter-spacing:.07em; text-transform:uppercase; }

.preview-about-grid { display:grid; grid-template-columns:.95fr 1.05fr; gap:clamp(2.8rem,6vw,6rem); align-items:center; }
.preview-about-copy h2 { color:#fff; }
.preview-about-copy p { color:rgba(255,255,255,.7); }
.preview-about-photo { min-height:520px; }
.preview-about-photo img { width:100%; height:100%; object-fit:cover; object-position:center 32%; }

.preview-final-cta {
  background: linear-gradient(90deg, rgba(201,155,53,.12), rgba(201,155,53,.02)), #080808;
  border-top: 1px solid rgba(201,155,53,.3);
  border-bottom: 1px solid rgba(201,155,53,.2);
}
.preview-final-cta-inner { display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.preview-final-cta h2 { margin:.2rem 0 0; color:#fff; font-size:clamp(2rem,3.7vw,3.7rem); }
.preview-final-cta p { margin:.65rem 0 0; color:rgba(255,255,255,.68); }

.preview-note {
  background:#19140b;
  color:#e5c672;
  border-bottom:1px solid rgba(201,155,53,.32);
  padding:.55rem 1rem;
  text-align:center;
  font-size:.76rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}

@media (max-width: 1060px) {
  .preview-hero-copy { width:min(700px, 72vw); }
  .preview-primary-routes-grid { grid-template-columns:1fr; }
  .preview-route { min-height:310px; border-right:0; border-bottom:1px solid rgba(201,155,53,.28); }
  .preview-route img { object-position:center 32%; }
  .preview-wedding-grid,
  .preview-about-grid { grid-template-columns:1fr; }
  .preview-editorial-image, .preview-about-photo { min-height:440px; }
  .preview-listen-grid { grid-template-columns:1fr; }
  .preview-listen-media { min-height:440px; }
  .preview-listen-media::after { background:linear-gradient(180deg, transparent 60%, rgba(10,10,9,.75)); }
  .preview-resources-grid { grid-template-columns:1fr; }
  .preview-resource-card { display:grid; grid-template-columns:minmax(240px,.8fr) 1.2fr; }
  .preview-resource-card img { height:100%; aspect-ratio:auto; }
}

@media (max-width: 760px) {
  .preview-note { font-size:.66rem; }
  .preview-hero { min-height:610px; align-items:end; }
  .preview-hero .container, .preview-section-pad .container { width:min(100% - 32px, 1180px); }
  .preview-hero .container { padding-top:5rem; padding-bottom:3.3rem; }
  .preview-hero-copy { width:100%; }
  .preview-hero-media img { object-position:58% 35%; }
  .preview-hero-media::before { background:linear-gradient(180deg, rgba(3,3,3,.32) 0%, rgba(3,3,3,.52) 32%, rgba(3,3,3,.94) 70%, rgba(3,3,3,.99) 100%); }
  .preview-hero h1 { font-size:clamp(2.85rem,13vw,4.25rem); }
  .preview-hero-lead { font-size:.98rem; }
  .preview-hero-actions .btn { width:100%; }
  .preview-hero-meta { display:grid; grid-template-columns:1fr 1fr; }
  .preview-route { min-height:285px; }
  .preview-route-copy { inset:auto 1.25rem 1.45rem; }
  .preview-chapters { grid-template-columns:1fr; }
  .preview-editorial-image, .preview-about-photo { min-height:340px; }
  .preview-gallery-strip { grid-template-columns:1fr 1fr; height:auto; }
  .preview-gallery-strip a { min-height:230px; }
  .preview-resource-head { align-items:start; flex-direction:column; }
  .preview-resource-card { display:block; }
  .preview-resource-card img { aspect-ratio:16/8; }
  .preview-final-cta-inner { align-items:flex-start; flex-direction:column; }
}

/* Build 117 preview refinement: hero visibility, full-width editorial sections and redesigned preview navigation. */
.home-preview-page {
  overflow-x: hidden;
}

/* Header / main menu: preview-only redesign. */
.home-preview-page .site-header {
  position: relative;
  z-index: 220;
}
.home-preview-page .header-inner {
  width: min(calc(100% - 56px), 1440px);
  max-width: none;
}
@media (min-width: 1181px) {
  .home-preview-page .header-inner {
    grid-template-columns: 275px minmax(0, 1fr) 44px;
    gap: 34px;
  }
  .home-preview-page .logo-link { width: 275px; }
  .home-preview-page .main-nav {
    gap: clamp(14px, 1.35vw, 24px);
    justify-content: flex-end;
  }
  .home-preview-page .main-nav > a,
  .home-preview-page .main-nav > .nav-dropdown > summary,
  .home-preview-page .main-nav > .nav-availability {
    font-size: .96rem;
    letter-spacing: .045em;
    font-weight: 800;
    white-space: nowrap;
  }
  .home-preview-page .main-nav > .nav-availability {
    padding: 12px 18px;
  }
}
@media (min-width: 901px) {
  .home-preview-page .main-nav > .nav-dropdown > .nav-dropdown-menu {
    top: calc(100% + 14px);
    left: 50%;
    transform: translateX(-50%);
    width: 370px;
    padding: 12px;
    gap: 4px;
    border: 1px solid rgba(218, 174, 75, .62);
    border-radius: 2px;
    background: #0b0b0b;
    box-shadow: 0 26px 70px rgba(0,0,0,.58);
  }
  .home-preview-page .main-nav > .nav-dropdown > .nav-dropdown-menu::before {
    content: "";
    position: absolute;
    top: -7px;
    left: 50%;
    width: 12px;
    height: 12px;
    border-left: 1px solid rgba(218, 174, 75, .62);
    border-top: 1px solid rgba(218, 174, 75, .62);
    background: #0b0b0b;
    transform: translateX(-50%) rotate(45deg);
  }
  .home-preview-page .main-nav > .nav-dropdown > .nav-dropdown-menu a {
    position: relative;
    z-index: 1;
    padding: 14px 15px 13px;
    border-radius: 0;
    border-bottom: 1px solid rgba(255,255,255,.08);
    font-size: .94rem;
    letter-spacing: .025em;
    line-height: 1.25;
  }
  .home-preview-page .main-nav > .nav-dropdown > .nav-dropdown-menu a:last-child {
    border-bottom: 0;
  }
  .home-preview-page .main-nav > .nav-dropdown > .nav-dropdown-menu small {
    margin-top: 5px;
    font-size: .79rem;
    line-height: 1.45;
    color: rgba(239,234,223,.65);
  }
  .home-preview-page .main-nav > .nav-dropdown > .nav-dropdown-menu a:hover,
  .home-preview-page .main-nav > .nav-dropdown > .nav-dropdown-menu a:focus-visible {
    background: rgba(210,162,58,.12);
  }
}

/* Hero: hard split so the portrait is fully visible rather than fading under copy. */
.home-preview-page .preview-hero {
  min-height: clamp(620px, 72vh, 760px);
  background: #050505;
}
.home-preview-page .preview-hero-media {
  position: absolute;
  inset: 0 0 0 46%;
  z-index: -1;
  overflow: hidden;
  background: #111;
  border-left: 1px solid rgba(210,162,58,.28);
}
.home-preview-page .preview-hero-media::before,
.home-preview-page .preview-hero-media::after {
  display: none;
}
.home-preview-page .preview-hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 49%;
  filter: saturate(.96) contrast(1.02) brightness(.96);
}
.home-preview-page .preview-hero .container {
  width: min(calc(100% - 56px), 1440px);
  max-width: none;
  padding-block: clamp(4.4rem, 7vw, 6.4rem);
}
.home-preview-page .preview-hero-copy {
  width: 42%;
  max-width: 610px;
  padding-right: clamp(1.5rem, 3vw, 3.5rem);
}
.home-preview-page .preview-hero h1 {
  font-size: clamp(3.25rem, 5.2vw, 5.8rem);
}
.home-preview-page .preview-hero-lead {
  font-size: clamp(1.02rem, 1.25vw, 1.18rem);
}

/* Stronger section labels throughout preview. */
.home-preview-page .preview-eyebrow,
.home-preview-page .preview-section-eyebrow,
.home-preview-page .preview-route-copy span {
  font-size: clamp(.9rem, .9vw, 1rem);
  letter-spacing: .16em;
  line-height: 1.3;
}

/* Three primary routes: distinct photographs and more useful image framing. */
.home-preview-page .preview-route {
  min-height: 400px;
}
.home-preview-page .preview-route--weddings img { object-position: 48% 30%; }
.home-preview-page .preview-route--occasions img { object-position: 48% 48%; }
.home-preview-page .preview-route--gigs img { object-position: 50% 44%; }

/* Full-bleed wedding editorial section. */
.home-preview-page .preview-wedding-section {
  padding: 0;
}
.home-preview-page .preview-wedding-grid {
  width: 100%;
  min-height: 680px;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 0;
  align-items: stretch;
}
.home-preview-page .preview-wedding-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(4rem, 7vw, 7rem) clamp(2rem, 5vw, 6rem) clamp(4rem, 7vw, 7rem) max(32px, calc((100vw - 1440px) / 2 + 28px));
}
.home-preview-page .preview-wedding-copy h2 {
  max-width: 10ch;
}
.home-preview-page .preview-editorial-image {
  position: relative;
  min-height: 680px;
  height: auto;
  margin: 0;
  overflow: hidden;
  border-left: 1px solid rgba(201,155,53,.45);
}
.home-preview-page .preview-editorial-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 38%;
}
.home-preview-page .preview-editorial-image::after {
  inset: 0;
  border: 0;
}

/* Planning / inspiration: true full-width section. */
.home-preview-page .preview-planning-section {
  padding: clamp(4.8rem, 7vw, 7rem) 0;
}
.home-preview-page .preview-wide-shell {
  width: 100%;
  max-width: none;
  padding-inline: clamp(28px, 5vw, 84px);
}
.home-preview-page .preview-resource-head {
  margin-bottom: clamp(2.2rem, 3.5vw, 3.5rem);
  align-items: end;
}
.home-preview-page .preview-resource-head h2 {
  font-size: clamp(3rem, 5vw, 5.25rem);
  line-height: 1;
  max-width: 12ch;
}
.home-preview-page .preview-resource-head > p {
  font-size: 1.05rem;
  line-height: 1.7;
}
.home-preview-page .preview-resources-grid {
  width: 100%;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
}
.home-preview-page .preview-resource-card img {
  aspect-ratio: 16 / 7.8;
}
.home-preview-page .preview-resource-card-body {
  padding: clamp(1.5rem, 2.5vw, 2.2rem);
}
.home-preview-page .preview-resource-card h3 {
  font-size: clamp(1.6rem, 2vw, 2.15rem);
}
.home-preview-page .preview-resource-card p {
  font-size: .98rem;
}

/* Footer is edge-to-edge, with content making use of the available width. */
.home-preview-page .site-footer {
  width: 100%;
}
.home-preview-page .site-footer .footer-b-shell {
  width: 100%;
  max-width: none;
  padding-inline: clamp(28px, 5vw, 84px);
}
.home-preview-page .site-footer .footer-b-main,
.home-preview-page .site-footer .footer-b-contact-row,
.home-preview-page .site-footer .footer-b-bottom {
  width: 100%;
}

@media (max-width: 1180px) and (min-width: 901px) {
  .home-preview-page .header-inner {
    width: min(calc(100% - 36px), 1180px);
    grid-template-columns: 205px minmax(0, 1fr) 44px;
    gap: 18px;
  }
  .home-preview-page .logo-link { width: 205px; }
  .home-preview-page .main-nav { gap: 7px; }
  .home-preview-page .main-nav > a,
  .home-preview-page .main-nav > .nav-dropdown > summary,
  .home-preview-page .main-nav > .nav-availability {
    font-size: .78rem;
    letter-spacing: .025em;
  }
  .home-preview-page .main-nav > .nav-availability { padding: 9px 9px; }
  .home-preview-page .preview-hero-media { left: 48%; }
  .home-preview-page .preview-hero-copy { width: 45%; }
}

@media (max-width: 1060px) {
  .home-preview-page .preview-wedding-grid {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .home-preview-page .preview-wedding-copy {
    padding: 4.5rem max(28px, 5vw);
  }
  .home-preview-page .preview-wedding-copy h2 { max-width: none; }
  .home-preview-page .preview-editorial-image {
    min-height: 520px;
    border-left: 0;
    border-top: 1px solid rgba(201,155,53,.45);
  }
  .home-preview-page .preview-resources-grid { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  .home-preview-page .header-inner { width: min(calc(100% - 30px), 100%); }
  .home-preview-page .preview-hero {
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  .home-preview-page .preview-hero-media {
    position: relative;
    inset: auto;
    order: 1;
    width: 100%;
    min-height: 520px;
    border-left: 0;
    border-bottom: 1px solid rgba(210,162,58,.28);
  }
  .home-preview-page .preview-hero .container {
    order: 2;
    width: 100%;
    padding: 3.4rem max(24px, 5vw) 3.8rem;
  }
  .home-preview-page .preview-hero-copy {
    width: 100%;
    max-width: 760px;
    padding-right: 0;
  }
  .home-preview-page .preview-hero-media img {
    object-position: 50% 50%;
  }
  .home-preview-page .preview-wide-shell,
  .home-preview-page .site-footer .footer-b-shell {
    padding-inline: max(22px, 5vw);
  }
  .home-preview-page .preview-resource-head {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 760px) {
  .home-preview-page .preview-hero-media { min-height: 430px; }
  .home-preview-page .preview-hero h1 { font-size: clamp(2.8rem, 13vw, 4.2rem); }
  .home-preview-page .preview-route { min-height: 310px; }
  .home-preview-page .preview-wedding-copy { padding-block: 3.7rem; }
  .home-preview-page .preview-editorial-image { min-height: 390px; }
  .home-preview-page .preview-planning-section { padding-block: 4rem; }
  .home-preview-page .preview-resource-head h2 { font-size: clamp(2.6rem, 12vw, 4rem); }
}

/* JT P31T39 bundle source: assets/css/home-preview-119.css */
/* Build 119 - index2 full-width performance-first refinement only. */
.home-preview-page {
  --preview-ivory: #f4efe7;
  --preview-ink: #11100e;
  overflow-x: hidden;
}

/* Keep preview route genuinely edge-to-edge. */
.home-preview-page #main-content,
.home-preview-page #main-content > section,
.home-preview-page .preview-primary-routes-grid,
.home-preview-page .preview-wedding-grid,
.home-preview-page .preview-performance-priority,
.home-preview-page .preview-listen-grid,
.home-preview-page .preview-gallery-strip,
.home-preview-page .preview-planning-section,
.home-preview-page .preview-about-grid,
.home-preview-page .preview-final-cta-inner,
.home-preview-page .preview-proof-strip {
  width: 100%;
  max-width: none;
}

/* Hero should fit as a single intentional view after header + preview ribbon. */
.home-preview-page .preview-hero {
  min-height: 0;
  height: clamp(620px, calc(100svh - 128px), 790px);
}
.home-preview-page .preview-hero-shell {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  padding: clamp(32px, 4vw, 72px);
}
.home-preview-page .preview-hero-copy {
  width: min(42vw, 650px);
  max-width: 650px;
  padding-right: clamp(24px, 3vw, 54px);
}
.home-preview-page .preview-hero-media { left: 46%; }
.home-preview-page .preview-hero-media img {
  object-position: 49% 48%;
  filter: saturate(.98) contrast(1.02) brightness(1);
}
.home-preview-page .preview-hero h1 {
  font-size: clamp(3.1rem, 5.1vw, 5.7rem);
  line-height: .98;
}
.home-preview-page .preview-hero-meta { display: none; }

/* Primary booking routes: one compact screen row, no dead space. */
.home-preview-page .preview-primary-routes {
  background: #080808;
}
.home-preview-page .preview-primary-routes-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.home-preview-page .preview-route {
  min-height: 0;
  height: clamp(300px, 38svh, 430px);
}
.home-preview-page .preview-route-copy {
  inset: auto clamp(24px, 3vw, 54px) clamp(24px, 4vw, 48px);
}
.home-preview-page .preview-route-copy h2 {
  font-size: clamp(2rem, 2.8vw, 3.15rem);
}
.home-preview-page .preview-route-copy p {
  font-size: .96rem;
  max-width: 38ch;
}

/* Thin divider band, based on the user's preferred compact treatment. */
.home-preview-page .preview-proof-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  background: var(--preview-ivory);
  color: #201d18;
  border-block: 1px solid rgba(72, 59, 40, .18);
}
.home-preview-page .preview-proof-item {
  min-height: 104px;
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 20px clamp(20px, 3vw, 46px);
  border-right: 1px solid rgba(72, 59, 40, .16);
}
.home-preview-page .preview-proof-item:last-child { border-right: 0; }
.home-preview-page .preview-proof-item > span {
  flex: 0 0 auto;
  width: 30px;
  text-align: center;
  color: #726b61;
  font-size: 1.35rem;
}
.home-preview-page .preview-proof-item strong {
  display: block;
  font-family: "Marcellus", serif;
  font-size: clamp(1.08rem, 1.35vw, 1.35rem);
  font-weight: 400;
  line-height: 1.15;
}
.home-preview-page .preview-proof-item small {
  display: block;
  margin-top: 4px;
  color: #625c54;
  font-size: .82rem;
  line-height: 1.25;
}

/* Wedding section: true full-width split and contained within one desktop view. */
.home-preview-page .preview-wedding-section { padding: 0; }
.home-preview-page .preview-wedding-grid {
  min-height: 0;
  height: clamp(570px, 70svh, 690px);
  grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr);
  gap: 0;
  align-items: stretch;
}
.home-preview-page .preview-wedding-copy {
  justify-content: center;
  padding: clamp(38px, 5vw, 72px) clamp(34px, 5vw, 82px);
}
.home-preview-page .preview-wedding-copy h2 {
  max-width: 11ch;
  font-size: clamp(2.8rem, 4.3vw, 4.8rem);
}
.home-preview-page .preview-wedding-copy > p:not(.preview-section-eyebrow) {
  font-size: .98rem;
  line-height: 1.62;
}
.home-preview-page .preview-chapters { margin-top: 1.35rem; }
.home-preview-page .preview-chapter { padding: .9rem 1rem 1rem; }
.home-preview-page .preview-chapter strong { font-size: 1rem; }
.home-preview-page .preview-chapter span { font-size: .8rem; line-height: 1.42; }
.home-preview-page .preview-wedding-copy .hero-actions { margin-top: 1.25rem; }
.home-preview-page .preview-editorial-image {
  min-height: 0;
  height: 100%;
  border-left: 1px solid rgba(201,155,53,.4);
}

/* Primary performance push after weddings: corporate/functions and THOV. */
.home-preview-page .preview-performance-priority {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  background: #080808;
}
.home-preview-page .preview-performance-panel {
  position: relative;
  min-height: 0;
  height: clamp(480px, 60svh, 610px);
  overflow: hidden;
  color: #fff;
}
.home-preview-page .preview-performance-panel + .preview-performance-panel {
  border-left: 1px solid rgba(201,155,53,.28);
}
.home-preview-page .preview-performance-panel > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(.55) saturate(.82);
}
.home-preview-page .preview-performance-panel--events > img { object-position: 50% 35%; }
.home-preview-page .preview-performance-panel--thov > img { object-position: 50% 42%; }
.home-preview-page .preview-performance-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.06) 14%, rgba(0,0,0,.86) 100%);
}
.home-preview-page .preview-performance-copy {
  position: absolute;
  z-index: 2;
  left: clamp(28px, 4vw, 72px);
  right: clamp(28px, 4vw, 72px);
  bottom: clamp(32px, 5vw, 64px);
}
.home-preview-page .preview-performance-copy h2 {
  max-width: 12ch;
  margin: 0;
  color: #fff;
  font-size: clamp(2.45rem, 3.7vw, 4.25rem);
  line-height: 1.02;
}
.home-preview-page .preview-performance-copy > p:not(.preview-section-eyebrow) {
  max-width: 56ch;
  margin: .9rem 0 0;
  color: rgba(255,255,255,.78);
  font-size: .98rem;
  line-height: 1.58;
}
.home-preview-page .preview-performance-copy .hero-actions { margin-top: 1.25rem; }

/* Review is deliberately shallow: proof, not a whole page. */
.home-preview-page .preview-review {
  min-height: 0;
  padding: 34px clamp(28px, 6vw, 100px);
}
.home-preview-page .preview-review-inner {
  width: 100%;
  max-width: 1420px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr) 220px;
  align-items: center;
  gap: clamp(24px, 4vw, 60px);
}
.home-preview-page .preview-review-heading .preview-section-eyebrow { margin-bottom: .55rem; }
.home-preview-page .preview-review blockquote {
  margin: 0;
  font-size: clamp(1.3rem, 2vw, 2rem);
  line-height: 1.38;
  text-align: left;
}
.home-preview-page .preview-review-tail {
  text-align: right;
}
.home-preview-page .preview-review .text-link { margin-top: .75rem; }

/* Listen: full-width and controlled height. */
.home-preview-page .preview-listen-section { padding: 0; }
.home-preview-page .preview-listen-grid {
  min-height: 0;
  height: clamp(480px, 62svh, 610px);
  grid-template-columns: 1.08fr .92fr;
}
.home-preview-page .preview-listen-copy {
  padding: clamp(36px, 5vw, 76px);
}
.home-preview-page .preview-listen-copy h2 {
  font-size: clamp(2.7rem, 4vw, 4.6rem);
}
.home-preview-page .preview-song-lines { margin: 1.1rem 0 1.35rem; }
.home-preview-page .preview-song-line { padding: .7rem 0; }

/* Gallery is a thin visual divider, not a full section. */
.home-preview-page .preview-gallery-strip {
  height: clamp(220px, 24vw, 320px);
}

/* Planning content remains useful, but secondary and compact. */
.home-preview-page .preview-planning-section {
  padding: clamp(42px, 5vw, 68px) 0;
}
.home-preview-page .preview-wide-shell {
  width: 100%;
  max-width: none;
  padding-inline: clamp(28px, 4vw, 72px);
}
.home-preview-page .preview-resource-head {
  margin-bottom: 1.5rem;
  align-items: end;
}
.home-preview-page .preview-resource-head h2 {
  font-size: clamp(2.65rem, 4vw, 4.35rem);
  max-width: none;
}
.home-preview-page .preview-resource-head > p {
  max-width: 54ch;
  font-size: .98rem;
  line-height: 1.55;
}
.home-preview-page .preview-resources-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.home-preview-page .preview-resource-card {
  display: grid;
  grid-template-columns: 42% 58%;
  min-height: 250px;
}
.home-preview-page .preview-resource-card img {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
}
.home-preview-page .preview-resource-card-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(20px, 2vw, 34px);
}
.home-preview-page .preview-resource-card-body .preview-section-eyebrow { font-size: .74rem; }
.home-preview-page .preview-resource-card h3 { font-size: clamp(1.35rem, 1.65vw, 1.8rem); }
.home-preview-page .preview-resource-card p { font-size: .86rem; line-height: 1.45; min-height: 0; }

/* About: full-width split and less vertical depth. */
.home-preview-page .preview-about-section { padding: 0; }
.home-preview-page .preview-about-grid {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  min-height: 0;
  height: clamp(470px, 58svh, 580px);
  gap: 0;
  align-items: stretch;
}
.home-preview-page .preview-about-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(38px, 5vw, 74px);
}
.home-preview-page .preview-about-copy h2 { font-size: clamp(2.7rem, 4vw, 4.5rem); }
.home-preview-page .preview-about-copy p { font-size: .96rem; line-height: 1.58; max-width: 58ch; }
.home-preview-page .preview-about-photo { min-height: 0; height: 100%; }
.home-preview-page .preview-about-photo img { object-position: center 30%; }

/* Final CTA is another shallow full-width band. */
.home-preview-page .preview-final-cta {
  padding: 32px clamp(28px, 5vw, 84px);
}
.home-preview-page .preview-final-cta-inner {
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.home-preview-page .preview-final-cta h2 {
  font-size: clamp(2rem, 3vw, 3.3rem);
}

/* Footer must use the full width. */
.home-preview-page .site-footer,
.home-preview-page .site-footer .footer-b-shell,
.home-preview-page .site-footer .footer-b-main,
.home-preview-page .site-footer .footer-b-contact-row,
.home-preview-page .site-footer .footer-b-bottom {
  width: 100%;
  max-width: none;
}
.home-preview-page .site-footer .footer-b-shell {
  padding-inline: clamp(28px, 4vw, 72px);
}

/* Floating circular next-section control. */
.home-preview-page .preview-section-scroll-next {
  position: fixed;
  left: 50%;
  bottom: max(18px, env(safe-area-inset-bottom));
  z-index: 9998;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid rgba(244,210,124,.82);
  border-radius: 50%;
  background: rgba(8,8,8,.76);
  color: #f0c867;
  box-shadow: 0 5px 20px rgba(0,0,0,.28);
  display: grid;
  place-items: center;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 10px);
  transition: opacity .2s ease, transform .2s ease, background .2s ease;
  backdrop-filter: blur(5px);
}
.home-preview-page .preview-section-scroll-next.is-visible {
  opacity: .92;
  pointer-events: auto;
  transform: translate(-50%, 0);
}
.home-preview-page .preview-section-scroll-next svg {
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.home-preview-page .preview-section-scroll-next:hover,
.home-preview-page .preview-section-scroll-next:focus-visible {
  opacity: 1;
  background: rgba(8,8,8,.96);
  outline: none;
}

@media (max-width: 1180px) {
  .home-preview-page .preview-hero { height: auto; min-height: 650px; }
  .home-preview-page .preview-hero-shell { padding-inline: 32px; }
  .home-preview-page .preview-route { height: 340px; }
  .home-preview-page .preview-proof-strip { grid-template-columns: repeat(2, 1fr); }
  .home-preview-page .preview-proof-item:nth-child(2) { border-right: 0; }
  .home-preview-page .preview-proof-item:nth-child(-n+2) { border-bottom: 1px solid rgba(72, 59, 40, .16); }
  .home-preview-page .preview-wedding-grid,
  .home-preview-page .preview-about-grid { height: auto; }
  .home-preview-page .preview-wedding-grid,
  .home-preview-page .preview-about-grid { grid-template-columns: 1fr; }
  .home-preview-page .preview-editorial-image,
  .home-preview-page .preview-about-photo { min-height: 430px; }
  .home-preview-page .preview-resources-grid { grid-template-columns: 1fr; }
  .home-preview-page .preview-resource-card { min-height: 220px; }
}

@media (max-width: 900px) {
  .home-preview-page .preview-hero { display: flex; flex-direction: column; min-height: 0; }
  .home-preview-page .preview-hero-media { position: relative; inset: auto; min-height: 460px; order: 1; border-left: 0; }
  .home-preview-page .preview-hero-shell { order: 2; padding: 34px 24px 42px; }
  .home-preview-page .preview-hero-copy { width: 100%; max-width: 760px; padding: 0; }
  .home-preview-page .preview-primary-routes-grid,
  .home-preview-page .preview-performance-priority { grid-template-columns: 1fr; }
  .home-preview-page .preview-route { height: 310px; border-right: 0; border-bottom: 1px solid rgba(201,155,53,.28); }
  .home-preview-page .preview-performance-panel { height: 470px; }
  .home-preview-page .preview-performance-panel + .preview-performance-panel { border-left: 0; border-top: 1px solid rgba(201,155,53,.28); }
  .home-preview-page .preview-review-inner { grid-template-columns: 1fr; text-align: left; gap: 12px; }
  .home-preview-page .preview-review-tail { text-align: left; }
  .home-preview-page .preview-listen-grid { height: auto; grid-template-columns: 1fr; }
  .home-preview-page .preview-listen-media { min-height: 390px; }
  .home-preview-page .preview-resource-card { grid-template-columns: 36% 64%; }
  .home-preview-page .preview-final-cta-inner { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 640px) {
  .home-preview-page .preview-hero-media { min-height: 390px; }
  .home-preview-page .preview-proof-strip { grid-template-columns: 1fr; }
  .home-preview-page .preview-proof-item { min-height: 88px; border-right: 0; border-bottom: 1px solid rgba(72,59,40,.16); }
  .home-preview-page .preview-proof-item:last-child { border-bottom: 0; }
  .home-preview-page .preview-wedding-copy,
  .home-preview-page .preview-about-copy,
  .home-preview-page .preview-listen-copy { padding: 34px 22px; }
  .home-preview-page .preview-chapters { grid-template-columns: 1fr; }
  .home-preview-page .preview-performance-panel { height: 430px; }
  .home-preview-page .preview-review { padding: 28px 22px; }
  .home-preview-page .preview-gallery-strip { grid-template-columns: 1fr 1fr; height: auto; }
  .home-preview-page .preview-gallery-strip a { min-height: 180px; }
  .home-preview-page .preview-resource-head { align-items: flex-start; flex-direction: column; gap: .65rem; }
  .home-preview-page .preview-resource-card { display: block; }
  .home-preview-page .preview-resource-card img { height: 170px; }
  .home-preview-page .preview-final-cta { padding: 30px 22px; }
  .home-preview-page .preview-section-scroll-next { width: 42px; height: 42px; bottom: max(14px, env(safe-area-inset-bottom)); }
}

@media (prefers-reduced-motion: reduce) {
  .home-preview-page .preview-section-scroll-next { transition: none; }
}

/* JT P31T39 bundle source: assets/css/home-preview-120.css */
/* Build 120 - index2 rhythm, alternation and containment refinement only. */
.home-preview-page {
  --preview-ivory: #f4efe7;
  --preview-ivory-deep: #ebe3d7;
  --preview-ink: #12100d;
}

/* The credibility strip belongs immediately under the hero and stays deliberately shallow. */
.home-preview-page .preview-hero + .preview-proof-strip {
  position: relative;
  z-index: 2;
  background: var(--preview-ivory);
  border-top: 1px solid rgba(201,155,53,.28);
  border-bottom: 1px solid rgba(73,59,39,.16);
}
.home-preview-page .preview-proof-item {
  min-height: 96px;
  padding-block: 17px;
}

/* Major-section rhythm: dark routes -> light wedding -> dark performance -> light review -> dark listen. */
.home-preview-page .preview-primary-routes { background: #080808; }
.home-preview-page .preview-wedding-section { background: var(--preview-ivory); color: var(--preview-ink); }
.home-preview-page .preview-performance-priority { background: #080808; }
.home-preview-page .preview-listen-section { background: #0a0a09; }

/* Review becomes a light proof band, not another black block. */
.home-preview-page .preview-review {
  min-height: 0;
  padding: 28px clamp(28px, 6vw, 100px);
  background: var(--preview-ivory);
  color: var(--preview-ink);
  border-block: 1px solid rgba(73,59,39,.18);
  text-align: left;
}
.home-preview-page .preview-review-inner {
  max-width: 1500px;
  grid-template-columns: 180px minmax(0, 1fr) 210px;
  gap: clamp(24px, 4vw, 56px);
}
.home-preview-page .preview-review .preview-section-eyebrow { color: #8b681f; }
.home-preview-page .preview-review-stars { color: #a77b23; }
.home-preview-page .preview-review blockquote {
  color: #1d1914;
  font-size: clamp(1.25rem, 1.85vw, 1.9rem);
  line-height: 1.34;
}
.home-preview-page .preview-review .review-source { color: #8b681f; }
.home-preview-page .preview-review .text-link { color: #765719; }

/* The gallery is a thin image-led divider, not a separate full-depth destination. */
.home-preview-page .preview-gallery-strip {
  height: clamp(190px, 21vw, 285px);
  border-block: 8px solid var(--preview-ivory);
  background: var(--preview-ivory);
}

/* About is the next light editorial section after the dark Listen block. Keep all media contained. */
.home-preview-page .preview-about-section {
  position: relative;
  background: var(--preview-ivory);
  color: var(--preview-ink);
  overflow: hidden;
}
.home-preview-page .preview-about-grid {
  width: 100%;
  max-width: none;
  overflow: hidden;
  background: var(--preview-ivory);
}
.home-preview-page .preview-about-copy {
  min-width: 0;
  color: var(--preview-ink);
}
.home-preview-page .preview-about-copy .preview-section-eyebrow { color: #8b681f; }
.home-preview-page .preview-about-copy h2 { color: var(--preview-ink); }
.home-preview-page .preview-about-copy p { color: #514a40; }
.home-preview-page .preview-about-copy .btn {
  color: #17130e;
  border-color: rgba(139,104,31,.72);
}
.home-preview-page .preview-about-copy .btn:hover,
.home-preview-page .preview-about-copy .btn:focus-visible {
  background: #17130e;
  color: #fff;
}
.home-preview-page .preview-about-photo {
  position: relative;
  min-width: 0;
  min-height: 0;
  height: 100%;
  margin: 0;
  overflow: hidden;
  align-self: stretch;
}
.home-preview-page .preview-about-photo img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: cover;
  object-position: center 30%;
}

/* Final CTA is a clean dark band with no media allowed to bleed into it. */
.home-preview-page .preview-final-cta {
  position: relative;
  z-index: 2;
  overflow: hidden;
  isolation: isolate;
  clear: both;
  background: linear-gradient(90deg, rgba(201,155,53,.13), rgba(201,155,53,.025)), #080808;
  color: #fff;
  border-top: 1px solid rgba(201,155,53,.34);
}
.home-preview-page .preview-final-cta-inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: none;
}
.home-preview-page .preview-final-cta h2 { color: #fff; }
.home-preview-page .preview-final-cta p { color: rgba(255,255,255,.72); }

/* Ensure the removed planning block cannot leave inherited spacing behind. */
.home-preview-page .preview-planning-section { display: none !important; }

@media (max-width: 1180px) {
  .home-preview-page .preview-review-inner {
    grid-template-columns: 150px minmax(0, 1fr) 180px;
    gap: 22px;
  }
}

@media (max-width: 900px) {
  .home-preview-page .preview-review { padding: 26px 24px; }
  .home-preview-page .preview-review-inner {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .home-preview-page .preview-review-tail { text-align: left; }
  .home-preview-page .preview-gallery-strip { border-block-width: 5px; }
}

/* JT P31T39 bundle source: assets/css/home-preview-121.css */
/* Build 121 - index2 structural repair and useful divider strips only. */
.home-preview-page {
  --preview-ivory: #f5f0e8;
  --preview-ivory-deep: #e9e0d3;
  --preview-ink: #17130e;
  --preview-gold: #b88724;
  --preview-gold-soft: #e0b651;
}

/* Consistent, legible icons in the proof strip beneath the hero. */
.home-preview-page .preview-proof-item > span {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  color: #746b5f;
}
.home-preview-page .preview-proof-item > span svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Thin, useful transition bands. They separate the large visual sections without dead space. */
.home-preview-page .preview-utility-strip {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-block: 1px solid rgba(76, 60, 38, .2);
  overflow: hidden;
}
.home-preview-page .preview-utility-strip--light {
  background: var(--preview-ivory-deep);
  color: var(--preview-ink);
}
.home-preview-page .preview-utility-strip--dark {
  background: #11100e;
  color: #f7f1e7;
  border-color: rgba(210, 162, 58, .28);
}
.home-preview-page .preview-utility-item {
  min-width: 0;
  min-height: 104px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 18px clamp(22px, 3vw, 52px);
  border-right: 1px solid rgba(76, 60, 38, .18);
  color: inherit;
  text-decoration: none;
}
.home-preview-page .preview-utility-strip--dark .preview-utility-item {
  border-right-color: rgba(255, 255, 255, .12);
}
.home-preview-page .preview-utility-item:last-child { border-right: 0; }
.home-preview-page .preview-utility-item span {
  margin-bottom: 5px;
  color: #8b681f;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .15em;
  line-height: 1.2;
  text-transform: uppercase;
}
.home-preview-page .preview-utility-strip--dark .preview-utility-item span { color: var(--preview-gold-soft); }
.home-preview-page .preview-utility-item strong {
  display: block;
  font-family: "Marcellus", serif;
  font-size: clamp(1.03rem, 1.25vw, 1.32rem);
  font-weight: 400;
  line-height: 1.2;
}
.home-preview-page .preview-utility-item small {
  display: block;
  margin-top: 5px;
  color: #625b52;
  font-size: .79rem;
  line-height: 1.35;
}
.home-preview-page .preview-utility-strip--dark .preview-utility-item small { color: rgba(255, 255, 255, .66); }
.home-preview-page a.preview-utility-item { transition: background .2s ease, color .2s ease; }
.home-preview-page a.preview-utility-item:hover,
.home-preview-page a.preview-utility-item:focus-visible {
  background: rgba(210, 162, 58, .12);
  outline: none;
}

/* Major sections must grow with their content. Fixed heights caused the visible collisions in Build 120. */
.home-preview-page .preview-wedding-grid,
.home-preview-page .preview-listen-grid,
.home-preview-page .preview-about-grid {
  height: auto;
  min-height: clamp(560px, 66svh, 700px);
  overflow: hidden;
}
.home-preview-page .preview-wedding-copy,
.home-preview-page .preview-listen-copy,
.home-preview-page .preview-about-copy {
  min-width: 0;
  position: relative;
  z-index: 2;
}
.home-preview-page .preview-editorial-image,
.home-preview-page .preview-listen-media,
.home-preview-page .preview-about-photo {
  min-width: 0;
  min-height: clamp(560px, 66svh, 700px);
  height: auto;
  overflow: hidden;
  margin: 0;
}
.home-preview-page .preview-editorial-image img,
.home-preview-page .preview-listen-media img,
.home-preview-page .preview-about-photo img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
}
.home-preview-page .preview-editorial-image img { object-position: 50% 43%; }
.home-preview-page .preview-listen-media img { object-position: 50% 42%; }
.home-preview-page .preview-about-photo img { object-position: 50% 28%; }

/* Performance panels use normal-flow copy over contained media, so text can never collide with the next section. */
.home-preview-page .preview-performance-priority {
  align-items: stretch;
  overflow: hidden;
  background: #080808;
}
.home-preview-page .preview-performance-panel {
  position: relative;
  isolation: isolate;
  height: auto;
  min-height: clamp(520px, 60svh, 650px);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}
.home-preview-page .preview-performance-panel > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(.56) saturate(.86);
}
.home-preview-page .preview-performance-panel--events > img { object-position: 50% 42%; }
.home-preview-page .preview-performance-panel--thov > img { object-position: 50% 48%; }
.home-preview-page .preview-performance-panel::after {
  z-index: 1;
  background: linear-gradient(180deg, rgba(0, 0, 0, .1) 10%, rgba(0, 0, 0, .88) 100%);
}
.home-preview-page .preview-performance-copy {
  position: relative;
  z-index: 2;
  left: auto;
  right: auto;
  bottom: auto;
  width: 100%;
  padding: clamp(36px, 5vw, 76px);
}

/* Keep the proof band deliberately shallow. */
.home-preview-page .preview-review {
  padding-block: 24px;
}
.home-preview-page .preview-review-inner {
  max-width: none;
}
.home-preview-page .preview-review blockquote {
  font-size: clamp(1.18rem, 1.65vw, 1.72rem);
  line-height: 1.32;
}

/* The gallery itself becomes the useful divider between Listen and About. */
.home-preview-page .preview-gallery-strip {
  width: 100%;
  height: clamp(190px, 19vw, 270px);
  display: grid;
  grid-template-columns: minmax(280px, .78fr) repeat(3, minmax(0, 1fr));
  gap: 0;
  border-block: 1px solid rgba(73, 59, 39, .18);
  background: var(--preview-ivory-deep);
  overflow: hidden;
}
.home-preview-page .preview-gallery-intro {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 24px clamp(26px, 3vw, 54px);
  background: var(--preview-ivory-deep);
  color: var(--preview-ink);
  border-right: 1px solid rgba(73, 59, 39, .18);
}
.home-preview-page .preview-gallery-intro .preview-section-eyebrow {
  margin-bottom: .5rem;
  color: #8b681f;
}
.home-preview-page .preview-gallery-intro h2 {
  margin: 0;
  color: var(--preview-ink);
  font-size: clamp(1.7rem, 2.5vw, 2.8rem);
  line-height: 1.05;
}
.home-preview-page .preview-gallery-intro .text-link {
  margin-top: .8rem;
  color: #765719;
}
.home-preview-page .preview-gallery-image {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border-right: 1px solid rgba(255, 255, 255, .18);
}
.home-preview-page .preview-gallery-image:last-child { border-right: 0; }
.home-preview-page .preview-gallery-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(.82) brightness(.82);
  transition: transform .4s ease, filter .4s ease;
}
.home-preview-page .preview-gallery-image:nth-of-type(2) img { object-position: 50% 43%; }
.home-preview-page .preview-gallery-image:nth-of-type(3) img { object-position: 50% 46%; }
.home-preview-page .preview-gallery-image:nth-of-type(4) img { object-position: 50% 50%; }
@media (hover: hover) and (pointer: fine) {
  .home-preview-page .preview-gallery-image:hover img {
    transform: scale(1.035);
    filter: saturate(1) brightness(.96);
  }
}

/* Final containment guarantees at every boundary. */
.home-preview-page #main-content > section {
  position: relative;
  clear: both;
}
.home-preview-page .preview-wedding-section,
.home-preview-page .preview-performance-priority,
.home-preview-page .preview-listen-section,
.home-preview-page .preview-about-section,
.home-preview-page .preview-final-cta {
  overflow: hidden;
}
.home-preview-page .preview-final-cta { isolation: isolate; }

@media (max-width: 1180px) {
  .home-preview-page .preview-utility-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-preview-page .preview-utility-item:nth-child(2) { border-right: 0; }
  .home-preview-page .preview-utility-item:nth-child(-n+2) { border-bottom: 1px solid rgba(76, 60, 38, .18); }
  .home-preview-page .preview-utility-strip--dark .preview-utility-item:nth-child(-n+2) { border-bottom-color: rgba(255, 255, 255, .12); }
  .home-preview-page .preview-wedding-grid,
  .home-preview-page .preview-about-grid { min-height: 0; }
  .home-preview-page .preview-editorial-image,
  .home-preview-page .preview-about-photo { min-height: 440px; }
  .home-preview-page .preview-gallery-strip {
    grid-template-columns: minmax(260px, .8fr) repeat(3, 1fr);
  }
}

@media (max-width: 900px) {
  .home-preview-page .preview-performance-panel { min-height: 500px; }
  .home-preview-page .preview-listen-grid { min-height: 0; }
  .home-preview-page .preview-listen-media { min-height: 390px; }
  .home-preview-page .preview-gallery-strip {
    height: auto;
    grid-template-columns: 1fr 1fr;
  }
  .home-preview-page .preview-gallery-intro {
    min-height: 190px;
    border-bottom: 1px solid rgba(73, 59, 39, .18);
  }
  .home-preview-page .preview-gallery-image { min-height: 220px; }
}

@media (max-width: 640px) {
  .home-preview-page .preview-proof-item > span { width: 30px; height: 30px; }
  .home-preview-page .preview-utility-strip { grid-template-columns: 1fr; }
  .home-preview-page .preview-utility-item {
    min-height: 88px;
    border-right: 0;
    border-bottom: 1px solid rgba(76, 60, 38, .18);
  }
  .home-preview-page .preview-utility-strip--dark .preview-utility-item { border-bottom-color: rgba(255, 255, 255, .12); }
  .home-preview-page .preview-utility-item:last-child { border-bottom: 0; }
  .home-preview-page .preview-wedding-grid,
  .home-preview-page .preview-listen-grid,
  .home-preview-page .preview-about-grid { min-height: 0; }
  .home-preview-page .preview-editorial-image,
  .home-preview-page .preview-listen-media,
  .home-preview-page .preview-about-photo { min-height: 330px; }
  .home-preview-page .preview-performance-panel { min-height: 460px; }
  .home-preview-page .preview-performance-copy { padding: 32px 22px; }
  .home-preview-page .preview-gallery-strip { grid-template-columns: 1fr; }
  .home-preview-page .preview-gallery-intro { min-height: 170px; }
  .home-preview-page .preview-gallery-image { min-height: 210px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.18); }
}

/* Keep the divider bands compact on phones rather than turning each item into a full row. */
@media (max-width: 640px) and (min-width: 361px) {
  .home-preview-page .preview-proof-strip,
  .home-preview-page .preview-utility-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .home-preview-page .preview-proof-item,
  .home-preview-page .preview-utility-item {
    min-height: 94px;
    padding: 14px 16px;
  }
  .home-preview-page .preview-proof-item:nth-child(odd),
  .home-preview-page .preview-utility-item:nth-child(odd) {
    border-right: 1px solid rgba(76, 60, 38, .18);
  }
  .home-preview-page .preview-utility-strip--dark .preview-utility-item:nth-child(odd) {
    border-right-color: rgba(255, 255, 255, .12);
  }
  .home-preview-page .preview-proof-item:nth-child(-n+2),
  .home-preview-page .preview-utility-item:nth-child(-n+2) {
    border-bottom: 1px solid rgba(76, 60, 38, .18);
  }
  .home-preview-page .preview-utility-strip--dark .preview-utility-item:nth-child(-n+2) {
    border-bottom-color: rgba(255, 255, 255, .12);
  }
  .home-preview-page .preview-proof-item:nth-child(even),
  .home-preview-page .preview-utility-item:nth-child(even) {
    border-right: 0;
  }
  .home-preview-page .preview-proof-item:nth-child(n+3),
  .home-preview-page .preview-utility-item:nth-child(n+3) {
    border-bottom: 0;
  }
  .home-preview-page .preview-utility-item strong { font-size: .98rem; }
  .home-preview-page .preview-utility-item small { font-size: .73rem; }
}

@media (max-width: 360px) {
  .home-preview-page .preview-proof-strip,
  .home-preview-page .preview-utility-strip { grid-template-columns: 1fr; }
}

/* Final structural verification fixes: remove intrinsic image ratios from grid
   sizing and compact the wedding copy so the section fits a normal desktop
   view without sacrificing content. */
.home-preview-page .preview-listen-media,
.home-preview-page .preview-about-photo,
.home-preview-page .preview-editorial-image {
  position: relative;
  align-self: stretch;
}

.home-preview-page .preview-listen-media img,
.home-preview-page .preview-about-photo img,
.home-preview-page .preview-editorial-image img {
  position: absolute;
  inset: 0;
  min-height: 0;
  max-width: 100%;
}

.home-preview-page .preview-wedding-grid {
  min-height: clamp(560px, 62svh, 680px);
}

.home-preview-page .preview-wedding-copy {
  padding: clamp(38px, 4.2vw, 62px) clamp(32px, 4.5vw, 72px);
}

.home-preview-page .preview-wedding-copy h2 {
  max-width: 14ch;
  font-size: clamp(2.55rem, 3.65vw, 4.2rem);
  line-height: 1.01;
}

.home-preview-page .preview-wedding-copy > p:not(.preview-section-eyebrow) {
  margin-block: .85rem;
  line-height: 1.56;
}

.home-preview-page .preview-wedding-copy .preview-chapters {
  margin-top: 1rem;
}

.home-preview-page .preview-wedding-copy .preview-chapter {
  padding: .78rem .9rem .86rem;
}

.home-preview-page .preview-wedding-copy .hero-actions {
  margin-top: 1rem;
}

.home-preview-page .preview-editorial-image {
  min-height: clamp(560px, 62svh, 680px);
}

/* Keep the useful divider strips on one shallow row at common laptop widths. */
@media (max-width: 1180px) and (min-width: 901px) {
  .home-preview-page .preview-utility-strip {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .home-preview-page .preview-utility-item:nth-child(2) {
    border-right: 1px solid rgba(76, 60, 38, .18);
  }
  .home-preview-page .preview-utility-strip--dark .preview-utility-item:nth-child(2) {
    border-right-color: rgba(255, 255, 255, .12);
  }
  .home-preview-page .preview-utility-item:nth-child(-n+2),
  .home-preview-page .preview-utility-strip--dark .preview-utility-item:nth-child(-n+2) {
    border-bottom: 0;
  }
  .home-preview-page .preview-utility-item {
    min-height: 112px;
    padding-inline: 20px;
  }
}

@media (max-width: 1060px) {
  .home-preview-page .preview-wedding-grid {
    min-height: 0;
  }
  .home-preview-page .preview-editorial-image {
    min-height: clamp(390px, 54vw, 520px);
  }
}

/* Give the labelled gallery divider enough intrinsic room at laptop widths. */
.home-preview-page .preview-gallery-strip {
  height: clamp(220px, 19vw, 270px);
}

@media (max-width: 900px) {
  .home-preview-page .preview-gallery-strip {
    height: auto;
  }
}

/* JT P31T39 bundle source: assets/css/home-preview-122.css */
/* Build 122 - index2 breathing-space refinement only.
   Keeps the slim information bands compact while giving each major chapter
   enough vertical room to read as a separate section. */

.home-preview-page {
  --preview-major-space: clamp(44px, 4.6vw, 82px);
  --preview-major-space-compact: clamp(30px, 3vw, 54px);
}

/* The hero-to-proof transition remains deliberately tight; the proof band is
   part of the hero introduction rather than a separate content chapter. */
.home-preview-page .preview-proof-strip {
  margin: 0;
}

/* Give the three main booking routes room above and below so they no longer
   feel pinned between the two light information bands. */
.home-preview-page .preview-primary-routes {
  padding-block: var(--preview-major-space-compact);
  background: #080808;
}

/* Main split/content sections: full width, but with a deliberate breathing
   zone in the section's own background colour. */
.home-preview-page .preview-wedding-section,
.home-preview-page .preview-listen-section,
.home-preview-page .preview-about-section {
  padding-block: var(--preview-major-space);
}

/* The two performance panels remain a single dark chapter, with space before
   and after rather than touching the transition strips/review band. */
.home-preview-page .preview-performance-priority {
  padding-block: var(--preview-major-space-compact);
}

/* Keep the testimonial visually compact, but stop it feeling glued to the
   sections on either side. */
.home-preview-page .preview-review {
  padding-block: clamp(34px, 3.4vw, 58px);
}

/* Gallery remains a thin useful divider, with a little air around its content
   rather than becoming another full-depth section. */
.home-preview-page .preview-gallery-strip {
  margin-block: clamp(20px, 2vw, 34px);
}

/* Final conversion section should feel intentional rather than bolted to the
   About block. */
.home-preview-page .preview-final-cta {
  padding-block: clamp(42px, 4vw, 68px);
}

/* Preserve the deliberately shallow information strips. */
.home-preview-page .preview-utility-strip,
.home-preview-page .preview-proof-strip {
  flex-shrink: 0;
}

/* Tablet: keep the same rhythm without wasting vertical space. */
@media (max-width: 1060px) {
  .home-preview-page {
    --preview-major-space: clamp(38px, 5vw, 64px);
    --preview-major-space-compact: clamp(26px, 4vw, 44px);
  }
  .home-preview-page .preview-gallery-strip {
    margin-block: 18px;
  }
}

/* Phone: breathing room remains visible, but not at the cost of excessive
   scrolling. */
@media (max-width: 640px) {
  .home-preview-page {
    --preview-major-space: 34px;
    --preview-major-space-compact: 24px;
  }
  .home-preview-page .preview-review {
    padding-block: 30px;
  }
  .home-preview-page .preview-final-cta {
    padding-block: 34px;
  }
  .home-preview-page .preview-gallery-strip {
    margin-block: 14px;
  }
}

/* JT P31T39 bundle source: assets/css/home-preview-123.css */
/* Build 123 - index2 internal-spacing correction.
   Removes the external spacer bands introduced in Build 122 and puts the
   breathing room inside the content areas of each full-width section. */

.home-preview-page {
  --preview-copy-pad-y: clamp(66px, 5.8vw, 106px);
  --preview-copy-pad-x: clamp(34px, 4.8vw, 86px);
  --preview-copy-pad-y-compact: clamp(48px, 4.2vw, 76px);
}

/* Remove Build 122's outer spacing. These sections should join the next
   section directly; their own background/image treatment provides the edge. */
.home-preview-page .preview-primary-routes,
.home-preview-page .preview-wedding-section,
.home-preview-page .preview-performance-priority,
.home-preview-page .preview-listen-section,
.home-preview-page .preview-about-section,
.home-preview-page .preview-final-cta {
  padding-block: 0 !important;
  margin-block: 0 !important;
}

/* The gallery is a divider in its own right. Never expose the page's black
   body background as an artificial spacer above or below it. */
.home-preview-page .preview-gallery-strip {
  margin-block: 0 !important;
}

/* Put the breathing room where it belongs: around the actual copy. */
.home-preview-page .preview-wedding-copy,
.home-preview-page .preview-listen-copy,
.home-preview-page .preview-about-copy {
  padding-top: var(--preview-copy-pad-y) !important;
  padding-bottom: var(--preview-copy-pad-y) !important;
  padding-left: var(--preview-copy-pad-x) !important;
  padding-right: var(--preview-copy-pad-x) !important;
}

/* The paired corporate / THOV panels remain edge-to-edge, but their text has
   room to breathe without creating blank black bands around the panels. */
.home-preview-page .preview-performance-copy {
  padding-top: var(--preview-copy-pad-y-compact) !important;
  padding-bottom: var(--preview-copy-pad-y-compact) !important;
}

/* Keep the light review compact, but pad the content rather than the outside. */
.home-preview-page .preview-review {
  padding-block: 0 !important;
  margin-block: 0 !important;
}
.home-preview-page .preview-review-inner {
  padding-top: clamp(42px, 3.8vw, 64px) !important;
  padding-bottom: clamp(42px, 3.8vw, 64px) !important;
}

/* Give the gallery intro breathing room inside its own light/dark treatment,
   while the photographs continue to meet the section edges. */
.home-preview-page .preview-gallery-intro {
  padding-top: clamp(30px, 3vw, 48px) !important;
  padding-bottom: clamp(30px, 3vw, 48px) !important;
}

/* Final CTA spacing belongs to its inner content so the section itself joins
   About/footer without an artificial gap. */
.home-preview-page .preview-final-cta-inner {
  padding-top: clamp(52px, 4.4vw, 78px) !important;
  padding-bottom: clamp(52px, 4.4vw, 78px) !important;
}

/* The proof/utility bands are intentionally shallow divider strips. */
.home-preview-page .preview-proof-strip,
.home-preview-page .preview-utility-strip {
  margin-block: 0 !important;
}

@media (max-width: 1060px) {
  .home-preview-page {
    --preview-copy-pad-y: clamp(48px, 6vw, 72px);
    --preview-copy-pad-x: clamp(26px, 5vw, 54px);
    --preview-copy-pad-y-compact: clamp(40px, 5vw, 58px);
  }
}

@media (max-width: 640px) {
  .home-preview-page {
    --preview-copy-pad-y: 42px;
    --preview-copy-pad-x: 22px;
    --preview-copy-pad-y-compact: 36px;
  }
  .home-preview-page .preview-review-inner {
    padding-top: 34px !important;
    padding-bottom: 34px !important;
  }
  .home-preview-page .preview-gallery-intro {
    padding-top: 26px !important;
    padding-bottom: 26px !important;
  }
  .home-preview-page .preview-final-cta-inner {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
}

/* JT P31T39 bundle source: assets/css/home-preview-132.css */
/* Build 132 - scoped home V2 hero photo reframing only.
   The hero panel dimensions are intentionally untouched. */
@media (min-width: 1061px) {
  .home-preview-page .preview-hero-media {
    left: 42% !important;
  }

  .home-preview-page .preview-hero-media img {
    object-position: 50% 58% !important;
  }
}

/* JT P31T39 bundle source: assets/css/home-preview-133.css */
/* Build 133 - scoped index2 image framing only.
   Hero and section container dimensions are intentionally unchanged. */

/* Approved vibrant ballroom hero photograph: keep the existing hero box and
   place James + violin at the visual centre of the media pane. */
.home-preview-page .preview-hero-media img {
  object-position: 50% 48% !important;
}

/* "Music for every chapter of the day": keep the existing image container,
   but crop closer to James's upper body and violin rather than the room. */
.home-preview-page .preview-wedding-section .preview-editorial-image img {
  object-position: 50% 35% !important;
  transform: scale(1.25);
  transform-origin: 50% 35%;
}

@media (max-width: 1060px) {
  .home-preview-page .preview-wedding-section .preview-editorial-image img {
    transform: scale(1.16);
    object-position: 50% 36% !important;
    transform-origin: 50% 36%;
  }
}

/* JT P31T39 bundle 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;
  }
}

/* JT P31T39 bundle source: assets/css/home-preview-134.css */
/* Build 134 - tightly scoped Index2 readability / alignment / gallery refinement.
   No hero, section-order, V2-page, or wedding-package changes. */

/* Light editorial sections: make supporting copy readable beside the large
   Marcellus headings, while keeping every item aligned to one left edge. */
.home-preview-page .preview-wedding-copy,
.home-preview-page .preview-about-copy {
  justify-content: center;
  align-items: flex-start;
  text-align: left;
}

.home-preview-page .preview-wedding-copy .preview-section-eyebrow,
.home-preview-page .preview-about-copy .preview-section-eyebrow {
  font-size: clamp(.9rem, .76vw, 1rem);
  line-height: 1.25;
}

.home-preview-page .preview-wedding-copy > p:not(.preview-section-eyebrow),
.home-preview-page .preview-about-copy > p:not(.preview-section-eyebrow) {
  width: 100%;
  max-width: 54rem;
  font-size: clamp(1.04rem, .92vw, 1.18rem);
  line-height: 1.72;
}

.home-preview-page .preview-chapter strong {
  font-size: clamp(1rem, .86vw, 1.1rem);
  line-height: 1.35;
}

.home-preview-page .preview-chapter span {
  font-size: clamp(.94rem, .78vw, 1.04rem);
  line-height: 1.58;
}

.home-preview-page .preview-wedding-copy .hero-actions,
.home-preview-page .preview-about-copy .hero-actions {
  margin-top: clamp(1.2rem, 1.6vw, 1.65rem);
  justify-content: flex-start;
}

/* About: match the comfortable alignment / CTA hierarchy used by the earlier
   light wedding section. */
.home-preview-page .preview-about-copy h2 {
  max-width: 13ch;
}

/* Recent performances is now a real next-section destination. The first image
   is framed higher so James and the violin are visible instead of an awkward
   centre crop. Container dimensions remain unchanged. */
.home-preview-page .preview-gallery-image:first-of-type img {
  object-position: 50% 30% !important;
}

@media (max-width: 900px) {
  .home-preview-page .preview-wedding-copy > p:not(.preview-section-eyebrow),
  .home-preview-page .preview-about-copy > p:not(.preview-section-eyebrow) {
    font-size: 1rem;
    line-height: 1.65;
  }
}

/* JT P31T39 bundle source: assets/css/home-preview-135.css */
/* Build 135 - index2 preview ribbon removal + hero viewport fill only. */
@media (min-width: 901px) {
  .home-preview-page .preview-hero {
    height: calc(100svh - var(--jt-v2-header-height, 88px)) !important;
    min-height: 0 !important;
  }
}

/* JT P31T39 bundle 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;
  }
}

/* JT P31T39 bundle 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;
  }
}

/* JT P31T39 bundle 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;
  }
}

/* JT P31T39 bundle 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;
  }
}

/* JT P31T39 bundle source: assets/css/home-preview-141.css */
/* Build 141 - Index2 hero image correction only.
   Restore the previously approved pink-shirt portrait framing without changing
   the hero panel dimensions or geometry. */
@media (min-width: 1061px) {
  .home-preview-page .preview-hero-media img {
    object-position: 50% 58% !important;
  }
}

/* JT P31T39 bundle 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;
    }
  }
}

/* JT P31T39 bundle 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;
  }
}

/* JT P31T39 bundle source: assets/css/public-hero-home-299.css */
/* Build 299 — HOME PAGE ONLY hero image-width prototype.
   The image occupies the right-hand 70% of the hero on desktop. The hero copy
   remains on the approved shared grid and the fade bridges the black copy area
   into the image. Tablet/mobile remain unchanged while this treatment is tested. */
@media (min-width: 1001px) {
  html body.home-page #main-content > .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;
  }

  html body.home-page #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;
  }
}

/* JT P31T39 bundle 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;
  }
}

/* P31T40 - constrained gallery-intro title fit.
   The shared V2 title scale is intentionally large, but this heading sits in the
   narrow first cell of a four-column photo strip. Keep the desktop/laptop title
   comfortably inside that cell without changing the shared section-title scale. */
@media (min-width: 901px) {
  body.home-preview-page main .preview-gallery-intro > h2 {
    font-size: clamp(40px, 2.75vw, 48px) !important;
  }
}