/* ==========================================================================
   Nameless Weddings, v2 design system
   Scoped entirely under body.nw2 so unflagged pages are untouched.
   ========================================================================== */

body.nw2 {
  --nw-ink:        #1C1B18;
  --nw-ink-soft:   #33302B;
  --nw-cream:      #F7F4EF;
  --nw-cream-deep: #EFEAE1;
  --nw-stone:      #D9CFC2;
  --nw-muted:      #6B6560;
  --nw-white:      #FFFFFF;
  --nw-accent:     #A9B300;
  --nw-accent-dp:  #8A9200;
  --nw-accent-gl:  rgba(169, 179, 0, .38);

  --nw-serif: "Cormorant Garamond", "Adamina", Georgia, serif;
  --nw-sans:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --nw-shadow-sm: 0 2px 8px rgba(28, 27, 24, .06);
  --nw-shadow:    0 12px 32px rgba(28, 27, 24, .10);
  --nw-shadow-lg: 0 24px 60px rgba(28, 27, 24, .16);

  --nw-ease: cubic-bezier(.22, .61, .36, 1);
  --nw-gutter: clamp(20px, 5vw, 80px);
  --nw-max: 1240px;
}

/* ---------- base ---------- */
body.nw2,
body.nw2 #page-container {
  background: var(--nw-cream);
  color: var(--nw-ink-soft);
  font-family: var(--nw-sans);
  font-size: 17px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

body.nw2 h1, body.nw2 h2, body.nw2 h3,
body.nw2 h4, body.nw2 h5, body.nw2 h6 {
  font-family: var(--nw-serif);
  color: var(--nw-ink);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -.012em;
  padding-bottom: 0;
}

body.nw2 h1 { font-size: clamp(2.75rem, 6.2vw, 5.25rem); }
body.nw2 h2 { font-size: clamp(2rem, 4.2vw, 3.5rem); }
body.nw2 h3 { font-size: clamp(1.4rem, 2.4vw, 2rem); }
body.nw2 h4 { font-size: clamp(1.15rem, 1.7vw, 1.4rem); }

body.nw2 p { margin: 0 0 1.15em; }
body.nw2 a { transition: color .25s var(--nw-ease); }

/* Divi resets that fight the design */
body.nw2 .et_pb_section  { background-color: transparent; padding: 0; }
body.nw2 .et_pb_row      { width: 100%; max-width: none; padding: 0; margin: 0; }
body.nw2 .et_pb_column   { margin-right: 0 !important; width: 100% !important; }
body.nw2 .et_pb_with_border { border: 0; }
body.nw2 .et_pb_code_inner { line-height: inherit; }

/* ---------- shared layout ---------- */
.nw-wrap {
  max-width: var(--nw-max);
  margin-inline: auto;
  padding-inline: var(--nw-gutter);
}
.nw-sec { padding-block: clamp(64px, 9vw, 132px); position: relative; }
.nw-sec--cream { background: var(--nw-cream); }
.nw-sec--deep  { background: var(--nw-cream-deep); }
.nw-sec--ink   { background: var(--nw-ink); color: #D8D4CD; }
.nw-sec--ink h2, .nw-sec--ink h3 { color: var(--nw-white); }

/* eyebrow: small caps label with a chartreuse hairline */
.nw-eyebrow {
  display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--nw-sans);
  font-size: .72rem; font-weight: 600;
  letter-spacing: .19em; text-transform: uppercase;
  color: var(--nw-muted); margin-bottom: 18px;
}
.nw-eyebrow::before {
  content: ""; width: 34px; height: 2px;
  background: var(--nw-accent); border-radius: 2px;
}
.nw-sec--ink .nw-eyebrow { color: var(--nw-stone); }

.nw-lede {
  font-size: clamp(1.05rem, 1.5vw, 1.22rem);
  color: var(--nw-muted); max-width: 62ch;
}
.nw-sec--ink .nw-lede { color: #B9B4AC; }

.nw-head { max-width: 72ch; margin-bottom: clamp(36px, 5vw, 64px); }
.nw-head--center { margin-inline: auto; text-align: center; }
.nw-head--center .nw-eyebrow::before { display: none; }
.nw-head--center .nw-lede { margin-inline: auto; }

/* ---------- buttons ---------- */
.nw-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--nw-sans); font-size: .82rem; font-weight: 600;
  letter-spacing: .13em; text-transform: uppercase;
  padding: 17px 34px; border-radius: 2px; border: 1.5px solid transparent;
  cursor: pointer; text-decoration: none; position: relative;
  transition: transform .35s var(--nw-ease), box-shadow .35s var(--nw-ease),
              background-color .3s var(--nw-ease), color .3s var(--nw-ease),
              border-color .3s var(--nw-ease);
}
.nw-btn:hover { transform: translateY(-2px); }

.nw-btn--primary { background: var(--nw-accent); color: var(--nw-ink) !important; }
.nw-btn--primary:hover {
  background: var(--nw-accent-dp);
  box-shadow: 0 0 0 1px var(--nw-accent-gl), 0 10px 30px var(--nw-accent-gl),
              0 0 44px var(--nw-accent-gl);
}
.nw-btn--ghost {
  border-color: rgba(255,255,255,.5); color: var(--nw-white) !important;
  backdrop-filter: blur(6px); background: rgba(255,255,255,.06);
}
.nw-btn--ghost:hover { border-color: var(--nw-white); background: rgba(255,255,255,.16); }
.nw-btn--ink { border-color: var(--nw-ink); color: var(--nw-ink) !important; }
.nw-btn--ink:hover { background: var(--nw-ink); color: var(--nw-cream) !important; }

/* the one CTA that breathes */
.nw-btn--pulse::after {
  content: ""; position: absolute; inset: -3px; border-radius: 3px;
  border: 1.5px solid var(--nw-accent); opacity: 0;
  animation: nwPulse 3.4s var(--nw-ease) infinite;
}
@keyframes nwPulse {
  0%   { opacity: .8; transform: scale(1); }
  70%  { opacity: 0;  transform: scale(1.13); }
  100% { opacity: 0;  transform: scale(1.13); }
}

/* ==========================================================================
   Header, restyle Divi's theme header into a slim, sticky bar
   ========================================================================== */
body.nw2 #main-header {
  background: rgba(247, 244, 239, .0) !important;
  box-shadow: none !important;
  transition: background-color .4s var(--nw-ease), box-shadow .4s var(--nw-ease),
              padding .4s var(--nw-ease);
  padding: 14px 0;
}
body.nw2.nw-scrolled #main-header {
  background: rgba(247, 244, 239, .94) !important;
  backdrop-filter: saturate(1.4) blur(14px);
  box-shadow: 0 1px 0 rgba(28,27,24,.08), 0 8px 26px rgba(28,27,24,.07) !important;
  padding: 6px 0;
}
body.nw2 #main-header .container { width: 92%; max-width: 1360px; }
body.nw2 #logo { max-height: 62px; transition: max-height .4s var(--nw-ease); }
body.nw2.nw-scrolled #logo { max-height: 46px; }

/* nav links */
body.nw2 #top-menu li a {
  font-family: var(--nw-sans); font-size: .78rem; font-weight: 500;
  letter-spacing: .08em; text-transform: uppercase;
  color: var(--nw-white); opacity: .92; padding-bottom: 18px;
}
body.nw2.nw-scrolled #top-menu li a { color: var(--nw-ink); }
body.nw2 #top-menu li a:hover { opacity: 1; color: var(--nw-accent); }
body.nw2 #top-menu li.current-menu-item > a { color: var(--nw-accent) !important; }

/* underline sweep */
body.nw2 #top-menu > li > a { position: relative; }
body.nw2 #top-menu > li > a::after {
  content: ""; position: absolute; left: 0; bottom: 12px;
  width: 100%; height: 1.5px; background: var(--nw-accent);
  transform: scaleX(0); transform-origin: right;
  transition: transform .35s var(--nw-ease);
}
body.nw2 #top-menu > li > a:hover::after { transform: scaleX(1); transform-origin: left; }

/* dropdowns */
body.nw2 #top-menu li ul {
  background: var(--nw-white); border-top: 2px solid var(--nw-accent);
  box-shadow: var(--nw-shadow); padding: 10px 0;
}
body.nw2 #top-menu li ul li a { color: var(--nw-ink) !important; font-size: .76rem; }
body.nw2 #top-menu li ul li a:hover { background: var(--nw-cream); color: var(--nw-accent-dp) !important; }

body.nw2 .mobile_menu_bar::before { color: var(--nw-white); }
body.nw2.nw-scrolled .mobile_menu_bar::before { color: var(--nw-ink); }
body.nw2 .et_mobile_menu {
  background: var(--nw-white); border-top: 2px solid var(--nw-accent);
  box-shadow: var(--nw-shadow);
}
body.nw2 .et_mobile_menu li a { color: var(--nw-ink); font-family: var(--nw-sans); font-size: .9rem; }

/* ==========================================================================
   Hero
   ========================================================================== */
.nw-hero {
  position: relative; min-height: 100svh;
  display: flex; align-items: center;
  overflow: hidden; background: var(--nw-ink);
}
.nw-hero__media { position: absolute; inset: 0; z-index: 0; }
.nw-hero__media img {
  width: 100%; height: 100%; object-fit: cover; object-position: center 42%;
  transform: scale(1.06); will-change: transform;
}
/* legible text over a bright photo, this is what the old chartreuse-on-video failed at */
.nw-hero__media::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(18,17,15,.62) 0%, rgba(18,17,15,.16) 34%,
                            rgba(18,17,15,.38) 66%, rgba(18,17,15,.80) 100%),
    radial-gradient(ellipse 70% 55% at 50% 46%, rgba(18,17,15,.44), transparent 70%);
}
.nw-hero__inner {
  position: relative; z-index: 2; width: 100%;
  text-align: center; padding-block: 140px 110px;
}
.nw-hero__eyebrow {
  display: inline-block; font-family: var(--nw-sans);
  font-size: .74rem; font-weight: 600; letter-spacing: .28em;
  text-transform: uppercase; color: var(--nw-stone); margin-bottom: 26px;
}
.nw-hero h1 {
  color: var(--nw-white); margin: 0 0 22px;
  text-shadow: 0 2px 40px rgba(0,0,0,.42);
  max-width: 17ch; margin-inline: auto;
}
.nw-hero h1 em {
  font-style: italic; color: var(--nw-accent);
  text-shadow: 0 0 34px rgba(169,179,0,.45);
}
.nw-hero__sub {
  color: rgba(255,255,255,.90); font-size: clamp(1.02rem, 1.5vw, 1.22rem);
  max-width: 54ch; margin: 0 auto 40px;
  text-shadow: 0 1px 18px rgba(0,0,0,.5);
}
.nw-hero__cta { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.nw-hero__scroll {
  position: absolute; left: 50%; bottom: 30px; transform: translateX(-50%);
  z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 9px;
  font-size: .64rem; letter-spacing: .22em; text-transform: uppercase;
  color: rgba(255,255,255,.72);
}
.nw-hero__scroll span {
  width: 1px; height: 42px;
  background: linear-gradient(180deg, var(--nw-accent), transparent);
  animation: nwDrop 2.1s var(--nw-ease) infinite;
}
@keyframes nwDrop {
  0%   { transform: scaleY(0); transform-origin: top; }
  45%  { transform: scaleY(1); transform-origin: top; }
  46%  { transform: scaleY(1); transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}

/* ==========================================================================
   Stats bar
   ========================================================================== */
.nw-stats {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 1px; background: var(--nw-stone);
  border-block: 1px solid var(--nw-stone);
}
.nw-stat { background: var(--nw-cream); padding: clamp(28px, 3.6vw, 46px) 20px; text-align: center; }
.nw-stat__num {
  font-family: var(--nw-serif); font-size: clamp(2.1rem, 3.6vw, 3.1rem);
  color: var(--nw-ink); line-height: 1; display: block; margin-bottom: 8px;
}
.nw-stat__num em { font-style: normal; color: var(--nw-accent); }
.nw-stat__lbl {
  font-size: .7rem; font-weight: 600; letter-spacing: .16em;
  text-transform: uppercase; color: var(--nw-muted);
}

/* ==========================================================================
   Editorial split (image + copy)
   ========================================================================== */
.nw-split {
  display: grid; grid-template-columns: 1.05fr .95fr;
  gap: clamp(36px, 6vw, 88px); align-items: center;
}
.nw-split--flip .nw-split__media { order: 2; }
.nw-split__media { position: relative; }
.nw-split__media img {
  width: 100%; height: auto; display: block;
  border-radius: 2px; box-shadow: var(--nw-shadow-lg);
}
/* offset chartreuse frame */
.nw-split__media::before {
  content: ""; position: absolute; inset: 22px -22px -22px 22px;
  border: 1.5px solid var(--nw-accent); border-radius: 2px; z-index: -1;
}
.nw-split--flip .nw-split__media::before { inset: 22px 22px -22px -22px; }

/* ==========================================================================
   Menu cards
   ========================================================================== */
.nw-cards {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: clamp(18px, 2.4vw, 30px);
}
.nw-card {
  position: relative; display: flex; flex-direction: column;
  background: var(--nw-white); border-radius: 2px; overflow: hidden;
  box-shadow: var(--nw-shadow-sm); text-decoration: none;
  transition: transform .45s var(--nw-ease), box-shadow .45s var(--nw-ease);
}
.nw-card:hover { transform: translateY(-7px); box-shadow: var(--nw-shadow-lg); }
.nw-card__media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--nw-stone); }
.nw-card__media img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .8s var(--nw-ease);
}
.nw-card:hover .nw-card__media img { transform: scale(1.07); }
.nw-card__price {
  position: absolute; left: 14px; bottom: 14px; z-index: 2;
  background: rgba(247,244,239,.95); color: var(--nw-ink);
  font-size: .74rem; font-weight: 700; letter-spacing: .05em;
  padding: 7px 13px; border-radius: 2px; backdrop-filter: blur(4px);
}
.nw-card__body { padding: 22px 24px 26px; flex: 1; display: flex; flex-direction: column; }
.nw-card__body h3 { margin: 0 0 8px; transition: color .3s var(--nw-ease); }
.nw-card:hover .nw-card__body h3 { color: var(--nw-accent-dp); }
.nw-card__body p { color: var(--nw-muted); font-size: .93rem; margin: 0 0 16px; flex: 1; }
.nw-card__more {
  font-size: .72rem; font-weight: 600; letter-spacing: .15em;
  text-transform: uppercase; color: var(--nw-accent-dp);
  display: inline-flex; align-items: center; gap: 8px;
}
.nw-card__more::after {
  content: "\2192"; transition: transform .35s var(--nw-ease);
}
.nw-card:hover .nw-card__more::after { transform: translateX(6px); }

