/* ============================================================
   OASIS DESIGN SYSTEM — adapted from oasisnaplesboatdetailing.com
   Navy gradients, light-blue accents, white rounded cards,
   pill buttons, Zalando Sans Expanded.
   Same selectors as the previous LSA system so every ACF
   builder partial keeps working untouched.
   ============================================================ */
:root {
  --navy:     #012A4A;  /* headings / primary        */
  --navy-2:   #013A63;  /* gradient partner          */
  --navy-3:   #1e3c72;  /* focus rings / chips       */
  --blue:     #89C2D9;  /* accent                    */
  --blue-2:   #A9D6E5;  /* accent light              */
  --ink:      #333333;  /* body text                 */
  --muted:    #666666;  /* secondary text            */
  --bg:       #f8f9fa;  /* page canvas               */
  --white:    #ffffff;
  --footer:   #1a1a1a;  /* footer background         */
  --green:    #28a745;  /* call-now button           */
  --green-2:  #20c997;
  --hairline: rgba(137, 194, 217, 0.35);

  --grad-navy: linear-gradient(135deg, #012A4A 0%, #013A63 100%);
  --grad-blue: linear-gradient(45deg, #89C2D9, #A9D6E5);
  --grad-blue-rev: linear-gradient(45deg, #A9D6E5, #89C2D9);
  --grad-green: linear-gradient(45deg, #28a745, #20c997);
  --grad-green-rev: linear-gradient(45deg, #20c997, #28a745);

  --radius:   15px;
  --radius-sm: 10px;
  --shadow-card: 0 5px 20px rgba(0, 0, 0, 0.1);
  --shadow-card-hover: 0 8px 25px rgba(0, 0, 0, 0.15);

  --serif:  "Zalando Sans Expanded", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  --sans:   "Zalando Sans Expanded", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  --cond:   "Zalando Sans Expanded", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

/* ============================================================
   BASE / TYPOGRAPHY
   ============================================================ */
html { scroll-behavior: smooth; }
section[id], .profile-row[id] { scroll-margin-top: 120px; } /* anchored blocks clear the sticky header */

body,
button, input, select, optgroup, textarea {
  font-family: var(--sans);
  color: var(--ink);
}

body {
  background: var(--bg);
  font-weight: 400;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--sans);
  font-weight: 700;
  color: var(--navy);
  line-height: 1.2;
}

h1 { font-size: clamp(34px, 4.2vw, 56px); }
h2 { font-size: clamp(28px, 3.2vw, 40px); }
h3 { font-size: clamp(22px, 2.4vw, 28px); }
h4 { font-size: clamp(18px, 2vw, 22px); }
h5, h6 { font-weight: 700; text-transform: uppercase; letter-spacing: 1px; }

h1 em, h2 em, h3 em, h4 em,
h1 span, h2 span, h3 span,
h3 .purple, .title .purple {
  font-style: normal;
  color: var(--blue) !important;
  font-weight: 700;
}

p { line-height: 1.8; color: var(--muted); }

a { color: var(--blue); transition: color .3s ease; }
a:hover { color: var(--navy); text-decoration: none; }

::selection { background: var(--blue); color: var(--navy); }

hr { border-top: 1px solid var(--hairline); }

blockquote {
  font-style: italic;
  font-size: clamp(20px, 2.2vw, 28px);
  color: var(--navy);
  border-left: 4px solid var(--blue);
  padding-left: 24px;
}

/* ============================================================
   BUTTONS — pill, uppercase, blue gradient (reference .btn)
   ============================================================ */
.btn,
.btn-large,
.btn-green,
.btn-outline,
button[type="submit"],
input[type="submit"],
.wpcf7 input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--grad-blue) !important;
  color: var(--navy) !important;
  font-family: var(--sans) !important;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none !important;
  padding: 15px 30px;
  border: 2px solid var(--blue) !important;
  border-radius: 50px !important;
  cursor: pointer;
  transition: all .3s ease;
  box-shadow: none !important;
}
.btn:hover, .btn:focus,
.btn-large:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
.wpcf7 input[type="submit"]:hover {
  background: var(--grad-blue-rev) !important;
  border-color: var(--blue) !important;
  color: var(--navy) !important;
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(137, 194, 217, 0.3) !important;
}

/* green variant — the reference "call now" button */
.btn-green {
  background: var(--grad-green) !important;
  color: var(--white) !important;
  border-color: var(--green) !important;
  box-shadow: 0 5px 15px rgba(40, 167, 69, 0.4) !important;
}
.btn-green:hover {
  background: var(--grad-green-rev) !important;
  color: var(--white) !important;
  border-color: var(--green) !important;
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(40, 167, 69, 0.5) !important;
}

/* outline variants → white/navy outline (reference .btn-secondary) */
.btn-outline, .btn-outline.blue, .btn-outline.darkblue, .btn-outline.orange,
.btn-outline.grey, .btn-outline.black, .btn-outline-white, .btn-outline.white {
  background: transparent !important;
  color: var(--navy) !important;
  border-color: var(--navy) !important;
}
.btn-outline:hover, .btn-outline-white:hover {
  background: var(--navy) !important;
  color: var(--white) !important;
  transform: translateY(-3px);
}

/* ============================================================
   HEADER / NAV — sticky navy gradient bar, white links,
   animated light-blue underline (reference .navbar)
   ============================================================ */
.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--grad-navy);
  border-bottom: none;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.site-header .navbar { background: transparent; padding: 12px 0; }
.site-header .navbar-brand img { max-height: 60px; width: auto; }

.site-header .header-nav,
.site-header .header-nav > li > a {
  font-family: var(--sans);
  font-weight: 500;
  font-size: 16px;
  letter-spacing: 0.3px;
  text-transform: none;
}
.site-header .header-nav > li > a,
.site-header .navbar-nav .nav-link,
ul.header-nav li a {
  color: var(--white) !important;
  background: transparent !important;
  text-decoration: none;
  transition: color .3s ease;
}
.site-header .header-nav > li > a:hover,
.site-header .header-nav > li.current-menu-item > a,
.site-header .header-nav > li.current_page_item > a,
ul.header-nav li a:hover {
  color: var(--blue) !important;
}

/* hover/active underline — light blue, growing from the left */
#menu-main-menu .menu-item > a::before {
  background: var(--blue) !important;
  height: 2px !important;
  top: calc(50% + 14px) !important;
  bottom: auto !important;
}
#menu-main-menu .current-menu-item > a::before,
#menu-main-menu .current_page_item > a::before { width: 100%; left: 0; }
#menu-main-menu .sub-menu .menu-item > a::before { display: none; }

/* dropdowns — white rounded panel, light-blue top accent */
header .menu-item:hover .sub-menu,
header .menu-item:focus .sub-menu,
header .menu-item:focus-within .sub-menu {
  background: var(--white);
  border: none;
  border-top: 3px solid var(--blue);
  border-radius: 0 0 var(--radius-sm) var(--radius-sm);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
  padding: 8px 0;
  min-width: 240px;
  top: calc(50% + 24px); /* right below the hover underline */
}
#menu-main-menu .sub-menu .menu-item > a,
.site-header .sub-menu li a {
  color: var(--ink) !important;
  font-family: var(--sans);
  font-weight: 500;
  letter-spacing: 0.3px;
  text-transform: none;
  font-size: 15px;
  padding: 12px 24px !important;
  margin: 0;
  white-space: nowrap;
  border-bottom: 1px solid rgba(137, 194, 217, 0.18);
  transition: color .2s ease, background .2s ease;
}
#menu-main-menu .sub-menu .menu-item:last-child > a { border-bottom: none; }
#menu-main-menu .sub-menu .menu-item > a::after { background-color: var(--blue); }
#menu-main-menu .sub-menu .menu-item > a:hover,
.site-header .sub-menu li a:hover {
  color: var(--navy) !important;
  background: rgba(137, 194, 217, 0.12) !important;
}

/* dropdown-only parents (href="#"): no pointer, no navigation */
#menu-main-menu > .menu-item > a[href="#"] { cursor: default; }

/* arrow on top-level items that have sub-pages */
#menu-main-menu > .menu-item-has-children > a::after {
  content: "\25BE";
  display: inline-block;
  margin-left: 6px;
  font-size: 11px;
  line-height: 1;
  color: currentColor;
  background: none;
  vertical-align: 1px;
  transition: transform .2s ease;
}
#menu-main-menu > .menu-item-has-children:hover > a::after,
#menu-main-menu > .menu-item-has-children:focus-within > a::after {
  transform: rotate(180deg);
}
/* the mobile mmenu panel has its own arrow buttons — no inline arrow there */
.mm-menu .menu-item > a::after { content: none !important; }

/* third-level flyout — opens to the side of its parent item */
.site-header .sub-menu .menu-item { position: relative; }
header .menu-item:hover .sub-menu .sub-menu { display: none; }
header .sub-menu .menu-item:hover > .sub-menu,
header .sub-menu .menu-item:focus-within > .sub-menu {
  display: block !important;
  position: absolute;
  left: 100%;
  top: -3px;
  margin-left: 1px;
  background: var(--white);
  border: none;
  border-top: 3px solid var(--blue);
  border-radius: 0 0 var(--radius-sm) var(--radius-sm);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
  padding: 8px 0;
  min-width: 240px;
  z-index: 20;
}
/* chevron hint on submenu items that have children */
#menu-main-menu .sub-menu .menu-item-has-children > a::after {
  content: "\203A";
  float: right;
  background: none;
  color: var(--blue);
  font-size: 16px;
  line-height: 1;
}

.navbar-toggler-icon { color: var(--white); }

/* mobile mmenu — white panel, stacked list, navy text (reference mobile menu) */
.mm-menu {
  --mm-color-background: #ffffff;
  --mm-color-background-highest: #f8f9fa;
  --mm-color-background-emphasis: rgba(137, 194, 217, 0.12);
  --mm-color-border: rgba(137, 194, 217, 0.3);
  --mm-color-button: #012A4A;
  --mm-color-text: #333333;
  --mm-color-text-dimmed: #012A4A;
  background: var(--white);
}
.mm-panels, .mm-panel { background: var(--white) !important; color: var(--ink); }

/* the desktop .header-nav flex rules leak into the mmenu panel — force a stacked list */
.mm-menu ul.header-nav,
.mm-menu ul.mm-listview {
  display: block !important;
  width: 100% !important;
  height: auto !important;
}
.mm-menu .mm-listitem { display: block !important; position: relative; }
.mm-menu .mm-listview a,
.mm-menu .mm-listitem__text {
  color: var(--ink) !important;
  background: transparent !important;
  padding: 16px 20px !important;
  margin: 0 !important;
  font-family: var(--sans) !important;
  font-weight: 500;
  font-size: 16px;
  text-transform: none !important;
  letter-spacing: 0.3px;
}
.mm-menu .mm-listitem { border-bottom: 1px solid rgba(137, 194, 217, 0.2); }
.mm-menu .mm-listview .current-menu-item > a,
.mm-menu .mm-listview .current_page_item > a { color: var(--navy) !important; font-weight: 700; }
li.current-menu-ancestor a.mm-listitem__text { background: transparent !important; color: var(--navy) !important; }

/* submenu arrow buttons — slim navy chevron */
.mm-menu a.mm-btn.mm-btn_next.mm-listitem__btn {
  background: transparent !important;
  width: 56px !important;
  height: 100% !important;
  border-left: 1px solid rgba(137, 194, 217, 0.3);
}
.mm-menu .mm-btn_next:after, .mm-menu .mm-btn:after, .mm-menu .mm-btn:before { border-color: var(--navy) !important; }

