/* SMT — Style 2 ("Bold Industrial"), charcoal.
 *
 * Loads AFTER every parent stylesheet (see functions.php), so it wins on
 * source order and almost nothing here needs extra specificity. Where it
 * does, the reason is next to the rule.
 *
 * HOW IT IS ORGANISED: most of the re-skin is done by redefining the parent's
 * TOKENS — colour, type, radius, shadow, measure — because every parent section
 * already reads them. The rules below the token block handle what tokens
 * cannot reach: layout differences, uppercase display type, and the new
 * markup from this theme's header, hero and prose bands.
 *
 * Palette: the client's Style 2 file with its black lifted to charcoal (Rob,
 * 2026-10-09) and every panel lifted by the same step, so the contrast between
 * layers is the file's own.
 */

/* =========================================================================
 * 1. Tokens
 * ========================================================================= */
:root {
  /* Style 2's own values */
  --s2-bg:      #232628;
  --s2-deep:    #1f2224;   /* .section.dark bands */
  --s2-floor:   #1d2022;   /* footer */
  --s2-panel:   #2b2e31;
  --s2-panel2:  #313538;
  --s2-line:    #3e4346;
  --s2-text:    #f3f4f4;
  --s2-body:    #b4babc;   /* paragraph grey; the file's #adb3b5, nudged for AA on panels */
  --s2-muted:   #8f979a;
  --s2-yellow:  #f4b51b;
  --s2-yellow2: #ffd05a;
  --s2-ink:     #101010;   /* text on yellow */
  --s2-card-grad: linear-gradient(145deg, #303437, #26292b);

  /* The parent's tokens, re-pointed */
  --color-bg:       var(--s2-bg);
  --color-surface:  var(--s2-panel);
  --color-charcoal: var(--s2-deep);
  --color-hairline: var(--s2-line);
  --color-border:   var(--s2-line);
  --color-primary:  var(--s2-yellow);
  /* Accent was the teal BACKGROUND of quote cards and feature panels. Here it
   * is a lifted panel; links and highlights are set to yellow explicitly. */
  --color-accent:   var(--s2-panel2);
  --color-text:     var(--s2-text);
  --color-text-mut: var(--s2-muted);

  --font-body:    "Inter", Arial, Helvetica, sans-serif;
  --font-display: "Inter", Arial, Helvetica, sans-serif;

  /* Style 2 is square-cornered and flat: no trays, no glass, no lift. */
  --radius-shell: 0;
  --radius-core:  0;
  --radius-pill:  3px;
  --tray-pad:     0px;
  --enclosure-bg: transparent;
  --shadow-sm:    none;
  --shadow-md:    0 18px 60px rgb(0 0 0 / 0.35);
  --shadow-inner: none;
  --subnav-radius: 0;

  /* The file's 1180 measure — narrower than the parent's 1640. */
  --container-max: 1180px;
  --gutter:        clamp(18px, 0.75rem + 1.6vw, 34px);
  --section-pad-y: clamp(56px, 2.5rem + 3.4vw, 80px);
  --hero-overlap:  0px;
}

/* =========================================================================
 * 2. Ground and type
 * ========================================================================= */
html { background: var(--s2-bg); }

body.style2 {
  background:
    radial-gradient(circle at 80% 0, #36322a 0, transparent 34rem),
    var(--s2-bg);
  color: var(--s2-text);
  font-size: 15.5px;
  /* Full-bleed bands use 100vw, which counts the scrollbar. Clip, not hidden:
   * hidden would create a scroll container and break position: sticky. */
  overflow-x: clip;
}

.style2 p { color: var(--s2-body); }

/* Display type: heavy, uppercase, tight. Every parent heading role. */
.style2 :is(.t-page-title, .t-display, .t-section, .t-band, .t-sub, .t-col-head, .t-lead) {
  font-family: var(--font-display);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: -0.03em;
  line-height: 1.02;
  color: var(--s2-text);
}
.style2 .t-display,
.style2 .t-section { font-size: clamp(30px, 1.25rem + 2.6vw, 52px); letter-spacing: -0.04em; }
.style2 .t-band,
.style2 .t-sub     { font-size: clamp(18px, 0.9rem + 0.6vw, 22px); letter-spacing: -0.01em; line-height: 1.15; }
.style2 .t-lead    { font-size: clamp(16px, 0.9rem + 0.3vw, 19px); letter-spacing: -0.01em; line-height: 1.2; }

.s2-accent { color: var(--s2-yellow); }

/* Eyebrow: a yellow kicker, not the parent's outlined pill. */
.style2 .eyebrow,
.s2-eyebrow {
  display: block;
  padding: 0;
  border: 0;
  border-radius: 0;
  opacity: 1;
  color: var(--s2-yellow);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.style2 .eyebrow::before { content: none; }

/* The heading rule is the parent's signature; Style 2 has none. */
.style2 .rule-row__line { display: none; }
.style2 .rule-row,
.style2 .rule-row:has(.eyebrow) { flex-direction: column; align-items: flex-start; gap: 12px; }

/* Focus: the parent's wine ring would be yellow-on-yellow on a button. */
.style2 :focus-visible {
  outline: 2px solid var(--s2-yellow);
  outline-offset: 3px;
  box-shadow: none;
}

/* =========================================================================
 * 3. Buttons
 * ========================================================================= */
.style2 .btn,
.s2-btn {
  min-height: 0;
  padding: 12px 18px;
  border: 1px solid var(--s2-yellow);
  border-radius: 3px;
  background: var(--s2-yellow);
  color: var(--s2-ink);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  gap: 0.5em;
}
.style2 .btn:hover,
.s2-btn:hover { background: var(--s2-yellow2); border-color: var(--s2-yellow2); color: var(--s2-ink); }

/* Ghost and outline are Style 2's "secondary": hollow, grey edge. */
.style2 .btn--ghost,
.style2 .btn--outline {
  background: transparent;
  border-color: #697074;
  color: #fff;
}
.style2 .btn--ghost:hover,
.style2 .btn--outline:hover { background: transparent; border-color: var(--s2-yellow); color: var(--s2-yellow); }

/* The parent's arrow-in-a-circle becomes a plain trailing arrow. */
.style2 .btn:has(.btn__arrow) { padding-right: 18px; }
.style2 .btn__arrow { width: auto; height: auto; margin-left: 0.15rem; background: none; border-radius: 0; }
.style2 .btn__arrow svg { width: 12px; height: 12px; }
.style2 .btn:hover .btn__arrow { background: none; transform: translate(2px, -1px); }

/* Imported prose buttons were restated at (0,2,1) by the parent's
 * interior.css to beat its own link colour — restated again here. */
.style2 :is(.pblock__body, .mtext__body, .icol__text) a.btn--primary,
.style2 :is(.pblock__body, .mtext__body, .icol__text) a.btn--primary:hover { color: var(--s2-ink); }

/* =========================================================================
 * 4. Header
 * ========================================================================= */
.style2 .site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  inset: auto;
  color: #fff;
}
/* Logged-in: the admin bar is 32px (46px below 783) and fixed. */
.admin-bar.style2 .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar.style2 .site-header { top: 0; } }

.s2-wrap {
  width: 100%;
  max-width: calc(var(--container-max) + var(--gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

/* The utility strip — Style 2 has none; it carries the phone. */
.s2-strip {
  background: #1b1e20;
  border-bottom: 1px solid var(--s2-line);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #9aa1a4;
}
.s2-strip__inner { display: flex; align-items: center; justify-content: space-between; min-height: 34px; }
.s2-strip .social { margin-inline: -13px; }
.s2-strip .social a { width: 34px; height: 34px; }
.s2-strip .social__icon { width: 14px; height: 14px; }
.s2-strip__nav,
.s2-strip__nav ul { display: flex; align-items: center; gap: 22px; }
.s2-strip__nav a { display: inline-flex; align-items: center; min-height: 24px; transition: color var(--dur-fast); }
.s2-strip__nav a:hover { color: var(--s2-yellow); }
.s2-strip__phone { color: #fff; font-weight: 700; }

.s2-bar {
  background: rgb(35 38 40 / 0.94);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--s2-line);
}
.s2-bar__inner {
  position: relative;
  display: flex;
  align-items: center;
  gap: 28px;
  min-height: 82px;
}

.s2-brand { display: flex; align-items: center; gap: 12px; flex: none; margin-right: auto; }
.s2-brand__mark { width: 52px; height: 52px; object-fit: contain; }
.s2-brand__copy {
  font-size: 9.5px;
  line-height: 1.15;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #d9dcdd;
}
.s2-brand__copy strong { color: #fff; font-size: 12px; font-weight: 900; }

/* Primary nav — the parent's .site-header__primary rules still apply; these
 * re-set what the dark bar needs. */
.style2 .s2-nav ul {
  gap: 26px;
  font-family: var(--font-body);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.style2 .s2-nav > ul > li > a { color: #c7ccce; min-height: 40px; white-space: nowrap; }
@media (min-width: 1241px) {
  .style2 .s2-nav > ul { gap: 22px; }
  .style2 .s2-nav .menu-item-has-children > a { padding-right: 0; }
  .style2 .s2-nav .subnav-toggle { width: 22px; margin-left: 2px; }
}
.style2 .s2-nav > ul > li > a:hover,
.style2 .s2-nav > ul > .current-menu-item > a,
.style2 .s2-nav > ul > .current-menu-ancestor > a,
.style2 .s2-nav > ul > .current-page-ancestor > a { color: var(--s2-yellow); }
.style2 .s2-nav a::after { background: var(--s2-yellow); height: 2px; }

.s2-bar__cta { flex: none; }

/* Desktop dropdown on the dark bar. */
@media (min-width: 769px) {
  .style2 .s2-nav .sub-menu {
    margin-top: 0;
    padding: 6px 0;
    background: #202325;
    border: 1px solid var(--s2-line);
    border-top: 2px solid var(--s2-yellow);
    text-transform: none;
    letter-spacing: 0;
    font-size: 13.5px;
    font-weight: 500;
  }
  .style2 .s2-nav .sub-menu a { color: #d5d8d9; padding: 0.65em 1.1em; }
  .style2 .s2-nav .sub-menu a:hover,
  .style2 .s2-nav .sub-menu a:focus-visible { background: var(--s2-panel2); color: var(--s2-yellow); }
}

.style2 .site-header__toggle { color: #fff; }

/* -- Drawer -------------------------------------------------------------
 * The parent switches to the drawer at 768. Four items, a dropdown and a
 * button do not fit beside the brand much below 1240, so Style 2 switches
 * there. The parent's 768 rules are the template; restated for 769–1240. */
@media (max-width: 1240px) {
  .style2 .site-header__toggle { display: grid; }
  .s2-bar__inner { gap: 14px; }

  .style2 .s2-nav {
    position: absolute;
    inset: 100% 0 auto 0;
    margin: 0;
    padding: 8px 0 14px;
    background: #202325;
    border-bottom: 1px solid var(--s2-line);
    box-shadow: var(--shadow-md);
    display: none;
  }
  .style2 .s2-nav[data-open="true"] { display: block; }
  .style2 .s2-nav ul { flex-direction: column; gap: 0; padding: 0 var(--gutter); }
  .style2 .s2-nav li + li { border-top: 1px solid var(--s2-line); }
  .style2 .s2-nav a { display: flex; min-height: 48px; }
  .style2 .s2-nav a::after { content: none; }
  .style2 .s2-nav > .site-header__drawer-utility {
    display: block;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid var(--s2-line);
  }
  .style2 .s2-nav > .site-header__drawer-utility a { color: #9aa1a4; }
  .s2-strip__nav ul { display: none; }
}

/* 769–1240: the parent's desktop dropdown rules are still live, so the
 * sub-menus would float. In the drawer they open in place, as below 768. */
@media (min-width: 769px) and (max-width: 1240px) {
  .style2 .s2-nav .menu-item-has-children { display: block; position: relative; }
  .style2 .s2-nav .menu-item-has-children > a { padding-right: 52px; }
  .style2 .s2-nav .menu-item-has-children::after { content: none; }
  .style2 .s2-nav .subnav-toggle { position: absolute; top: 0; right: var(--gutter); width: 52px; height: 48px; color: #fff; }
  .style2 .s2-nav .sub-menu {
    position: static;
    display: none;
    visibility: visible;
    opacity: 1;
    transform: none;
    padding: 0 0 8px 16px;
    border: 0;
    background: none;
  }
  .style2 .s2-nav .menu-item-has-children:hover > .sub-menu { display: none; }
  .style2 .s2-nav .subnav-toggle[aria-expanded="true"] + .sub-menu { display: flex; }
}

@media (max-width: 768px) {
  .s2-strip { display: none; }
  .s2-bar__inner { min-height: 68px; }
  .s2-bar__cta { display: none; }
  .s2-brand__mark { width: 44px; height: 44px; }
  .style2 .site-header__call {
    background: var(--s2-yellow);
    color: var(--s2-ink);
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 12px;
    font-weight: 800;
  }
}

/* =========================================================================
 * 5. Hero (template-parts/sections/hero-banner.php)
 * ========================================================================= */
.s2-hero { padding-block: clamp(28px, 1rem + 3vw, 70px) clamp(28px, 1rem + 2vw, 46px); }

.s2-hero__frame {
  display: grid;
  grid-template-columns: 1fr 1.08fr;
  border: 1px solid var(--s2-line);
  background: #26292b;
  overflow: hidden;
}
.s2-hero--short .s2-hero__frame { min-height: clamp(280px, 12rem + 12vw, 400px); }
.s2-hero--tall  .s2-hero__frame { min-height: clamp(420px, 18rem + 14vw, 540px); }
.s2-hero--noimage .s2-hero__frame { grid-template-columns: 1fr; }

.s2-hero__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(36px, 1.5rem + 3vw, 72px) clamp(26px, 1rem + 3vw, 58px);
  background: linear-gradient(130deg, #25282a, #2f3335);
}
.s2-hero__copy .s2-eyebrow { margin-bottom: 15px; }

.s2-hero__heading {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: -0.045em;
  line-height: 0.98;
  color: #fff;
  font-size: clamp(34px, 1.2rem + 3.4vw, 64px);
  text-wrap: balance;
}
.s2-hero--short .s2-hero__heading { font-size: clamp(30px, 1.1rem + 2.6vw, 54px); }

.s2-hero__bullets { display: grid; gap: 7px; margin-top: 26px; }
.s2-hero__bullets li { color: #d5d8d9; font-size: 15px; }
.s2-hero__bullets li::before { content: "+"; margin-right: 10px; color: var(--s2-yellow); font-weight: 900; }

.s2-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

.s2-hero__media { position: relative; min-height: 320px; overflow: hidden; }
.s2-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.s2-hero__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgb(9 11 12 / 0.65), rgb(9 11 12 / 0.1) 55%, rgb(9 11 12 / 0.35));
}

.s2-card {
  position: absolute;
  right: 28px;
  bottom: 28px;
  z-index: 2;
  width: 260px;
  padding: 22px;
  display: grid;
  gap: 6px;
  background: rgb(35 38 40 / 0.9);
  border: 1px solid #555a5c;
  box-shadow: 0 18px 60px rgb(0 0 0 / 0.5);
}
.s2-card b { font-size: 42px; font-weight: 900; line-height: 1; color: var(--s2-yellow); }
.s2-card span { color: #e1e3e3; font-size: 14px; }
.s2-card small { color: #aeb4b6; font-size: 9px; letter-spacing: 0.1em; text-transform: uppercase; }

@media (max-width: 900px) {
  .s2-hero__frame { grid-template-columns: 1fr; }
  .s2-hero__media { min-height: 300px; }
  .s2-hero--short .s2-hero__media { min-height: 220px; }
  .s2-card { right: 16px; bottom: 16px; width: 220px; padding: 16px; }
  .s2-card b { font-size: 32px; }
}
@media (max-width: 480px) {
  .s2-hero--short .s2-card { display: none; }
}

/* Stat bar (homepage, tall hero only) */
.s2-stats { margin-bottom: clamp(16px, 2vw, 32px); }
.s2-stats__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  margin: 0;
  background: #2a2d30;
  border: 1px solid var(--s2-line);
}
.s2-stats__item { padding: 24px 20px; border-right: 1px solid var(--s2-line); }
.s2-stats__item:last-child { border-right: 0; }
.s2-stats dt { font-size: 29px; font-weight: 900; line-height: 1; color: #fff; }
.s2-stats dd { margin: 7px 0 0; font-size: 9.5px; letter-spacing: 0.08em; text-transform: uppercase; color: #92999c; }
@media (max-width: 900px) {
  .s2-stats__list { grid-template-columns: repeat(2, 1fr); }
  .s2-stats__item { border-right: 0; border-bottom: 1px solid var(--s2-line); }
  .s2-stats__item:nth-child(odd) { border-right: 1px solid var(--s2-line); }
  .s2-stats__item:last-child { grid-column: 1 / -1; border-right: 0; border-bottom: 0; }
  .s2-stats__item:nth-last-child(2):nth-child(odd) { border-bottom: 0; }
}

/* =========================================================================
 * 6. Home sections
 * ========================================================================= */

/* -- intro-duo: two lifted cards, no longer overlapping a photo ---------- */
.style2 .introduo { padding-top: var(--section-pad-y); }
.style2 .introduo__panel {
  margin-top: 0;
  padding: 0;
  gap: 14px;
  background: none;
  border: 0;
  box-shadow: none;
}
.style2 .introduo__col,
.style2 .introduo__col:first-child,
.style2 .introduo__col:last-child {
  padding: clamp(24px, 1rem + 1.5vw, 34px);
  border: 1px solid var(--s2-line);
  border-radius: 0;
  background: var(--s2-card-grad);
}
.style2 .introduo__heading { font-size: clamp(17px, 0.9rem + 0.4vw, 20px); line-height: 1.2; }
.style2 .introduo__body { font-size: 14.5px; }
.style2 .introduo__actions .btn { padding: 0; border: 0; background: none; color: var(--s2-yellow); }
.style2 .introduo__actions .btn:hover { color: var(--s2-yellow2); }
@media (max-width: 992px) { .style2 .introduo__panel { gap: 14px; } }

/* -- section-heading ------------------------------------------------------ */
.style2 .secheading { padding-top: var(--section-pad-y); }

/* -- feature-split: Style 2 sets these as cards -------------------------
 * The homepage has three in a row. CSS cannot wrap siblings, so <main> itself
 * becomes the grid: three content columns between two gutter tracks, every
 * section spanning all five, and only the fsplit TRIO placed one per column.
 * Scoped with :has() to a page that actually HAS three in a row; a lone
 * fsplit (About's History band) stays a wide two-column card. */
.style2 .site-main:has(> .fsplit + .fsplit + .fsplit) {
  display: grid;
  grid-template-columns:
    minmax(var(--gutter), 1fr)
    repeat(3, minmax(0, calc(var(--container-max) / 3 - 10px)))
    minmax(var(--gutter), 1fr);
  column-gap: 14px;
  align-items: stretch;
}
.style2 .site-main:has(> .fsplit + .fsplit + .fsplit) > * { grid-column: 1 / -1; min-width: 0; }
/* Desktop only: these selectors out-rank the ≤900 single-column rule on
 * specificity (:has/:not count their arguments), so they must not apply there. */
@media (min-width: 901px) {
  .style2 .site-main > .fsplit:has(+ .fsplit + .fsplit):not(.fsplit + .fsplit) { grid-column: 2; }
  .style2 .site-main > .fsplit:not(.fsplit + .fsplit) + .fsplit:has(+ .fsplit) { grid-column: 3; }
  .style2 .site-main > .fsplit + .fsplit + .fsplit { grid-column: 4; }
}

.style2 .fsplit {
  margin: var(--space-md) auto 0;
  padding: 0;
  border: 1px solid var(--s2-line);
  background: var(--s2-panel);
  color: var(--s2-text);
  transition: border-color var(--dur-base), transform var(--dur-base);
}
.style2 .fsplit:hover { border-color: #5d6264; transform: translateY(-2px); }
.style2 .fsplit__media { border-radius: 0; }
.style2 .fsplit__panel,
.style2 .fsplit--teal .fsplit__panel,
.style2 .fsplit--charcoal .fsplit__panel,
.style2 .fsplit--wine .fsplit__panel {
  background: none;
  border-radius: 0;
  box-shadow: none;
}
.style2 .fsplit__body { font-size: 14.5px; }
.style2 .fsplit__cta { margin-top: 18px; }

/* In the trio: image on top, copy beneath, whichever side the editor chose. */
.style2 .site-main:has(> .fsplit + .fsplit + .fsplit) > .fsplit {
  display: flex;
  flex-direction: column;
  width: auto;
  max-width: none;
  margin-top: 38px;
}
.style2 .site-main:has(> .fsplit + .fsplit + .fsplit) .fsplit__media {
  height: 220px;
  border-bottom: 3px solid var(--s2-yellow);
}
.style2 .site-main:has(> .fsplit + .fsplit + .fsplit) .fsplit__panel {
  flex: 1;
  align-content: start;
  padding: 24px 26px 28px;
}
.style2 .site-main:has(> .fsplit + .fsplit + .fsplit) .fsplit__content { max-width: none; }
.style2 .site-main:has(> .fsplit + .fsplit + .fsplit) .fsplit__cta {
  padding: 0;
  border: 0;
  background: none;
  color: var(--s2-yellow);
}

/* A lone fsplit: the parent's two-column card, contained. */
.style2 .site-main > .fsplit { width: calc(100% - var(--gutter) * 2); max-width: var(--container-max); }

@media (max-width: 900px) {
  .style2 .site-main:has(> .fsplit + .fsplit + .fsplit) {
    grid-template-columns: var(--gutter) minmax(0, 1fr) var(--gutter);
  }
  .style2 .site-main:has(> .fsplit + .fsplit + .fsplit) > .fsplit { grid-column: 2; margin-top: 14px; }
}

/* -- partner-roll: white logo tiles on charcoal ------------------------- */
.style2 .proll { padding-top: var(--section-pad-y); }
.style2 .proll__inner { grid-template-columns: minmax(0, 1fr); gap: 30px; }
.style2 .proll__head { color: var(--s2-text); }
.style2 .proll__heading { white-space: normal; }
.style2 .proll__item {
  height: 110px;
  padding: 18px;
  background: #eef0f0;
  border: 1px solid var(--s2-line);
}
.style2 .proll__item img { max-height: 64px; object-fit: contain; filter: grayscale(1); opacity: 0.85; transition: filter var(--dur-base), opacity var(--dur-base); }
.style2 .proll__item:hover img { filter: none; opacity: 1; }
.style2 .proll__nav { color: #fff; border-radius: 3px; }
.style2 .proll__nav:hover { background: var(--s2-panel2); }
.style2 .proll--grid .proll__track { gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 180px), 1fr)); }
.style2 .proll--grid .proll__item img { max-height: 64px; }

/* -- testimonial-pair: dark glass cards, the photo kept faint ----------- */
.style2 .tpair {
  margin-top: var(--section-pad-y);
  padding-block: var(--section-pad-y);
  border-block: 1px solid var(--s2-line);
}
.style2 .tpair::before { background: rgb(29 32 34 / 0.86); }
.style2 .tpair__list { gap: 14px; }
.style2 .tpair__card {
  padding: 30px;
  border: 1px solid var(--s2-line);
  background: rgb(35 38 40 / 0.6);
  box-shadow: none;
}
.style2 .tpair__quote { font-family: var(--font-body); font-size: 19px; line-height: 1.35; color: #f0f1f1; }
.style2 .tpair__quote p { color: inherit; }
.style2 .tpair__attr { color: var(--s2-yellow); font-size: 11px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }

/* -- card-grid and child-pages (same .cgrid markup) --------------------- */
.style2 .cgrid__head { margin-bottom: 30px; }
.style2 .cgrid__heading { white-space: normal; }
.style2 .cgrid__all { color: var(--s2-yellow); font-size: 11px; font-weight: 800; letter-spacing: 0.05em; }
.style2 .cgrid__list { gap: 14px; }
.style2 .cgrid__card {
  padding: 0;
  border: 1px solid var(--s2-line);
  background: var(--s2-panel);
  box-shadow: none;
}
.style2 .cgrid__card:hover,
.style2 .cgrid__card:focus-within { transform: translateY(-2px); border-color: #6a7073; box-shadow: none; }
.style2 .cgrid__card:focus-within { outline-color: var(--s2-yellow); }
.style2 .cgrid__thumb { border-radius: 0; }
.style2 .cgrid__body { padding: 18px 20px 22px; gap: 12px; }
.style2 .cgrid__title { font-size: 15.5px; }
.style2 .cgrid__more {
  padding: 0;
  border: 0;
  background: none;
  color: var(--s2-yellow);
  font-size: 11px;
}
.style2 .cgrid__more::after { content: " \2192"; }
.style2 .cgrid__card:hover .cgrid__more,
.style2 .cgrid__card:focus-within .cgrid__more { background: none; color: var(--s2-yellow2); }

/* -- action-tiles ------------------------------------------------------- */
.style2 .atiles { padding-top: var(--section-pad-y); }
.style2 .atiles__list { gap: 14px; }
.style2 .atiles__tile { border: 1px solid var(--s2-line); }
.style2 .atiles__tile::before { background: rgb(20 22 24 / 0.62); }
.style2 .atiles__tile:hover::before { background: rgb(20 22 24 / 0.4); }
.style2 .atiles__text { font-size: clamp(18px, 1rem + 0.6vw, 24px); font-weight: 900; text-transform: uppercase; text-decoration-color: var(--s2-yellow); }
.style2 .atiles__icon { color: var(--s2-yellow); }

/* -- quote-band and quote-feature --------------------------------------- */
.style2 .qband__card {
  border: 1px solid var(--s2-line);
  border-left: 4px solid var(--s2-yellow);
  background: #2e3134;
  box-shadow: none;
}
.style2 .qband__quote { font-family: var(--font-body); color: #e1e3e3; font-size: 15.5px; }
.style2 .qband__quote p { color: inherit; }
.style2 .qband__attr { color: var(--s2-yellow); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; }

.style2 .qfeature { border: 1px solid var(--s2-line); background: var(--s2-panel); }
.style2 .qfeature::before,
.style2 .qfeature--accent::before,
.style2 .qfeature--primary::before,
.style2 .qfeature--charcoal::before {
  background-image: linear-gradient(90deg, rgb(20 22 24 / 0.9) 0%, rgb(20 22 24 / 0.7) 60%, rgb(20 22 24 / 0.45) 100%);
}
.style2 .qfeature--noimage.qfeature--accent,
.style2 .qfeature--noimage.qfeature--primary,
.style2 .qfeature--noimage.qfeature--charcoal { background: linear-gradient(110deg, #34322c, #25282a); }
.style2 .qfeature__quote { font-family: var(--font-body); font-weight: 600; font-size: clamp(20px, 1rem + 1vw, 28px); line-height: 1.3; letter-spacing: -0.01em; }
.style2 .qfeature__quote p { color: #f0f1f1; }
.style2 .qfeature__quote::before { color: var(--s2-yellow); opacity: 0.35; }
.style2 .qfeature__attr { color: var(--s2-yellow); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; }

/* =========================================================================
 * 7. Interior prose (Text Block) and the bands
 * ========================================================================= */

/* Links in imported copy: yellow with a soft underline. */
.style2 :is(.pblock__body, .mtext__body, .icol__text, .cform__intro) a:not(.btn) {
  color: var(--s2-yellow);
  text-decoration: none;
  border-bottom: 1px solid rgb(244 181 27 / 0.35);
}
.style2 :is(.pblock__body, .mtext__body, .icol__text, .cform__intro) a:not(.btn):hover { color: var(--s2-yellow2); border-bottom-color: var(--s2-yellow2); }

.style2 :is(.pblock__body, .mtext__body, .icol__text) strong { color: #fff; }

/* Prose headings: Style 2's uppercase display, white not wine. */
.style2 :is(.pblock__body, .mtext__body, .icol__text) h2 {
  color: #fff;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(26px, 1rem + 2vw, 40px);
  line-height: 1.04;
  letter-spacing: -0.035em;
  text-transform: uppercase;
}
.style2 :is(.pblock__body, .mtext__body, .icol__text) :is(h3, h4),
.style2 :is(.pblock__body, .mtext__body, .icol__text) h4[style] {
  color: #fff !important; /* parent retires an inline #425DBF the same way */
  font-weight: 900;
  font-size: clamp(18px, 0.95rem + 0.6vw, 22px);
  line-height: 1.12;
  text-transform: uppercase;
  letter-spacing: -0.01em;
}
.style2 :is(.pblock__body, .mtext__body, .icol__text) h4 { font-size: 15px; letter-spacing: 0.04em; }

/* Lists: Style 2's ruled list with a yellow "+", replacing disc bullets. */
.style2 :is(.pblock__body > .wpb_wrapper, .mtext__body > .wpb_wrapper, .icol__text, .s2-lead, .s2-band) ul {
  padding-left: 0;
  list-style: none;
}
.style2 :is(.pblock__body, .mtext__body, .icol__text) ul > li {
  margin: 0;
  padding: 11px 0;
  border-top: 1px solid var(--s2-line);
  color: #d5d8d9;
}
.style2 :is(.pblock__body, .mtext__body, .icol__text) ul > li::before {
  content: "+";
  margin-right: 10px;
  color: var(--s2-yellow);
  font-weight: 900;
}
.style2 :is(.pblock__body, .mtext__body, .icol__text) ul > li + li { margin-top: 0; }

/* The bands are wrappers the filter adds, so the parent's sibling-spacing
 * rule on .wpb_wrapper > * now spaces BANDS. Their own children need it too. */
.s2-lead > * + *,
.s2-band > * + * { margin-top: var(--space-xs); }
.s2-band > :is(h2, h3) + * { margin-top: var(--space-2xs); }
.s2-lead > :first-child,
.s2-band > :first-child { margin-top: 0; }

/* Lead: the first paragraphs, a step larger. */
.s2-lead > p:first-child { font-size: 17.5px; color: #c3c7c8; }

/* -- Bands in a full-width Text Block: full-bleed, alternating ---------
 * Breaks out of the container with the 50vw trick; body is overflow-x: clip
 * so the scrollbar width cannot cause a sideways scroll. The padding puts the
 * content straight back on the container edge. */
.style2 .vc_row.pblock .s2-band {
  margin-inline: calc(50% - 50vw);
  padding: clamp(44px, 2rem + 3vw, 72px) calc(50vw - 50%);
}
.style2 .vc_row.pblock .pblock__body > .wpb_wrapper > .s2-band { margin-top: clamp(44px, 2rem + 3vw, 72px); }
.style2 .vc_row.pblock .s2-band + .s2-band { margin-top: 0; }
.style2 .vc_row.pblock .s2-band:nth-child(odd of .s2-band) {
  background: var(--s2-deep);
  border-block: 1px solid var(--s2-line);
}
/* The last band sits on the footer's own margin; no gap of page ground. */
.style2 .vc_row.pblock:last-child .s2-band:last-child { margin-bottom: calc(var(--section-pad-y) * -1); }

/* -- Bands beside an image column: panels ------------------------------ */
.style2 .vc_row.mtext--inner .s2-band {
  margin-top: 22px;
  padding: clamp(22px, 1rem + 1vw, 30px);
  border: 1px solid var(--s2-line);
  border-left: 4px solid var(--s2-yellow);
  background: #2a2d30;
}
.style2 .vc_row.mtext--inner .s2-band:nth-child(even of .s2-band) { border-left-color: #697074; }

/* -- The two-column interior row: copy LEFT, images RIGHT --------------
 * The parent puts the image column first at 34%. Style 2's split runs copy
 * first and gives the media a little under half. Order only — the DOM, and
 * so the reading order for a screen reader, is unchanged. */
.style2 .vc_row.mtext--inner > .wpb_column > .vc_column-inner > .wpb_wrapper {
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(28px, 1rem + 3vw, 60px);
}
.style2 .vc_row.mtext--inner .icol {
  order: 2;
  position: sticky;
  top: 140px;
}
/* A column of 11 photos is taller than any viewport; sticky would pin its
 * top and hide the rest until the copy ran out. */
.style2 .vc_row.mtext--inner .icol:has(.istack--dense) { position: static; }

.style2 .istack { gap: 14px; }
.style2 .istack--dense { gap: 12px; }
.style2 .istack__item img,
.style2 .istack--dense .istack__item img {
  border-radius: 0;
  border: 1px solid var(--s2-line);
  background: var(--s2-panel);
}
.style2 .istack__item--logo img { border: 0; background: #eef0f0; padding: 16px; }

.style2 .icol__text {
  padding: 22px 26px;
  border: 1px solid var(--s2-line);
  background: var(--s2-panel2);
  font-size: 14.5px;
}
.style2 .icol__text h2 { font-size: clamp(20px, 1rem + 0.8vw, 26px); }
.style2 .icol__text ul > li:first-child { border-top: 0; }

@media (max-width: 992px) {
  .style2 .vc_row.mtext--inner > .wpb_column > .vc_column-inner > .wpb_wrapper { grid-template-columns: 1fr; }
  .style2 .vc_row.mtext--inner .icol { position: static; }
}

/* Imported CTA rows */
.style2 .row-cta-buttons { gap: 12px; }

/* About's media-text row (core vc_single_image + Text Block) */
.style2 .mtext .wpb_single_image img { border: 1px solid var(--s2-line); }

/* =========================================================================
 * 8. Contact form on charcoal
 * ========================================================================= */
.style2 .cform input[type="text"],
.style2 .cform input[type="email"],
.style2 .cform input[type="tel"],
.style2 .cform textarea {
  min-height: 48px;
  padding: 14px;
  border: 1px solid #474c4f;
  border-radius: 2px;
  background: #202325;
  color: #fff;
}
.style2 .cform textarea { min-height: 150px; }
.style2 .cform input:focus-visible,
.style2 .cform textarea:focus-visible { border-color: var(--s2-yellow); box-shadow: 0 0 0 3px rgb(244 181 27 / 0.18); }
.style2 .cform__interests { border: 1px solid var(--s2-line); background: var(--s2-panel); }
.style2 .cform__legend { color: #fff; font-size: 14px; font-weight: 900; letter-spacing: 0.04em; text-transform: uppercase; }
.style2 .cform .wpcf7-list-item label { color: #c8ced1; font-size: 14px; }
.style2 .cform input[type="checkbox"] { accent-color: var(--s2-yellow); }
.style2 .cform input[type="submit"] { cursor: pointer; }
.style2 .wpcf7-response-output { border-color: var(--s2-line); color: var(--s2-text); }

/* =========================================================================
 * 9. Footer
 * ========================================================================= */
.style2 .site-footer {
  margin-top: var(--section-pad-y);
  border-top: 1px solid var(--s2-line);
  border-radius: 0;
  background: var(--s2-floor);
  color: #9fa6a8;
}

/* The schedule strip becomes Style 2's warm "band". */
.style2 .sfooter__schedule {
  background: linear-gradient(110deg, #34322c, #25282a);
  border-bottom: 1px solid var(--s2-line);
}
.style2 .sfooter__schedule-inner { padding-block: clamp(28px, 1rem + 2vw, 44px); }
.style2 .sfooter__schedule-text {
  max-width: 44ch;
  color: #fff;
  font-size: clamp(18px, 0.9rem + 0.8vw, 24px);
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: -0.02em;
  text-transform: uppercase;
}
.style2 .sfooter__schedule-cta {
  background: var(--s2-yellow);
  border-color: var(--s2-yellow);
  color: var(--s2-ink);
}
.style2 .sfooter__schedule-cta:hover { background: var(--s2-yellow2); color: var(--s2-ink); }

.style2 .sfooter__mid { font-size: 13px; }
.style2 .sfooter__mid p { color: #9fa6a8; }
.style2 .site-footer .t-col-head {
  color: var(--s2-yellow);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.14em;
  line-height: 1.4;
}
.style2 .sfooter__links a,
.style2 .sfooter__col a { color: #c3c7c8; }
.style2 .sfooter__links a:hover,
.style2 .sfooter__col a:hover { color: var(--s2-yellow); text-decoration-color: transparent; }
.style2 .sfooter__brand img { width: 58px; height: 58px; }

.style2 .sfooter__bottom { border-top: 1px solid var(--s2-line); }
.style2 .sfooter__bottom-inner {
  padding-block: 18px;
  color: #7c8386;
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.style2 .sfooter__bottom-inner p { color: inherit; }