/* ==========================================================================
   Steps
   ========================================================================== */
.nw-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: clamp(24px, 3vw, 44px); }
.nw-step { position: relative; padding-top: 30px; }
.nw-step::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0;
  height: 1.5px; background: var(--nw-stone);
}
.nw-step::after {
  content: ""; position: absolute; top: 0; left: 0;
  height: 1.5px; width: 0; background: var(--nw-accent);
  transition: width 1s var(--nw-ease);
}
.nw-step.is-in::after { width: 46px; }
.nw-step__n {
  font-family: var(--nw-serif); font-size: 1rem; color: var(--nw-accent-dp);
  letter-spacing: .1em; display: block; margin-bottom: 10px;
}
.nw-step h3 { margin: 0 0 10px; font-size: clamp(1.25rem, 1.8vw, 1.55rem); }
.nw-step p { color: var(--nw-muted); font-size: .94rem; margin: 0; }

/* ==========================================================================
   Venues
   ========================================================================== */
.nw-venues {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
  gap: 1px; background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.13);
}
.nw-venue {
  background: var(--nw-ink); padding: 20px 18px;
  font-size: .88rem; color: #C7C2BA; text-decoration: none;
  display: flex; align-items: center; min-height: 68px;
  transition: background-color .35s var(--nw-ease), color .35s var(--nw-ease);
}
.nw-venue:hover { background: #24231F; color: var(--nw-accent) !important; }

/* ==========================================================================
   Gallery strip
   ========================================================================== */
.nw-gal { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.nw-gal a {
  display: block; position: relative; overflow: hidden;
  aspect-ratio: 3 / 4; border-radius: 2px; background: var(--nw-stone);
}
.nw-gal a:nth-child(1), .nw-gal a:nth-child(6) { aspect-ratio: 3 / 5; }
.nw-gal img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .9s var(--nw-ease), filter .5s var(--nw-ease);
}
.nw-gal a:hover img { transform: scale(1.07); filter: brightness(1.06); }

/* ==========================================================================
   Testimonial
   ========================================================================== */
.nw-quote { max-width: 46ch; margin-inline: auto; text-align: center; }
.nw-quote__mark {
  font-family: var(--nw-serif); font-size: 5rem; line-height: .5;
  color: var(--nw-accent); opacity: .55; display: block; margin-bottom: 20px;
}
.nw-quote blockquote {
  font-family: var(--nw-serif); font-size: clamp(1.5rem, 2.9vw, 2.35rem);
  line-height: 1.3; color: var(--nw-ink); margin: 0 0 26px; font-style: italic;
}
.nw-sec--ink .nw-quote blockquote { color: var(--nw-white); }
.nw-quote cite {
  font-family: var(--nw-sans); font-style: normal; font-size: .74rem;
  font-weight: 600; letter-spacing: .17em; text-transform: uppercase;
  color: var(--nw-muted);
}

/* ==========================================================================
   FAQ accordion (clean markup for FAQPage schema)
   ========================================================================== */
.nw-faq { max-width: 860px; margin-inline: auto; }
.nw-faq details {
  border-bottom: 1px solid var(--nw-stone); padding: 4px 0;
}
.nw-faq summary {
  cursor: pointer; list-style: none; padding: 22px 44px 22px 0;
  position: relative; font-family: var(--nw-serif);
  font-size: clamp(1.12rem, 1.7vw, 1.38rem); color: var(--nw-ink);
  transition: color .3s var(--nw-ease);
}
.nw-faq summary::-webkit-details-marker { display: none; }
.nw-faq summary:hover { color: var(--nw-accent-dp); }
.nw-faq summary::after {
  content: ""; position: absolute; right: 6px; top: 50%;
  width: 13px; height: 1.5px; background: var(--nw-accent);
  transition: transform .35s var(--nw-ease);
}
.nw-faq summary::before {
  content: ""; position: absolute; right: 12px; top: 50%;
  width: 1.5px; height: 13px; background: var(--nw-accent);
  transform: translateY(-50%); transition: opacity .3s var(--nw-ease), transform .35s var(--nw-ease);
}
.nw-faq details[open] summary::before { opacity: 0; transform: translateY(-50%) rotate(90deg); }
.nw-faq details p { color: var(--nw-muted); margin: 0 0 22px; max-width: 68ch; }

/* ==========================================================================
   Closing CTA
   ========================================================================== */
.nw-cta { position: relative; overflow: hidden; text-align: center; }
.nw-cta::before {
  content: ""; position: absolute; inset: 0; z-index: 0;
  background: radial-gradient(ellipse 60% 90% at 50% 100%, rgba(169,179,0,.16), transparent 70%);
}
.nw-cta > * { position: relative; z-index: 1; }
.nw-cta h2 { max-width: 18ch; margin: 0 auto 20px; }
.nw-cta__actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-top: 34px; }
.nw-cta__phone {
  font-family: var(--nw-serif); font-size: clamp(1.6rem, 2.6vw, 2.2rem);
  color: var(--nw-white) !important; text-decoration: none;
  border-bottom: 1.5px solid var(--nw-accent); padding-bottom: 3px;
}
.nw-cta__phone:hover { color: var(--nw-accent) !important; }

/* ==========================================================================
   Footer
   ========================================================================== */
body.nw2 #main-footer { background: var(--nw-ink); }
body.nw2 #footer-widgets { padding: clamp(52px, 6vw, 84px) 0 40px; }
body.nw2 #footer-widgets .footer-widget h4 {
  color: var(--nw-white); font-family: var(--nw-serif); font-size: 1.25rem;
}
body.nw2 #footer-widgets .footer-widget,
body.nw2 #footer-widgets .footer-widget li a { color: #A8A39B; font-size: .92rem; }
body.nw2 #footer-widgets .footer-widget li a:hover { color: var(--nw-accent); }
body.nw2 #footer-bottom { background: #141310; padding: 18px 0; }
body.nw2 #footer-info { color: #6E6960; font-size: .78rem; }

/* ==========================================================================
   Gravity Forms, carry the design system into the quote flow
   ========================================================================== */
body.nw2 .gform_wrapper { font-family: var(--nw-sans); }
body.nw2 .gform_wrapper .gfield_label {
  font-size: .74rem; font-weight: 600; letter-spacing: .12em;
  text-transform: uppercase; color: var(--nw-muted); margin-bottom: 8px;
}
body.nw2 .gform_wrapper input[type=text],
body.nw2 .gform_wrapper input[type=email],
body.nw2 .gform_wrapper input[type=tel],
body.nw2 .gform_wrapper input[type=number],
body.nw2 .gform_wrapper textarea,
body.nw2 .gform_wrapper select {
  font-family: var(--nw-sans); font-size: 1rem;
  background: var(--nw-white); color: var(--nw-ink);
  border: 1px solid var(--nw-stone); border-radius: 2px;
  padding: 13px 15px; width: 100%;
  transition: border-color .25s var(--nw-ease), box-shadow .25s var(--nw-ease);
}
body.nw2 .gform_wrapper input:focus,
body.nw2 .gform_wrapper textarea:focus,
body.nw2 .gform_wrapper select:focus {
  outline: none; border-color: var(--nw-accent);
  box-shadow: 0 0 0 3px rgba(169,179,0,.18);
}
body.nw2 .gform_wrapper .gform_button,
body.nw2 .gform_wrapper .gform_next_button,
body.nw2 .gform_wrapper .gform_previous_button {
  font-family: var(--nw-sans); font-size: .82rem; font-weight: 600;
  letter-spacing: .13em; text-transform: uppercase;
  background: var(--nw-accent); color: var(--nw-ink);
  border: 0; border-radius: 2px; padding: 16px 34px; cursor: pointer;
  transition: background-color .3s var(--nw-ease), box-shadow .35s var(--nw-ease),
              transform .35s var(--nw-ease);
}
body.nw2 .gform_wrapper .gform_button:hover {
  background: var(--nw-accent-dp); transform: translateY(-2px);
  box-shadow: 0 10px 30px var(--nw-accent-gl), 0 0 40px var(--nw-accent-gl);
}

/* ==========================================================================
   Motion, reveal states driven by nw2.js / GSAP
   ========================================================================== */
body.nw2 [data-nw-reveal] { opacity: 0; transform: translateY(18px); }
body.nw2.nw-no-motion [data-nw-reveal] { opacity: 1 !important; transform: none !important; }

/* sheen that sweeps a divider once on entry */
.nw-sheen { position: relative; height: 1.5px; background: var(--nw-stone); overflow: hidden; }
.nw-sheen::after {
  content: ""; position: absolute; inset: 0; transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, var(--nw-accent), transparent);
}
.nw-sheen.is-in::after { animation: nwSheen 1.5s var(--nw-ease) forwards; }
@keyframes nwSheen { to { transform: translateX(100%); } }

@media (prefers-reduced-motion: reduce) {
  body.nw2 *, body.nw2 *::before, body.nw2 *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; scroll-behavior: auto !important;
  }
  body.nw2 [data-nw-reveal] { opacity: 1 !important; transform: none !important; }
  .nw-hero__media img { transform: none !important; }
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 980px) {
  .nw-split, .nw-split--flip .nw-split__media { grid-template-columns: 1fr; order: 0; }
  .nw-split__media::before { display: none; }
  .nw-stats { grid-template-columns: repeat(2, 1fr); }
  .nw-gal { grid-template-columns: repeat(3, 1fr); }
  .nw-gal a:nth-child(n+7) { display: none; }
}
@media (max-width: 620px) {
  body.nw2 { font-size: 16px; }
  .nw-hero { min-height: 92svh; }
  .nw-hero__inner { padding-block: 120px 96px; }
  .nw-hero__cta .nw-btn { width: 100%; }
  .nw-gal { grid-template-columns: repeat(2, 1fr); }
  .nw-gal a, .nw-gal a:nth-child(1), .nw-gal a:nth-child(6) { aspect-ratio: 1 / 1; }
  .nw-gal a:nth-child(n+5) { display: none; }
  .nw-venues { grid-template-columns: 1fr 1fr; }
  .nw-cta__actions .nw-btn { width: 100%; }
}

/* ==========================================================================
   Divi fixed-nav compensation
   Divi's et_fixed_nav pads #page-container to clear the fixed header.
   The v2 hero is full-bleed and sits *under* the header, so that padding
   has to go, the hero supplies its own top spacing instead.
   ========================================================================== */
body.nw2 #page-container { padding-top: 0 !important; margin-top: 0 !important; }
body.nw2 #main-header { position: fixed; top: 0; left: 0; right: 0; z-index: 99999; }
body.nw2 #et-main-area { overflow-x: clip; }

/* centered header style: tighten the stacked logo + nav */
body.nw2.et_header_style_centered #main-header .logo_container { padding-bottom: 6px; }
body.nw2.et_header_style_centered #top-menu { padding-bottom: 4px; }
body.nw2.et_header_style_centered #main-header .container { padding-top: 6px; }

/* pages whose first block is NOT a full-bleed hero still need clearance */
body.nw2.nw-has-topbar #page-container { padding-top: 118px !important; }

/* ==========================================================================
   Hero entrance, CSS only.
   The headline is the most important copy on the site, so it must never
   depend on a script loading. GSAP handles scroll-linked parallax only.
   ========================================================================== */
.nw-hero [data-nw-hero] { animation: nwHeroIn .95s var(--nw-ease) both; }
.nw-hero [data-nw-hero]:nth-child(1) { animation-delay: .10s; }
.nw-hero [data-nw-hero]:nth-child(2) { animation-delay: .22s; }
.nw-hero [data-nw-hero]:nth-child(3) { animation-delay: .34s; }
.nw-hero [data-nw-hero]:nth-child(4) { animation-delay: .46s; }
@keyframes nwHeroIn {
  from { opacity: 0; transform: translateY(26px); }
  to   { opacity: 1; transform: translateY(0); }
}
/* Ken Burns also moves to CSS so the hero is fully self-sufficient. */
.nw-hero__media img { animation: nwKen 26s var(--nw-ease) both; }
@keyframes nwKen { from { transform: scale(1.06); } to { transform: scale(1.17); } }

@media (prefers-reduced-motion: reduce) {
  .nw-hero [data-nw-hero], .nw-hero__media img { animation: none !important; }
}

/* ==========================================================================
   Hero corrections
   `body.nw2 h1` (0,1,2) was out-specifying `.nw-hero h1` (0,1,1), so the
   headline inherited the dark ink colour and disappeared into the photo.
   Every hero colour rule is now body-scoped to win cleanly.
   ========================================================================== */