/* panel header */
.mm-menu .mm-navbar {
  background: var(--grad-navy);
  border-bottom: none;
}
.mm-menu a.mm-navbar__title, .mm-menu .mm-navbar__title {
  color: var(--white) !important;
  font-family: var(--sans) !important;
  font-weight: 700;
  text-transform: uppercase !important;
  letter-spacing: 1px;
}
.mm-panels .header-nav li.btn_header a { background: var(--grad-blue) !important; color: var(--navy) !important; border-radius: 50px; }

/* ============================================================
   HOME SLIDER — hero over navy veil, white headline
   (reference .hero)
   ============================================================ */
.home-slider .item { position: relative; padding: 140px 0 130px; text-align: center; }
.home-slider .item h2 { margin: 0 auto 20px; max-width: 1000px; }
.home-slider .item h4 { max-width: 780px; margin: 0 auto 30px; }
.home-slider .item::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--grad-navy);
}
.home-slider .item .container { position: relative; z-index: 1; }
.home-slider .item h2 {
  font-weight: 700;
  font-size: clamp(36px, 4.4vw, 56px);
  line-height: 1.2;
  color: var(--white);
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
}
.home-slider .item h2 em, .home-slider .item h2 span { color: var(--blue-2); font-style: normal; }
.home-slider .item h4 {
  font-weight: 400;
  font-size: clamp(16px, 1.4vw, 21px);
  line-height: 1.6;
  color: var(--white);
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

/* slides WITH a background image: dark veil so the photo shows through */
.home-slider .item.has-image::before {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4));
}
.home-slider .item, .home-slider .item.has-image {
  background-size: cover;
  background-position: center;
}
.home-slider .item.has-image h2 { color: var(--white); }
.home-slider .item.has-image h2 em, .home-slider .item.has-image h2 span { color: var(--blue-2); }
.home-slider .item.has-image h4 { color: var(--white); }

.owl-theme .owl-dots .owl-dot span { background: rgba(137, 194, 217, 0.4); border-radius: 50px; width: 24px; height: 4px; }
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span { background: var(--blue); }

/* ============================================================
   PAGE BANNERS (entry-header) — navy gradient veil + white title
   (reference .page-header)
   ============================================================ */
header.entry-header {
  position: relative;
  padding: 100px 0 60px;
  text-align: center;
  background-size: cover;
  background-position: center;
}
header.entry-header::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(1, 42, 74, 0.92) 0%, rgba(1, 58, 99, 0.9) 100%);
}
header.entry-header .container { position: relative; z-index: 1; }
header.entry-header .entry-title {
  font-weight: 700;
  color: var(--white);
  font-size: clamp(36px, 4.2vw, 56px);
  line-height: 1.15;
  margin: 0;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
header.entry-header .entry-title::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  border-radius: 50px;
  background: var(--blue);
  margin: 24px auto 0;
}
header.entry-header .desc {
  font-weight: 400;
  font-size: 19px;
  line-height: 1.7;
  color: var(--white);
  opacity: 0.9;
  max-width: 680px;
  margin: 22px auto 0;
}
header.entry-header .breadcrumb { justify-content: center; margin: 18px 0 0; }

/* breadcrumbs */
.breadcrumb { background: transparent; }
.breadcrumb-item, .breadcrumb-item a, .breadcrumb-item.active,
.breadcrumb-item + .breadcrumb-item::before {
  font-weight: 500;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--blue-2);
}
.breadcrumb-item a:hover { color: var(--white); }

/* ============================================================
   CONTENT SECTIONS — light canvas, alternating white bands
   ============================================================ */
.site-content { background: var(--bg); }
section.padded, section.padded-md, section.padded-top-md { background: transparent; }

/* spacing utilities the theme uses but never defined (stylesheet.css shipped empty) */
.padded-md { padding-top: 70px; padding-bottom: 70px; }
/* simple content block — extra breathing room (emp-block variants keep 70px) */
section.padded-md:not(.emp-block) { padding-top: 80px; padding-bottom: 80px; }
/* per-block spacing control (ACF "Spacing" field) */
section.padded-md.spacing-compact { padding-top: 40px !important; padding-bottom: 40px !important; }
section.padded-md.spacing-none { padding-top: 0 !important; padding-bottom: 0 !important; }

/* simple content typography: blue check bullets + eyebrows + readable column */
section.padded-md:not(.emp-block) .col-12 > h2 { margin-top: 48px; margin-bottom: 18px; }
section.padded-md:not(.emp-block) .col-12 > h2:first-child { margin-top: 0; }
section.padded-md:not(.emp-block) h6 {
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--blue);
  margin: 48px 0 10px;
}
section.padded-md:not(.emp-block) h6 + h2 { margin-top: 0; }
section.padded-md:not(.emp-block) ul {
  list-style: none;
  padding: 0;
  margin: 20px 0 24px;
}
section.padded-md:not(.emp-block) ul li {
  position: relative;
  padding-left: 26px;
  margin-bottom: 12px;
  line-height: 1.7;
  color: var(--ink);
}
section.padded-md:not(.emp-block) ul li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  top: 0;
  width: auto;
  height: auto;
  background: none;
  color: var(--blue);
  font-weight: 700;
  transform: none;
}
.padded-top-md { padding-top: 70px; }
.padded-bottom-md { padding-bottom: 70px; }
.padded-lr-md { padding-left: 40px; padding-right: 40px; }

/* simple content: optional centered variant — centers ALL block content */
section.is-centered .col-12 { text-align: center; }
section.padded-md.is-centered .col-12 > h2,
section.padded-md.is-centered .col-12 > h3,
section.padded-md.is-centered .col-12 > h4,
section.padded-md.is-centered .col-12 > p {
  max-width: 900px;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center;
}
section.padded-md.is-centered .col-12 > ul {
  display: inline-block;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
}
section.is-centered h2::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  border-radius: 50px;
  background: var(--blue);
  margin: 22px auto 0;
}

/* gallery carousel — contained height, rounded cards (reference .gallery-item) */
.carousel-nav { display: none; } /* legacy nav buttons, never wired to the carousel */
.gallery-carousel .item {
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-card);
}
.gallery-carousel .item img {
  width: 100%;
  height: clamp(320px, 44vw, 540px);
  object-fit: cover;
  transition: transform .3s ease;
}
.gallery-carousel .item:hover img { transform: scale(1.05); }
.gallery-carousel.owl-theme .owl-nav,
.home-slider.owl-theme .owl-nav {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  margin: 0;
  display: flex;
  justify-content: space-between;
  padding: 0 16px;
  pointer-events: none;
}
.gallery-carousel.owl-theme .owl-nav [class*="owl-"],
.home-slider.owl-theme .owl-nav [class*="owl-"] {
  pointer-events: auto;
  margin: 0;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.92);
  color: var(--navy);
  font-size: 26px;
  line-height: 1;
  border: none;
  border-radius: 50%;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
  transition: background .2s ease, color .2s ease;
}
.gallery-carousel.owl-theme .owl-nav [class*="owl-"]:hover,
.home-slider.owl-theme .owl-nav [class*="owl-"]:hover {
  background: var(--navy);
  color: var(--white);
}
.gallery-carousel.owl-theme .owl-dots { margin-top: 20px; }
.home-slider.owl-theme .owl-dots { position: absolute; left: 0; right: 0; bottom: 26px; margin: 0; }
.home-slider.owl-theme { position: relative; }

/* replace the browser's blue focus ring with a palette one, site-wide */
button:focus, .owl-carousel button:focus, .btn:focus, a:focus {
  outline: none;
  box-shadow: none !important;
}
button:focus-visible, a:focus-visible, .btn:focus-visible,
input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 2px solid var(--navy-3) !important;
  outline-offset: 2px;
  box-shadow: none !important;
}

/* CTA block — navy gradient band, white headline (reference .cta-section) */
section.cta-block { position: relative; background-size: cover; background-position: center; }
section.cta-block::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(1, 42, 74, 0.94) 0%, rgba(1, 58, 99, 0.92) 100%);
}
section.cta-block .container { position: relative; z-index: 1; }
section.cta-block { padding-top: 80px; padding-bottom: 80px; }
/* the partial prints <p> and .buttons as direct flex children of .row — stack them */
section.cta-block .row > p,
section.cta-block .row > .buttons {
  flex-basis: 100%;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}
section.cta-block .buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
  padding-top: 32px;
}
section.cta-block h2 { margin-bottom: 20px; }
section.cta-block h2, section.cta-block .white {
  font-weight: 700;
  color: var(--white) !important;
}
section.cta-block p { color: var(--white); opacity: 0.9; font-size: 18px; }
section.cta-block .cta-disclaimer { margin-top: 32px; margin-bottom: 0; }
/* outline buttons read better on the navy band (reference .cta-section .btn-secondary) */
section.cta-block .btn-outline, section.cta-block .btn-outline-white {
  background: rgba(255, 255, 255, 0.1) !important;
  color: var(--white) !important;
  border-color: var(--white) !important;
  backdrop-filter: blur(10px);
}
section.cta-block .btn-outline:hover, section.cta-block .btn-outline-white:hover {
  background: var(--white) !important;
  color: var(--navy) !important;
}

/* ============================================================
   LANDING SECTIONS — hero / stats / quote
   ============================================================ */
.eyebrow {
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--blue);
  margin: 0;
}
.eyebrow--center { text-align: center; }

.btn-gold {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--grad-blue);
  color: var(--navy) !important;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none !important;
  padding: 16px 36px;
  border: 2px solid var(--blue);
  border-radius: 50px;
  cursor: pointer;
  transition: all .3s ease;
}
.btn-gold:hover {
  background: var(--grad-blue-rev);
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(137, 194, 217, 0.3);
}

/* hero — navy gradient, white headline (reference .hero) */
.hero {
  position: relative;
  background: var(--grad-navy);
  overflow: hidden;
  padding: 80px 24px 96px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.hero > * { position: relative; z-index: 1; }
.hero__eyebrow {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 32px;
}
.hero__eyebrow .rule { width: 36px; height: 2px; border-radius: 50px; background: var(--blue); }
.eyebrow-text {
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--blue-2);
}
.hero__video {
  position: relative;
  width: 720px;
  max-width: 100%;
  margin: 0 0 40px;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5);
}
.hero__headline {
  font-weight: 700;
  color: var(--white);
  font-size: clamp(32px, 4.4vw, 56px);
  line-height: 1.2;
  margin: 0 0 24px;
  max-width: 1100px;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
}
.hero__headline em { font-style: normal; color: var(--blue-2); }
.hero__sub {
  font-weight: 400;
  font-size: clamp(16px, 1.4vw, 21px);
  line-height: 1.8;
  color: var(--white);
  opacity: 0.92;
  max-width: 900px;
  margin: 0 0 34px;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}
.hero__sub .refresh {
  font-weight: 700;
  color: var(--blue-2);
  font-size: clamp(22px, 2.2vw, 30px);
}
.hero__scroll {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  margin-top: 52px;
  text-decoration: none;
}
.hero__scroll-label {
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--blue-2);
}
.hero__scroll-line {
  width: 2px;
  height: 40px;
  border-radius: 50px;
  background: linear-gradient(180deg, var(--blue), rgba(137, 194, 217, 0));
}
.hero__scroll-arrow {
  width: 36px;
  height: auto;
  fill: none;
  stroke: var(--blue);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  animation: scroll-bounce 1.8s ease-in-out infinite;
  transition: transform .25s ease;
}
.hero__scroll:hover .hero__scroll-arrow { transform: scale(1.12); }
@keyframes scroll-bounce {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(12px); }
}
@media (prefers-reduced-motion: reduce) {
  .hero__scroll-arrow { animation: none; }
}

