/* ==========================================================================
   GOGO Facility Maintenance — site styles
   Brand palette sampled directly from the GoGo logo / one-sheet:
     navy #001C3A · orange #E75819 · steel grey #6B6E72
   ========================================================================== */

/* ---------- Tokens ---------- */
:root {
  --navy:        #001C3A;
  --navy-800:    #062949;
  --navy-700:    #0C3760;
  --navy-600:    #14456F;
  --orange:      #E75819;
  --orange-600:  #C8460E;
  --orange-100:  #FDEEE7;
  --steel:       #6B6E72;
  --slate:       #4A5158;
  --ink:         #16202B;
  --line:        #E2E7EC;
  --bg:          #FFFFFF;
  --bg-alt:      #F5F7F9;
  --bg-alt-2:    #EDF1F5;

  --wrap: 1200px;
  --radius: 4px;
  --radius-lg: 10px;
  --shadow-sm: 0 1px 2px rgba(0,28,58,.08), 0 2px 8px rgba(0,28,58,.06);
  --shadow-md: 0 8px 28px rgba(0,28,58,.10);
  --shadow-lg: 0 22px 60px rgba(0,28,58,.16);

  --font-body: "Barlow", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-head: "Barlow Semi Condensed", "Barlow", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-cond: "Barlow Condensed", "Barlow Semi Condensed", Impact, Haettenschweiler, sans-serif;

  --header-h: 112px;
}

/* ---------- Reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 16px); }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.65;
  color: var(--slate);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: var(--navy-700); }
h1, h2, h3, h4 {
  font-family: var(--font-head);
  color: var(--navy);
  line-height: 1.08;
  margin: 0 0 .5em;
  font-weight: 700;
  letter-spacing: -.01em;
}
h1 { font-size: clamp(2.5rem, 5.4vw, 4.1rem); }
h2 { font-size: clamp(1.9rem, 3.6vw, 2.85rem); }
h3 { font-size: clamp(1.2rem, 1.9vw, 1.45rem); }
p  { margin: 0 0 1.1em; }
ul { margin: 0 0 1.1em; padding-left: 1.15em; }
li { margin-bottom: .4em; }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }

.wrap { width: min(100% - 3rem, var(--wrap)); margin-inline: auto; }
.section { padding: clamp(3.5rem, 7vw, 6.5rem) 0; }
.section--alt { background: var(--bg-alt); }
.section--navy { background: var(--navy); color: #C3D0DC; }
.section--navy h2, .section--navy h3 { color: #fff; }

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--orange); color: #fff; padding: .75rem 1.25rem; font-weight: 600;
}
.skip-link:focus { left: 0; }

/* ---------- Eyebrow / section heading ---------- */
.eyebrow {
  display: inline-flex; align-items: center; gap: .6rem;
  font-family: var(--font-head);
  font-size: .8rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  color: var(--orange); margin: 0 0 .9rem;
}
.eyebrow::before { content: ""; width: 28px; height: 3px; background: var(--orange); }
.section-head { max-width: 720px; margin-bottom: 2.75rem; }
.section-head.center { margin-inline: auto; text-align: center; }
.section-head.center .eyebrow::before { display: none; }
.section-head p { font-size: 1.075rem; margin-bottom: 0; }
.lede { font-size: 1.15rem; color: var(--slate); }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  font-family: var(--font-head); font-weight: 700; font-size: 1.02rem;
  letter-spacing: .04em; text-transform: uppercase;
  padding: .95rem 1.6rem; border-radius: var(--radius);
  text-decoration: none; border: 2px solid transparent; cursor: pointer;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.btn:hover { transform: translateY(-1px); }