body.nw2 .nw-hero h1 {
  color: var(--nw-white);
  font-size: clamp(2.4rem, 4.6vw, 4.1rem);
  max-width: 15ch;
  text-shadow: 0 2px 30px rgba(0,0,0,.55), 0 1px 4px rgba(0,0,0,.4);
}
body.nw2 .nw-hero h1 em {
  color: var(--nw-accent);
  text-shadow: 0 2px 26px rgba(0,0,0,.6), 0 0 40px rgba(169,179,0,.35);
}
body.nw2 .nw-hero__eyebrow {
  color: #E6E1D8;
  text-shadow: 0 1px 14px rgba(0,0,0,.6);
}
body.nw2 .nw-hero__sub {
  color: #F2EFEA;
  max-width: 50ch;
  text-shadow: 0 1px 16px rgba(0,0,0,.62);
}

/* A real scrim. The photo is bright and busy through the middle, which is
   exactly where the copy sits, so the text needs its own dark ground rather
   than a decorative wash. */
body.nw2 .nw-hero__media::after {
  background:
    linear-gradient(180deg,
      rgba(16,15,13,.80) 0%,
      rgba(16,15,13,.52) 18%,
      rgba(16,15,13,.44) 50%,
      rgba(16,15,13,.60) 82%,
      rgba(16,15,13,.86) 100%),
    radial-gradient(ellipse 58% 46% at 50% 48%, rgba(12,11,10,.62), transparent 72%);
}

/* Nav needs to hold up against the photo before the page is scrolled. */
body.nw2:not(.nw-scrolled) #top-menu li a,
body.nw2:not(.nw-scrolled) #top-menu li a:hover {
  text-shadow: 0 1px 10px rgba(0,0,0,.55);
}

/* ==========================================================================
   Corrections round 2
   ========================================================================== */

/* Same specificity trap as the hero: `body.nw2 h2` (0,1,2) was beating
   `.nw-sec--ink h2` (0,2,0), so headings on dark sections rendered in ink
   on ink and vanished entirely. */
body.nw2 .nw-sec--ink h2,
body.nw2 .nw-sec--ink h3,
body.nw2 .nw-sec--ink h4 { color: var(--nw-white); }
body.nw2 .nw-sec--ink .nw-quote blockquote { color: var(--nw-white); }
body.nw2 .nw-sec--ink .nw-lede { color: #B9B4AC; }

/* Divi styles blockquote with a left rule; the centred pull-quote doesn't want it. */
body.nw2 .nw-quote blockquote {
  border-left: 0; padding-left: 0; margin-left: 0;
}

/* Gallery: 6 images never tiled cleanly into 4 columns, the leftover cells
   read as broken rather than intentional. Two even rows of three. */
.nw-gal { grid-template-columns: repeat(3, 1fr); gap: 12px; }
.nw-gal a,
.nw-gal a:nth-child(1),
.nw-gal a:nth-child(6) { aspect-ratio: 4 / 5; }

/* Venues: 16 partners divide exactly into four columns, so no ragged last row. */
.nw-venues { grid-template-columns: repeat(4, 1fr); }

/* The offset accent frame sat at z-index:-1, which put it behind the section
   background instead of behind the photo. Stack it locally instead. */
.nw-split__media { isolation: isolate; }
.nw-split__media::before { z-index: 0; }
.nw-split__media img { position: relative; z-index: 1; }

/* Keep the currency symbol the same colour as the figure. */
.nw-stat__num { color: var(--nw-ink); }

@media (max-width: 980px) {
  .nw-venues { grid-template-columns: repeat(2, 1fr); }
  .nw-gal { grid-template-columns: repeat(3, 1fr); }
  .nw-gal a:nth-child(n+7) { display: none; }
}
@media (max-width: 620px) {
  .nw-gal { grid-template-columns: repeat(2, 1fr); }
  .nw-gal a, .nw-gal a:nth-child(1), .nw-gal a:nth-child(6) { aspect-ratio: 1 / 1; }
  .nw-gal a:nth-child(n+5) { display: none; }
}

/* The editorial photo read short and weightless next to a tall copy column.
   A 5:4 crop gives it presence without going full portrait. */
.nw-split__media img { aspect-ratio: 5 / 4; object-fit: cover; }
@media (max-width: 980px) { .nw-split__media img { aspect-ratio: 16 / 10; } }

/* ==========================================================================
   Polish
   ========================================================================== */
/* Headings sat flush against the paragraph beneath them. */
body.nw2 .nw-split__copy h2,
body.nw2 .nw-head h2 { margin-bottom: .42em; }
body.nw2 .nw-split__copy .nw-lede { margin-bottom: 1.4em; }
body.nw2 .nw-split__copy .nw-btn { margin-top: 10px; }

/* Divi prints a "Select Page" label beside the mobile hamburger. */
body.nw2 .et_mobile_nav_menu .select_page { display: none; }
body.nw2 .et_mobile_nav_menu { float: right; }

/* Give the mobile hero a little more room to breathe under the logo. */
@media (max-width: 620px) {
  body.nw2 .nw-hero__inner { padding-block: 150px 110px; }
  body.nw2 .nw-hero h1 { font-size: clamp(2.1rem, 9vw, 2.9rem); max-width: 13ch; }
}

/* ==========================================================================
   Header, round 2
   The scrolled state used a cream background, which hid the white logo and
   left the nav low-contrast. Going dark on scroll keeps the existing white
   logo readable and reads more premium than a light bar.
   ========================================================================== */
body.nw2.nw-scrolled #main-header {
  background: rgba(24, 23, 20, .93) !important;
  backdrop-filter: saturate(1.2) blur(14px);
  box-shadow: 0 1px 0 rgba(255,255,255,.07), 0 10px 30px rgba(0,0,0,.28) !important;
}
body.nw2.nw-scrolled #top-menu li a { color: #F2EFEA; opacity: 1; }
body.nw2.nw-scrolled #top-menu li a:hover { color: var(--nw-accent); }
body.nw2.nw-scrolled .mobile_menu_bar::before { color: #F2EFEA; }
body.nw2.nw-scrolled #top-menu li.current-menu-item > a { color: var(--nw-accent) !important; }

/* Nav legibility: heavier weight and a touch more tracking at small sizes. */
body.nw2 #top-menu li a {
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .07em;
}

/* Submenu caret was colliding with the label.
   Our underline sweep previously claimed ::after, which is the same
   pseudo-element Divi uses for the caret. The sweep moves to ::before and
   parent items get room on the right for the arrow. */
body.nw2 #top-menu > li > a::after { content: none; }
body.nw2 #top-menu > li > a {
  position: relative;
  padding-right: 0;
}
body.nw2 #top-menu > li > a::before {
  content: ""; position: absolute; left: 0; bottom: 12px;
  width: 100%; height: 1.5px; background: var(--nw-accent);
  transform: scaleX(0); transform-origin: right;
  transition: transform .35s var(--nw-ease);
}
body.nw2 #top-menu > li > a:hover::before { transform: scaleX(1); transform-origin: left; }

body.nw2 #top-menu li.menu-item-has-children > a { padding-right: 20px; }
body.nw2 #top-menu li.menu-item-has-children > a::after {
  content: "3";
  font-family: ETmodules, sans-serif;
  font-size: 14px; font-weight: 400; line-height: 1;
  position: absolute; right: 0; top: 50%;
  transform: translateY(-50%) translateY(-4px);
  opacity: .75; pointer-events: none;
}
body.nw2 #top-menu li.menu-item-has-children > a:hover::after { opacity: 1; }
/* the caret must not inherit the underline's width transition */
body.nw2 #top-menu li.menu-item-has-children > a::after { background: none; height: auto; transform-origin: center; }

/* ==========================================================================
   Mobile menu
   ========================================================================== */
body.nw2 .et_mobile_menu {
  background: #1A1916;
  border-top: 2px solid var(--nw-accent);
  box-shadow: 0 24px 50px rgba(0,0,0,.4);
  padding: 6px 0;
}
body.nw2 .et_mobile_menu li a {
  color: #EFECE6;
  font-family: var(--nw-sans);
  font-size: .88rem; font-weight: 500;
  letter-spacing: .04em;
  padding: 15px 22px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  transition: color .25s var(--nw-ease), background-color .25s var(--nw-ease);
}
body.nw2 .et_mobile_menu li a:hover,
body.nw2 .et_mobile_menu li.current-menu-item > a { color: var(--nw-accent); background: rgba(255,255,255,.04); }
body.nw2 .et_mobile_menu li li a { padding-left: 38px; font-size: .82rem; opacity: .85; }
body.nw2 .et_mobile_menu .menu-item-has-children > a {
  font-weight: 700; background: rgba(255,255,255,.05); color: #FFF;
}
body.nw2 .et_mobile_menu li:last-child > a { border-bottom: 0; }
body.nw2 .mobile_menu_bar::before { font-size: 30px; }

/* ==========================================================================
   Testimonials, two up
   ========================================================================== */
.nw-quotes {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: clamp(20px, 3vw, 40px);
}
.nw-q {
  margin: 0; padding: clamp(28px, 3.2vw, 44px);
  background: var(--nw-white); border-radius: 2px;
  box-shadow: var(--nw-shadow-sm);
  display: flex; flex-direction: column;
}
.nw-q__mark {
  font-family: var(--nw-serif); font-size: 3.4rem; line-height: .4;
  color: var(--nw-accent); opacity: .6; margin-bottom: 18px;
}
body.nw2 .nw-q blockquote {
  font-family: var(--nw-serif);
  font-size: clamp(1.18rem, 1.75vw, 1.5rem);
  line-height: 1.36; font-style: italic;
  color: var(--nw-ink);
  border-left: 0; padding-left: 0; margin: 0 0 22px; flex: 1;
}
.nw-q figcaption {
  font-family: var(--nw-sans); font-size: .74rem; font-weight: 600;
  letter-spacing: .15em; text-transform: uppercase; color: var(--nw-ink);
}
.nw-q figcaption span {
  display: block; margin-top: 5px;
  font-weight: 500; letter-spacing: .1em; color: var(--nw-muted);
}
@media (max-width: 820px) { .nw-quotes { grid-template-columns: 1fr; } }

/* three stats instead of four */
.nw-stats { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 760px) { .nw-stats { grid-template-columns: 1fr; } }

/* ==========================================================================
   Footer
   ========================================================================== */
body.nw2 #main-footer { display: none; }

.nw-foot { background: var(--nw-ink); color: #A8A39B; padding-top: clamp(56px, 6vw, 88px); }
.nw-foot__top {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: clamp(28px, 4vw, 56px);
  padding-bottom: clamp(38px, 4.5vw, 60px);
}
.nw-foot__brand img { max-width: 190px; height: auto; margin-bottom: 18px; }
.nw-foot__brand p { font-size: .92rem; max-width: 34ch; margin-bottom: 18px; color: #918C84; }
.nw-foot__phone {
  font-family: var(--nw-serif); font-size: 1.65rem;
  color: var(--nw-white) !important; text-decoration: none;
  border-bottom: 1.5px solid var(--nw-accent); padding-bottom: 2px;
  transition: color .3s var(--nw-ease);
}
.nw-foot__phone:hover { color: var(--nw-accent) !important; }
.nw-foot__social { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 22px; }
.nw-foot__social a {
  font-size: .72rem; font-weight: 600; letter-spacing: .13em;
  text-transform: uppercase; color: #8C877F !important; text-decoration: none;
}
.nw-foot__social a:hover { color: var(--nw-accent) !important; }

body.nw2 .nw-foot__col h4 {
  color: var(--nw-white); font-family: var(--nw-sans);
  font-size: .72rem; font-weight: 700; letter-spacing: .17em;
  text-transform: uppercase; margin: 0 0 16px;
}
.nw-foot__col ul { list-style: none; margin: 0; padding: 0; }
.nw-foot__col li { margin-bottom: 9px; }
.nw-foot__col a {
  color: #918C84 !important; text-decoration: none; font-size: .92rem;
  transition: color .25s var(--nw-ease), padding-left .25s var(--nw-ease);
}
.nw-foot__col a:hover { color: var(--nw-accent) !important; padding-left: 5px; }

.nw-foot__cta {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 18px;
  padding: clamp(26px, 3vw, 38px) 0;
  border-top: 1px solid rgba(255,255,255,.10);
  border-bottom: 1px solid rgba(255,255,255,.10);
}
.nw-foot__cta p {
  margin: 0; font-family: var(--nw-serif);
  font-size: clamp(1.35rem, 2.2vw, 1.9rem); color: var(--nw-white);
}
.nw-foot__bottom {
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px;
  padding: 22px 0 26px; font-size: .78rem; color: #6E6960;
}
.nw-foot__legal { display: flex; gap: 20px; }
.nw-foot__legal a { color: #6E6960 !important; text-decoration: none; }
.nw-foot__legal a:hover { color: var(--nw-accent) !important; }

@media (max-width: 900px) {
  .nw-foot__top { grid-template-columns: 1fr 1fr; }
  .nw-foot__brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .nw-foot__top { grid-template-columns: 1fr; gap: 30px; }
  .nw-foot__cta { flex-direction: column; align-items: flex-start; }
  .nw-foot__cta .nw-btn { width: 100%; }
  .nw-foot__bottom { flex-direction: column; }
}

/* Divi's customizer sets a tan page background, which showed as a band below
   the footer on short pages. The v2 footer is dark, so the page ground
   behind it should be too. */
body.nw2,
body.nw2 #page-container,
body.nw2 #et-main-area { background-color: var(--nw-ink); }
body.nw2 #main-content { background-color: var(--nw-cream); }

/* ==========================================================================
   Header background, final
   Divi emits et-core-unified-<id>.min.css AFTER this file, carrying
   `#main-header,...{background-color:#cbb9a8}`. Matching Divi's own selector
   list (and covering the .et-fixed-header class its script adds on scroll)
   so the header is reliably transparent at rest and dark once scrolled.
   ========================================================================== */
html body.nw2 #main-header,
html body.nw2 #main-header.et-fixed-header,
html body.nw2 .et-search-form {
  background-color: transparent !important;
}
html body.nw2.nw-scrolled #main-header,
html body.nw2 #main-header.et-fixed-header,
html body.nw2.nw-scrolled #main-header.et-fixed-header {
  background-color: rgba(24, 23, 20, .94) !important;
}
html body.nw2 #main-header .nav li ul,
html body.nw2 #main-header .et_mobile_menu {
  background-color: #1A1916 !important;
}
/* dropdown panels read as part of the dark bar */
body.nw2 #top-menu li ul { border-top: 2px solid var(--nw-accent); }
body.nw2 #top-menu li ul li a { color: #EFECE6 !important; }
body.nw2 #top-menu li ul li a:hover { background: rgba(255,255,255,.06); color: var(--nw-accent) !important; }

/* ==========================================================================
   Header background, final
   Divi emits et-core-unified-<id>.min.css AFTER this file, carrying
   `#main-header,...{background-color:#cbb9a8}`. Matching Divi's own selector
   list (and the .et-fixed-header class its script adds) so the header is
   reliably transparent at rest and dark once scrolled.
   ========================================================================== */
html body.nw2 #main-header,
html body.nw2 .et-search-form { background-color: transparent !important; }

html body.nw2.nw-scrolled #main-header,
html body.nw2 #main-header.et-fixed-header {
  background-color: rgba(24, 23, 20, .94) !important;
}
html body.nw2 #main-header .nav li ul,
html body.nw2 #main-header .et_mobile_menu { background-color: #1A1916 !important; }