/* stats — light cards with big navy numbers (reference .stat-item) */
.stats {
  background: var(--white);
  padding: 80px 24px;
  position: relative;
}
.stats .eyebrow { margin-bottom: 50px; }
.stats__grid {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  align-items: stretch;
}
.stat {
  text-align: center;
  padding: 40px 24px;
  position: relative;
  background: var(--bg);
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
}
.stat__num {
  font-weight: 700;
  color: var(--navy);
  line-height: 1;
  margin: 0 0 14px;
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 4px;
}
.stat__num span { font-size: clamp(48px, 5vw, 72px); }
.stat__num em {
  font-style: normal;
  font-weight: 700;
  color: var(--blue);
  font-size: clamp(32px, 3.4vw, 52px);
}
.stat__num .plus { font-weight: 700; }
.stat__num--italic em { font-weight: 700; }
.stat__num .pct { font-size: clamp(26px, 2.8vw, 52px); }
.stat__desc {
  font-size: 16px;
  line-height: 1.5;
  font-weight: 600;
  color: var(--muted);
  max-width: 300px;
  margin: 0 auto;
}
@media (max-width: 640px) {
  .stats__grid { grid-template-columns: 1fr; gap: 24px; }
}

/* pull quote — testimonial style (reference .testimonial) */
.quote {
  background: var(--white);
  padding: 100px 24px;
  position: relative;
  text-align: center;
  overflow: hidden;
}
.quote__mark {
  position: absolute;
  font-weight: 700;
  font-size: 280px;
  line-height: 1;
  color: var(--blue);
  opacity: 0.12;
  user-select: none;
}
.quote__mark--open  { top: -30px;  left: 9%; }
.quote__mark--close { bottom: -130px; right: 9%; }
.quote__body {
  font-style: italic;
  font-weight: 400;
  color: var(--navy);
  font-size: clamp(24px, 2.8vw, 40px);
  line-height: 1.35;
  margin: 0 0 30px;
  position: relative;
  border-left: none;
  padding-left: 0;
}
.quote__hl {
  font-weight: 700;
  color: var(--blue);
  text-decoration: underline;
  text-decoration-color: rgba(137, 194, 217, 0.6);
  text-decoration-thickness: 2px;
  text-underline-offset: 8px;
}
.quote__divider {
  display: block;
  width: 60px; height: 3px;
  border-radius: 50px;
  background: var(--blue);
  margin: 0 auto 24px;
}
.quote__eyebrow { font-weight: 700; margin-bottom: 12px; }
.quote__author {
  font-weight: 700;
  font-size: 17px;
  letter-spacing: 0.5px;
  color: var(--navy);
  margin: 0;
}
@media (max-width: 900px) {
  .quote__mark { font-size: 160px; }
}

/* contact split person card */
.contact-split__rule {
  display: block;
  width: 100%;
  max-width: 460px;
  height: 1px;
  background: var(--hairline);
  margin: 40px 0 32px;
}
.contact-split__person { display: flex; align-items: center; gap: 22px; }
.contact-split__avatar {
  width: 80px; height: 80px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: var(--shadow-card);
  border: 3px solid var(--blue);
}
.contact-split__name {
  font-weight: 700;
  font-size: 20px;
  color: var(--navy);
  margin: 0 0 6px;
}
.contact-split__role {
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--blue);
  margin: 0;
}
.contact-split__li {
  margin-left: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 55px; height: 55px;
  border: 2px solid var(--blue);
  border-radius: 50%;
  color: var(--navy) !important;
  font-size: 22px;
  transition: background .25s ease, color .25s ease;
}
.contact-split__li:hover { background: var(--blue); color: var(--navy) !important; }

/* ============================================================
   FEATURE GRID — white rounded cards (reference .service-card)
   ============================================================ */
.services {
  background: var(--bg);
  padding: 80px 24px 90px;
}
.services__head {
  max-width: 1200px;
  margin: 0 auto 50px;
  text-align: center;
}
.services__title {
  font-weight: 700;
  color: var(--navy);
  font-size: clamp(30px, 3.4vw, 42px);
  line-height: 1.15;
  margin: 0 0 20px;
}
.services__title em { font-style: normal; font-weight: 700; color: var(--blue); }
.services__intro {
  font-size: 17px;
  line-height: 1.8;
  color: var(--muted);
  margin: 0 auto;
  max-width: 800px;
}
.services__grid {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  border-top: none;
}
.services__grid .card {
  background: var(--white);
  border: none;
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
  display: block;
  padding: 40px 30px;
  text-align: center;
  transition: transform .3s ease;
}
.services__grid .card:hover { transform: translateY(-10px); }
.services__grid .card__num {
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 1px;
  color: var(--blue);
}
.services__grid .card__icon {
  display: block;
  margin: 22px 0 24px;
}
.services__grid .card__icon img { width: 44px; height: 44px; object-fit: contain; margin: 0 auto; }
.services__grid .card__title {
  font-weight: 700;
  font-size: 22px;
  text-transform: none;
  letter-spacing: 0;
  color: var(--navy);
  margin: 18px 0 14px;
}
.services__grid .card__desc {
  font-size: 16px;
  line-height: 1.7;
  color: var(--muted);
}
.services__grid .card__desc p { margin-bottom: 16px; }
/* lists inside cards — blue check bullets */
.services__grid .card__desc ul {
  list-style: none;
  padding: 0;
  margin: 16px 0 18px;
  text-align: left;
}
.services__grid .card__desc ul li {
  position: relative;
  padding-left: 26px;
  margin-bottom: 10px;
  line-height: 1.65;
  color: var(--ink);
}
.services__grid .card__desc ul li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  top: 0;
  width: auto;
  height: auto;
  background: none;
  color: var(--blue);
  font-weight: 700;
  transform: none;
}
@media (max-width: 900px) {
  .services__grid { grid-template-columns: 1fr; }
  .services__grid .card { padding: 32px 24px; }
}

/* ============================================================
   LOGO SLIDER — smooth marquee of sponsor/partner logos
   ============================================================ */
section.padded-md.logo-slider-block { padding-top: 20px; }
.logo-slider-block__title { text-align: center; margin-bottom: 56px; }
.logo-slider-block__title::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  border-radius: 50px;
  background: var(--blue);
  margin: 22px auto 0;
}
.logo-slider .logo-slider__item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 170px;
}
.logo-slider .logo-slider__item a { display: flex; align-items: center; justify-content: center; height: 100%; width: 100%; }
.logo-slider .logo-slider__item img {
  max-height: 143px;
  max-width: 234px;
  width: auto !important;
  object-fit: contain;
  transition: transform .3s ease;
}
.logo-slider .logo-slider__item a:hover img { transform: scale(1.06); }

/* ============================================================
   EMBED BLOCK — third-party widgets on-palette
   ============================================================ */
.embed-block { min-height: 320px; }
#ja-jobs-widget { max-width: 1000px; margin: 0 auto; }

/* search bar */
#ja-jobs-widget .ja-job-search { margin-bottom: 56px; }
#ja-jobs-widget .ja-form {
  display: flex;
  align-items: flex-end;
  gap: 28px;
  flex-wrap: wrap;
}
#ja-jobs-widget .ja-field-container { flex: 1 1 320px; }
#ja-jobs-widget .ja-form label {
  display: block;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--navy);
  margin-bottom: 8px;
}
#ja-jobs-widget .ja-field input {
  width: 100%;
  border: 2px solid #e9ecef !important;
  border-radius: 8px !important;
  background: var(--white) !important;
  padding: 12px 15px !important;
  font-size: 16px;
  color: var(--ink);
}
#ja-jobs-widget .ja-field input:focus { border-color: var(--navy-3) !important; outline: none; }
#ja-jobs-widget input.ja-button {
  background: var(--grad-blue) !important;
  color: var(--navy) !important;
  border: 2px solid var(--blue) !important;
  border-radius: 50px !important;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 14px 36px !important;
  cursor: pointer;
  transition: all .3s ease;
}
#ja-jobs-widget input.ja-button:hover { transform: translateY(-3px); box-shadow: 0 10px 20px rgba(137, 194, 217, 0.3); }

/* job cards */
#ja-jobs-widget .job {
  background: var(--white);
  border: none;
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
  padding: 40px 44px;
  margin-bottom: 28px;
  transition: transform .25s ease, box-shadow .25s ease;
}
#ja-jobs-widget .job:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-card-hover);
}
#ja-jobs-widget .job h2.title {
  font-size: clamp(22px, 2.4vw, 30px);
  margin: 0 0 14px;
}
#ja-jobs-widget .job h2.title a {
  color: var(--navy) !important;
  text-decoration: none;
  transition: color .2s ease;
}
#ja-jobs-widget .job h2.title a:hover { color: var(--blue) !important; }
#ja-jobs-widget .job .meta {
  display: flex;
  align-items: center;
  gap: 10px 22px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}
#ja-jobs-widget .job .date-posted {
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--blue);
  margin: 0;
  order: -1;
}
#ja-jobs-widget .job .classifications {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
#ja-jobs-widget .job .classifications li {
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--navy);
  border: 2px solid var(--hairline);
  border-radius: 50px;
  padding: 5px 14px;
}
#ja-jobs-widget .job .summary {
  font-size: 16px;
  line-height: 1.8;
  color: var(--muted);
  margin: 0 0 26px;
}
#ja-jobs-widget .job a.view-details {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--grad-blue) !important;
  color: var(--navy) !important;
  border: 2px solid var(--blue);
  border-radius: 50px;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none !important;
  padding: 12px 28px;
  transition: all .3s ease;
}
#ja-jobs-widget .job a.view-details:hover { transform: translateY(-3px); box-shadow: 0 10px 20px rgba(137, 194, 217, 0.3); }

/* pager */
#ja-jobs-widget .ja-pager-container { text-align: center; margin-top: 48px; }
#ja-jobs-widget .ja-pager { display: inline-flex; align-items: center; flex-wrap: wrap; justify-content: center; }
#ja-jobs-widget .ja-pager .current-page,
#ja-jobs-widget .ja-pager a.page,
#ja-jobs-widget .ja-pager a.next,
#ja-jobs-widget .ja-pager a.previous {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  height: 48px;
  padding: 0 18px;
  margin: 0 6px 8px;
  border: 2px solid var(--navy-3);
  border-radius: 50px;
  color: var(--navy) !important;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none !important;
  transition: all .25s ease;
}
#ja-jobs-widget .ja-pager a.page:hover,
#ja-jobs-widget .ja-pager a.next:hover,
#ja-jobs-widget .ja-pager a.previous:hover {
  background: var(--navy-3);
  color: var(--white) !important;
}
#ja-jobs-widget .ja-pager .current-page {
  background: var(--navy-3);
  border-color: var(--navy-3);
  color: var(--white) !important;
}
#ja-jobs-widget .ja-pager-summary {
  font-weight: 500;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--muted);
  margin-top: 10px;
}
#ja-jobs-widget .powered-by-jobadder {
  text-align: center;
  margin-top: 26px;
  opacity: 0.55;
  font-size: 13px;
}
@media (max-width: 640px) {
  #ja-jobs-widget .job { padding: 28px 22px; }
}

