/*
Theme Name: International Wine & Travel
Theme URI: https://iwinetravel.com
Description: Kadence child theme for International Wine & Travel. Monochrome + photography brand per DESIGN-BRIEF.md — Cinzel display, Source Sans Pro body. Values extracted from the live site's computed CSS.
Author: IWT Rebuild
Template: kadence
Version: 0.9.3
Text Domain: iwt
*/

:root {
  /* ---- Monochrome palette (DESIGN-BRIEF.md; NO wine/gold accent) ---- */
  --iwt-charcoal: #363433;   /* header/footer/dark sections + primary button */
  --iwt-ink: #1b1b1b;        /* headings */
  --iwt-body: #333333;       /* body text */
  --iwt-muted: #5e5e5e;      /* price / secondary */
  --iwt-nav: #a9a9a9;        /* nav grey on charcoal */
  --iwt-white: #ffffff;
  --iwt-line: #e6e3e0;       /* hairlines on white */
  --iwt-section-pad: 110px;  /* desktop section padding */
}

/* ============================ Typography ============================ */
body,
.entry-content,
input, select, textarea, button {
  font-family: "Source Sans Pro", arial, sans-serif;
  color: var(--iwt-body);
  font-size: 18px;
  line-height: 1.6;
}
h1, h2, h3, h4, h5, h6,
.entry-title, .site-title, .iwt-display {
  font-family: "Cinzel", Georgia, serif;
  font-weight: 400;
  color: var(--iwt-ink);
  letter-spacing: 0.02em;
}
/* Page H1 on white (destination/detail titles on light) */
.single .entry-title,
.page .entry-title {
  font-size: 74px;
  line-height: 1.08;
  color: var(--iwt-ink);
  text-align: center;
}
/* single trips carry the title in the photo hero -> hide Kadence's default title area */
.single-trip .entry-header,
.single-trip .entry-hero-container-inner,
.single-trip h1.entry-title { display: none !important; }
/* h4 card / sub headings */
h4, .iwt-trip-card__title {
  font-family: "Source Sans Pro", arial, sans-serif;
  font-weight: 700;
  font-size: 21px;
  color: var(--iwt-ink);
  letter-spacing: 0;
}
p { color: var(--iwt-body); }
a { color: var(--iwt-ink); text-decoration: none; }
a:hover { color: var(--iwt-charcoal); text-decoration: underline; }

/* ============================ Buttons ============================ */
.button, button, input[type="submit"], input[type="button"],
.wp-block-button__link, .iwt-btn {
  border-radius: 0 !important;
  font-family: "Source Sans Pro", arial, sans-serif;
  font-weight: 700;
  font-size: 18px;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 0.9em 2.1em;
  line-height: 1.2;
  display: inline-block;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}