body.nw2 #top-menu li ul li a { color: #EFECE6 !important; }
body.nw2 #top-menu li ul li a:hover { background: rgba(255,255,255,.06); color: var(--nw-accent) !important; }

/* Divi's nav anchors carry 18px of bottom padding, so centring the caret on
   the box dropped it below the word. Offset by half that padding to sit it
   on the text baseline instead. */
body.nw2 #top-menu li.menu-item-has-children > a::after {
  top: 50%;
  transform: translateY(-50%);
  margin-top: -9px;
}

/* Caret drawn with borders rather than Divi's ETmodules icon font, so it
   never depends on an icon font loading and never sits on top of the label. */
body.nw2 #top-menu li.menu-item-has-children > a { padding-right: 18px; }
body.nw2 #top-menu li.menu-item-has-children > a::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -12px;
  width: 6px; height: 6px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
  opacity: .7;
  font-size: 0; line-height: 0; background: none;
  transition: opacity .25s var(--nw-ease), transform .3s var(--nw-ease);
}
body.nw2 #top-menu li.menu-item-has-children > a:hover::after {
  opacity: 1;
  transform: translateY(-50%) rotate(45deg) translate(1px, 1px);
}

/* Divi targets the caret as `#top-menu .menu-item-has-children>a:first-child:after`.
   Matching that exact shape guarantees the override lands. */
body.nw2 #top-menu .menu-item-has-children > a:first-child { padding-right: 20px; }
body.nw2 #top-menu .menu-item-has-children > a:first-child::after {
  font-family: inherit !important;
  content: "" !important;
  position: absolute;
  right: 2px;
  top: 7px;
  width: 7px; height: 7px;
  border: 0;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
  opacity: .75;
  font-size: 0; font-weight: 400;
  transition: opacity .25s ease, transform .3s ease;
}
body.nw2 #top-menu .menu-item-has-children > a:first-child:hover::after {
  opacity: 1; transform: rotate(45deg) translate(1px, 1px);
}

/* Final caret approach.
   Divi's caret is anchored to the <a>, whose positioning context proved
   unreliable inside the centred header layout, landing the chevron on top of
   the label. Hiding Divi's and drawing our own on the <li> gives a stable box
   to position against, with room reserved so it can never touch the text. */
body.nw2 #top-menu > li.menu-item-has-children > a:first-child::after { display: none !important; }
body.nw2 #top-menu > li.menu-item-has-children > a:first-child { padding-right: 0 !important; }

body.nw2 #top-menu > li.menu-item-has-children { position: relative; padding-right: 30px; }
body.nw2 #top-menu > li.menu-item-has-children::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 1px;
  width: 7px; height: 7px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
  opacity: .7;
  pointer-events: none;
  transition: opacity .25s ease, transform .3s ease;
}
body.nw2 #top-menu > li.menu-item-has-children:hover::after {
  opacity: 1; transform: rotate(45deg) translate(1px, 1px);
}

/* ==========================================================================
   Hero spacing and centring
   `body.nw2 p` (0,1,2) was out-specifying `.nw-hero__sub` (0,1,0) and
   overwriting its `margin: 0 auto`, which pushed the subhead off centre.
   Setting the side margins in a body-scoped rule puts it back.
   ========================================================================== */
body.nw2 .nw-hero__sub {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
  text-align: center;
}

/* The eyebrow was crowding the two-row nav. More headroom above it. */
body.nw2 .nw-hero__inner { padding-block: clamp(200px, 22vh, 250px) clamp(90px, 12vh, 120px); }
body.nw2 .nw-hero__eyebrow { margin-bottom: 22px; }

@media (max-width: 620px) {
  body.nw2 .nw-hero__inner { padding-block: 170px 104px; }
}

/* ==========================================================================
   Mobile menu scrolling
   The panel can run longer than the viewport. Divi lets the page scroll
   underneath instead of the menu, so the lower items were unreachable.
   ========================================================================== */
body.nw2 .et_mobile_menu {
  max-height: calc(100svh - 108px) !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
body.nw2 .et_mobile_menu::-webkit-scrollbar { width: 4px; }
body.nw2 .et_mobile_menu::-webkit-scrollbar-thumb {
  background: rgba(169,179,0,.55); border-radius: 4px;
}
body.nw2 .et_mobile_menu::-webkit-scrollbar-track { background: transparent; }

/* Google rating link under the reviews */
.nw-rating {
  display: flex; align-items: center; justify-content: center;
  gap: 10px; flex-wrap: wrap;
  margin-top: clamp(26px, 3vw, 40px);
  text-decoration: none; color: var(--nw-muted) !important;
  font-size: .84rem;
  transition: color .25s var(--nw-ease);
}
.nw-rating:hover { color: var(--nw-ink) !important; }
.nw-rating__stars { color: var(--nw-accent); letter-spacing: 2px; font-size: .95rem; }
.nw-rating__num {
  font-family: var(--nw-serif); font-size: 1.35rem; color: var(--nw-ink);
  line-height: 1;
}
.nw-rating__txt {
  font-weight: 600; letter-spacing: .12em; text-transform: uppercase; font-size: .72rem;
}

/* ==========================================================================
   Exit popup (Popups for Divi)
   The plugin moves the section into .area-outer-wrap at runtime but keeps its
   id, so styling #customMenu works both in place and once it is shown.
   ========================================================================== */

/* backdrop */
body.nw2 .da-overlay {
  background: rgba(16, 15, 13, .74) !important;
  backdrop-filter: blur(6px) saturate(.9);
}

/* the panel itself */
body.nw2 #customMenu.et_pb_section {
  position: relative;
  max-width: 640px;
  margin-inline: auto;
  padding: clamp(46px, 6vw, 76px) clamp(28px, 5vw, 60px) clamp(38px, 5vw, 60px);
  border-radius: 3px;
  overflow: hidden;
  background-position: center 30% !important;
  background-size: cover !important;
  box-shadow: 0 40px 90px rgba(0, 0, 0, .5);
  text-align: center;
}
/* scrim so the heading is readable over the photo */
body.nw2 #customMenu.et_pb_section::before {
  content: "";
  position: absolute; inset: 0; z-index: 0;
  background:
    linear-gradient(180deg, rgba(14,13,11,.72) 0%, rgba(14,13,11,.58) 45%, rgba(14,13,11,.86) 100%);
}
body.nw2 #customMenu .et_pb_row,
body.nw2 #customMenu .et_pb_column { position: relative; z-index: 1; }

/* a chartreuse hairline above the heading, in place of the old drop shadow */
body.nw2 #customMenu .et_pb_heading:first-of-type::before {
  content: "";
  display: block; width: 40px; height: 2px;
  background: var(--nw-accent);
  margin: 0 auto 22px;
  border-radius: 2px;
}

/* retype the heading: Cormorant instead of Abril Fatface with a hard shadow */
body.nw2 #customMenu .et_pb_heading_container h1,
body.nw2 #customMenu .et_pb_heading_container h2,
body.nw2 #customMenu .et_pb_heading_container h3,
body.nw2 #customMenu .et_pb_heading_container h4,
body.nw2 #customMenu .et_pb_heading_container h5,
body.nw2 #customMenu .et_pb_heading_container h6 {
  font-family: var(--nw-serif) !important;
  font-weight: 500 !important;
  font-style: normal !important;
  font-size: clamp(1.8rem, 3.6vw, 2.6rem) !important;
  line-height: 1.14 !important;
  letter-spacing: -.01em;
  color: #FFFFFF !important;
  text-shadow: 0 2px 26px rgba(0,0,0,.5) !important;
  max-width: 18ch;
  margin-inline: auto;
}

/* the CTA */
body.nw2 #customMenu .et_pb_button {
  font-family: var(--nw-sans) !important;
  font-size: .82rem !important;
  font-weight: 600 !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
  background: var(--nw-accent) !important;
  color: var(--nw-ink) !important;
  border: 0 !important;
  border-radius: 2px !important;
  padding: 17px 34px !important;
  transition: transform .35s var(--nw-ease), box-shadow .35s var(--nw-ease),
              background-color .3s var(--nw-ease) !important;
}
body.nw2 #customMenu .et_pb_button:hover {
  background: var(--nw-accent-dp) !important;
  transform: translateY(-2px);
  box-shadow: 0 10px 30px var(--nw-accent-gl), 0 0 44px var(--nw-accent-gl);
}
body.nw2 #customMenu .et_pb_button::after { display: none !important; }

/* close button */
body.nw2 .area-outer-wrap .da-close {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: rgba(255,255,255,.14) !important;
  backdrop-filter: blur(6px);
  color: #FFF !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  transition: background-color .25s ease, transform .25s ease;
}
body.nw2 .area-outer-wrap .da-close:hover {
  background: var(--nw-accent) !important;
  color: var(--nw-ink) !important;
  transform: rotate(90deg);
}

/* entrance */
body.nw2 .area-outer-wrap[data-da-type=popup] [data-da-area] {
  animation: nwPopIn .5s var(--nw-ease) both;
}
@keyframes nwPopIn {
  from { opacity: 0; transform: translateY(18px) scale(.985); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  body.nw2 .area-outer-wrap[data-da-type=popup] [data-da-area] { animation: none !important; }
}
@media (max-width: 560px) {
  body.nw2 #customMenu.et_pb_section { padding: 44px 22px 36px; }
}

/* ==========================================================================
   Menu pages
   One template drives all fourteen, so everything here is generic.
   ========================================================================== */
.nw-mband {
  position: relative; min-height: clamp(420px, 56vh, 620px);
  display: flex; align-items: flex-end;
  overflow: hidden; background: var(--nw-ink);
}
.nw-mband__media { position: absolute; inset: 0; z-index: 0; }
.nw-mband__media img {
  width: 100%; height: 100%; object-fit: cover; object-position: center 55%;
  animation: nwKen 26s var(--nw-ease) both;
}
.nw-mband__media::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(16,15,13,.74) 0%, rgba(16,15,13,.34) 40%,
                                      rgba(16,15,13,.62) 74%, rgba(16,15,13,.90) 100%);
}
.nw-mband__inner {
  position: relative; z-index: 2; width: 100%;
  padding-block: clamp(150px, 18vh, 200px) clamp(46px, 6vh, 74px);
}
.nw-mband__eyebrow {
  display: inline-block; font-family: var(--nw-sans);
  font-size: .72rem; font-weight: 600; letter-spacing: .26em;
  text-transform: uppercase; color: #E6E1D8; margin-bottom: 16px;
  text-shadow: 0 1px 12px rgba(0,0,0,.6);
}
body.nw2 .nw-mband h1 {
  color: var(--nw-white); margin: 0 0 14px;
  font-size: clamp(2.6rem, 6vw, 4.6rem);
  text-shadow: 0 2px 30px rgba(0,0,0,.55);
}
body.nw2 .nw-mband__tag {
  color: #EDE9E2; font-size: clamp(1.05rem, 1.6vw, 1.3rem);
  font-style: italic; font-family: var(--nw-serif);
  margin: 0 0 22px; max-width: 46ch;
  text-shadow: 0 1px 16px rgba(0,0,0,.6);
}
.nw-mband__price {
  display: inline-block;
  background: var(--nw-accent); color: var(--nw-ink);
  font-family: var(--nw-sans); font-size: .78rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  padding: 11px 20px; border-radius: 2px;
}