/* hosted application form (cross-origin iframe) — framed as a card */
.ja-apply-form {
  max-width: 900px;
  margin: 0 auto;
  background: var(--white);
  border: none;
  border-radius: var(--radius);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
  padding: 16px;
}
.ja-apply-form iframe {
  width: 100%;
  height: 1500px;
  border: 0;
  display: block;
}
@media (max-width: 640px) {
  .ja-apply-form { padding: 8px; }
  .ja-apply-form iframe { height: 1700px; }
}

/* ============================================================
   PROFILE LIST — detailed people rows with collapsible bios
   ============================================================ */
.profile-list__title { text-align: center; margin-bottom: 64px; }
.profile-list__title::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  border-radius: 50px;
  background: var(--blue);
  margin: 22px auto 0;
}
.profile-list__items { max-width: 1100px; margin: 0 auto; }
.profile-row {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 56px;
  align-items: start;
  padding: 60px 0;
  border-bottom: 1px solid rgba(137, 194, 217, 0.3);
}
.profile-row:first-child { padding-top: 0; }
.profile-row:last-child { border-bottom: none; padding-bottom: 0; }
.profile-row__media { text-align: center; }
.profile-row__photo {
  width: 240px;
  height: 240px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
  display: inline-block;
}
.profile-row__name {
  font-weight: 700;
  font-size: clamp(26px, 2.8vw, 34px);
  color: var(--navy);
  margin: 0 0 8px;
}
.profile-row__role {
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--blue);
  margin: 0 0 6px;
}
.profile-row__contact {
  list-style: none;
  padding: 0;
  margin: 24px 0 0;
}
.profile-row__contact li {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 12px;
  font-size: 16px;
  padding-left: 0 !important;
}
.profile-row__contact li::before { display: none !important; }
.profile-row__contact em {
  color: var(--blue);
  font-size: 15px;
  width: 18px;
  text-align: center;
}
.profile-row__contact a {
  color: var(--ink);
  text-decoration: none;
  transition: color .2s ease;
}
.profile-row__contact a:hover { color: var(--navy); }
/* the Read More collapse inherits accordion styles; tune it for this context */
.profile-row__more {
  max-width: none;
  margin: 28px 0 0;
  border-top: 1px solid rgba(137, 194, 217, 0.4);
}
.profile-row__more .accordion__q {
  font-size: 17px;
  padding: 16px 4px !important;
}
@media (max-width: 900px) {
  .profile-row {
    grid-template-columns: 1fr;
    gap: 28px;
    padding: 48px 0;
  }
  .profile-row__media { text-align: left; }
}

/* ============================================================
   CONTACT SPLIT — content left, framed form right
   ============================================================ */
.contact-split {
  background: var(--white);
  padding: 0 clamp(24px, 6vw, 100px) 100px;
  border-top: none;
}
.contact-split__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding-top: 90px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(48px, 7vw, 90px);
}
.contact-split__left, .contact-split__form { min-width: 0; }
.contact-split__eyebrow {
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--blue);
  margin: 0 0 20px;
}
.contact-split__title {
  font-weight: 700;
  color: var(--navy);
  font-size: clamp(36px, 4.4vw, 56px);
  line-height: 1.1;
  margin: 0 0 30px;
}
.contact-split__title em { font-style: normal; color: var(--blue); }
.contact-split__copy {
  font-size: 16px;
  line-height: 1.8;
  color: var(--muted);
  max-width: 460px;
}
.contact-split__copy h3, .contact-split__copy h4 {
  font-weight: 700;
  font-size: 17px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--navy);
  margin: 30px 0 16px;
}
.contact-split__copy h3:first-child, .contact-split__copy h4:first-child { margin-top: 0; }
.contact-split__copy a {
  color: var(--blue);
  font-weight: 600;
  text-decoration: none;
}
.contact-split__copy a:hover { color: var(--navy); text-decoration: underline; }
.contact-split__copy p { margin-bottom: 14px; }
.contact-split__copy hr {
  max-width: 460px;
  margin: 28px 0;
  border-top: 1px solid var(--hairline);
}
.contact-split__form {
  background: var(--bg);
  border-radius: var(--radius);
  padding: 32px;
  box-shadow: var(--shadow-card);
}
.contact-split__form iframe { width: 100%; max-width: 100%; border: none; display: block; }
@media (max-width: 900px) {
  .contact-split__inner { grid-template-columns: 1fr; gap: 48px; padding-top: 70px; }
}

/* ============================================================
   ACCORDION — FAQ cards with light-blue left rule
   (reference .faq-item)
   ============================================================ */
section.padded-md.accordion-block .col-12 > .accordion-block__title {
  margin: 0 auto 56px;
  text-align: center;
}
.accordion {
  max-width: 900px;
  margin: 0 auto;
  border-top: none;
}
.accordion__item {
  background: var(--white);
  border: none;
  border-left: 4px solid var(--blue);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-card);
  margin-bottom: 20px;
  overflow: hidden;
}
.accordion__q {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  background: transparent !important;
  border: none !important;
  padding: 22px 24px !important;
  cursor: pointer;
  text-align: left;
  box-shadow: none !important;
  color: var(--navy) !important;
  font-family: var(--sans) !important;
  font-weight: 700;
  font-size: clamp(17px, 1.8vw, 20px);
  line-height: 1.35;
  text-transform: none;
  transition: color .25s ease;
}
.accordion__q:hover { color: var(--blue) !important; }
.accordion__icon {
  position: relative;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
}
.accordion__icon::before,
.accordion__icon::after {
  content: "";
  position: absolute;
  background: var(--blue);
  border-radius: 50px;
  transition: transform .3s ease;
}
.accordion__icon::before { left: 0; top: 7px; width: 16px; height: 2px; }
.accordion__icon::after { left: 7px; top: 0; width: 2px; height: 16px; }
.accordion__item.is-open .accordion__icon::after { transform: rotate(90deg); }
.accordion__a { display: none; }
.accordion__a-inner { padding: 0 24px 26px; max-width: 860px; }
.accordion__a-inner p { color: var(--muted); line-height: 1.8; margin-bottom: 14px; }
.accordion__a-inner p:last-child { margin-bottom: 0; }

/* ============================================================
   STORY LIST — editorial rows
   ============================================================ */
.story-list__items {
  max-width: 1200px;
  margin: 0 auto;
  border-top: none;
}
.story-item {
  background: var(--white);
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
  padding: 48px 44px;
  margin-bottom: 30px;
  border-bottom: none;
  transition: transform .3s ease;
}
.story-item:hover { transform: translateY(-5px); }
.story-item__title {
  font-weight: 700;
  font-size: clamp(24px, 2.8vw, 34px);
  color: var(--navy);
  margin: 0 0 10px;
}
.story-item__subtitle {
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--blue);
  margin: 0 0 22px;
}
.story-item__content p {
  max-width: 780px;
  font-size: 16px;
  line-height: 1.8;
  color: var(--muted);
  margin-bottom: 18px;
}
.story-item__content p:last-child { margin-bottom: 0; }
@media (max-width: 900px) {
  .story-item { padding: 32px 24px; }
}

/* ============================================================
   PLACEMENT / LINK GRID — rounded area cards (reference .areas-grid)
   ============================================================ */
.placement {
  background: var(--bg);
  padding: 80px 24px 90px;
  text-align: center;
}
.placement .eyebrow {
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--blue);
  margin: 0 0 22px;
}
.placement__title {
  font-weight: 700;
  color: var(--navy);
  font-size: clamp(30px, 3.6vw, 46px);
  line-height: 1.1;
  margin: 0 0 50px;
}
.placement__title em { font-style: normal; font-weight: 700; color: var(--blue); }

.placement__table {
  max-width: 1000px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  border-bottom: none;
}
.placement__cell {
  font-weight: 600;
  font-size: clamp(17px, 1.8vw, 21px);
  color: var(--navy) !important;
  text-decoration: none !important;
  padding: 28px 24px;
  background: var(--white);
  border: 2px solid #e9ecef;
  border-top: 2px solid #e9ecef;
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  cursor: pointer;
  transition: all .3s ease;
}
.placement__cell::after { display: none; }
.placement__cell:hover {
  background: var(--navy-3);
  border-color: var(--navy-3);
  color: var(--white) !important;
  transform: translateY(-3px);
  box-shadow: 0 5px 15px rgba(30, 60, 114, 0.3);
}
.placement__cell:nth-child(odd) { border-right: 2px solid #e9ecef; }
.placement__cell:nth-child(odd):hover { border-right-color: var(--navy-3); }

@media (max-width: 640px) {
  .placement__table { grid-template-columns: 1fr; }
  .placement__cell { padding: 20px 16px; }
}

/* half & half / emphasized blocks — media and text side by side on desktop */
.emp-block .row { align-items: center; }
.emp-block .col-lg-6 img { width: 100%; object-fit: cover; border-radius: var(--radius); box-shadow: var(--shadow-card); }

/* image style: cover — the photo fills its half, flush and full height */
.emp-block.img-cover { padding-top: 0; padding-bottom: 0; }
.emp-block.img-cover .row { align-items: stretch; }
.emp-block.img-cover .col-lg-6 {
  padding-left: 0;
  padding-right: 0;
  overflow: hidden;
}
.emp-block.img-cover .col-lg-6 img {
  width: 100%;
  height: 100%;
  min-height: 380px;
  object-fit: cover;
  display: block;
  border-radius: 0;
  box-shadow: none;
}
.emp-block.img-cover .content-text { padding-top: 70px; padding-bottom: 70px; }

/* scroll-reveal animation — subtle fade-up, once, honors reduced motion */
@media (prefers-reduced-motion: no-preference) {
  .lsa-reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .9s cubic-bezier(0.22, 0.61, 0.36, 1), transform .9s cubic-bezier(0.22, 0.61, 0.36, 1);
    will-change: opacity, transform;
  }
  .lsa-reveal.is-visible {
    opacity: 1;
    transform: none;
  }
}
@media (min-width: 992px) {
  .emp-block .content-text { flex: 0 0 50%; max-width: 50%; }
  .emp-block.content-right .row { flex-direction: row-reverse; }
  .emp-block .col-lg-6[style*="background-color"] { min-height: 320px; align-self: stretch; }
}

.emp-block h3, .half-block h3 { color: var(--navy); }
.emp-block .container-content h3::after,
.half-block h3::after {
  content: "";
  display: block;
  width: 48px;
  height: 3px;
  border-radius: 50px;
  background: var(--blue);
  margin-top: 16px;
}
.emp-block .content-text p, .half-block p { color: var(--muted); line-height: 1.8; }
.emp-block .container-content h3 { margin-bottom: 24px; }

/* sub-section labels inside blocks — blue eyebrows */
.emp-block .container-content h4 {
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--blue);
  margin: 32px 0 16px;
}
.emp-block .container-content h4:first-of-type { margin-top: 26px; }

/* lists — blue check bullets, roomy rhythm, two columns on desktop */
.emp-block .container-content ul {
  list-style: none;
  padding: 0;
  margin: 20px 0 8px;
}
.emp-block .container-content ul li {
  position: relative;
  padding-left: 26px;
  margin-bottom: 12px;
  line-height: 1.6;
  color: var(--ink);
}
.emp-block .container-content ul li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  top: 0;
  width: auto;
  height: auto;
  background: none;
  color: var(--blue);
  font-weight: 700;
  transform: none;
}
@media (min-width: 992px) {
  .emp-block .container-content ul {
    columns: 2;
    column-gap: 44px;
  }
  .emp-block .container-content ul li { break-inside: avoid; }
}