.btn--primary { background: var(--orange); color: #fff; border-color: var(--orange); }
.btn--primary:hover { background: var(--orange-600); border-color: var(--orange-600); }
.btn--navy { background: var(--navy); color: #fff; border-color: var(--navy); }
.btn--navy:hover { background: var(--navy-700); border-color: var(--navy-700); }
.btn--ghost { background: transparent; color: var(--navy); border-color: #C7D1DA; }
.btn--ghost:hover { border-color: var(--navy); background: var(--navy); color: #fff; }
.btn--white { background: #fff; color: var(--navy); border-color: #fff; }
.btn--white:hover { background: var(--navy); color: #fff; }
.btn--outline-white { background: transparent; color: #fff; border-color: rgba(255,255,255,.6); }
.btn--outline-white:hover { background: #fff; color: var(--navy); border-color: #fff; }
.btn--sm { padding: .65rem 1.1rem; font-size: .88rem; }
.btn-row { display: flex; flex-wrap: wrap; gap: .85rem; }

/* ---------- Top utility bar ---------- */
.topbar {
  background: var(--navy); color: #A9BACB;
  font-size: .84rem; letter-spacing: .02em;
}
.topbar__inner {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  min-height: 40px; flex-wrap: wrap;
}
.topbar a { color: #fff; text-decoration: none; font-weight: 600; }
.topbar a:hover { color: var(--orange); }
.topbar__tag {
  font-family: var(--font-head); font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: #fff; font-size: .78rem;
}
.topbar__tag b { color: var(--orange); font-weight: 700; }
.topbar__contact { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.topbar__phone a { font-size: .95rem; letter-spacing: .01em; }
.topbar__phone em { font-style: normal; color: #A9BACB; margin-left: .35rem; }
.topbar__contact span { display: inline-flex; align-items: center; gap: .45rem; }
.topbar svg { width: 15px; height: 15px; fill: var(--orange); flex: none; }

/* ---------- Header ---------- */
.header {
  position: sticky; top: 0; z-index: 100;
  background: #fff; border-bottom: 1px solid var(--line);
  transition: box-shadow .2s ease;
}
.header.is-stuck { box-shadow: var(--shadow-sm); }
.header__inner {
  display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
  /* less the 1px bottom border, so --header-h is the header's true outer height
     and the fixed mobile nav overlay lines up with it exactly */
  min-height: calc(var(--header-h) - 1px);
}
.brand { display: inline-flex; align-items: center; flex: none; }
.brand img { height: 78px; width: auto; }
.nav { display: flex; align-items: center; gap: 1.9rem; margin-left: auto; }
.nav a {
  font-family: var(--font-head); font-weight: 600; font-size: 1.02rem;
  letter-spacing: .04em; text-transform: uppercase;
  color: var(--navy); text-decoration: none; padding: .35rem 0;
  border-bottom: 3px solid transparent;
}
.nav a:hover { color: var(--orange); }
.nav a[aria-current="page"] { border-bottom-color: var(--orange); }
.header .btn { flex: none; }
.header__actions { display: flex; align-items: center; gap: 1.25rem; flex: none; }
.header__call {
  display: inline-flex; align-items: center; gap: .6rem;
  text-decoration: none; color: var(--navy);
  padding-right: 1.25rem; border-right: 1px solid var(--line);
}
.header__call svg { width: 26px; height: 26px; fill: var(--orange); flex: none; }
.header__call span { display: block; line-height: 1.15; }
.header__call em {
  display: block; font-style: normal; font-size: .74rem; letter-spacing: .12em;
  text-transform: uppercase; color: var(--steel); font-family: var(--font-head); font-weight: 600;
}
.header__call b { font-family: var(--font-head); font-size: 1.22rem; color: var(--navy); letter-spacing: .01em; }
.header__call:hover b { color: var(--orange); }

.nav-toggle {
  display: none; width: 46px; height: 42px; border: 1px solid var(--line);
  border-radius: var(--radius); background: #fff; cursor: pointer; padding: 0;
  align-items: center; justify-content: center; flex: none;
}
.nav-toggle span:not(.visually-hidden),
.nav-toggle span:not(.visually-hidden)::before,
.nav-toggle span:not(.visually-hidden)::after {
  display: block; width: 22px; height: 2px; background: var(--navy); position: relative;
  transition: transform .2s ease, opacity .2s ease;
}
.nav-toggle span:not(.visually-hidden)::before,
.nav-toggle span:not(.visually-hidden)::after { content: ""; position: absolute; left: 0; }
.nav-toggle span:not(.visually-hidden)::before { top: -7px; }
.nav-toggle span:not(.visually-hidden)::after  { top: 7px; }
.nav-toggle[aria-expanded="true"] span:not(.visually-hidden) { background: transparent; }
.nav-toggle[aria-expanded="true"] span:not(.visually-hidden)::before { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:not(.visually-hidden)::after  { transform: translateY(-7px) rotate(-45deg); }

/* ---------- Blueprint texture (echoes the one-sheet artwork) ---------- */
.blueprint {
  background-image:
    linear-gradient(rgba(0,28,58,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,28,58,.045) 1px, transparent 1px);
  background-size: 46px 46px, 46px 46px;
}

/* ---------- Hero ---------- */
.hero { position: relative; background: var(--bg-alt); overflow: hidden; }
.hero__inner {
  display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center; padding: clamp(3rem, 6vw, 5.5rem) 0;
}
.hero__tag {
  display: inline-block; font-family: var(--font-head); font-weight: 700;
  font-size: .84rem; letter-spacing: .2em; text-transform: uppercase;
  color: var(--navy); background: #fff; border-left: 4px solid var(--orange);
  padding: .5rem .9rem; margin-bottom: 1.5rem; box-shadow: var(--shadow-sm);
}
.hero h1 { margin-bottom: .55rem; }
.hero h1 .accent { color: var(--orange); }
.hero__sub { font-size: 1.2rem; max-width: 34ch; color: var(--slate); margin-bottom: 1.9rem; }
.hero__media { position: relative; }
.hero__media img {
  width: 100%; height: clamp(340px, 42vw, 520px); object-fit: cover;
  border-radius: var(--radius-lg); box-shadow: var(--shadow-lg);
}
.hero__badge {
  position: absolute; left: -22px; bottom: 34px;
  background: var(--navy); color: #fff; padding: 1.1rem 1.4rem;
  border-radius: var(--radius); box-shadow: var(--shadow-md); max-width: 235px;
  border-left: 5px solid var(--orange);
}
.hero__badge strong {
  display: block; font-family: var(--font-head); font-size: 1.85rem; line-height: 1; color: #fff;
}
.hero__badge span { font-size: .86rem; color: #A9BACB; letter-spacing: .04em; }

/* ---------- Trust strip ---------- */
.trust { background: var(--navy); }
.trust__grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  border-left: 1px solid rgba(255,255,255,.12);
}
.trust__item {
  padding: 1.9rem 1.5rem; border-right: 1px solid rgba(255,255,255,.12);
  display: flex; gap: .9rem; align-items: flex-start;
}
.trust__item svg { width: 26px; height: 26px; fill: var(--orange); flex: none; margin-top: 2px; }
.trust__item h3 { font-size: 1.06rem; color: #fff; margin: 0 0 .2rem; letter-spacing: .01em; }
.trust__item p { margin: 0; font-size: .92rem; color: #A9BACB; line-height: 1.5; }

/* ---------- Service tabs ---------- */
.tabs { display: flex; flex-wrap: wrap; gap: 0; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: #fff; margin-bottom: 2.5rem; }
.tabs button {
  flex: 1 1 0; min-width: 150px; padding: 1.15rem .9rem; background: #fff; border: 0;
  border-right: 1px solid var(--line); cursor: pointer;
  font-family: var(--font-head); font-weight: 600; font-size: 1.02rem;
  letter-spacing: .04em; text-transform: uppercase; color: var(--navy);
  display: flex; flex-direction: column; align-items: center; gap: .55rem;
  transition: background-color .18s ease, color .18s ease;
  border-bottom: 4px solid transparent;
}
.tabs button:last-child { border-right: 0; }
.tabs button svg { width: 30px; height: 30px; fill: none; stroke: var(--navy); stroke-width: 1.6; transition: stroke .18s ease; }
.tabs button:hover { background: var(--bg-alt); }
.tabs button[aria-selected="true"] { background: var(--navy); color: #fff; border-bottom-color: var(--orange); }
.tabs button[aria-selected="true"] svg { stroke: var(--orange); }

.tabpanel { display: none; }
.tabpanel.is-active { display: block; }
.no-js .tabpanel { display: block; margin-bottom: 3rem; }
.no-js .tabs { display: none; }

.svc {
  display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.75rem, 4vw, 3.5rem);
  align-items: center;
}
.svc img { width: 100%; height: clamp(280px, 34vw, 420px); object-fit: cover; border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }
.svc h3 { font-size: clamp(1.6rem, 2.6vw, 2.1rem); }
.checklist { list-style: none; padding: 0; margin: 0 0 1.6rem; }
.checklist li { position: relative; padding-left: 1.9rem; margin-bottom: .55rem; }
.checklist li::before {
  content: ""; position: absolute; left: 0; top: .52em;
  width: 11px; height: 6px; border-left: 2.5px solid var(--orange); border-bottom: 2.5px solid var(--orange);
  transform: rotate(-45deg);
}

/* ---------- Service cards grid ---------- */
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; }
.card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg);
  overflow: hidden; display: flex; flex-direction: column;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: #CFDAE4; }
.card img { width: 100%; height: 210px; object-fit: cover; }
.card__body { padding: 1.6rem 1.5rem 1.75rem; flex: 1; display: flex; flex-direction: column; }
.card__body h3 { margin-bottom: .45rem; }
.card__body p { font-size: .97rem; margin-bottom: 1.1rem; }
.card__body .card__link { margin-top: auto; }
.card__icon {
  width: 52px; height: 52px; border-radius: 50%; border: 2px solid var(--orange);
  display: grid; place-items: center; margin-bottom: 1.1rem;
}
.card__icon svg { width: 26px; height: 26px; fill: none; stroke: var(--orange); stroke-width: 1.7; }
.card__link {
  font-family: var(--font-head); font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; font-size: .9rem; color: var(--orange); text-decoration: none;
  display: inline-flex; align-items: center; gap: .4rem;
}
.card__link:hover { color: var(--navy); }
.card__link::after { content: "→"; transition: transform .18s ease; }
.card__link:hover::after { transform: translateX(3px); }

/* ---------- Split feature ---------- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.split--flip .split__media { order: 2; }
.split__media { position: relative; }
.split__media img { width: 100%; height: clamp(320px, 40vw, 520px); object-fit: cover; border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }
.split__media::after {
  content: ""; position: absolute; left: -18px; bottom: -18px;
  width: 120px; height: 120px;
  border-left: 6px solid var(--orange);
  border-bottom: 6px solid var(--orange);
  border-bottom-left-radius: var(--radius-lg);
  z-index: -1;
}

/* ---------- Stats ---------- */
.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-top: 2rem; }
.stat { border-left: 4px solid var(--orange); padding-left: 1.1rem; }
.stat strong { display: block; font-family: var(--font-head); font-size: 2.1rem; line-height: 1.05; color: var(--navy); }
.stat span { font-size: .93rem; color: var(--steel); }

/* ---------- Process ---------- */
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.6rem; counter-reset: step; }
.step { position: relative; padding-top: 3.6rem; }
.step::before {
  counter-increment: step; content: "0" counter(step);
  position: absolute; top: 0; left: 0;
  font-family: var(--font-head); font-size: 2.9rem; font-weight: 700; line-height: 1;
  color: rgba(231,88,25,.22);
}
.step h3 { font-size: 1.18rem; margin-bottom: .4rem; }
.step p { font-size: .96rem; margin: 0; }
.section--navy .step p { color: #A9BACB; }
.section--navy .step::before { color: rgba(231,88,25,.55); }

/* ---------- Orange CTA banner ---------- */
.banner { background: var(--orange); color: #fff; padding: clamp(2.25rem, 4vw, 3rem) 0; }
.banner__inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
.banner__left { display: flex; align-items: center; gap: 1.6rem; }
.banner__left svg { width: 62px; height: 62px; fill: none; stroke: #fff; stroke-width: 2; flex: none; }
.banner__rule { width: 2px; align-self: stretch; background: rgba(255,255,255,.5); }
.banner h2 {
  font-family: var(--font-cond); font-size: clamp(2rem, 4.6vw, 3.25rem);
  color: #fff; margin: 0; letter-spacing: .01em; line-height: 1;
}

/* ---------- Testimonials ---------- */
.notice {
  display: flex; gap: .75rem; align-items: flex-start;
  background: var(--orange-100); border: 1px dashed var(--orange);
  border-radius: var(--radius); padding: .9rem 1.1rem; margin-bottom: 2rem;
  font-size: .93rem; color: var(--navy-800);
}
.notice svg { width: 18px; height: 18px; fill: var(--orange); flex: none; margin-top: 3px; }
.notice strong { color: var(--navy); }
.quotes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; }
.quote {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg);
  padding: 1.75rem 1.6rem; display: flex; flex-direction: column;
}
.quote__stars { display: flex; gap: 3px; margin-bottom: .9rem; }
.quote__stars svg { width: 17px; height: 17px; fill: var(--orange); }
.quote p { font-size: 1rem; color: var(--slate); font-style: italic; }
.quote__who { display: flex; align-items: center; gap: .8rem; margin-top: auto; padding-top: 1rem; border-top: 1px solid var(--line); }
.quote__who img { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; flex: none; }
.quote__who b { display: block; font-family: var(--font-head); color: var(--navy); font-size: 1.02rem; }
.quote__who span { font-size: .86rem; color: var(--steel); }

/* ---------- Forms ---------- */
.form-layout { display: grid; grid-template-columns: 1.25fr .75fr; gap: clamp(2rem, 5vw, 3.5rem); align-items: start; }
.form-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(1.5rem, 3vw, 2.5rem); box-shadow: var(--shadow-sm); }
.field { margin-bottom: 1.15rem; }
.field label {
  display: block; font-family: var(--font-head); font-weight: 600; font-size: .95rem;
  letter-spacing: .04em; text-transform: uppercase; color: var(--navy); margin-bottom: .4rem;
}
.field .req { color: var(--orange); }
.field input, .field select, .field textarea {
  width: 100%; font-family: var(--font-body); font-size: 1rem; color: var(--ink);
  padding: .8rem .9rem; border: 1px solid #CFD8E0; border-radius: var(--radius); background: #fff;
  transition: border-color .16s ease, box-shadow .16s ease;
}
.field input:focus, .field select:focus, .field textarea:focus {
  outline: 0; border-color: var(--orange); box-shadow: 0 0 0 3px rgba(231,88,25,.16);
}
.field textarea { min-height: 140px; resize: vertical; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.15rem; }
.form-note { font-size: .88rem; color: var(--steel); margin: .6rem 0 0; }
fieldset { border: 0; padding: 0; margin: 0 0 1.15rem; }
fieldset legend {
  font-family: var(--font-head); font-weight: 600; font-size: .95rem;
  letter-spacing: .04em; text-transform: uppercase; color: var(--navy); margin-bottom: .5rem; padding: 0;
}
.radios { display: flex; gap: .6rem; flex-wrap: wrap; }
.radios label {
  display: inline-flex; align-items: center; gap: .45rem; cursor: pointer;
  border: 1px solid #CFD8E0; border-radius: var(--radius); padding: .55rem .9rem;
  font-size: .95rem; text-transform: none; letter-spacing: 0; color: var(--slate);
  font-family: var(--font-body); font-weight: 500; margin: 0;
}
.radios input { accent-color: var(--orange); margin: 0; width: auto; }
.radios label:has(input:checked) { border-color: var(--orange); background: var(--orange-100); color: var(--navy); font-weight: 600; }

/* ---------- Contact aside ---------- */
.info-card { background: var(--navy); color: #A9BACB; border-radius: var(--radius-lg); padding: clamp(1.5rem, 3vw, 2.25rem); }
.info-card h3 { color: #fff; }
.info-list { list-style: none; padding: 0; margin: 0; }
.info-list li { display: flex; gap: .9rem; padding: 1rem 0; border-bottom: 1px solid rgba(255,255,255,.12); margin: 0; }
.info-list li:last-child { border-bottom: 0; }
.info-list svg { width: 20px; height: 20px; fill: var(--orange); flex: none; margin-top: 4px; }
.info-list b { display: block; color: #fff; font-family: var(--font-head); letter-spacing: .04em; text-transform: uppercase; font-size: .86rem; margin-bottom: .15rem; }
.info-list a { color: #fff; text-decoration: none; }
.info-list a:hover { color: var(--orange); }

/* ---------- Page hero (inner pages) ---------- */
.pagehero { background: var(--navy); color: #A9BACB; padding: clamp(3rem, 6vw, 4.75rem) 0; position: relative; overflow: hidden; }
.pagehero.blueprint {
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 46px 46px, 46px 46px;
  background-color: var(--navy);
}
.pagehero h1 { color: #fff; margin-bottom: .5rem; }
.pagehero p { font-size: 1.12rem; max-width: 60ch; margin: 0; }
.crumbs { font-size: .86rem; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 1rem; font-family: var(--font-head); }
.crumbs a { color: var(--orange); text-decoration: none; }
.crumbs a:hover { text-decoration: underline; }
.crumbs span { color: #7D91A5; }

/* ---------- Footer ---------- */
.footer { background: var(--navy); color: #93A6B8; padding: clamp(3rem, 6vw, 4.25rem) 0 0; font-size: .96rem; }
.footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 2.5rem; padding-bottom: 3rem; }
.footer__logo { background: #fff; border-radius: var(--radius); padding: .8rem 1rem; display: inline-block; margin-bottom: 1.25rem; }
.footer__logo img { height: 72px; width: auto; }
.footer h4 {
  font-family: var(--font-head); color: #fff; font-size: 1.02rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; margin: 0 0 1.1rem;
}
.footer ul { list-style: none; padding: 0; margin: 0; }
.footer li { margin-bottom: .6rem; }
.footer a { color: #93A6B8; text-decoration: none; }
.footer a:hover { color: var(--orange); }
.footer address { font-style: normal; line-height: 1.8; }
.footer__hours { display: flex; gap: .6rem; align-items: flex-start; margin: 1.1rem 0 0; }
.footer__hours svg { width: 18px; height: 18px; fill: var(--orange); flex: none; margin-top: 3px; }
.footer__hours b {
  display: block; color: #fff; font-family: var(--font-head);
  letter-spacing: .1em; text-transform: uppercase; font-size: .78rem;
}
.footer__tag {
  font-family: var(--font-head); font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: #fff; font-size: .82rem; margin: 0 0 1rem;
}
.footer__bottom {
  border-top: 1px solid rgba(255,255,255,.12); padding: 1.4rem 0;
  display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
  font-size: .87rem; color: #7D91A5;
}

/* ---------- Utilities ---------- */
.visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.mt-0 { margin-top: 0; }

/* ---------- Responsive ---------- */
@media (max-width: 1240px) {
  .header__call { display: none; }
  :root { --header-h: 104px; }
  .brand img { height: 72px; }
}

@media (max-width: 1080px) {
  .nav { gap: 1.3rem; }
  .nav a { font-size: .95rem; }
  :root { --header-h: 96px; }
  .brand img { height: 66px; }
  .trust__grid { grid-template-columns: repeat(2, 1fr); }
  .cards, .quotes { grid-template-columns: repeat(2, 1fr); }
  .steps { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
  :root { --header-h: 88px; }
  .brand img { height: 60px; }
  .nav-toggle { display: flex; }
  .nav {
    /* absolute inside the sticky header, so the panel follows the header
       wherever it sits — fixed positioning detached it from the header
       while the top bar was still on screen */
    position: absolute; top: calc(100% + 1px); left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    background: #fff; border-bottom: 1px solid var(--line); box-shadow: var(--shadow-md);
    padding: .5rem 1.5rem 1.25rem; margin: 0;
    max-height: calc(100vh - var(--header-h)); overflow-y: auto;
    display: none;
  }
  .nav.is-open { display: flex; }
  .nav a { padding: .95rem 0; border-bottom: 1px solid var(--line); font-size: 1.05rem; }
  .nav a[aria-current="page"] { color: var(--orange); border-bottom-color: var(--line); }
  .header__inner { gap: .75rem; }
  .header__actions { gap: .6rem; margin-left: auto; order: 2; }
  .nav-toggle { order: 3; }
  .header__call {
    display: inline-flex; padding: 0; border-right: 0;
    width: 46px; height: 42px; justify-content: center;
    border: 1px solid var(--line); border-radius: var(--radius);
  }
  .header__call span { display: none; }
  .header__call svg { width: 20px; height: 20px; }
  .header .btn { display: none; }
  .hero__inner { grid-template-columns: 1fr; }
  .hero__sub { max-width: none; }
  .hero__badge { left: 12px; bottom: 12px; }
  .split, .svc, .form-layout { grid-template-columns: 1fr; }
  .split--flip .split__media { order: 0; }
  .split__media::after { display: none; }
  .banner__inner { justify-content: flex-start; }
}

@media (max-width: 640px) {
  body { font-size: 16px; }
  .wrap { width: min(100% - 2rem, var(--wrap)); }
  .trust__grid, .cards, .quotes, .steps, .stats, .field-row { grid-template-columns: 1fr; }
  .tabs button { min-width: 50%; flex-basis: 50%; }
  .footer__grid { grid-template-columns: 1fr; gap: 2rem; }
  .topbar__inner { justify-content: center; text-align: center; }
  .banner__left svg, .banner__rule { display: none; }
  .btn { width: 100%; }
  .btn-row { flex-direction: column; }
  .hero__badge { position: static; margin-top: 1rem; max-width: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* info-list on a light background (About page leadership card) */
.info-list--dark li { border-bottom-color: var(--line); }
.info-list--dark b { color: var(--navy); }
.info-list--dark a { color: var(--navy-700); }
.info-list--dark a:hover { color: var(--orange); }

/* ==========================================================================
   Video hero carousel
   Six looping clips, one per service line, cross-fading behind the headline.
   ========================================================================== */
.vhero {
  position: relative; isolation: isolate;
  min-height: clamp(560px, 82vh, 840px);
  display: flex; flex-direction: column; justify-content: center;
  background: var(--navy);
  overflow: hidden;
  padding: clamp(3rem, 7vw, 5rem) 0 0;
}

/* --- media stack --- */
.vhero__media { position: absolute; inset: 0; z-index: -2; }
.vhero__slide {
  position: absolute; inset: 0;
  opacity: 0; transition: opacity 1s ease-in-out;
}
.vhero__slide.is-active { opacity: 1; }
.vhero__video {
  width: 100%; height: 100%; object-fit: cover; display: block;
  /* the clips are lightly graded toward the brand navy so the six sources
     read as one film rather than six unrelated stock shots */
  filter: saturate(.82) contrast(1.06);
}

/* --- scrim: heavier at the left where the copy sits --- */
.vhero__scrim {
  position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(100deg, rgba(0,28,58,.94) 0%, rgba(0,28,58,.86) 34%, rgba(0,28,58,.58) 68%, rgba(0,28,58,.48) 100%),
    linear-gradient(to top, rgba(0,28,58,.85) 0%, rgba(0,28,58,0) 42%);
}

/* --- copy --- */
.vhero__inner { position: relative; flex: 1; display: flex; flex-direction: column; justify-content: center; padding-bottom: 2rem; }
.vhero__tag {
  display: inline-block; align-self: flex-start;
  font-family: var(--font-head); font-weight: 700; font-size: .82rem;
  letter-spacing: .2em; text-transform: uppercase; color: #fff;
  border-left: 4px solid var(--orange); padding: .35rem 0 .35rem .85rem;
  margin: 0 0 1.4rem;
}
.vhero h1 { color: #fff; margin-bottom: .55rem; text-wrap: balance; }
.vhero h1 .accent { color: var(--orange); }
.vhero__sub { font-size: 1.2rem; color: #C6D3E0; max-width: 40ch; margin-bottom: 2rem; }

/* --- rotating caption naming the trade on screen --- */
.vhero__captions { position: relative; min-height: 4.4em; margin-top: 2.25rem; max-width: 46ch; }
.vhero__caption {
  position: absolute; inset: 0; margin: 0;
  font-size: .98rem; color: #A9BACB;
  opacity: 0; transform: translateY(6px);
  /* visibility (not just opacity) so the links inside inactive captions stay
     out of the tab order until their slide is on screen */
  visibility: hidden;
  transition: opacity .5s ease, transform .5s ease, visibility 0s linear .5s;
  pointer-events: none;
}
.vhero__caption.is-active {
  opacity: 1; transform: none; visibility: visible; pointer-events: auto;
  transition: opacity .5s ease, transform .5s ease, visibility 0s;
}

/* per-service link out of the hero caption */
.vhero__more {
  /* block-level so it always sits on its own line under the caption text
     rather than wrapping mid-sentence */
  display: flex; width: fit-content; align-items: center; gap: .35rem;
  margin-top: .6rem; white-space: nowrap;
  font-family: var(--font-head); font-weight: 700; font-size: .88rem;
  letter-spacing: .06em; text-transform: uppercase;
  color: #fff; text-decoration: none;
  border-bottom: 2px solid var(--orange); padding-bottom: 1px;
  transition: color .18s ease, border-color .18s ease;
}
.vhero__more::after { content: "\2192"; transition: transform .18s ease; }
.vhero__more:hover { color: var(--orange); }
.vhero__more:hover::after { transform: translateX(3px); }
.vhero__caption b {
  color: #fff; font-family: var(--font-head); letter-spacing: .06em;
  text-transform: uppercase; font-size: .92rem;
}

/* --- controls --- */
.vhero__controls {
  position: relative; border-top: 1px solid rgba(255,255,255,.16);
  background: rgba(0,28,58,.42); backdrop-filter: blur(3px);
}
.vhero__controls-inner { display: flex; align-items: stretch; gap: 1.5rem; justify-content: space-between; }
.vhero__tabs { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1.4rem; flex: 1; }
.vhero__tab {
  appearance: none; background: none; border: 0; cursor: pointer;
  padding: 1rem 0 1.1rem; text-align: left; color: #A9BACB;
  display: flex; flex-direction: column; gap: .55rem;
  font-family: var(--font-head); font-size: .84rem; font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase;
  transition: color .2s ease;
}
.vhero__tab:hover { color: #fff; }
.vhero__tab.is-active { color: #fff; }
.vhero__tab-bar { display: block; height: 3px; background: rgba(255,255,255,.24); overflow: hidden; }
.vhero__tab-bar i { display: block; height: 100%; width: 0; background: var(--orange); }
.vhero__tab.is-active .vhero__tab-bar i { width: 100%; transition: width var(--slide-ms, 7000ms) linear; }
.vhero.is-paused .vhero__tab.is-active .vhero__tab-bar i { transition: none; }

.vhero__toggle {
  appearance: none; background: none; border: 0; cursor: pointer;
  display: inline-flex; align-items: center; gap: .5rem;
  color: #A9BACB; padding: 1rem 0;
  font-family: var(--font-head); font-size: .82rem; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
  transition: color .2s ease;
}
.vhero__toggle:hover { color: #fff; }
.vhero__toggle svg { width: 16px; height: 16px; fill: var(--orange); }
.vhero__toggle .icon-play { display: none; }
.vhero__toggle[aria-pressed="true"] .icon-play { display: block; }
.vhero__toggle[aria-pressed="true"] .icon-pause { display: none; }

/* --- responsive --- */
@media (max-width: 1080px) {
  .vhero__tabs { grid-template-columns: repeat(3, 1fr); gap: 1rem; row-gap: 0; }
}
@media (max-width: 700px) {
  .vhero { min-height: 0; padding-top: 2.5rem; }
  .vhero__sub { font-size: 1.08rem; }
  /* keep the caption on small screens — it carries the per-service link */
  .vhero__captions { min-height: 5.2em; margin-top: 1.5rem; font-size: .92rem; }
  .vhero__tabs { grid-template-columns: repeat(2, 1fr); }
  .vhero__tab { font-size: .76rem; }
  .vhero__controls-inner { flex-direction: column; gap: 0; }
  .vhero__toggle { align-self: flex-start; padding-bottom: 1rem; }
  .vhero__scrim {
    background:
      linear-gradient(180deg, rgba(0,28,58,.86) 0%, rgba(0,28,58,.78) 55%, rgba(0,28,58,.92) 100%);
  }
}

/* Motion-sensitive viewers get the poster frames, never a moving background. */
@media (prefers-reduced-motion: reduce) {
  .vhero__slide { transition: none; }
  .vhero__tab.is-active .vhero__tab-bar i { transition: none; width: 100%; }
}

/* Two clips frame their subject on the left, where the headline sits. Mirroring
   the footage moves the worker into the open right side of the hero. Neither
   clip contains text or signage, so the flip is invisible. */
.vhero__slide[data-flip] .vhero__video { transform: scaleX(-1); }

/* The upkeep clip is a dim interior with a dark-clad subject, so the hero scrim
   crushes it while the hi-vis clips punch through. Lift this one's exposure. */
.vhero__slide[data-lift] .vhero__video {
  filter: saturate(.88) contrast(1.02) brightness(1.34);
}

/* ---------- Service request: composed-request panel + toast ---------- */
.sent {
  margin-top: 1.75rem; padding: clamp(1.25rem, 3vw, 1.9rem);
  background: var(--bg-alt); border: 1px solid var(--line);
  border-left: 5px solid var(--orange); border-radius: var(--radius-lg);
}
.sent:focus { outline: none; }
.sent:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
.sent h3 { margin-top: 0; margin-bottom: .4rem; }
.sent p { font-size: .98rem; }
.sent em { color: var(--steel); font-style: normal; display: block; margin-top: .35rem; font-size: .92rem; }
.sent__text {
  width: 100%; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .88rem; line-height: 1.55; color: var(--ink);
  padding: .9rem 1rem; margin-bottom: 1rem;
  border: 1px solid #CFD8E0; border-radius: var(--radius); background: #fff;
  resize: vertical;
}
.sent__text:focus { outline: 0; border-color: var(--orange); box-shadow: 0 0 0 3px rgba(231,88,25,.16); }

.toast {
  position: fixed; left: 50%; bottom: 1.5rem; z-index: 300;
  transform: translate(-50%, 1rem);
  background: var(--navy); color: #fff;
  font-family: var(--font-head); font-size: .95rem; letter-spacing: .02em;
  padding: .8rem 1.2rem; border-radius: var(--radius);
  box-shadow: var(--shadow-lg); border-left: 4px solid var(--orange);
  opacity: 0; pointer-events: none; max-width: calc(100% - 2rem);
  transition: opacity .22s ease, transform .22s ease;
}
.toast.is-shown { opacity: 1; transform: translate(-50%, 0); }