/* intro */
.nw-mintro {
  display: grid; grid-template-columns: 1.35fr 1fr;
  gap: clamp(30px, 5vw, 70px); align-items: start;
}
body.nw2 .nw-mintro .nw-lede { font-size: clamp(1.1rem, 1.7vw, 1.35rem); color: var(--nw-ink-soft); }
.nw-mincl {
  background: var(--nw-white); border-radius: 2px;
  padding: clamp(24px, 3vw, 34px);
  box-shadow: var(--nw-shadow-sm);
  border-top: 2px solid var(--nw-accent);
}
body.nw2 .nw-mincl p { font-size: .93rem; color: var(--nw-muted); margin: 0 0 12px; }
body.nw2 .nw-mincl__up { font-weight: 600; color: var(--nw-ink-soft) !important; }
body.nw2 .nw-mincl__fee { font-size: .8rem !important; font-style: italic; margin-bottom: 0 !important; }
@media (max-width: 900px) { .nw-mintro { grid-template-columns: 1fr; } }

/* the menu itself */
.nw-mcards {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: clamp(18px, 2.4vw, 28px); align-items: start;
}
.nw-mcard {
  background: var(--nw-white); border-radius: 2px;
  padding: clamp(26px, 3vw, 38px);
  box-shadow: var(--nw-shadow-sm);
}
body.nw2 .nw-mcard h2 {
  font-size: clamp(1.25rem, 1.9vw, 1.6rem);
  margin: 0 0 16px; padding-bottom: 14px;
  border-bottom: 1px solid var(--nw-stone);
}
.nw-mcard__list { list-style: none; margin: 0; padding: 0; }
.nw-mcard__list--two { columns: 2; column-gap: 26px; }
.nw-mcard__list li {
  position: relative; padding-left: 17px; margin-bottom: 9px;
  font-size: .95rem; color: var(--nw-ink-soft);
  break-inside: avoid;
}
.nw-mcard__list li::before {
  content: ""; position: absolute; left: 0; top: .62em;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--nw-accent);
}
body.nw2 .nw-mcard p { font-size: .95rem; color: var(--nw-muted); margin: 0 0 10px; }
body.nw2 .nw-mcard p:last-child { margin-bottom: 0; }
@media (max-width: 560px) { .nw-mcard__list--two { columns: 1; } }

/* ==========================================================================
   Venues page
   ========================================================================== */
.nw-vstats {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: var(--nw-stone);
  border: 1px solid var(--nw-stone);
  margin-bottom: clamp(34px, 4vw, 52px);
}
.nw-vstat { background: var(--nw-cream); padding: clamp(22px, 3vw, 34px) 16px; text-align: center; }
.nw-vstat__n {
  display: block; font-family: var(--nw-serif);
  font-size: clamp(1.9rem, 3.4vw, 2.9rem); color: var(--nw-accent-dp); line-height: 1;
}
.nw-vstat__l {
  font-size: .68rem; font-weight: 600; letter-spacing: .16em;
  text-transform: uppercase; color: var(--nw-muted);
}

/* search */
.nw-vsearch { max-width: 640px; margin: 0 auto clamp(30px, 4vw, 46px); text-align: center; }
.nw-vsearch__label {
  display: block; font-family: var(--nw-serif);
  font-size: clamp(1.5rem, 2.6vw, 2.1rem); color: var(--nw-ink); margin-bottom: 14px;
}
.nw-vsearch__field { position: relative; display: flex; align-items: center; }
.nw-vsearch__icon {
  position: absolute; left: 16px; width: 20px; height: 20px;
  color: var(--nw-muted); pointer-events: none;
}
body.nw2 .nw-vsearch input {
  width: 100%; font-family: var(--nw-sans); font-size: 1rem;
  padding: 16px 48px 16px 46px;
  background: var(--nw-white); color: var(--nw-ink);
  border: 1px solid var(--nw-stone); border-radius: 2px;
  transition: border-color .25s var(--nw-ease), box-shadow .25s var(--nw-ease);
  -webkit-appearance: none; appearance: none;
}
body.nw2 .nw-vsearch input:focus {
  outline: none; border-color: var(--nw-accent);
  box-shadow: 0 0 0 3px rgba(169,179,0,.18);
}
body.nw2 .nw-vsearch input::-webkit-search-cancel-button { display: none; }
.nw-vsearch__clear {
  position: absolute; right: 10px;
  width: 30px; height: 30px; line-height: 1;
  font-size: 1.5rem; color: var(--nw-muted);
  background: none; border: 0; cursor: pointer; border-radius: 50%;
  transition: color .2s ease, background-color .2s ease;
}
.nw-vsearch__clear:hover { color: var(--nw-ink); background: var(--nw-cream-deep); }
body.nw2 .nw-vsearch__hint {
  font-size: .82rem; color: var(--nw-muted); margin: 10px 0 0;
}
body.nw2 .nw-vsearch__count {
  font-size: .72rem; font-weight: 600; letter-spacing: .14em;
  text-transform: uppercase; color: var(--nw-accent-dp); margin: 12px 0 0;
  min-height: 1.2em;
}

/* grid */
.nw-vgrid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(258px, 1fr));
  gap: clamp(12px, 1.6vw, 18px);
}
.nw-vcard {
  background: var(--nw-white); border-radius: 2px;
  padding: 20px 22px;
  border-left: 2px solid var(--nw-stone);
  box-shadow: var(--nw-shadow-sm);
  transition: border-color .3s var(--nw-ease), transform .3s var(--nw-ease),
              box-shadow .3s var(--nw-ease);
}
.nw-vcard:hover {
  border-left-color: var(--nw-accent);
  transform: translateY(-3px);
  box-shadow: var(--nw-shadow);
}
body.nw2 .nw-vcard h3 {
  font-size: 1.08rem; margin: 0 0 6px; line-height: 1.24;
}
body.nw2 .nw-vcard p {
  font-size: .86rem; color: var(--nw-muted); margin: 0; line-height: 1.5;
}

/* empty state */
.nw-vempty {
  text-align: center; padding: clamp(38px, 5vw, 62px) 20px;
  background: var(--nw-white); border-radius: 2px;
  border-top: 2px solid var(--nw-accent);
  box-shadow: var(--nw-shadow-sm);
  margin-top: 18px;
}
body.nw2 .nw-vempty h3 { margin: 0 0 10px; }
body.nw2 .nw-vempty p {
  color: var(--nw-muted); max-width: 46ch; margin: 0 auto 22px;
}

@media (max-width: 620px) {
  .nw-vstats { grid-template-columns: 1fr; }
  .nw-vgrid { grid-template-columns: 1fr; }
}

/* Venue names on the home page are plain text now, not outbound links, so
   they should not invite a click. */
body.nw2 span.nw-venue { cursor: default; }
body.nw2 span.nw-venue:hover { background: var(--nw-ink); color: #C7C2BA !important; }

/* Cormorant defaults to oldstyle figures, which makes venue names like
   "1899 Venue" and "300 Spring" read as lowercase digits. Force lining
   figures anywhere a name leads with a number. */
body.nw2 .nw-vcard h3,
body.nw2 .nw-vstat__n,
body.nw2 .nw-stat__num,
body.nw2 .nw-rating__num,
body.nw2 .nw-foot__phone,
body.nw2 .nw-cta__phone { font-variant-numeric: lining-nums; }

/* Menu body photography */
.nw-mshots { display: grid; gap: clamp(12px, 1.6vw, 20px); }
.nw-mshots--3 { grid-template-columns: repeat(3, 1fr); }
.nw-mshots--2 { grid-template-columns: repeat(2, 1fr); }
.nw-mshot {
  margin: 0; overflow: hidden; border-radius: 2px;
  background: var(--nw-stone); box-shadow: var(--nw-shadow-sm);
  aspect-ratio: 4 / 3;
}
.nw-mshot img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .9s var(--nw-ease);
}
.nw-mshot:hover img { transform: scale(1.05); }
/* first shot leads on wide screens */
@media (min-width: 981px) {
  .nw-mshots--3 .nw-mshot:first-child { grid-row: span 2; aspect-ratio: 4 / 5; }
  .nw-mshots--3 { grid-template-columns: 1.3fr 1fr 1fr; }
}
@media (max-width: 700px) {
  .nw-mshots--3, .nw-mshots--2 { grid-template-columns: 1fr 1fr; }
  .nw-mshots--3 .nw-mshot:first-child { grid-column: 1 / -1; aspect-ratio: 16 / 10; }
}

/* ==========================================================================
   Menu layout corrections
   ========================================================================== */

/* Menu groups vary from two to five per menu, so a fixed grid left a ragged
   last row. CSS columns pack them tightly whatever the count. */
.nw-mcards {
  display: block;
  columns: 3;
  column-gap: clamp(18px, 2.4vw, 28px);
}
.nw-mcard {
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  margin-bottom: clamp(18px, 2.4vw, 28px);
  display: inline-block;
  width: 100%;
}
@media (max-width: 1000px) { .nw-mcards { columns: 2; } }
@media (max-width: 640px)  { .nw-mcards { columns: 1; } }

/* Three shots: a tall lead beside two stacked, so no empty cells. */
@media (min-width: 981px) {
  .nw-mshots--3 {
    grid-template-columns: 1.25fr 1fr;
    grid-template-rows: 1fr 1fr;
  }
  .nw-mshots--3 .nw-mshot:first-child {
    grid-row: 1 / span 2;
    aspect-ratio: auto;
    height: 100%;
  }
  .nw-mshots--3 .nw-mshot:not(:first-child) { aspect-ratio: 16 / 10; }
}

/* Menus carry two to five groups. Three columns left the last one empty on
   the common four-group menus, so two balanced columns it is; it also gives
   the dish lists a more readable measure. */
.nw-mcards {
  columns: 2;
  max-width: 980px;
  margin-inline: auto;
}
@media (max-width: 720px) { .nw-mcards { columns: 1; } }

/* ==========================================================================
   Fixes round 3
   ========================================================================== */

/* Filtered-out venue cards must actually disappear. Grid items pick up a
   computed display that can beat the UA [hidden] rule, so state it plainly. */
body.nw2 .nw-vcard[hidden],
body.nw2 .nw-vcard.is-hidden,
body.nw2 .nw-vempty[hidden],
body.nw2 .nw-vempty.is-hidden { display: none !important; }
body.nw2 .nw-vsearch__clear[hidden] { display: none !important; }

/* Divi styles list items inside text and code modules with their own marker,
   which doubled up with our chartreuse dot. */
body.nw2 .nw-mcard ul,
body.nw2 .nw-mcard__list,
body.nw2 .nw-mcard ol {
  list-style: none !important;
  list-style-type: none !important;
  list-style-image: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}
body.nw2 .nw-mcard__list li {
  list-style: none !important;
  list-style-type: none !important;
  background-image: none !important;
}
body.nw2 .nw-mcard__list li::marker { content: none; font-size: 0; }

/* Menu price now doubles as a call to action. */
a.nw-mband__price {
  text-decoration: none;
  transition: transform .3s var(--nw-ease), box-shadow .35s var(--nw-ease),
              background-color .3s var(--nw-ease);
}
a.nw-mband__price:hover {
  background: var(--nw-accent-dp);
  transform: translateY(-2px);
  box-shadow: 0 10px 26px var(--nw-accent-gl), 0 0 36px var(--nw-accent-gl);
}
.nw-mband__actions {
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
  margin-top: 6px;
}
@media (max-width: 620px) {
  .nw-mband__actions { flex-direction: column; align-items: stretch; }
  .nw-mband__actions .nw-btn, a.nw-mband__price { width: 100%; text-align: center; justify-content: center; }
}

/* mid-page quote prompt on menu pages */
.nw-mnudge {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 18px;
  background: var(--nw-white);
  border-left: 3px solid var(--nw-accent);
  border-radius: 2px;
  padding: clamp(22px, 3vw, 32px) clamp(24px, 3.4vw, 40px);
  box-shadow: var(--nw-shadow-sm);
  max-width: 980px; margin: clamp(28px, 3.6vw, 44px) auto 0;
}
body.nw2 .nw-mnudge p {
  margin: 0; font-family: var(--nw-serif);
  font-size: clamp(1.15rem, 1.8vw, 1.5rem); color: var(--nw-ink);
  max-width: 34ch;
}
@media (max-width: 620px) {
  .nw-mnudge { flex-direction: column; align-items: flex-start; }
  .nw-mnudge .nw-btn { width: 100%; }
}

/* Menus index: text tiles for the add ons that have no card art */
.nw-mtiles {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: clamp(14px, 2vw, 22px);
}
.nw-mtile {
  display: flex; flex-direction: column;
  background: var(--nw-white); border-radius: 2px;
  padding: clamp(24px, 3vw, 32px);
  border-top: 2px solid var(--nw-stone);
  box-shadow: var(--nw-shadow-sm); text-decoration: none;
  transition: transform .4s var(--nw-ease), box-shadow .4s var(--nw-ease),
              border-color .4s var(--nw-ease);
}
.nw-mtile:hover {
  transform: translateY(-5px);
  border-top-color: var(--nw-accent);
  box-shadow: var(--nw-shadow);
}
body.nw2 .nw-mtile h3 { margin: 0 0 8px; font-size: 1.3rem; transition: color .3s var(--nw-ease); }
.nw-mtile:hover h3 { color: var(--nw-accent-dp); }
body.nw2 .nw-mtile p { color: var(--nw-muted); font-size: .92rem; margin: 0 0 16px; flex: 1; }