.half-blocks { padding-bottom: 70px; }

/* ============================================================
   PROFILE CARDS — team grid (reference .team-member)
   ============================================================ */
.profile-cards__title { text-align: center; margin-bottom: 50px; }
.profile-cards__title::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  border-radius: 50px;
  background: var(--blue);
  margin: 22px auto 0;
}
.profile-cards__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 280px));
  justify-content: center;
  gap: 48px 60px;
}
.profile-card {
  text-align: center;
  text-decoration: none !important;
  display: block;
}
.profile-card__photo {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
  display: inline-block;
  margin-bottom: 20px;
  transition: transform .3s ease;
}
a.profile-card:hover .profile-card__photo { transform: scale(1.03); }
.profile-card__name {
  font-size: clamp(20px, 2vw, 24px);
  margin: 0 0 10px;
  color: var(--navy);
}
a.profile-card:hover .profile-card__name { color: var(--blue); }
.profile-card__role {
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--blue) !important;
  margin: 0;
}
.half-blocks .half-block {
  border-top: 1px solid var(--hairline);
  padding-top: 40px;
  margin-top: -1px;
}

/* generic content area typography */
.site-main ul li { line-height: 1.8; }
.site-main .container-content h3 em { color: var(--blue); font-style: normal; }

/* ============================================================
   CONTACT — boxed fields, navy focus glow (reference forms)
   ============================================================ */
section.contact_form { background: var(--bg); }
section.contact_form.bg-lightpurple { background: var(--white) !important; }

.contact_form label,
.wpcf7 label {
  font-weight: 600;
  font-size: 15px;
  letter-spacing: 0.3px;
  text-transform: none;
  color: var(--navy);
  margin-bottom: 8px;
}

input[type="text"], input[type="email"], input[type="url"], input[type="password"],
input[type="search"], input[type="number"], input[type="tel"], input[type="date"],
select, textarea,
.wpcf7 input:not([type="submit"]), .wpcf7 textarea, .wpcf7 select {
  width: 100%;
  border: 2px solid #e9ecef !important;
  border-radius: 8px !important;
  background: var(--white) !important;
  font-weight: 400;
  font-size: 16px;
  color: var(--ink);
  padding: 12px 15px;
  box-shadow: none !important;
  transition: border-color .3s ease, box-shadow .3s ease;
}
input:focus, textarea:focus, select:focus,
.wpcf7 input:focus, .wpcf7 textarea:focus {
  outline: none !important;
  border-color: var(--navy-3) !important;
  box-shadow: 0 0 0 3px rgba(30, 60, 114, 0.1) !important;
}
::placeholder { color: var(--muted); opacity: 0.8; }

.contact-info .title { color: var(--navy); }
.contact-info .content-text i, .contact-info .content-text svg { color: var(--blue); }
.contact-info a { color: var(--ink); }
.contact-info a:hover { color: var(--blue); }

/* ============================================================
   BLOG / ARCHIVE / SIDEBAR
   ============================================================ */
.card-img-top,
article .img-responsive { filter: none; }

/* blog cards — white rounded cards, shadow, lift on hover */
.ati-blog.card {
  background: var(--white);
  border: none;
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: transform .3s ease, box-shadow .3s ease;
}
.ati-blog.card:hover {
  transform: translateY(-10px);
  box-shadow: var(--shadow-card-hover);
}
.ati-blog .card-img-top {
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
}
.ati-blog .card-body {
  padding: 28px 28px 24px;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
.ati-blog .card-title {
  font-size: 22px;
  margin: 0 0 14px;
}
.ati-blog .card-title a {
  color: var(--navy) !important;
  text-decoration: none;
  transition: color .2s ease;
}
.ati-blog .card-title a:hover { color: var(--blue) !important; }
.ati-blog .card-text { display: flex; flex-direction: column; flex: 1 1 auto; }
.ati-blog .card-text p {
  font-size: 15px;
  line-height: 1.75;
  color: var(--muted);
  margin-bottom: 20px;
}
/* "read more" — standard pill button, pinned to the card bottom */
.ati-blog .card-text a.btn {
  margin-top: auto;
  align-self: flex-start;
  padding: 12px 26px;
  font-size: 13px;
}
.ati-blog .card-footer {
  background: transparent;
  border-top: 1px solid rgba(137, 194, 217, 0.25);
  padding: 14px 28px;
}
.ati-blog .card-footer small {
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--blue) !important;
}
.ati-blog .card-footer p { margin: 0; }

article .entry-title a { color: var(--navy); text-decoration: none; }
article .entry-title a:hover { color: var(--blue); }
.entry-meta, .entry-footer, .posted-on, .byline {
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--blue);
}
.entry-meta a, .entry-footer a { color: var(--blue); }

/* single post — readable editorial column */
.single .ati-blog-large .ati-blog {
  max-width: 860px;
  margin: 0 auto;
}
.single section.padded { padding: 70px 0 90px; }
.single .ati-blog-img { margin: 0 0 44px; }
.single .ati-blog-img img {
  width: 100%;
  height: clamp(280px, 38vw, 460px);
  object-fit: cover;
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
}
.single .ati-blog-title h2 {
  font-size: clamp(30px, 3.4vw, 44px);
  line-height: 1.15;
  margin: 0 0 16px;
}
.single .ati-blog-info {
  border-bottom: 1px solid var(--hairline);
  padding-bottom: 22px;
  margin-bottom: 38px;
}
.single .ati-blog-info small {
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--blue) !important;
}
.single .ati-blog-content p,
.single .ati-blog-content li {
  font-size: 17px;
  line-height: 1.9;
  color: var(--ink);
  margin-bottom: 24px;
}
.single .ati-blog-content h2,
.single .ati-blog-content h3,
.single .ati-blog-content h4 { margin: 44px 0 18px; }
.single .ati-blog-content a {
  color: var(--blue);
  font-weight: 600;
  text-decoration: none;
}
.single .ati-blog-content a:hover { color: var(--navy); text-decoration: underline; }
.single .ati-blog-content img { margin: 12px auto 32px; border-radius: var(--radius); }

/* comments — same centered column as the article, palette panel */
.single .comments-area,
.single .comment-respond,
.single #comments {
  max-width: 860px;
  margin-left: auto !important;
  margin-right: auto !important;
}
.single .comments-area.card,
.single .comments-area .card-body,
.single .comments-area .card-footer {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  border-radius: 0;
}
.single .comment-respond {
  background: var(--white);
  border: none;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-card) !important;
  padding: 40px;
  margin-top: 24px;
}
.single .comment-reply-title {
  font-size: clamp(24px, 2.4vw, 30px);
  margin: 0 0 12px;
}
.single .comment-respond label {
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.3px;
  text-transform: none;
  color: var(--navy);
}
.single .logged-in-as, .single .comment-notes { color: var(--muted); font-size: 15px; }

.widget-area .widget, .sidebar .widget { background: transparent; }
.widget .widget-title, .widget-title {
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--navy);
}
.widget ul li a { color: var(--ink); text-decoration: none; }
.widget ul li a:hover { color: var(--blue); }

/* pagination — centered rounded pills */
.blog-pagination {
  text-align: center;
  padding: 40px 0 10px;
}
.blog-pagination .page-numbers,
.pagination .page-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  height: 48px;
  padding: 0 18px;
  margin: 0 6px 8px;
  border: 2px solid var(--navy-3);
  border-radius: 50px;
  background: transparent;
  color: var(--navy) !important;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none !important;
  transition: all .25s ease;
}
.blog-pagination a.page-numbers:hover {
  background: var(--navy-3);
  border-color: var(--navy-3);
  color: var(--white) !important;
}
.blog-pagination .page-numbers.current,
.pagination .page-item.active .page-link {
  background: var(--navy-3);
  border-color: var(--navy-3);
  color: var(--white) !important;
}

/* tables */
table { border-color: var(--hairline); }
th { text-transform: uppercase; letter-spacing: 1px; color: var(--navy); }

/* ============================================================
   FOOTER — dark charcoal, light-blue headings (reference footer)
   ============================================================ */
.site-footer {
  background: var(--footer);
  border-top: none;
  color: #cccccc;
}
.site-footer .widget-title {
  font-weight: 700;
  font-size: 17px;
  letter-spacing: 0.5px;
  text-transform: none;
  color: var(--blue);
}
.site-footer, .site-footer p, .site-footer li, .site-footer .textwidget {
  font-weight: 400;
  font-size: 15px;
  line-height: 1.9;
  color: #cccccc;
}
.site-footer a, .site-footer .textwidget a,
.site-footer .menu li a, .site-footer ul li a,
footer a { color: #cccccc !important; text-decoration: none; transition: color .3s ease; }
.site-footer a:hover, footer a:hover { color: var(--blue) !important; }
.site-footer .menu li a {
  font-weight: 400;
  letter-spacing: 0.3px;
  text-transform: none;
}
.site-footer .social a { color: var(--blue); }
.site-footer .social a:hover { color: var(--white); }
.site-footer .social i { font-size: 20px; }

/* footer layout — distribute widget columns, align heights */
.site-footer { padding: 60px 0 30px; }
.site-footer .row.justify-content-between { align-items: flex-start; row-gap: 40px; }
.site-footer .col-auto:not(:has(.widget)) { display: none; }
.site-footer .widget-title { margin: 0 0 20px; }
/* the address column has no title — offset it to align with the other columns' content */
.footer-contact--address { margin-top: 40px; }

/* footer contact block (Stay Connected) */
.site-footer .footer-contact {
  line-height: 2.1;
  margin-bottom: 14px;
}
.site-footer .footer-contact em {
  color: var(--blue);
  width: 20px;
  display: inline-block;
  text-align: center;
  margin-right: 8px;
  font-size: 14px;
}
.site-footer .footer-contact__indent { padding-left: 28px; }
.site-footer .footer-social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 2px solid var(--blue);
  border-radius: 50%;
  color: var(--blue) !important;
  font-size: 17px;
  transition: background .25s ease, color .25s ease;
}
.site-footer .footer-social a:hover {
  background: var(--blue);
  color: var(--navy) !important;
}

.copyright {
  background: var(--footer);
  border-top: 1px solid #333333;
  padding: 24px 0;
}
.copyright, .copyright p, .copyright li,
.copyright a, .copyright ul li a {
  font-weight: 400;
  font-size: 14px;
  letter-spacing: 0.3px;
  text-transform: none;
  color: #999999 !important;
  margin: 0;
}
.copyright a:hover, .copyright ul li a:hover { color: var(--blue) !important; }
.copyright-img { filter: grayscale(1) opacity(0.7); max-height: 40px; }

/* ============================================================
   MISC — keep the whole page inside the palette
   ============================================================ */
.skip, .skip-link { background: var(--navy); color: var(--white); }