/* primary = solid charcoal / white */
.button, button, input[type="submit"], .wp-block-button__link, .iwt-btn--primary {
  background-color: var(--iwt-charcoal);
  border: 1px solid var(--iwt-charcoal);
  color: #fff !important;
}
.button:hover, .wp-block-button__link:hover, .iwt-btn--primary:hover {
  background-color: #211f1e; border-color: #211f1e; color: #fff !important; text-decoration: none;
}
/* secondary/ghost = transparent, charcoal text, invert on hover */
.iwt-btn--ghost {
  background: transparent; border: 1px solid var(--iwt-charcoal); color: var(--iwt-charcoal) !important;
}
.iwt-btn--ghost:hover { background: var(--iwt-charcoal); color: #fff !important; text-decoration: none; }
/* ghost-on-dark (over hero) */
.iwt-btn--onhero { background: transparent; border: 1px solid #fff; color: #fff !important; }
.iwt-btn--onhero:hover { background: #fff; color: var(--iwt-charcoal) !important; }

/* ============================ Header / Nav ============================ */
.site-header-wrap, .site-header-row-container-inner,
#masthead, .site-main-header-wrap {
  background-color: var(--iwt-charcoal);
}
/* sticky header */
.site-header { position: -webkit-sticky; position: sticky; top: 0; z-index: 200; }
/* uppercase tracked nav, grey -> white — original DESIGN-BRIEF.md metrics.
   Restored to 16px / letter-spacing 2.672px now that the priority+ "More" overflow (iwt.js) collapses
   any items that don't fit at a given width — matching the original site's own behaviour at these widths. */
.header-navigation .menu-container > ul > li > a,
.main-navigation a, .header-navigation a, .site-header a.nav-link {
  font-family: "Source Sans Pro", arial, sans-serif;
  font-size: 16px; font-weight: 400;
  text-transform: uppercase; letter-spacing: 2.672px;
}
/* Kadence ships a default slate (#4a5568) on nav links that beats plain selectors on specificity.
   Enforce the brief spec with !important: #a9a9a9 base, white on hover/active, over #363433. */
.header-navigation .header-menu-container ul li a,
.header-navigation .menu-container ul li a,
.main-navigation ul li a,
.header-navigation a,
.site-header a.nav-link { color: #a9a9a9 !important; }
.header-navigation .header-menu-container ul li a:hover,
.header-navigation .header-menu-container ul li a:focus,
.header-navigation .header-menu-container ul li.current-menu-item > a,
.header-navigation .header-menu-container ul li.current-menu-ancestor > a,
.main-navigation ul li a:hover,
.main-navigation ul li.current-menu-item > a { color: #ffffff !important; }
/* Destinations dropdown panel on dark */
.header-navigation ul ul.sub-menu,
.header-navigation .header-menu-container ul ul { background-color: #2b2a29 !important; }
.header-navigation ul ul.sub-menu li a { color: #a9a9a9 !important; letter-spacing: 1.5px; }
.header-navigation ul ul.sub-menu li a:hover,
.header-navigation ul ul.sub-menu li.current-menu-item > a { color: #ffffff !important; }
/* mobile menu (Kadence off-canvas) also on charcoal with correct contrast */
.mobile-navigation ul li a,
#mobile-drawer .menu-container ul li a { color: #e8e6e3 !important; }
.mobile-navigation ul li a:hover { color: #ffffff !important; }
/* MENU-ONLY HEADER (parity with original): no brand text/logo in the bar — the site name lives in page heroes.
   Reclaim the space for the menu; the priority+ "More" dropdown (iwt.js) absorbs whatever doesn't fit. */
.site-header-item.site-header-focus-item.site-branding,
.site-header-item-branding,
.site-branding,
.site-header .site-title,
.site-header a.brand { display: none !important; }
/* widen ONLY the header's container past the 1290px content cap so the reclaimed space is usable */
.site-header .site-container { max-width: 1600px !important; }
/* the real nav list is ul.menu inside .header-menu-container.
   Priority+ JS (iwt.js) keeps it on ONE line by collapsing overflow into a "More" dropdown.
   Base is flex-wrap:wrap so that with JS unavailable the menu simply wraps (progressive enhancement)
   instead of clipping. */
.header-navigation ul.menu { flex-wrap: wrap; justify-content: center; }
.header-navigation ul.menu > li > a,
.header-navigation .menu-container > ul > li > a { padding-left: .55rem; padding-right: .55rem; white-space: nowrap; }

/* Sticky header (Kadence adds .item-is-fixed; enforce charcoal) */
.site-header .site-header-row-container.item-is-fixed .site-header-row-container-inner,
.site-header.stuck .site-header-wrap { background-color: var(--iwt-charcoal); }

/* Transparent-over-hero variant: on pages flagged .iwt-has-hero the header floats over the hero */
.iwt-has-hero .site-header:not(.item-is-fixed) .site-header-row-container-inner,
.iwt-has-hero.transparent-header .site-header-row-container-inner {
  background-color: transparent;
}

/* ============================ Full-bleed hero ============================ */
.iwt-hero {
  position: relative;
  min-height: 60vh;
  display: flex; align-items: center; justify-content: center;
  text-align: center;
  background-size: cover; background-position: center;
  color: #fff;
}
.iwt-hero { background-color: var(--iwt-charcoal); }        /* fallback if image fails -> never white */
.iwt-hero::after { display: none; }                        /* overlay is baked into background-image now */
.iwt-hero__inner { position: relative; z-index: 2; padding: 2rem 1.25rem; max-width: 1000px; }
.iwt-hero__title {
  font-family: "Cinzel", Georgia, serif; font-weight: 400;
  font-size: 55px; line-height: 1.1; letter-spacing: 1.265px; color: #fff; margin: 0;
}
.iwt-hero__sub {
  font-family: "Source Sans Pro", arial, sans-serif; font-size: 20px; letter-spacing: .04em;
  color: #f2efeb; margin: 1rem 0 1.75rem; text-transform: none;
}

/* ============================ Sections ============================ */
.iwt-section { padding: var(--iwt-section-pad) 1.25rem; }
.iwt-section--dark { background: var(--iwt-charcoal); color: #f4f1ee; }
.iwt-section--dark h1,.iwt-section--dark h2,.iwt-section--dark h3 { color:#fff; }
.iwt-section--dark p { color: #d8d4d0; }
.iwt-wrap { max-width: 1180px; margin: 0 auto; }
.iwt-section__title { text-align:center; font-size: 40px; margin: 0 0 .5rem; }
.iwt-section__lead { text-align:center; max-width: 720px; margin: 0 auto 2.5rem; color: var(--iwt-muted); }

/* ============================ Homepage sections ============================ */
/* hide the default page title on the front page (hero carries identity) */
.home .entry-header,
.home h1.entry-title,
.home .entry-hero-container-inner,
.iwt-year-page .entry-header,
.iwt-year-page h1.entry-title,
.iwt-year-page .entry-hero-container-inner { display: none !important; }
/* full-bleed heroes + sections (brief: full-bleed photo heroes, alternating bands).
   #content clips overflow-x so the 100vw break-out never creates a page scrollbar,
   and #content is not an ancestor of the sticky header, so sticky is unaffected. */
.site-content, #content { overflow-x: clip; }
/* HERO FLUSH: on pages with a full-bleed hero, remove the content-area top gap so the hero
   starts immediately below the sticky header (Kadence adds #primary margin-top + entry-content-wrap padding-top). */
.iwt-has-hero #primary.content-area { margin-top: 0 !important; }
.iwt-has-hero .entry-content-wrap { padding-top: 0 !important; }
.iwt-has-hero .entry-content { margin-top: 0 !important; }   /* single-trip content adds a 32px top margin */
/* Full-bleed: span exactly the viewport from x=0. The !important is required because some of these
   elements also set a `margin:` shorthand (which would reset margin-left/right to 0 and cause a
   viewport-width block to overflow to the right). max-width:100vw guards against Kadence content caps. */
.iwt-hero, .iwt-trip-hero, .iwt-section, .iwt-price-band, .iwt-cta-band {
  width: 100vw; max-width: 100vw;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}
.iwt-section--alt { background: #faf8f6; }
.iwt-hero--home { min-height: 66vh; }
.iwt-hero--year { min-height: 46vh; }
.iwt-year-body { padding: 3.5rem 1.25rem 0; }
/* About Us (why-us) 3 cards — round image + full text + Show More toggle (matches original) */
.iwt-why { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.5rem; align-items: start; }
.iwt-why-card { text-align: center; }
.iwt-why-card__img { width: 230px; height: 230px; max-width: 100%; object-fit: cover; border-radius: 50%; display: block; margin: 0 auto 1.4rem; }
.iwt-why-card h4 { font-size: 24px; margin-bottom: 1rem; }
.iwt-why-card__text { max-height: 10.5em; overflow: hidden; transition: max-height .35s ease; text-align: left; }
.iwt-why-card.is-open .iwt-why-card__text { max-height: 220em; }
.iwt-why-card__text p { margin: 0 0 .85rem; }
.iwt-why-toggle { all: unset; cursor: pointer; margin-top: 1rem; text-transform: uppercase; letter-spacing: 2px;
  font-size: 13px; font-weight: 700; color: var(--iwt-charcoal) !important; background: none !important;
  display: inline-flex; align-items: center; gap: .45rem; }
.iwt-why-toggle:hover { color: #000 !important; }
.iwt-why-toggle::before { content: "+"; font-size: 17px; line-height: 1; }
.iwt-why-card.is-open .iwt-why-toggle::before { content: "\2013"; }
/* services 4 cards */
.iwt-services { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.75rem; }
.iwt-services a { display: block; background: #fff; border: 1px solid var(--iwt-line); padding: 2rem 1.5rem; text-align: center; color: inherit; text-decoration: none; transition: box-shadow .2s ease, transform .2s ease; }
.iwt-services a:hover { box-shadow: 0 12px 30px rgba(27,27,27,.12); transform: translateY(-3px); text-decoration: none; }
.iwt-services h4 { margin: 0 0 .5rem; }
.iwt-services p { font-size: 15px; color: var(--iwt-muted); margin: 0; }
/* testimonials */
/* Reusable testimonial grid: auto-fits any number of cards (2 -> centered pair, 3+ -> row),
   caps card width, and equalises heights (align-items:stretch) with the attribution pinned to
   the bottom (cite margin-top:auto) so unequal-length quotes stay balanced & top-aligned. */
.iwt-quotes { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 460px)); justify-content: center; align-items: stretch; gap: 2rem; }
.iwt-quotes blockquote { margin: 0; padding: 2.25rem; border: 1px solid var(--iwt-line); background: #fff; font-size: 18px; font-style: italic; display: flex; flex-direction: column; text-align: left; }
.iwt-quotes blockquote p { margin: 0; }
.iwt-quotes cite { display: block; margin-top: auto; padding-top: 1.25rem; font-style: normal; font-size: 14px; letter-spacing: 1px; text-transform: uppercase; color: var(--iwt-muted); }
.iwt-placeholder-tag { display:inline-block; margin-top:.5rem; font-size:12px; letter-spacing:1.5px; text-transform:uppercase; color:#b06; }
/* contact strip + newsletter band */
.iwt-contact-strip { text-align: center; }
.iwt-contact-strip p { font-size: 18px; }

/* ============================ Trip / destination cards ============================ */
.iwt-trip-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.25rem;
}
.iwt-trip-grid--4 { grid-template-columns: repeat(4, 1fr); gap: 1.75rem; }
/* Stories / blog post cards (homepage "Past Journeys" + blog archive) */
.iwt-post-card__date { text-transform: uppercase; letter-spacing: 1.5px; font-size: 12px; color: var(--iwt-muted); margin-bottom: .45rem; }
.iwt-post-card .iwt-trip-card__title { font-size: 20px; }
.iwt-post-card .iwt-trip-card__img { aspect-ratio: 16/10; }
.iwt-trip-card {
  display: block; color: inherit; text-decoration: none; background: #fff;
  border: 1px solid var(--iwt-line); border-radius: 0; overflow: hidden;
  transition: box-shadow .2s ease, transform .2s ease;
}
.iwt-trip-card:hover, .iwt-trip-card:focus-visible {
  box-shadow: 0 14px 34px rgba(27,27,27,.15); transform: translateY(-4px); color: inherit; text-decoration: none;
}
.iwt-trip-card:focus-visible { outline: 2px solid var(--iwt-charcoal); outline-offset: 2px; }
.iwt-trip-card__imgwrap { position: relative; }
.iwt-trip-card__img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
/* coming-soon badge on year cards + body treatment on stub trip pages */
.iwt-card-badge { position: absolute; top: 12px; left: 12px; z-index: 2; background: var(--iwt-charcoal);
  color: #fff; font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; padding: .38em .8em; }
.iwt-comingsoon-tag { display: inline-block; background: var(--iwt-charcoal); color: #fff; font-size: 12px;
  font-weight: 700; letter-spacing: 2px; text-transform: uppercase; padding: .45em 1.1em; margin: 0 0 1.25rem; }
.iwt-comingsoon-lead { font-size: 20px; color: var(--iwt-body); }
.iwt-trip-card__body { padding: 1.4rem 1.5rem 1.7rem; }
.iwt-trip-card__title { margin: 0 0 .5rem; font-size: 21px; }
.iwt-trip-card__dates { color: var(--iwt-body); font-size: 17px; }
.iwt-trip-card__price { margin-top: .5rem; font-size: 21px; color: var(--iwt-muted); font-weight: 400; }
.iwt-trip-card__pp { font-size: 14px; letter-spacing: .04em; text-transform: uppercase; color: var(--iwt-muted); }

/* ============================ Trip detail template ============================ */
.iwt-trip-hero {
  position: relative; height: 62vh; min-height: 380px; margin: 0 0 2.5rem;
  background-color: var(--iwt-charcoal);   /* fallback if image fails -> never white */
  background-size: cover; background-position: center;
}
.iwt-trip-hero-overlay {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  text-align:center; background: transparent;   /* overlay is baked into the hero background-image */
}
.iwt-trip-hero-overlay .iwt-trip-hero__title {
  font-family:"Cinzel",Georgia,serif; color:#fff; font-size:55px; letter-spacing:1.265px; margin:0; padding:1rem; max-width:1000px;
}
.iwt-trip-hero__cap { margin-top:.5rem; font-family:"Source Sans Pro"; font-style: normal; color:#f0ede9; }

/* itinerary day cards — 3-col grid desktop, accordion mobile */
.single-trip .entry-content h2 { font-size: 34px; text-align:center; margin: 2.5rem 0 1.5rem; }
.iwt-itinerary-title { font-size: 34px; text-align:center; margin: 2.5rem 0 1.5rem; }
.iwt-day-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin: 1.5rem 0 2.5rem; align-items: start; }
.iwt-day-card { background:#fff; border:1px solid var(--iwt-line); border-top:3px solid var(--iwt-charcoal); padding:1.4rem 1.5rem; }
.iwt-day-card__head { all: unset; display:block; width:100%; }
.iwt-day-card__day { display:block; font-family:"Cinzel",Georgia,serif; font-size:20px; color:var(--iwt-charcoal); letter-spacing:.02em; }
.iwt-day-card__title { display:block; font-weight:700; margin:.35rem 0 .1rem; color:var(--iwt-ink); }
.iwt-day-card__acts { margin:.75rem 0 0; padding-left:1.15rem; }
.iwt-day-card__acts li { margin-bottom:.4rem; font-size:15.5px; color:var(--iwt-body); }
/* trip inline images */
.iwt-trip-figure { margin: 1.75rem 0 2rem; }
.iwt-trip-figure img { width:100%; height:auto; display:block; }
.iwt-trip-gallery { display:grid; grid-template-columns: repeat(3,1fr); gap:1rem; margin: 0 0 2.5rem; }
.iwt-trip-gallery img { width:100%; height:230px; object-fit:cover; display:block; }

/* PRICE band (charcoal) — the "## PRICE" section is wrapped by JS/template into .iwt-price-band */
.iwt-price-band { background: var(--iwt-charcoal); color:#fff; padding: 2.5rem 1.5rem; text-align:center; margin: 2.5rem 0; }
.iwt-price-band h2 { color:#fff; }
.iwt-price-band p { color:#f0ede9; font-size: 21px; margin:.25rem 0; }
.iwt-price-band a { display:inline-block; margin-top:1.4rem; color:#fff !important; border:1px solid #fff;
  padding:.7em 1.9em; text-transform:uppercase; letter-spacing:2px; font-weight:700; font-size:15px; text-decoration:none; }
.iwt-price-band a:hover { background:#fff; color:var(--iwt-charcoal) !important; }

/* Departures table */
.iwt-departures { margin: 2.5rem 0; }
.iwt-departures h2 { font-size: 30px; text-align:center; margin-bottom: 1.25rem; }
.iwt-departures table { width:100%; border-collapse: collapse; }
.iwt-departures th, .iwt-departures td { padding: .85rem 1rem; border-bottom: 1px solid var(--iwt-line); text-align:left; font-size:17px; }
.iwt-departures th { font-family:"Source Sans Pro"; text-transform:uppercase; letter-spacing:1.5px; font-size:13px; color:var(--iwt-muted); }
.iwt-departures td:first-child { font-weight:700; }

/* Essential Travel Guide 4-up boxes: the "## Essential Travel Guide" <ul> becomes a grid */
.iwt-guide { display:grid; grid-template-columns: repeat(4,1fr); gap:1.5rem; margin: 1.5rem 0 2.5rem; }
.iwt-guide > div { background:#faf8f6; border:1px solid var(--iwt-line); padding:1.4rem; font-size:15.5px; }
.iwt-guide strong { display:block; }

/* CTA band */
.iwt-cta-band { background: var(--iwt-charcoal); color:#fff; text-align:center; padding: 3.5rem 1.5rem; margin-top: 3rem; }
.iwt-cta-band h2 { color:#fff; font-size: 38px; margin:0 0 1.5rem; }

/* ============================ Footer ============================ */
.site-footer, .site-footer-wrap, #colophon { background: var(--iwt-charcoal); color:#cfcbc7; }
.site-footer a, #colophon a { color: var(--iwt-nav); }
.site-footer a:hover { color:#fff; }
/* self-contained footer styling so it holds regardless of Kadence's footer wrapper
   (front page renders the footer under .wp-site-blocks, not .site-footer) */
.iwt-footer { padding: 70px 1.25rem 40px; background: var(--iwt-charcoal); color: #d0ccc8; }
.iwt-footer p { color: #d0ccc8; }
.iwt-footer a { color: var(--iwt-nav); }
.iwt-footer a:hover { color: #fff; }
.iwt-footer__cols { display:grid; grid-template-columns: 1.8fr 1fr 1fr 1.5fr; gap: 2.5rem; max-width:1180px; margin:0 auto; }
.iwt-footer h4 { color:#fff; text-transform:uppercase; letter-spacing:2px; font-size:15px; margin-bottom:1rem; }
.iwt-footer nav a { display:block; padding:.28rem 0; text-transform:uppercase; letter-spacing:1.5px; font-size:14px; }
.iwt-footer__socials { display:flex; align-items:center; gap: 1rem; }
.iwt-footer__socials a { color: var(--iwt-nav); display:inline-flex; }
.iwt-footer__socials a:hover { color:#fff; }
.iwt-footer__ig { color: var(--iwt-nav); font-size: 14px; letter-spacing: 1px; }
.iwt-footer__legal { text-align:center; border-top:1px solid #4a4746; margin-top:2.5rem; padding-top:1.5rem; font-size:13px; color:#b3afab; }

/* ============================ Responsive ============================ */
@media (max-width: 1024px) {
  .iwt-trip-grid, .iwt-trip-grid--4, .iwt-guide, .iwt-services, .iwt-why, .iwt-day-grid { grid-template-columns: repeat(2,1fr); }
  .iwt-footer__cols { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  :root { --iwt-section-pad: 60px; }
  /* hero titles scale ~40% down */
  .iwt-hero__title, .iwt-trip-hero-overlay .iwt-trip-hero__title { font-size: 33px; letter-spacing: .8px; }
  .single .entry-title, .page .entry-title { font-size: 44px; }
  .iwt-section__title, .iwt-cta-band h2 { font-size: 28px; }
  .iwt-trip-grid, .iwt-trip-grid--4, .iwt-guide, .iwt-services, .iwt-why, .iwt-footer__cols { grid-template-columns: 1fr; }
  body { font-size: 17px; }
  /* itinerary accordion on mobile */
  /* day cards collapse into an accordion */
  .iwt-day-grid { grid-template-columns: 1fr; gap: .85rem; }
  .iwt-day-card__head { cursor: pointer; position: relative; padding-right: 1.5rem; }
  .iwt-day-card__head::after { content: "+"; position: absolute; right: 0; top: 0; font-size: 18px; color: var(--iwt-charcoal); }
  .iwt-day-card.is-open .iwt-day-card__head::after { content: "\2013"; }
  .iwt-day-card__acts { display: none; }
  .iwt-day-card.is-open .iwt-day-card__acts { display: block; }
  .iwt-trip-gallery { grid-template-columns: 1fr 1fr; }
}
/* generous tap targets on clickable cards */
@media (hover: none) { .iwt-trip-card { min-height: 44px; } .iwt-trip-card__body { padding: 1.2rem; } }

/* ---------------------------------------------------------------- Moments gallery (tiled, expandable, lightbox) */
.iwt-gallery {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 2.25rem;
}
.iwt-gallery__item {
  position: relative;
  display: block;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: var(--iwt-line);
  aspect-ratio: 1 / 1;
  overflow: hidden;
  cursor: pointer;
  outline: none;
}
.iwt-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .5s ease, filter .4s ease;
  filter: grayscale(12%);
}
.iwt-gallery__item:hover img,
.iwt-gallery__item:focus-visible img { transform: scale(1.06); filter: grayscale(0); }
.iwt-gallery__item::after {
  content: "";
  position: absolute;
  inset: 0;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.06);
  pointer-events: none;
}
.iwt-gallery--collapsed .iwt-gallery__item:nth-child(n+17) { display: none; }
.iwt-gallery-more { text-align: center; margin-top: 2rem; }
.iwt-gallery-count { opacity: .7; font-weight: 400; }

/* lightbox */
.iwt-lightbox {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(27,27,27,.94);
  padding: 4vmin;
  cursor: zoom-out;
  opacity: 0;
  transition: opacity .2s ease;
}
.iwt-lightbox.is-open { opacity: 1; }
.iwt-lightbox img {
  max-width: 92vw;
  max-height: 90vh;
  width: auto;
  height: auto;
  box-shadow: 0 12px 48px rgba(0,0,0,.5);
}
.iwt-lightbox__close {
  position: absolute;
  top: 18px; right: 24px;
  width: 44px; height: 44px;
  background: none; border: 0; color: #fff;
  font-size: 30px; line-height: 1; cursor: pointer; opacity: .85;
}
.iwt-lightbox__close:hover { opacity: 1; }

@media (max-width: 900px) { .iwt-gallery { grid-template-columns: repeat(3, 1fr); gap: 8px; } }
@media (max-width: 560px) { .iwt-gallery { grid-template-columns: repeat(2, 1fr); gap: 6px; } }

/* ---------------------------------------------------------------- About page: narrow intro, contact form, social */
.iwt-wrap.iwt-narrow { max-width: 820px; }
.iwt-form-wrap { margin-top: 2rem; text-align: left; }
.iwt-form-wrap .fluentform, .iwt-form-wrap form { max-width: 640px; margin: 0 auto; }
.iwt-social { display: inline-flex; align-items: center; justify-content: center; gap: 1.5rem; margin-top: 1.5rem; }
.iwt-social a { color: inherit; display: inline-flex; opacity: .9; transition: opacity .2s ease; }
.iwt-social a:hover { opacity: 1; }
.iwt-social svg { width: 30px; height: 30px; display: block; }
.iwt-social__handle { letter-spacing: 1px; font-size: 15px; opacity: .9; }

/* ---------------------------------------------------------------- About: Contact banner (mirrors original SectionBanner + white card) */
.iwt-section--banner { background-size: cover; background-position: center; background-repeat: no-repeat; }
.iwt-banner-card { background: #fff; max-width: 760px; margin: 0 auto; padding: 3.25rem 2.75rem; box-shadow: 0 14px 44px rgba(0,0,0,.28); text-align: center; }
.iwt-banner-card .iwt-section__title { margin-top: 0; }
.iwt-banner-card .iwt-form-wrap { text-align: left; }
@media (max-width: 560px) { .iwt-banner-card { padding: 2rem 1.25rem; } }

/* ---------------------------------------------------------------- Priority+ overflow nav ("More" dropdown) */
/* The "More" item looks like a normal top-level menu item; its panel reuses the standard dropdown look. */
.iwt-more { position: relative; }
.iwt-more > .iwt-more__toggle { cursor: pointer; display: inline-flex; align-items: center; gap: .4em; white-space: nowrap; }
.iwt-more__caret { width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor; display: inline-block; opacity: .85; transition: transform .15s ease; }
.iwt-more.is-open .iwt-more__caret { transform: rotate(180deg); }
/* panel: we control visibility via opacity/visibility so it never fights Kadence's display rules */
.iwt-more > .iwt-more__panel {
  position: absolute; top: 100%; right: 0; left: auto;
  min-width: 230px; margin: 0; padding: .4rem 0; list-style: none;
  background: #2b2a29;
  box-shadow: 0 14px 34px rgba(0,0,0,.34);
  display: block !important;                 /* override Kadence sub-menu display toggling */
  opacity: 0; visibility: hidden; transform: translateY(4px);
  transition: opacity .15s ease, transform .15s ease, visibility .15s;
  z-index: 400;
}
.iwt-more:hover > .iwt-more__panel,
.iwt-more:focus-within > .iwt-more__panel,
.iwt-more.is-open > .iwt-more__panel { opacity: 1; visibility: visible; transform: translateY(0); }
.iwt-more__panel > li { display: block !important; width: 100%; margin: 0 !important; padding: 0 !important; }
.iwt-more__panel > li > a {
  display: block; width: 100%; box-sizing: border-box; margin: 0;
  padding: .55rem 1.35rem; white-space: nowrap;
  color: #a9a9a9 !important; text-transform: uppercase; letter-spacing: 1.2px; font-size: 14px;
}
/* highlight on the full-width <li> (the <a> is width-constrained by Kadence), so it spans the whole row */
.iwt-more__panel > li:hover,
.iwt-more__panel > li.current-menu-item { background: #363433; }
.iwt-more__panel > li:hover > a,
.iwt-more__panel > li:focus-within > a,
.iwt-more__panel > li.current-menu-item > a { color: #fff !important; background: transparent !important; text-decoration: none; }

/* ---------------------------------------------------------------- Service pages: photo hero + supporting figures */
.iwt-hero--service { min-height: 54vh; }
.iwt-service-body { padding: 3.5rem 1.25rem 0; }
.iwt-service-body > h2:first-child, .iwt-service-body > h3:first-child { margin-top: 0; }
/* in-content supporting figure (content width) */
.iwt-figure { margin: 3.25rem 0; }
.iwt-figure img { width: 100%; height: auto; display: block; }
.iwt-figure figcaption { margin-top: .6rem; font-size: 14px; letter-spacing: .5px; color: var(--iwt-muted); text-align: center; }
/* full-bleed supporting band (breaks out to viewport, like the section bands) */
.iwt-figure--bleed { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; margin-top: 3.5rem; margin-bottom: 3.5rem; }
.iwt-figure--bleed img { width: 100vw; height: 58vh; object-fit: cover; }
@media (max-width: 768px) { .iwt-figure--bleed img { height: 42vh; } }

/* ---------------------------------------------------------------- Trip inquiry form embedded in the dark CTA band */
.iwt-cta-band__sub { color: #cfcbc7; margin: -0.5rem 0 2rem; font-size: 17px; }
.iwt-cta-form { max-width: 640px; margin: 0 auto; text-align: left; }
.iwt-cta-form .ff-el-input--label label { color: #f0ede9; font-weight: 600; letter-spacing: .3px; }
.iwt-cta-form .ff-el-form-control { background: #fff; color: #1b1b1b; border: 1px solid #6a6664; border-radius: 0; }
.iwt-cta-form .ff-el-form-control:focus { border-color: #fff; outline: none; }
.iwt-cta-form .ff-message-success { color: #fff; }
.iwt-cta-form .ff-el-is-error input, .iwt-cta-form .ff-el-is-error textarea { border-color: #e6a4a4; }

/* ---------------------------------------------------------------- Footer newsletter signup (Fluent Forms, email-only) */
.iwt-footer__news p { margin-bottom: .9rem; font-size: 14px; color: #d0ccc8; }
.iwt-footer__news .ff-el-group { margin-bottom: .55rem; }
.iwt-footer__news .ff-el-input--label { display: none; }
.iwt-footer__news .ff-el-form-control { background: #2c2a29; color: #f0ede9; border: 1px solid #4a4746; border-radius: 0; width: 100%; box-sizing: border-box; }
.iwt-footer__news .ff-el-form-control::placeholder { color: #98938f; }
.iwt-footer__news .ff-btn-submit { width: 100%; } /* color/border comes from the FF-button rule below (on-dark variant) */
.iwt-footer__news .ff-message-success { color: #e6d8cf; font-size: 14px; }

/* ---------------------------------------------------------------- Fluent Forms submit buttons -> IWT CTA design system
   Overrides Fluent Forms' per-form injected color rule (form.fluent_form_N .ff-btn-submit{background:...}),
   so every current AND future form inherits the site button look. !important is needed to beat that
   plugin-injected rule + FF's base .ff-btn stylesheet. */
.fluentform .ff-btn,
.fluentform .ff-btn-submit {
  background-color: #363433 !important;
  border: 1px solid #363433 !important;
  color: #fff !important;
  border-radius: 0 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  font-family: "Source Sans Pro", arial, sans-serif !important;
  padding: 0.85em 2em !important;
  box-shadow: none !important;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
.fluentform .ff-btn:hover,
.fluentform .ff-btn-submit:hover {
  background-color: #211f1e !important;
  border-color: #211f1e !important;
  color: #fff !important;
}
/* On-dark contexts (trip CTA band, dark newsletter section, footer): a solid charcoal button would be
   invisible on the #363433 background, so use the design system's on-dark CTA (white fill, charcoal text,
   invert on hover) — still branded, still square/uppercase/tracked. */
.iwt-cta-form .ff-btn-submit,
.iwt-section--dark .ff-btn-submit,
.iwt-footer__news .ff-btn-submit {
  background-color: #fff !important;
  border: 1px solid #fff !important;
  color: #1b1b1b !important;
}
.iwt-cta-form .ff-btn-submit:hover,
.iwt-section--dark .ff-btn-submit:hover,
.iwt-footer__news .ff-btn-submit:hover {
  background-color: #211f1e !important;
  border-color: #211f1e !important;
  color: #fff !important;
}

/* ---------------------------------------------------------------- Legal pages (Privacy, Terms) + FAQ: narrow readable column */
.iwt-legal, .iwt-faq { max-width: 820px; margin: 0 auto; padding: 3.5rem 1.25rem 2.5rem; text-align: left; }
.iwt-legal__title, .iwt-faq__title { text-align: center; margin: 0 0 .5rem; }
.iwt-legal__meta { text-align: center; color: var(--iwt-muted); font-size: 15px; margin: 0 0 2.5rem; }
.iwt-legal h2 { font-size: 26px; margin: 2.4rem 0 .8rem; }
.iwt-legal p { margin: 0 0 1.1rem; line-height: 1.75; }
.iwt-legal a { text-decoration: underline; }

/* FAQ accordion (native <details>/<summary> — keyboard + screen-reader accessible) */
.iwt-faq__intro { text-align: center; color: var(--iwt-muted); max-width: 660px; margin: 0 auto 2.5rem; }
.iwt-faq__section { font-size: 26px; margin: 2.6rem 0 .4rem; }
.iwt-faq__item { border-bottom: 1px solid var(--iwt-line); }
.iwt-faq__q { cursor: pointer; list-style: none; padding: 1.15rem 2.5rem 1.15rem 0; position: relative; font-weight: 700; font-size: 18px; color: var(--iwt-ink); font-family: "Source Sans Pro", arial, sans-serif; }
.iwt-faq__q::-webkit-details-marker { display: none; }
.iwt-faq__q::after { content: "+"; position: absolute; right: .35rem; top: 50%; transform: translateY(-50%); font-size: 26px; font-weight: 400; line-height: 1; color: var(--iwt-muted); }
.iwt-faq__item[open] .iwt-faq__q::after { content: "\2212"; }
.iwt-faq__q:hover { color: var(--iwt-charcoal); }
.iwt-faq__q:focus-visible { outline: 2px solid var(--iwt-charcoal); outline-offset: 3px; border-radius: 2px; }
.iwt-faq__a { padding: 0 0 1.35rem; }
.iwt-faq__a p { margin: 0; color: var(--iwt-body); line-height: 1.75; }

/* Portrait supporting figure — for people photos that can't crop to a wide bleed band without clipping
   faces. Shown whole at a tasteful width instead (no crop, all faces visible). */
.iwt-figure--portrait { max-width: 560px; margin-left: auto; margin-right: auto; }
.iwt-figure--portrait img { width: 100%; height: auto; display: block; }