/* Quote form: confirmation that a menu was carried over from a menu page */
.nw-prefill {
  display: flex; align-items: flex-start; gap: 14px;
  background: var(--nw-white);
  border-left: 3px solid var(--nw-accent);
  border-radius: 2px;
  padding: 18px 22px;
  margin: 0 0 26px;
  box-shadow: var(--nw-shadow-sm);
}
.nw-prefill__tick {
  flex: none; width: 26px; height: 26px; border-radius: 50%;
  background: var(--nw-accent); color: var(--nw-ink);
  display: flex; align-items: center; justify-content: center;
  font-size: .82rem; font-weight: 700;
}
body.nw2 .nw-prefill p {
  margin: 0; font-size: .95rem; color: var(--nw-ink-soft); line-height: 1.5;
}
body.nw2 .nw-prefill strong { color: var(--nw-ink); }

/* ==========================================================================
   Submenu carets
   currentColor resolved against the <li>, which Divi colours darkly, so the
   chevrons were nearly invisible over the hero. Set them explicitly for each
   header state instead, with a shadow so they hold up over photography.
   ========================================================================== */
body.nw2 #top-menu > li.menu-item-has-children::after {
  border-right-color: #FFFFFF;
  border-bottom-color: #FFFFFF;
  border-right-width: 2px;
  border-bottom-width: 2px;
  width: 8px; height: 8px;
  opacity: .95;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .55));
}
body.nw2 #top-menu > li.menu-item-has-children:hover::after {
  border-right-color: var(--nw-accent);
  border-bottom-color: var(--nw-accent);
  opacity: 1;
}
/* scrolled bar is dark, so the same white reads correctly there too */
body.nw2.nw-scrolled #top-menu > li.menu-item-has-children::after {
  border-right-color: #F2EFEA;
  border-bottom-color: #F2EFEA;
  filter: none;
}
body.nw2.nw-scrolled #top-menu > li.menu-item-has-children:hover::after {
  border-right-color: var(--nw-accent);
  border-bottom-color: var(--nw-accent);
}
/* submenu items that themselves have children */
body.nw2 #top-menu ul li.menu-item-has-children > a::after {
  border-right-color: #EFECE6;
  border-bottom-color: #EFECE6;
}

/* ==========================================================================
   Remaining page components
   ========================================================================== */

/* price chip inside a card heading (china tiers, rentals) */
.nw-tierprice {
  display: inline-block; margin-left: 8px;
  font-family: var(--nw-sans); font-size: .74rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--nw-accent-dp); vertical-align: middle;
}

/* gallery wall */
.nw-gwall {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: clamp(10px, 1.4vw, 16px);
}
.nw-gtile {
  margin: 0; overflow: hidden; border-radius: 2px;
  background: var(--nw-stone); aspect-ratio: 4 / 5;
  box-shadow: var(--nw-shadow-sm);
}
.nw-gtile img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .9s var(--nw-ease), filter .5s var(--nw-ease);
}
.nw-gtile:hover img { transform: scale(1.06); filter: brightness(1.05); }
.nw-gtile:nth-child(6n+1) { grid-column: span 2; grid-row: span 2; aspect-ratio: 1 / 1; }
@media (max-width: 900px) {
  .nw-gwall { grid-template-columns: repeat(3, 1fr); }
  .nw-gtile:nth-child(6n+1) { grid-column: span 2; grid-row: span 2; }
}
@media (max-width: 620px) {
  .nw-gwall { grid-template-columns: repeat(2, 1fr); }
  .nw-gtile:nth-child(6n+1) { grid-column: span 2; grid-row: auto; aspect-ratio: 16 / 10; }
}

/* numbered steps on the quote and tasting pages */
.nw-qpoints {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 2.4vw, 30px);
}
.nw-qpoint {
  display: flex; gap: 14px; align-items: flex-start;
  background: var(--nw-white); border-radius: 2px;
  padding: clamp(20px, 2.6vw, 28px);
  box-shadow: var(--nw-shadow-sm);
  border-top: 2px solid var(--nw-accent);
}
.nw-qpoint span {
  flex: none; width: 30px; height: 30px; border-radius: 50%;
  background: var(--nw-accent); color: var(--nw-ink);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--nw-serif); font-size: 1rem; font-weight: 600;
}
body.nw2 .nw-qpoint p { margin: 0; font-size: .95rem; color: var(--nw-ink-soft); }
@media (max-width: 760px) { .nw-qpoints { grid-template-columns: 1fr; } }

/* team grid */
.nw-people {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(196px, 1fr));
  gap: 1px; background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.13);
}
.nw-person { background: var(--nw-ink); padding: 22px 20px; }
body.nw2 .nw-person h3 {
  font-size: 1.15rem; color: var(--nw-white); margin: 0 0 4px;
}
body.nw2 .nw-person p {
  margin: 0; font-family: var(--nw-sans); font-size: .72rem;
  font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  color: var(--nw-accent);
}

/* form pages get the section padding without doubling it */
.nw-formwrap { padding-top: clamp(38px, 4.5vw, 60px); }

/* ==========================================================================
   Gravity Forms, round 2
   GF 2.5+ ships its own theme layer whose button and progress styles beat a
   plain class selector, hence the extra specificity here. Styling only: no
   form, field or id is altered.
   ========================================================================== */
body.nw2 .gform_wrapper .gform_button,
body.nw2 .gform_wrapper .gform_next_button,
body.nw2 .gform_wrapper .gform_previous_button,
body.nw2 .gform_wrapper input[type=submit],
body.nw2 .gform_wrapper .gform-theme-button,
body.nw2 .gform_wrapper button.gform-theme-button {
  font-family: var(--nw-sans) !important;
  font-size: .8rem !important;
  font-weight: 600 !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
  background: var(--nw-accent) !important;
  background-image: none !important;
  color: var(--nw-ink) !important;
  border: 0 !important;
  border-radius: 2px !important;
  padding: 16px 34px !important;
  min-height: 0 !important;
  cursor: pointer;
  box-shadow: none !important;
  transition: background-color .3s var(--nw-ease), transform .3s var(--nw-ease),
              box-shadow .35s var(--nw-ease) !important;
}
body.nw2 .gform_wrapper .gform_button:hover,
body.nw2 .gform_wrapper .gform_next_button:hover,
body.nw2 .gform_wrapper input[type=submit]:hover,
body.nw2 .gform_wrapper button.gform-theme-button:hover {
  background: var(--nw-accent-dp) !important;
  transform: translateY(-2px);
  box-shadow: 0 10px 28px var(--nw-accent-gl), 0 0 36px var(--nw-accent-gl) !important;
}
/* the back button reads as secondary */
body.nw2 .gform_wrapper .gform_previous_button,
body.nw2 .gform_wrapper .gform-theme-button--secondary {
  background: transparent !important;
  color: var(--nw-ink) !important;
  border: 1.5px solid var(--nw-stone) !important;
}
body.nw2 .gform_wrapper .gform_previous_button:hover,
body.nw2 .gform_wrapper .gform-theme-button--secondary:hover {
  border-color: var(--nw-ink) !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* progress bar */
body.nw2 .gform_wrapper .gf_progressbar_wrapper .gf_progressbar_title,
body.nw2 .gform_wrapper .gf_progressbar_title {
  font-family: var(--nw-sans) !important;
  font-size: .7rem !important;
  font-weight: 600 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
  color: var(--nw-muted) !important;
}
body.nw2 .gform_wrapper .gf_progressbar {
  background: var(--nw-stone) !important;
  border-radius: 999px !important;
  height: 5px !important;
  box-shadow: none !important;
  overflow: hidden;
}
body.nw2 .gform_wrapper .gf_progressbar_percentage,
body.nw2 .gform_wrapper .gf_progressbar_percentage.percentbar_blue {
  background: var(--nw-accent) !important;
  background-image: none !important;
  border-radius: 999px !important;
  height: 5px !important;
  transition: width .5s var(--nw-ease);
}
body.nw2 .gform_wrapper .gf_progressbar_percentage span { display: none !important; }

/* headings and required markers inside the form */
body.nw2 .gform_wrapper h2.gform_title,
body.nw2 .gform_wrapper h3.gform_title {
  font-family: var(--nw-serif) !important;
  font-size: clamp(1.5rem, 2.4vw, 2rem) !important;
  color: var(--nw-ink) !important;
  font-weight: 500 !important;
}
body.nw2 .gform_wrapper .gfield_required { color: var(--nw-accent-dp) !important; }
body.nw2 .gform_wrapper .gfield_description { color: var(--nw-muted) !important; font-size: .84rem !important; }
body.nw2 .gform_wrapper .gform_page_footer { border-top: 0 !important; padding-top: 18px !important; }

/* ==========================================================================
   Team, with photographs
   ========================================================================== */
.nw-people {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: clamp(14px, 2vw, 22px);
  background: none; border: 0;
}
.nw-person {
  margin: 0; background: #201F1B; border-radius: 2px; overflow: hidden;
  border-bottom: 2px solid transparent;
  transition: transform .4s var(--nw-ease), border-color .4s var(--nw-ease);
}
.nw-person:hover { transform: translateY(-5px); border-bottom-color: var(--nw-accent); }
.nw-person__shot {
  aspect-ratio: 3 / 4; overflow: hidden;
  background: linear-gradient(180deg, #2B2A25 0%, #201F1B 100%);
  display: flex; align-items: flex-end; justify-content: center;
}
.nw-person__shot img {
  width: 100%; height: 100%; object-fit: contain; object-position: bottom;
  display: block; transition: transform .6s var(--nw-ease);
}
.nw-person:hover .nw-person__shot img { transform: scale(1.04); }
.nw-person figcaption { padding: 16px 18px 20px; }
body.nw2 .nw-person h3 { font-size: 1.2rem; color: var(--nw-white); margin: 0 0 4px; }
body.nw2 .nw-person p {
  margin: 0; font-family: var(--nw-sans); font-size: .68rem; font-weight: 600;
  letter-spacing: .13em; text-transform: uppercase; color: var(--nw-accent);
}

/* ==========================================================================
   Nav carets: smaller, on sub-submenus too, and flipping on hover
   ========================================================================== */
body.nw2 #top-menu > li.menu-item-has-children::after {
  width: 6px; height: 6px;
  border-right-width: 1.5px; border-bottom-width: 1.5px;
  top: 3px; right: 14px;
  transform-origin: center;
  transform: rotate(45deg);
  transition: transform .32s var(--nw-ease), border-color .25s var(--nw-ease), opacity .25s var(--nw-ease);
}
/* flip to point up while the dropdown is open */
body.nw2 #top-menu > li.menu-item-has-children:hover::after,
body.nw2 #top-menu > li.menu-item-has-children:focus-within::after {
  transform: rotate(-135deg) translate(-1px, -1px);
}

/* submenu items that themselves have children get their own caret,
   pointing right, rotating down on hover */
body.nw2 #top-menu li ul li.menu-item-has-children { position: relative; }
body.nw2 #top-menu li ul li.menu-item-has-children > a { padding-right: 30px !important; }
body.nw2 #top-menu li ul li.menu-item-has-children > a::after {
  content: "" !important;
  position: absolute; right: 16px; top: 50%;
  width: 6px; height: 6px;
  border: 0;
  border-right: 1.5px solid #EFECE6;
  border-bottom: 1.5px solid #EFECE6;
  transform: translateY(-50%) rotate(-45deg);
  transform-origin: center;
  opacity: .8;
  font-size: 0; background: none;
  transition: transform .32s var(--nw-ease), border-color .25s var(--nw-ease), opacity .25s var(--nw-ease);
}
body.nw2 #top-menu li ul li.menu-item-has-children:hover > a::after {
  transform: translateY(-50%) rotate(45deg);
  border-right-color: var(--nw-accent);
  border-bottom-color: var(--nw-accent);
  opacity: 1;
}

/* ==========================================================================
   Gravity Forms, round 3
   ========================================================================== */

/* Focus rings were being clipped by the form's own overflow. Padding on
   .gform_body pushed the page footer buttons out of line, so instead the
   breathing room goes on the field wrappers and the clipping is removed. */
body.nw2 .gform_wrapper,
body.nw2 .gform_wrapper .gform_body,
body.nw2 .gform_wrapper .gform_page,
body.nw2 .gform_wrapper .gform_fields { overflow: visible !important; }
body.nw2 .gform_wrapper .gform_fields { row-gap: 22px !important; }
body.nw2 .gform_wrapper .gfield { padding-inline: 2px; }
body.nw2 .gform_wrapper .gform_page_footer {
  margin-top: 26px !important;
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
}

/* Selects were padded like a text input, which left the value sitting high
   and left. Match the height and centre the value properly. */
body.nw2 .gform_wrapper select,
body.nw2 .gform_wrapper .ginput_container select {
  padding: 0 44px 0 15px !important;
  height: 52px !important;
  line-height: 52px !important;
  background-color: var(--nw-white) !important;
  border: 1px solid var(--nw-stone) !important;
  border-radius: 2px !important;
  color: var(--nw-ink) !important;
  font-family: var(--nw-sans) !important;
  font-size: 1rem !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%236B6560' stroke-linecap='round' stroke-width='2' d='M3 6l5 5 5-5'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat !important;
  background-position: right 16px center !important;
  background-size: 14px 14px !important;
  text-overflow: ellipsis;
}
body.nw2 .gform_wrapper select:focus {
  border-color: var(--nw-accent) !important;
  box-shadow: 0 0 0 3px rgba(169,179,0,.18) !important;
  outline: none !important;
}
/* match text inputs to the same height so rows line up */
body.nw2 .gform_wrapper input[type=text],
body.nw2 .gform_wrapper input[type=email],
body.nw2 .gform_wrapper input[type=tel],
body.nw2 .gform_wrapper input[type=number],
body.nw2 .gform_wrapper input[type=url],
body.nw2 .gform_wrapper input[type=date] {
  height: 52px !important;
  padding: 0 15px !important;
  border-radius: 2px !important;
}
body.nw2 .gform_wrapper textarea { padding: 14px 15px !important; border-radius: 2px !important; }