/* replace legacy theme accent colors (reds / blues / purples) */
.purple, .blue, .darkblue, .orange { color: var(--blue) !important; }
.bg-lightpurple, .bg-purple, .bg-blue { background-color: var(--bg) !important; }
/* ...but never on buttons — legacy markup uses .btn.bg-blue */
.btn.bg-blue, .btn.bg-purple, .btn.bg-lightpurple {
  background: var(--grad-blue) !important;
  border-color: var(--blue) !important;
  color: var(--navy) !important;
}
.btn.bg-blue:hover, .btn.bg-purple:hover, .btn.bg-lightpurple:hover {
  background: var(--grad-blue-rev) !important;
  border-color: var(--blue) !important;
}

/* Ultimate Member widgets/forms inherit palette */
.um input[type="submit"], .um .um-button {
  background: var(--grad-blue) !important;
  color: var(--navy) !important;
  border-radius: 50px !important;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 700;
}
.um .um-button:hover { background: var(--grad-blue-rev) !important; }

/* GiveWP donation buttons */
.give-btn, .give-submit {
  background: var(--grad-blue) !important;
  color: var(--navy) !important;
  border-radius: 50px !important;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 700;
}
.give-btn:hover, .give-submit:hover { background: var(--grad-blue-rev) !important; }

/* ============================================================
   HOME SECTIONS — ported from oasisnaplesboatdetailing.com
   (hero, trust bar, area band, service cards, why-choose,
   quick FAQ, quote form). Markup lives in the new ACF blocks.
   ============================================================ */

/* button variants used by the home blocks (reference .btn-*) */
.btn.btn-primary {
  background: var(--grad-blue) !important;
  color: var(--navy) !important;
  border-color: var(--blue) !important;
}
.btn.btn-primary:hover {
  background: var(--grad-blue-rev) !important;
  box-shadow: 0 10px 20px rgba(137, 194, 217, 0.3) !important;
}
.btn.btn-secondary {
  background: transparent !important;
  color: var(--white) !important;
  border-color: var(--white) !important;
}
.btn.btn-secondary:hover {
  background: var(--white) !important;
  color: var(--navy) !important;
  box-shadow: 0 10px 20px rgba(255, 255, 255, 0.3) !important;
}
.btn.btn-text {
  background: var(--grad-green) !important;
  color: var(--white) !important;
  border-color: var(--green) !important;
  box-shadow: 0 5px 15px rgba(40, 167, 69, 0.4) !important;
}
.btn.btn-text:hover {
  background: var(--grad-green-rev) !important;
  color: var(--white) !important;
  box-shadow: 0 10px 25px rgba(40, 167, 69, 0.5) !important;
}
/* secondary reads dark on light sections (faq-link box) */
.faq-link-section .btn.btn-secondary,
.quick-faq .faq-cta .btn.btn-secondary {
  background: var(--navy) !important;
  color: var(--white) !important;
  border-color: var(--navy) !important;
}
.faq-link-section .btn.btn-secondary:hover,
.quick-faq .faq-cta .btn.btn-secondary:hover {
  background: var(--navy-2) !important;
  border-color: var(--navy-2) !important;
  box-shadow: 0 10px 20px rgba(1, 42, 74, 0.3) !important;
}

/* shared CTA text line (hero / faq / cta band) */
.cta-text {
  margin-top: 20px;
  font-size: 1.3rem;
  color: var(--white);
  text-align: center;
  font-weight: 500;
  line-height: 1.6;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
}
.cta-text strong {
  color: var(--blue-2);
  font-weight: 700;
  font-size: 1.4rem;
}

/* hero — full-viewport photo with dark veil (reference .hero) */
.home-hero {
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  background-color: var(--navy);
  /* header (~80px) + hero + trust strip (~180px) fit in one viewport */
  height: calc(100vh - 260px);
  min-height: 480px;
  display: flex;
  align-items: center;
  text-align: center;
  color: var(--white);
}
.home-hero__content {
  max-width: 800px;
  margin: 0 auto;
  padding: 0 20px;
}
.home-hero h1 {
  font-size: 3.5rem;
  margin-bottom: 20px;
  color: var(--white);
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
  line-height: 1.2;
}
.home-hero .hero-subtitle {
  font-size: 1.3rem;
  margin-bottom: 30px;
  color: var(--white);
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
}
.home-hero .hero-cta {
  display: flex;
  flex-direction: column;
  gap: 20px;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.home-hero .hero-cta .cta-text {
  margin-top: 10px;
  font-size: 1.2rem;
}

/* trust signals strip */
.trust-signals {
  background: var(--white);
  padding: 40px 0;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.trust-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 30px;
  text-align: center;
}
.trust-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  font-weight: 600;
  color: var(--navy);
}
.trust-icon {
  background: var(--blue);
  color: var(--navy);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  font-weight: bold;
}

/* service areas band */
.service-areas {
  background: var(--bg);
  padding: 60px 0;
}
.service-areas h2 {
  text-align: center;
  color: var(--navy);
  font-size: 2.5rem;
  margin-bottom: 15px;
}
.service-areas > .container > p {
  text-align: center;
  color: var(--muted);
  font-size: 1.1rem;
  margin-bottom: 40px;
}
.service-areas-list {
  text-align: center;
  width: 100%;
  display: flex;
  justify-content: center;
}
.service-areas-list p {
  font-size: 1.2rem;
  color: var(--navy);
  line-height: 1.8;
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
  font-weight: 500;
  letter-spacing: 0.5px;
  background: linear-gradient(135deg, rgba(137, 194, 217, 0.1) 0%, rgba(169, 214, 229, 0.1) 100%);
  padding: 30px 40px;
  border-radius: 15px;
  border: 2px solid rgba(137, 194, 217, 0.3);
  box-shadow: 0 8px 25px rgba(137, 194, 217, 0.15);
  backdrop-filter: blur(10px);
  transition: all 0.3s ease;
}
.service-areas-list p a {
  color: var(--navy);
  text-decoration: none;
  border-bottom: 2px solid rgba(137, 194, 217, 0.5);
  transition: color .2s ease, border-color .2s ease;
}
.service-areas-list p a:hover {
  color: #2a6f97;
  border-bottom-color: #2a6f97;
}
.service-areas-list p:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 35px rgba(137, 194, 217, 0.25);
  border-color: rgba(137, 194, 217, 0.5);
  background: linear-gradient(135deg, rgba(137, 194, 217, 0.15) 0%, rgba(169, 214, 229, 0.15) 100%);
}

/* services overview cards */
.services-overview {
  padding: 80px 0;
  background: var(--bg);
}
.services-overview h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 20px;
  color: var(--navy);
}
.services-intro {
  text-align: center;
  color: var(--muted);
  font-size: 1.1rem;
  margin-bottom: 40px;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}
.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
}
.service-card {
  background: var(--white);
  padding: 40px 30px;
  border-radius: 15px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
  text-align: center;
  transition: transform 0.3s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
}
/* pin the button to the bottom so it lines up across cards */
.service-card .service-link { margin-top: auto; }
.service-card:hover { transform: translateY(-10px); }
.service-card h3 {
  color: var(--navy);
  margin-bottom: 20px;
  font-size: 1.5rem;
}
.service-card p {
  margin-bottom: 20px;
  color: var(--muted);
  line-height: 1.6;
}
.service-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--grad-blue);
  color: var(--navy) !important;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
  padding: 13px 30px;
  border: 2px solid var(--blue);
  border-radius: 50px;
  transition: all .3s ease;
}
.service-link:hover {
  background: var(--grad-blue-rev);
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(137, 194, 217, 0.3);
}

/* why choose — plain feature columns */
.why-choose {
  padding: 80px 0;
  background: var(--white);
}
.why-choose h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 50px;
  color: var(--navy);
}
.features-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 40px;
}
.feature h3 {
  color: var(--navy);
  margin-bottom: 20px;
  font-size: 1.3rem;
}
.feature p {
  color: var(--muted);
  line-height: 1.6;
}
.feature a { color: var(--blue); font-weight: 600; text-decoration: none; }
.feature a:hover { color: var(--navy); text-decoration: underline; }

/* quick FAQ grid */
.quick-faq {
  background: var(--white);
  padding: 60px 0;
}
.quick-faq h2 {
  text-align: center;
  color: var(--navy);
  font-size: 2.5rem;
  margin-bottom: 20px;
}
.faq-intro {
  text-align: center;
  color: var(--muted);
  font-size: 1.1rem;
  margin-bottom: 40px;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}
.faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 25px;
  margin-bottom: 40px;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