/* ---- date picker ---- */
body.nw2 .gform_wrapper .ginput_container_date { position: relative; }
body.nw2 .gform_wrapper .ginput_container_date input { padding-right: 44px !important; }
body.nw2 .gform_wrapper .gform-theme-datepicker,
body.nw2 .gform_wrapper img.ui-datepicker-trigger { display: none !important; }

body.nw2 #ui-datepicker-div,
#ui-datepicker-div {
  font-family: var(--nw-sans) !important;
  background: var(--nw-white) !important;
  border: 1px solid var(--nw-stone) !important;
  border-top: 3px solid var(--nw-accent) !important;
  border-radius: 3px !important;
  box-shadow: 0 24px 60px rgba(28,27,24,.22) !important;
  padding: 12px !important;
  width: auto !important;
  min-width: 300px;
  z-index: 100000 !important;
}
#ui-datepicker-div .ui-datepicker-header {
  background: none !important; border: 0 !important;
  padding: 4px 0 10px !important;
}
#ui-datepicker-div .ui-datepicker-title {
  display: flex; gap: 8px; justify-content: center; align-items: center;
}
#ui-datepicker-div .ui-datepicker-title select {
  height: 38px !important; line-height: 38px !important;
  padding: 0 30px 0 10px !important;
  font-size: .9rem !important;
  background-position: right 10px center !important;
  border: 1px solid var(--nw-stone) !important;
  border-radius: 2px !important;
  color: var(--nw-ink) !important;
}
#ui-datepicker-div .ui-datepicker-prev,
#ui-datepicker-div .ui-datepicker-next {
  top: 6px !important; width: 32px !important; height: 32px !important;
  background: var(--nw-cream) !important; border: 1px solid var(--nw-stone) !important;
  border-radius: 2px !important; cursor: pointer !important;
}
#ui-datepicker-div .ui-datepicker-prev { left: 4px !important; }
#ui-datepicker-div .ui-datepicker-next { right: 4px !important; }
#ui-datepicker-div .ui-datepicker-prev span,
#ui-datepicker-div .ui-datepicker-next span {
  background-image: none !important; text-indent: 0 !important;
  margin: 0 !important; top: 0 !important; left: 0 !important;
  width: 100% !important; height: 100% !important;
  display: flex !important; align-items: center; justify-content: center;
  font-size: 0;
}
#ui-datepicker-div .ui-datepicker-prev span::before { content: "\2039"; font-size: 20px; color: var(--nw-ink); }
#ui-datepicker-div .ui-datepicker-next span::before { content: "\203A"; font-size: 20px; color: var(--nw-ink); }
#ui-datepicker-div table { margin: 0 !important; font-size: .9rem !important; }
#ui-datepicker-div th {
  font-size: .64rem !important; font-weight: 700 !important;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--nw-muted) !important; padding: 8px 0 !important; border: 0 !important;
}
#ui-datepicker-div td { padding: 2px !important; border: 0 !important; }
#ui-datepicker-div td a, #ui-datepicker-div td span {
  display: flex !important; align-items: center; justify-content: center;
  width: 38px !important; height: 38px !important;
  padding: 0 !important; margin: 0 auto !important;
  border: 0 !important; border-radius: 2px !important;
  background: var(--nw-cream) !important;
  color: var(--nw-ink) !important;
  text-align: center !important;
  transition: background-color .2s ease, color .2s ease;
}
#ui-datepicker-div td a:hover {
  background: var(--nw-accent) !important; color: var(--nw-ink) !important;
}
#ui-datepicker-div td .ui-state-active,
#ui-datepicker-div td a.ui-state-active {
  background: var(--nw-ink) !important; color: var(--nw-white) !important;
}
#ui-datepicker-div td.ui-datepicker-today a {
  box-shadow: inset 0 0 0 1.5px var(--nw-accent) !important;
}
#ui-datepicker-div td.ui-state-disabled span {
  background: transparent !important; color: #C4BFB7 !important;
}

@media (max-width: 620px) {
  #ui-datepicker-div { min-width: 0; width: calc(100vw - 28px) !important; max-width: 340px; }
  #ui-datepicker-div td a, #ui-datepicker-div td span { width: 100% !important; height: 42px !important; }
  body.nw2 .gform_wrapper .gform_page_footer .gform_next_button,
  body.nw2 .gform_wrapper .gform_page_footer .gform_previous_button,
  body.nw2 .gform_wrapper .gform_page_footer .gform_button { width: 100%; }
}

/* Datepicker header: centre the month and year, pin the arrows to the edges. */
#ui-datepicker-div .ui-datepicker-header {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  margin-bottom: 4px !important;
}
#ui-datepicker-div .ui-datepicker-title {
  margin: 0 44px !important;
  line-height: 1 !important;
}
#ui-datepicker-div .ui-datepicker-prev,
#ui-datepicker-div .ui-datepicker-next {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
#ui-datepicker-div .ui-datepicker-prev { left: 2px !important; right: auto !important; }
#ui-datepicker-div .ui-datepicker-next { right: 2px !important; left: auto !important; }
#ui-datepicker-div .ui-datepicker-prev:hover,
#ui-datepicker-div .ui-datepicker-next:hover {
  background: var(--nw-accent) !important; border-color: var(--nw-accent) !important;
}
#ui-datepicker-div .ui-datepicker-calendar { width: 100% !important; table-layout: fixed; }
#ui-datepicker-div td a, #ui-datepicker-div td span {
  text-decoration: none !important; font-size: .88rem !important;
}

/* ==========================================================================
   Fixes round 4
   ========================================================================== */

/* Headshots sit on the card with no plate behind them, so they read as
   cut-outs floating on the card rather than photos on a grey panel. */
.nw-person__shot {
  background: none !important;
  aspect-ratio: 4 / 5;
  padding: 10px 10px 0;
  align-items: flex-end;
}
.nw-person__shot img {
  object-fit: contain !important;
  object-position: bottom center !important;
  width: 100%; height: 100%;
}

/* Submenu links: give the text a consistent box so it sits centred. */
body.nw2 #top-menu li ul li a {
  padding: 12px 20px !important;
  line-height: 1.35 !important;
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  min-height: 44px;
  font-size: .78rem !important;
  letter-spacing: .05em;
}
body.nw2 #top-menu li ul { padding: 8px 0 !important; width: 250px !important; }
body.nw2 #top-menu li ul li { padding: 0 !important; }
body.nw2 #top-menu li ul li.menu-item-has-children > a { padding-right: 34px !important; }

/* ---- phone field: intl-tel-input injects a flag selector over the input,
   and our blanket padding rule was covering it. Give the value room. ---- */
body.nw2 .gform_wrapper .iti { width: 100%; display: block; }
body.nw2 .gform_wrapper .iti input[type=tel],
body.nw2 .gform_wrapper .iti input.large {
  padding-left: 62px !important;
  padding-right: 15px !important;
}
body.nw2 .gform_wrapper .iti__selected-country,
body.nw2 .gform_wrapper .iti__country-container {
  height: 52px !important;
  display: flex !important;
  align-items: center !important;
  padding-left: 12px !important;
}
body.nw2 .gform_wrapper .iti__country-list,
body.nw2 .gform_wrapper .iti__dropdown-content {
  border: 1px solid var(--nw-stone) !important;
  border-top: 2px solid var(--nw-accent) !important;
  border-radius: 2px !important;
  box-shadow: 0 18px 46px rgba(28,27,24,.2) !important;
  font-family: var(--nw-sans) !important;
}

/* ---- Gravity Forms date picker (its own component, not jQuery UI) ---- */
/* the toggle is an icon, not a full chartreuse block */
body.nw2 .gform_wrapper .gform-datepicker-toggle,
body.nw2 .gform_wrapper button.gform-datepicker-toggle {
  background: transparent !important;
  color: var(--nw-muted) !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 12px !important;
  min-height: 0 !important;
  height: 50px !important;
  width: 46px !important;
  border-radius: 0 2px 2px 0 !important;
  transform: none !important;
  transition: color .2s ease, background-color .2s ease !important;
}
body.nw2 .gform_wrapper .gform-datepicker-toggle:hover {
  background: var(--nw-cream) !important;
  color: var(--nw-ink) !important;
  transform: none !important;
  box-shadow: none !important;
}
body.nw2 .gform_wrapper .gform-datepicker-toggle-icon { font-size: 20px !important; }

body.nw2 .gform-datepicker-calendar,
.gform-datepicker-calendar {
  font-family: var(--nw-sans) !important;
  background: var(--nw-white) !important;
  border: 1px solid var(--nw-stone) !important;
  border-top: 3px solid var(--nw-accent) !important;
  border-radius: 3px !important;
  box-shadow: 0 26px 64px rgba(28,27,24,.24) !important;
  padding: 14px !important;
  z-index: 100000 !important;
}
body.nw2 .gform-datepicker-calendar,
.gform-datepicker-calendar {
  font-family: var(--nw-sans) !important;
  background: var(--nw-white) !important;
  border: 1px solid var(--nw-stone) !important;
  border-top: 3px solid var(--nw-accent) !important;
  border-radius: 3px !important;
  box-shadow: 0 26px 64px rgba(28,27,24,.24) !important;
  color: var(--nw-ink) !important;
  z-index: 100000 !important;
}
/* only colour the interactive bits, never their box model */
.gform-datepicker-calendar .day:hover,
.gform-datepicker-calendar td button:hover {
  background-color: var(--nw-accent) !important;
  color: var(--nw-ink) !important;
}
.gform-datepicker-calendar .day.selected,
.gform-datepicker-calendar .selected {
  background-color: var(--nw-ink) !important;
  color: var(--nw-white) !important;
}
.gform-datepicker-calendar .day.current,
.gform-datepicker-calendar .current {
  box-shadow: inset 0 0 0 1.5px var(--nw-accent) !important;
}

/* the toggle button sits inside the field, subtle, never a chartreuse slab */
body.nw2 .gform_wrapper .gform-datepicker-toggle,
body.nw2 .gform_wrapper button.gform-datepicker-toggle {
  background: transparent !important;
  background-image: none !important;
  color: var(--nw-muted) !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}
body.nw2 .gform_wrapper .gform-datepicker-toggle:hover {
  background: transparent !important;
  color: var(--nw-ink) !important;
  transform: none !important;
  box-shadow: none !important;
}

/* ==========================================================================
   Datepicker: colour only
   Gravity Forms 3.1 lays this component out itself. An earlier pass forced
   widths, heights and flex onto it and broke that layout, so nothing here
   touches the box model.
   ========================================================================== */
body.nw2 .gform-datepicker-calendar,
.gform-datepicker-calendar {
  font-family: var(--nw-sans) !important;
  background-color: var(--nw-white) !important;
  border-color: var(--nw-stone) !important;
  border-top: 3px solid var(--nw-accent) !important;
  box-shadow: 0 26px 64px rgba(28, 27, 24, .24) !important;
  color: var(--nw-ink) !important;
  z-index: 100000 !important;
}
.gform-datepicker-calendar .day:hover,
.gform-datepicker-calendar td button:hover {
  background-color: var(--nw-accent) !important;
  color: var(--nw-ink) !important;
}
.gform-datepicker-calendar .day.selected,
.gform-datepicker-calendar .selected {
  background-color: var(--nw-ink) !important;
  color: var(--nw-white) !important;
}
.gform-datepicker-calendar .day.current,
.gform-datepicker-calendar .current {
  box-shadow: inset 0 0 0 1.5px var(--nw-accent) !important;
}

/* ==========================================================================
   Fixes round 5 (restored)
   ========================================================================== */

/* Submenu items were flowing inline, so a tall item pushed the next one into
   a second column and the hover background only covered the text. Force each
   row to be its own full-width block. */
body.nw2 #top-menu li ul { width: 260px !important; }
body.nw2 #top-menu li ul li {
  display: block !important;
  float: none !important;
  width: 100% !important;
  clear: both !important;
  margin: 0 !important;
  position: relative !important;
}
body.nw2 #top-menu li ul li a {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 13px 20px !important;
  min-height: 0 !important;
  line-height: 1.35 !important;
}
body.nw2 #top-menu li ul li.menu-item-has-children > a { padding-right: 36px !important; }

/* Third level opens flush against its parent so the pointer never crosses a
   gap on the way to it. */
body.nw2 #top-menu li ul li ul {
  left: 100% !important;
  top: 0 !important;
  margin-left: 0 !important;
}

/* Headings: stop a single word dropping onto its own line. */
body.nw2 h1, body.nw2 h2, body.nw2 h3,
body.nw2 .nw-hero h1, body.nw2 .nw-mband h1 { text-wrap: balance; }
body.nw2 .nw-lede, body.nw2 .nw-hero__sub, body.nw2 .nw-mband__tag { text-wrap: pretty; }

/* ==========================================================================
   Fixes round 6
   ========================================================================== */