.faq-item {
  background: var(--bg);
  padding: 25px;
  border-radius: 10px;
  border-left: 4px solid var(--blue);
  margin-bottom: 30px;
}
.faq-item h3 {
  color: var(--navy);
  font-size: 1.2rem;
  margin-bottom: 15px;
}
.faq-item p {
  color: var(--muted);
  line-height: 1.6;
}
.faq-item a {
  color: var(--navy);
  text-decoration: none;
  font-weight: 600;
}
.faq-item a:hover { text-decoration: underline; }
.faq-cta {
  text-align: center;
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 40px;
}
.faq-cta .btn { margin: 0; }
.faq-link-section {
  background: var(--bg);
  padding: 60px 0;
  text-align: center;
  margin-top: 40px;
  border-radius: 15px;
}
.faq-link-section h3 {
  color: var(--navy);
  font-size: 2rem;
  margin-bottom: 20px;
}
.faq-link-section p {
  color: var(--muted);
  font-size: 1.1rem;
  margin-bottom: 30px;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

/* quote form (home contact section) */
.contact-content {
  padding: 80px 0;
  background: var(--white);
}
.contact-header {
  text-align: center;
  margin-bottom: 50px;
}
.contact-header h2 {
  color: var(--navy);
  font-size: 2.5rem;
  margin-bottom: 15px;
}
.contact-header p {
  color: var(--muted);
  font-size: 1.1rem;
  max-width: 700px;
  margin: 0 auto;
}
.contact-form-section {
  max-width: 900px;
  margin: 0 auto;
}
.contact-form {
  background: var(--bg);
  padding: 40px;
  border-radius: 15px;
}
.contact-form .form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.contact-form .form-group { margin-bottom: 25px; }
.contact-form label {
  display: block;
  margin-bottom: 8px;
  font-weight: bold;
  color: var(--navy);
}
.contact-form .checkbox-label {
  display: flex;
  align-items: center;
  font-weight: normal;
  cursor: pointer;
  color: var(--ink);
}
.contact-form .checkbox-label input[type="checkbox"],
.contact-form input[type="checkbox"] {
  width: auto;
  margin-right: 10px;
}
.contact-form .wpcf7-list-item { margin: 0; }
.contact-form .form-submit {
  text-align: center;
  margin-top: 20px;
}
.contact-form .form-submit .btn {
  padding: 15px 40px;
  font-size: 1.1rem;
}
.contact-form .form-note {
  margin-top: 15px;
  color: var(--muted);
  font-size: 0.9rem;
  font-style: italic;
}
.contact-form .wpcf7-not-valid-tip { color: #dc3545; font-size: 0.9rem; margin-top: 5px; }
.contact-form .wpcf7-response-output {
  margin: 20px 0 0;
  padding: 15px 20px;
  border-radius: 8px;
  font-weight: 500;
  text-align: center;
  border: 2px solid #c3e6cb;
  background-color: #d4edda;
  color: #155724;
}
.contact-form .wpcf7-form.invalid .wpcf7-response-output,
.contact-form .wpcf7-form.failed .wpcf7-response-output {
  background-color: #f8d7da;
  color: #721c24;
  border-color: #f5c6cb;
}
.required { color: #dc3545; font-weight: bold; }

/* home sections responsive (ported from the reference mobile rules) */
@media (max-width: 768px) {
  .home-hero {
    padding: 80px 0;
    height: auto;
    min-height: 70vh;
    background-attachment: scroll;
  }
  .home-hero h1 { font-size: 2.2rem; line-height: 1.2; }
  .home-hero .hero-subtitle { font-size: 1.1rem; line-height: 1.4; }
  .home-hero .hero-cta { gap: 15px; }
  .home-hero .hero-cta .cta-text { font-size: 1rem; padding: 0 15px; }
  .home-hero .btn, .faq-cta .btn, .cta-block .btn {
    width: 100%;
    max-width: 300px;
  }
  .cta-text { font-size: 1.1rem; padding: 0 15px; }
  .cta-text strong { font-size: 1.2rem; }
  .services-grid, .features-grid, .faq-grid { grid-template-columns: 1fr; gap: 20px; }
  .contact-form .form-row { grid-template-columns: 1fr; gap: 15px; }
  .service-areas-list p { font-size: 1rem; padding: 25px 30px; margin: 0 20px; }
  .faq-cta { flex-direction: column; align-items: center; gap: 15px; }
}
@media (max-width: 480px) {
  .home-hero h1 { font-size: 1.8rem; line-height: 1.1; }
  .home-hero .hero-subtitle { font-size: 1rem; }
  .service-card, .faq-item { padding: 15px; }
  .contact-form { padding: 30px 20px; }
}

/* copyright strip — single centered line like the reference footer-bottom */
.copyright .container .col-lg-12 { justify-content: center; text-align: center; }

/* footer columns — equal-width grid like the reference .footer-content
   (col-auto let the first widget stretch across the whole row) */
.site-footer .row.justify-content-between {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 40px;
}
.site-footer .row.justify-content-between > .col-auto {
  width: auto;
  max-width: 100%;
  flex: none;
  padding-left: 15px;
  padding-right: 15px;
}
@media (max-width: 768px) {
  .site-footer .row.justify-content-between { grid-template-columns: 1fr; gap: 30px; text-align: center; }
}

/* ============================================================
   ABOUT SECTIONS — ported from about.html
   (team, story, values, certifications, service note, faq banner)
   ============================================================ */

/* team */
.team-section {
  padding: 80px 0;
  background: var(--white);
}
.team-section h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 50px;
  color: var(--navy);
}
.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 40px;
}
.team-photo {
  margin-top: 50px;
  text-align: center;
}
.team-photo img {
  width: 100%;
  max-width: 800px;
  border-radius: 15px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
}
/* caption matches the member-name size above (.member-info h3) */
.team-photo figcaption {
  margin-top: 15px;
  color: var(--navy);
  font-weight: 700;
  font-size: 1.5rem;
}
.team-member {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.member-photo {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  overflow: hidden;
  margin-bottom: 20px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}
.member-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.placeholder-photo {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--grad-navy);
}
.placeholder-photo .initials {
  font-size: 3rem;
  font-weight: bold;
  color: var(--white);
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
.member-info h3 {
  color: var(--navy);
  font-size: 1.5rem;
  margin-bottom: 10px;
}
.member-title {
  color: var(--blue);
  font-weight: bold;
  margin-bottom: 20px;
}

/* story */
.story-section {
  padding: 80px 0;
  background: var(--bg);
}
.story-section h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 40px;
  color: var(--navy);
}
.story-content p {
  font-size: 1.1rem;
  line-height: 1.8;
  margin-bottom: 20px;
  color: var(--muted);
}

/* values */
.values-section {
  padding: 80px 0;
  background: var(--white);
}
.values-section h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 50px;
  color: var(--navy);
}
.values-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
}
.value-card {
  background: var(--bg);
  padding: 30px;
  border-radius: 15px;
  text-align: center;
  transition: transform 0.3s ease;
}
.value-card:hover { transform: translateY(-5px); }
.value-card h3 {
  color: var(--navy);
  margin-bottom: 15px;
  font-size: 1.3rem;
}
.value-card p { color: var(--muted); line-height: 1.6; }

/* certifications */
.certifications-section {
  padding: 80px 0;
  background: var(--bg);
}
.certifications-section h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 50px;
  color: var(--navy);
}
.cert-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 30px;
}
.cert-item {
  background: var(--white);
  padding: 30px;
  border-radius: 15px;
  text-align: center;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
  /* equal-height cards: center the content so leftover space splits evenly top/bottom */
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.cert-item h3 {
  color: var(--navy);
  margin-bottom: 15px;
  line-height: 1.25;
}
.cert-item p { color: var(--muted); line-height: 1.6; }

/* service note under the areas band */
.service-note {
  text-align: center;
  background: var(--white);
  padding: 25px;
  border-radius: 10px;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.1);
  max-width: 600px;
  margin: 50px auto 0;
}
.service-note p {
  color: var(--muted);
  font-size: 1rem;
  margin: 0;
}
.service-note a {
  color: var(--navy);
  text-decoration: none;
  font-weight: 600;
}
.service-note a:hover { text-decoration: underline; }

/* standalone faq banner — full-width grey band, no card framing */
.faq-link-section--standalone {
  border-radius: 0;
  margin-top: 0;
}

@media (max-width: 768px) {
  .team-grid, .values-grid, .cert-grid { grid-template-columns: 1fr; gap: 20px; }
}
@media (max-width: 480px) {
  .member-photo { width: 120px; height: 120px; }
}

/* ported sections use the reference 1200px container (theme default is 1440) */
.trust-signals .container,
.service-areas .container,
.services-overview .container,
.why-choose .container,
.quick-faq .container,
.contact-content .container,
.team-section .container,
.story-section .container,
.values-section .container,
.certifications-section .container,
.faq-link-section .container,
section.cta-block .container {
  max-width: 1200px;
}

/* brand: logo + site name (reference .nav-logo / .logo-text) */
.site-header .navbar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: none;
  color: var(--white) !important;
  text-decoration: none !important;
}
.site-header .navbar-brand .logo-text {
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--white);
  line-height: 1.2;
  white-space: nowrap;
}
@media (max-width: 991px) {
  .site-header .navbar-brand .logo-text { font-size: 0.9rem; white-space: normal; }
  .site-header .navbar-brand img { max-height: 45px; }
}

/* ============================================================
   PROGRAM / SERVICES SECTIONS — ported from maintenance.html
   (section heading, category cards, benefit grid, list groups,
   numbered process steps)
   ============================================================ */
.program-heading {
  background: var(--bg);
  padding: 80px 0 10px;
}
.program-heading .container,
.program-block .container,
.how-it-works .container { max-width: 1200px; }
.program-heading h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 20px;
  color: var(--navy);
}
.service-intro {
  font-size: 1.1rem;
  line-height: 1.8;
  color: var(--muted);
  margin-bottom: 40px;
  text-align: center;
}

.program-block {
  background: var(--bg);
  padding: 40px 0;
}
.service-category {
  background: var(--white);
  /* less on top: the heading's own line leading adds ~10px of visual air there */
  padding: 30px 40px 40px;
  border-radius: 15px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
}
.service-category h3 {
  color: var(--navy);
  font-size: 2rem;
  line-height: 1.25;
  margin-bottom: 20px;
  text-align: center;
  border-bottom: 2px solid var(--blue);
  padding-bottom: 15px;
}
.category-description {
  font-size: 1.1rem;
  line-height: 1.8;
  color: var(--muted);
  margin-bottom: 20px;
  text-align: center;
  font-style: italic;
}

/* benefit grid */
.benefits-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin-top: 30px;
}
.benefit-item {
  background: var(--white);
  /* top padding minus the 4px top border so the visual gap matches the bottom */
  padding: 21px 25px 25px;
  border-radius: 10px;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.1);
  text-align: center;
  border-top: 4px solid var(--blue);
  /* equal-height cards: center the content so leftover space splits evenly top/bottom */
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.benefit-item h4 {
  color: var(--navy);
  font-size: 1.3rem;
  margin-bottom: 15px;
  line-height: 1.25;
}
.benefit-item p { color: var(--muted); line-height: 1.6; }

/* list groups */
.included-services {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
  margin-top: 30px;
}
.service-group {
  background: var(--white);
  padding: 25px;
  border-radius: 10px;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.1);
}
.service-group h4 {
  color: var(--navy);
  font-size: 1.3rem;
  margin-bottom: 15px;
  border-bottom: 2px solid var(--blue);
  padding-bottom: 10px;
}
.service-group ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.service-group li {
  padding: 8px 0 8px 25px;
  border-bottom: 1px solid #f1f3f4;
  position: relative;
  color: var(--ink);
  line-height: 1.6;
}
.service-group li:last-child { border-bottom: none; }
.service-group li::before {
  content: "\2022";
  color: var(--blue);
  font-weight: bold;
  position: absolute;
  left: 0;
}

/* how it works */
.how-it-works {
  background: var(--bg);
  padding: 80px 0;
}
.how-it-works h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 30px;
  color: var(--navy);
}
.how-it-works .process-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 40px;
  margin-top: 50px;
}
.how-it-works .process-step {
  text-align: center;
  background: var(--white);
  padding: 30px;
  border-radius: 15px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
  position: relative;
}
.how-it-works .step-number {
  background: var(--grad-navy);
  color: var(--white);
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: bold;
  margin: 0 auto 20px;
}
.how-it-works .process-step h3 {
  color: var(--navy);
  margin-bottom: 15px;
  font-size: 1.3rem;
}
.how-it-works .process-step p { color: var(--muted); line-height: 1.6; }

/* both process-step variants: equal-height cards with content pinned to the
   top so the step numbers line up across cards */
.process-step {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}
.process-step h3 { line-height: 1.25; }
.process-step > :last-child { margin-bottom: 0; }

@media (max-width: 768px) {
  .service-category { padding: 20px; }
  .service-category h3 { font-size: 1.6rem; }
  .benefits-grid, .included-services, .how-it-works .process-steps { grid-template-columns: 1fr; gap: 20px; }
}

/* ============================================================
   DETAILING SECTIONS — ported from detailing.html
   (check-list service items + blue process variant)
   ============================================================ */
.services-list-block {
  background: var(--bg);
  padding: 80px 0 40px;
}
.services-list-block .container { max-width: 1200px; }
.services-list-block h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 20px;
  color: var(--navy);
}
.services-list-block .service-category { margin-top: 20px; }
.service-list {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.service-item {
  background: var(--bg);
  padding: 25px;
  border-radius: 10px;
  border-left: 4px solid var(--blue);
}
.service-item p { color: var(--muted); line-height: 1.6; }
.service-features {
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 40px;
}
.service-features li {
  padding: 8px 0 8px 25px;
  position: relative;
  color: var(--ink);
  line-height: 1.6;
}
.service-features li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  color: var(--blue);
  font-weight: bold;
}

/* blue process variant (reference .process-section) */
.process-section {
  background: var(--bg);
  padding: 80px 0;
}
.process-section .container { max-width: 1200px; }
.process-section h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 50px;
  color: var(--navy);
}
.process-section .process-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 30px;
}
.process-section .process-step {
  text-align: center;
  background: var(--white);
  padding: 30px 20px;
  border-radius: 15px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
}
.process-section .step-number {
  background: var(--blue);
  color: var(--navy);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: bold;
  margin: 0 auto 20px;
}
.process-section .process-step h3 {
  color: var(--navy);
  margin-bottom: 15px;
  font-size: 1.3rem;
}
.process-section .process-step p { color: var(--muted); line-height: 1.6; }