/* --- China packages (restored: an earlier edit removed this block) --- */
.nw-chinas {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: clamp(14px, 2vw, 24px);
}
.nw-china {
  background: var(--nw-white); border-radius: 2px; overflow: hidden;
  box-shadow: var(--nw-shadow-sm); border-top: 2px solid var(--nw-accent);
  display: flex; flex-direction: column;
  transition: transform .4s var(--nw-ease), box-shadow .4s var(--nw-ease);
}
.nw-china:hover { transform: translateY(-5px); box-shadow: var(--nw-shadow); }
.nw-china__shot {
  aspect-ratio: 1 / 1;
  background: var(--nw-cream);
  padding: 16px;
  display: flex; align-items: center; justify-content: center;
}
.nw-china__shot img {
  width: 100%; height: 100%; object-fit: contain; display: block;
}
.nw-china__body { padding: 18px 22px 24px; }
body.nw2 .nw-china__body h3 { margin: 0 0 8px; font-size: 1.15rem; }
body.nw2 .nw-china__body p { margin: 0; font-size: .88rem; color: var(--nw-muted); line-height: 1.55; }
@media (max-width: 560px) { .nw-chinas { grid-template-columns: 1fr 1fr; } }

/* --- Team: three across rather than four, so nine people sit 3/3/3 --- */
.nw-people { grid-template-columns: repeat(3, 1fr) !important; }
@media (max-width: 900px) { .nw-people { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 560px) { .nw-people { grid-template-columns: 1fr !important; } }

/* --- Top level caret: centre it on the label --- */
body.nw2 #top-menu > li.menu-item-has-children::after {
  top: 50% !important;
  margin-top: -12px !important;
}

/* --- Date picker must not be clipped by its Divi wrappers --- */
body.nw2 .et_pb_section,
body.nw2 .et_pb_row,
body.nw2 .et_pb_column,
body.nw2 .et_pb_module,
body.nw2 .et_pb_code_inner,
body.nw2 .nw-formwrap,
body.nw2 .nw-formwrap .nw-wrap,
body.nw2 .gform_wrapper .gfield,
body.nw2 .gform_wrapper .ginput_container_date { overflow: visible !important; }

/* --- Phone: more clearance between the flag and the number --- */
body.nw2 .gform_wrapper .iti input[type=tel],
body.nw2 .gform_wrapper .iti input.large { padding-left: 76px !important; }
body.nw2 .gform_wrapper .iti__selected-country { padding-left: 14px !important; padding-right: 10px !important; }

/* --- Gravity Forms buttons: replace the browser's blue focus ring --- */
body.nw2 .gform_wrapper button:focus,
body.nw2 .gform_wrapper button:focus-visible,
body.nw2 .gform_wrapper input[type=submit]:focus,
body.nw2 .gform_wrapper input[type=submit]:focus-visible,
body.nw2 .gform_wrapper .gform_button:focus,
body.nw2 .gform_wrapper .gform_next_button:focus,
body.nw2 .gform_wrapper .gform_previous_button:focus,
body.nw2 .gform_wrapper .gform-theme-button:focus,
body.nw2 .gform_wrapper .gform-theme-button:focus-visible {
  outline: none !important;
  border-color: transparent !important;
  box-shadow: 0 0 0 3px rgba(169, 179, 0, .35) !important;
}
body.nw2 .gform_wrapper .gform_previous_button:focus,
body.nw2 .gform_wrapper .gform-theme-button--secondary:focus {
  border-color: var(--nw-ink) !important;
}
/* and the same for the date toggle, which was picking up a blue ring too */
body.nw2 .gform_wrapper .gform-datepicker-toggle:focus,
body.nw2 .gform_wrapper .gform-datepicker-toggle:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(169, 179, 0, .35) !important;
}

/* ==========================================================================
   Legacy pages (privacy policy, thank you, client questionnaires)
   These keep their original Divi content, which was built for a dark hero
   treatment. Under the v2 palette that left dark text on a dark ground and
   content running off the left edge. Give them a plain readable page.
   ========================================================================== */
body.nw2-legacy #et-main-area { background: var(--nw-cream); }
body.nw2-legacy .et_pb_section {
  background-color: var(--nw-cream) !important;
  background-image: none !important;
  padding: clamp(30px, 5vw, 60px) 0 !important;
}
body.nw2-legacy .et_pb_section:first-of-type { padding-top: clamp(140px, 16vh, 190px) !important; }
body.nw2-legacy .et_pb_row {
  width: 90% !important;
  max-width: 900px !important;
  margin-inline: auto !important;
  padding: 0 !important;
}
body.nw2-legacy .et_pb_column { width: 100% !important; margin-right: 0 !important; }
body.nw2-legacy .et_pb_text,
body.nw2-legacy .et_pb_text_inner,
body.nw2-legacy .et_pb_text p,
body.nw2-legacy .et_pb_text li,
body.nw2-legacy .et_pb_text span {
  color: var(--nw-ink-soft) !important;
  text-shadow: none !important;
}
body.nw2-legacy .et_pb_text h1, body.nw2-legacy .et_pb_text h2,
body.nw2-legacy .et_pb_text h3, body.nw2-legacy .et_pb_text h4,
body.nw2-legacy h1, body.nw2-legacy h2, body.nw2-legacy h3, body.nw2-legacy h4 {
  color: var(--nw-ink) !important;
  text-shadow: none !important;
  margin-top: 1.2em;
}
body.nw2-legacy .et_pb_text a { color: var(--nw-accent-dp) !important; text-decoration: underline; }
body.nw2-legacy .et_pb_fullwidth_header,
body.nw2-legacy .et_pb_slider { display: none !important; }

/* Legacy pages have no dark hero behind the header, so the transparent bar
   left white nav text sitting on cream. Give them the solid bar from the off. */
html body.nw2-legacy #main-header {
  background-color: rgba(24, 23, 20, .96) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.07), 0 8px 26px rgba(0,0,0,.22) !important;
}
body.nw2-legacy #top-menu li a { color: #F2EFEA !important; text-shadow: none !important; }
body.nw2-legacy #top-menu li a:hover { color: var(--nw-accent) !important; }
body.nw2-legacy #top-menu > li.menu-item-has-children::after {
  border-right-color: #F2EFEA !important;
  border-bottom-color: #F2EFEA !important;
  filter: none !important;
}
body.nw2-legacy .mobile_menu_bar::before { color: #F2EFEA !important; }

/* Divi's nav anchors carry a large bottom padding, so centring the caret on
   the box always drops it below the label. Position it against the text line
   itself instead: the line box is 23px tall, so 9px puts the 6px chevron on
   the optical centre. */
body.nw2 #top-menu > li.menu-item-has-children::after {
  /* measured: the link's text centre sits 6.5px below the list item's top,
     and the chevron box is 8px tall, so 2.5px lands it dead centre. */
  top: 2.5px !important;
  margin-top: 0 !important;
}

/* ==========================================================================
   Fixes round 7
   ========================================================================== */

/* --- Calendar clipping ---
   The quote form runs on Swiper for its page transitions. Swiper gives
   .gform-body.swiper-wrapper overflow:hidden and a fixed pixel height for
   the active slide, so the date picker was being cut off at the slide edge
   on both desktop and mobile. Inactive slides are already opacity:0 and
   inert, so letting the wrapper overflow is safe. */
body.nw2 .gform_wrapper form.swiper,
body.nw2 .gform_wrapper .gform-body.swiper-wrapper,
body.nw2 .gform_wrapper .gform_body.swiper-wrapper,
body.nw2 .gform_wrapper .gform_page.swiper-slide,
body.nw2 .gform_wrapper .gform_page_fields,
body.nw2 .gform_wrapper .gform_fields,
body.nw2 .gform_wrapper .gfield--type-date {
  overflow: visible !important;
}
/* lift the picker above neighbouring fields once it escapes the slide */
body.nw2 .gform_wrapper .gfield--type-date { position: relative; z-index: 50; }
body.nw2 .gform-datepicker-calendar,
.gform-datepicker-calendar { z-index: 100001 !important; }

/* --- Calendar: the selected day was still Gravity Forms blue --- */
html body.nw2 .gform-datepicker-calendar td.day.selected,
html body.nw2 .gform-datepicker-calendar td.dayMarked,
html body.nw2 .gform-datepicker-calendar .day.selected,
html body.nw2 .gform-datepicker-calendar td.day.dayToday.selected,
.gform-theme--framework .gform-datepicker-calendar td.day.selected {
  background-color: var(--nw-ink) !important;
  background-image: none !important;
  color: var(--nw-white) !important;
}
html body.nw2 .gform-datepicker-calendar td.day:hover {
  background-color: var(--nw-accent) !important;
  color: var(--nw-ink) !important;
}
html body.nw2 .gform-datepicker-calendar td.day.dayToday:not(.selected) {
  box-shadow: inset 0 0 0 1.5px var(--nw-accent) !important;
}
/* the two selector rows and their arrows, coloured only */
html body.nw2 .gform-datepicker-calendar select.select {
  border-color: var(--nw-stone) !important;
  color: var(--nw-ink) !important;
}
html body.nw2 .gform-datepicker-calendar td.nav.btn { color: var(--nw-ink) !important; }
html body.nw2 .gform-datepicker-calendar td.nav.btn:hover { color: var(--nw-accent-dp) !important; }
html body.nw2 .gform-datepicker-calendar .monthMessage { display: none !important; }

/* --- Sub-submenu caret: anchor it to the link and centre on the text --- */
body.nw2 #top-menu li ul li.menu-item-has-children { position: relative !important; }
body.nw2 #top-menu li ul li.menu-item-has-children > a {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}
body.nw2 #top-menu li ul li.menu-item-has-children > a::after {
  position: absolute !important;
  top: 50% !important;
  right: 18px !important;
  margin: 0 !important;
  transform: translateY(-50%) rotate(-45deg) !important;
}
body.nw2 #top-menu li ul li.menu-item-has-children:hover > a::after {
  transform: translateY(-50%) rotate(45deg) !important;
}

/* --- Remove the Schedule a Call popup --- */
body.nw2 #scheduleACall,
body.nw2 .et_pb_section#scheduleACall { display: none !important; }

/* ==========================================================================
   Gravity Forms theming, done properly
   GF 3.1 exposes its palette as CSS custom properties and styles the inner
   <span> of each calendar cell, which is why selector overrides kept losing.
   Setting the variables is the supported route and fixes the blue selected
   day, the blue focus rings and the control colours in one place.
   The form prints its own vars on #gform_wrapper_9[data-form-index].gform-theme,
   so these are scoped one step higher to win cleanly.
   ========================================================================== */
body.nw2 .gform-theme,
body.nw2 .gform_wrapper.gform-theme,
body.nw2 #gform_wrapper_9.gform-theme,
body.nw2 #gform_wrapper_8.gform-theme {
  /* brand palette */
  --gf-color-primary: #A9B300;
  --gf-color-primary-rgb: 169, 179, 0;
  --gf-color-primary-contrast: #1C1B18;
  --gf-color-primary-contrast-rgb: 28, 27, 24;
  --gf-color-primary-darker: #8A9200;
  --gf-color-primary-lighter: #C3CE22;

  --gf-color-in-ctrl-primary: #1C1B18;
  --gf-color-in-ctrl-primary-rgb: 28, 27, 24;
  --gf-color-in-ctrl-primary-contrast: #FFFFFF;
  --gf-color-in-ctrl-primary-contrast-rgb: 255, 255, 255;
  --gf-color-in-ctrl-primary-darker: #000000;
  --gf-color-in-ctrl-primary-lighter: #33302B;

  --gf-color-secondary-contrast: #1C1B18;
  --gf-ctrl-border-color: #D9CFC2;
  --gf-ctrl-label-color-primary: #6B6560;
  --gf-ctrl-label-color-secondary: #6B6560;
  --gf-radius: 2px;

  /* date picker */
  --gf-ctrl-date-picker-bg-color: #FFFFFF;
  --gf-ctrl-date-picker-radius: 3px;
  --gf-ctrl-date-picker-shadow: 0 26px 64px rgba(28, 27, 24, .24);
  --gf-ctrl-date-picker-cell-content-bg-color-selected: #1C1B18;
  --gf-ctrl-date-picker-cell-content-color-selected: #FFFFFF;
  --gf-ctrl-date-picker-cell-content-bg-color-hover: #A9B300;
  --gf-ctrl-date-picker-cell-content-color-hover: #1C1B18;
  --gf-ctrl-date-picker-cell-content-color: #1C1B18;
  --gf-ctrl-date-picker-cell-content-radius: 2px;
  --gf-ctrl-date-picker-cell-content-color-disabled: #C4BFB7;
}

/* Undo the earlier selector-level fights: they were losing to GF's :where()
   guards anyway, and the variables above now handle the colours. */
html body.nw2 .gform-datepicker-calendar td.day.selected,
html body.nw2 .gform-datepicker-calendar td.dayMarked,
html body.nw2 .gform-datepicker-calendar .day.selected,
html body.nw2 .gform-datepicker-calendar td.day.dayToday.selected,
html body.nw2 .gform-datepicker-calendar td.day:hover,
html body.nw2 .gform-datepicker-calendar td.day.dayToday:not(.selected) {
  background-color: revert;
  background-image: revert;
  color: revert;
  box-shadow: revert;
}

/* The month and year pickers are GF's own controls, so keep our generic
   select styling off them. */
body.nw2 .gform-datepicker-calendar select,
body.nw2 .gform-datepicker-calendar select.select,
body.nw2 .gform-datepicker-calendar .nav.current.select {
  height: auto !important;
  line-height: normal !important;
  padding: 4px 26px 4px 10px !important;
  border: 1px solid var(--nw-stone) !important;
  box-shadow: none !important;
  background-color: #FFFFFF !important;
  font-family: var(--nw-sans) !important;
  font-size: .9rem !important;
  color: var(--nw-ink) !important;
}
body.nw2 .gform-datepicker-calendar select:focus {
  border-color: var(--nw-accent) !important;
  box-shadow: 0 0 0 2px rgba(169,179,0,.25) !important;
}