@media (max-width: 768px) {
  .process-section .process-steps { grid-template-columns: 1fr; gap: 20px; }
  .service-item { padding: 15px; }
  .service-features { grid-template-columns: 1fr; }
}

/* ============================================================
   GALLERY SECTIONS — ported from gallery.html
   (media grid with video overlay + testimonials)
   ============================================================ */
.story-section--white { background: var(--white); padding: 60px 0; }

.gallery-section {
  padding: 60px 0;
  background: var(--white);
}
.gallery-section .container { max-width: 1200px; }
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
}
.gallery-more { margin-top: 40px; text-align: center; }
.gallery-item {
  position: relative;
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
  transition: box-shadow .7s cubic-bezier(0.22, 0.61, 0.36, 1);
  /* neutralize the theme's WP-gallery thumbnail rules */
  display: block;
  width: auto;
  max-width: none;
  text-align: left;
  vertical-align: top;
}
.gallery-item:hover {
  box-shadow: 0 22px 45px rgba(1, 42, 74, 0.16);
}
.gallery-image {
  position: relative;
  height: 250px;
  overflow: hidden;
}
.gallery-image img,
.gallery-image video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.1s cubic-bezier(0.22, 0.61, 0.36, 1), filter 1.1s cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: transform;
}
.gallery-item:hover .gallery-image img,
.gallery-item:hover .gallery-image video { transform: scale(1.05); }
.gallery-image video { background: #000; cursor: pointer; }
/* soft veil that lifts on hover — reads as a gentle "reveal" */
.gallery-item .gallery-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(1, 42, 74, 0.08);
  opacity: 1;
  transition: opacity .7s cubic-bezier(0.22, 0.61, 0.36, 1);
  pointer-events: none;
  z-index: 1;
}
.gallery-item:hover .gallery-image::after { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  .gallery-item,
  .gallery-image img,
  .gallery-image video,
  .gallery-item .gallery-image::after { transition: none; }
  .gallery-item:hover .gallery-image img,
  .gallery-item:hover .gallery-image video { transform: none; }
}

/* video play overlay */
.video-item { position: relative; }
.video-play-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(1, 15, 26, 0.28);
  opacity: 1;
  transition: background .7s cubic-bezier(0.22, 0.61, 0.36, 1);
  z-index: 2;
  cursor: pointer;
}
.video-item:hover .video-play-overlay { background: rgba(1, 15, 26, 0.42); }
.play-button {
  transition: transform .7s cubic-bezier(0.22, 0.61, 0.36, 1), opacity .7s ease;
  opacity: 0.9;
}
.video-item:hover .play-button { transform: scale(1.08); opacity: 1; }
.video-item.playing .video-play-overlay {
  opacity: 0;
  pointer-events: none;
}
.video-item:hover .gallery-image video {
  transform: scale(1.05);
  filter: brightness(1.06);
}

/* testimonials */
.testimonials-section {
  padding: 80px 0;
  background: var(--bg);
}
.testimonials-section .container { max-width: 1200px; }
.testimonials-section h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 50px;
  color: var(--navy);
}
.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
}
.testimonial {
  background: var(--white);
  padding: 30px;
  border-radius: 15px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
}
.testimonial-content p {
  font-style: italic;
  margin-bottom: 20px;
  color: var(--muted);
  line-height: 1.6;
}
.testimonial-author strong {
  color: var(--navy);
  display: block;
  margin-bottom: 5px;
}
.testimonial-author span {
  color: #999999;
  font-size: 0.9rem;
}
.testimonials-cta { text-align: center; margin-top: 40px; }
.testimonials-embed { max-width: 1100px; margin: 0 auto; }
.testimonials-embed .lc_reviews_widget { display: block; border: 0; }

@media (max-width: 768px) {
  .gallery-grid, .testimonials-grid { grid-template-columns: 1fr; gap: 20px; }
  .gallery-image {
    height: auto;
    min-height: 200px;
  }
  .gallery-image img,
  .gallery-image video {
    height: auto;
    object-fit: contain;
    object-position: center;
  }
}

/* gallery modal lightbox */
.gallery-item[data-modal-src] { cursor: pointer; }
.gallery-item[data-modal-src] .gallery-video { pointer-events: none; }
.oasis-modal {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  background: rgba(1, 15, 26, 0.9);
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s ease, visibility .25s ease;
}
.oasis-modal.is-open { opacity: 1; visibility: visible; }
.oasis-modal__content {
  max-width: min(1100px, 92vw);
  max-height: 85vh;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: scale(0.96);
  transition: transform .25s ease;
}
.oasis-modal.is-open .oasis-modal__content { transform: scale(1); }
.oasis-modal__content img,
.oasis-modal__content video {
  max-width: 100%;
  max-height: 85vh;
  width: auto;
  height: auto;
  border-radius: 10px;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.6);
  background: #000;
}
.oasis-modal__close {
  position: absolute;
  top: 20px;
  right: 24px;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.12) !important;
  color: var(--white) !important;
  border: 2px solid rgba(255, 255, 255, 0.4) !important;
  border-radius: 50% !important;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  transition: all .2s ease;
  z-index: 1;
}
.oasis-modal__close:hover {
  background: var(--white) !important;
  color: var(--navy) !important;
}
body.oasis-modal-open { overflow: hidden; }

/* ============================================================
   FAQ PAGE — single-column list variant (reference .faq)
   ============================================================ */
.faq {
  padding: 60px 0;
  background: var(--bg);
}
.faq .container { max-width: 1200px; }
.faq h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 50px;
  color: var(--navy);
}
.faq .faq-list {
  max-width: 800px;
  margin: 0 auto;
}
.faq + .faq { padding-top: 20px; }

/* FAQ page accordions — <details> items, question row toggles the answer */
.faq-item--acc { padding: 0; }
.faq-item--acc summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px 25px;
}
.faq-item--acc summary::-webkit-details-marker { display: none; }
.faq-item--acc summary h3 { margin: 0; }
.faq-item--acc summary::after {
  content: "\25BE";
  flex: 0 0 auto;
  color: var(--blue);
  font-size: 18px;
  line-height: 1;
  transition: transform .25s ease;
}
.faq-item--acc[open] summary::after { transform: rotate(180deg); }
.faq-item--acc summary:hover h3 { color: #2a6f97; }
.faq-acc__answer { padding: 0 25px 22px; }
.faq-acc__answer > :last-child { margin-bottom: 0; }

/* ============================================================
   HEADER — mid-resolution fixes (992px–1400px)
   Long menu labels were wrapping to two lines and misaligning
   the nav. Keep every item on one line and tighten spacing as
   the viewport narrows, until the mmenu takes over below 992px.
   ============================================================ */
.site-header .header-nav > li > a { white-space: nowrap; }
.site-header .header-nav { flex-wrap: nowrap; }
.site-header .navbar .container { flex-wrap: nowrap; }
.site-header .navbar-brand { flex-shrink: 0; }

/* mid resolutions: drop the site-name text (logo alone identifies the brand)
   so the menu keeps its normal size on a single line */
@media (min-width: 992px) and (max-width: 1499px) {
  .site-header .navbar-brand .logo-text { display: none; }
}

/* testimonials slider (4+ items) — same cards, owl handles layout.
   owl's stage-outer clips overflow, so pad the clip window out far enough
   for the card shadow (0 5px 20px) and pull the layout back with negative
   margins — spacing stays identical, shadows render complete. */
.testimonials-slider .testimonial { margin: 0; height: 100%; }
.testimonials-slider .owl-stage-outer {
  padding: 25px 14px 35px;
  margin: -25px -14px -35px;
}
.testimonials-slider .owl-stage {
  display: flex;
  padding-bottom: 2px;
}
.testimonials-slider .owl-item { display: flex; float: none; }
.testimonials-slider .owl-item > .testimonial { flex: 1 1 auto; }
.testimonials-slider.owl-theme .owl-dots { margin-top: 30px; }

/* boxes: the last element's bottom margin was inflating the bottom padding —
   strip it so boxes have even padding top and bottom */
.service-card > :last-child,
.faq-item > :last-child,
.value-card > :last-child,
.cert-item > :last-child,
.feature > :last-child,
.benefit-item > :last-child,
.service-category > :last-child,
.service-item > :last-child,
.contact-method > :last-child,
.services__grid .card > :last-child,
.services__grid .card__desc > :last-child,
#ja-jobs-widget .job > :last-child,
.contact-form > :last-child,
.contact-split__form > :last-child,
.single .comment-respond > :last-child,
.site-footer .widget > :last-child,
.site-footer .textwidget > :last-child {
  margin-bottom: 0;
}

/* footer social column — row of round icon buttons */
.site-footer .footer-social {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
/* icons sit below the contact info in the same column */
.site-footer .textwidget .footer-social { margin-top: 18px; }
@media (max-width: 768px) {
  .site-footer .footer-social { justify-content: center; }
}

/* ============================================================
   CONTACT PAGE — contact-method cards (reference contact.html)
   ============================================================ */
.contact-methods {
  padding: 80px 0;
  background: var(--bg);
}
.contact-methods .container { max-width: 1200px; }
.contact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 40px;
}
.contact-method {
  background: var(--white);
  padding: 40px 30px;
  border-radius: 15px;
  text-align: center;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
  /* equal-height cards: center the content so leftover space splits evenly top/bottom */
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.contact-icon {
  font-size: 3rem;
  margin-bottom: 20px;
  line-height: 1; /* emoji leading was adding extra space at the top */
}
.contact-method h3 {
  color: var(--navy);
  margin-bottom: 15px;
  line-height: 1.25;
}
.contact-method p { color: var(--muted); line-height: 1.6; }
.contact-link {
  color: var(--blue);
  text-decoration: none;
  font-weight: bold;
  font-size: 1.2rem;
  display: block;
  margin: 15px 0;
}
.contact-link:hover { color: var(--navy); }
.contact-method__btn {
  display: block !important;
  margin: 15px auto !important;
  max-width: 250px;
}
.contact-hours {
  color: var(--muted);
  font-size: 0.9rem;
  margin-top: 10px;
}

/* quote form: embed variant — third-party widgets/iframes fill the card */
.contact-form--embed iframe {
  width: 100%;
  max-width: 100%;
  border: 0;
  display: block;
  border-radius: 8px;
  /* form_embed.js auto-sizes the iframe but lands a few px short and an inner
     scrollbar appears — pad its measurement just enough to clear it */
  min-height: 660px;
}

/* ============================================================
   HOME HERO — slider variants
   content mode (2+ slides): whole-slide crossfade via owl
   background mode: fixed content, backgrounds fade in/out
   ============================================================ */
/* fixed-attachment backgrounds break inside owl's transformed stage */
.home-hero--slide { background-attachment: scroll; }
.home-hero-slider.owl-theme { position: relative; }
.home-hero-slider.owl-theme .owl-dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 26px;
  margin: 0;
}
.home-hero-slider .owl-item { overflow: hidden; }

/* background fade variant */
.home-hero--fade {
  position: relative;
  overflow: hidden;
  background-image: none !important;
}
.home-hero__bgs { position: absolute; inset: 0; z-index: 0; }
.home-hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 1.8s ease-in-out;
}
.home-hero__bg.is-active { opacity: 1; }
.home-hero--fade .home-hero__content { position: relative; z-index: 1; }
@media (prefers-reduced-motion: reduce) {
  .home-hero__bg { transition: none; }
}