/* ---------- Header height and the top bar (Bennett 2026-10-20: "remove the facebook and linked in and all that from the top but keep
   it at the bottom"). The grey bar of social icons above the logo is hidden; the same five icons stay in the footer.
   --hdr is the header's height on a computer (90px without the bar); every full-screen hero subtracts it. ---------- */
:root { --hdr: 90px; }
#topbar { display: none !important; }

/* Fixes shared by every page: the gray top strip, footer, copyright bar, back-to-top button and site-wide
   focus (header/footer review, 2026-10-15). Loaded after the theme and header styles on every page.
   The header itself is styled in /header/header.css. */

/* Keyboard focus: the theme removes the outline from every link (a { outline: 0 }) and button, so keyboard
   users could not see where they were. Navy ring with a thin white gap, visible on white and on navy.
   Low specificity and no !important on the colour, so a page's own focus rule (white rings on photos) wins. */
a:focus-visible { outline: 2px solid #0A285A; outline-offset: 2px; box-shadow: 0 0 0 2px #fff; }
button:focus-visible, input[type="submit"]:focus-visible { outline-style: solid !important; }   /* theme: outline none !important */
button:focus-visible, input[type="submit"]:focus-visible { outline-width: 2px; outline-color: #0A285A; outline-offset: 2px; }
#copyright a:focus-visible { outline-color: #fff; box-shadow: none; }

/* Top strip: on phones the theme made the strip white with a 300px gray box in the middle; gray full width,
   as on larger screens */
@media only screen and (max-width: 767px) {
  #topbar { background: #f5f5f5 !important; }
}
/* Top strip icons were #999 at 60% opacity on #f5f5f5 (about 1.6:1, hard to see); slate, navy on hover */
#topbar .social-icons ul li a { color: #64748B; opacity: 1; }
#topbar .social-icons ul li a:hover { color: #0A285A; }

/* Footer: white headings and #888 text on the #c6c6c6 band were about 1.7:1 and 2:1. Same band, same layout,
   navy headings and links (like the logo above them) and dark gray text. */
#footer, #footer .widget_contact address { color: #333333; }
#footer .widget h3 { color: #0A285A; }
#footer a, #footer .widget_contact address span i { color: #0A285A; }
#footer a:hover { color: #0A285A; text-decoration: underline; }
/* search box: placeholder in place of the old typed-in hint; visible focus */
#footer .widget_search input::placeholder { color: #bbbbbb; opacity: 1; }
#footer .widget_search input:focus-visible { outline: 2px solid #0A285A !important; outline-offset: 2px; }

/* Copyright bar: #777 on #1b1b1b was 3.9:1; #999 is the bar's own link color (5.9:1) */
#copyright { color: #999999; }

/* Back-to-top button: at these widths it sat on top of the copyright bar's last social icon (Privacy Policy) */
@media only screen and (min-width: 768px) and (max-width: 899px), only screen and (min-width: 960px) and (max-width: 1079px) {
  #copyright .copyright-col2 { padding-right: 56px; }
}
/* 44px tap target on touch screens (was 42 x 36) */
@media only screen and (max-width: 1023px) {
  #back-to-top a { width: 44px; height: 44px; line-height: 44px; }
}
/* phones: the button covered page content (cards, paragraphs) from 200px down; header.js keeps it hidden
   until the visitor is two screens down */
html.hx-btt-early #back-to-top { display: none !important; }

/* Form buttons on every form (Fluent Forms on airborne-public-safety, contact, eng, government, heliinclink;
   Forminator on employment; Contact Form 7 on leasing): the plugins' bright blue #1a7efb, 7px / 2px corners,
   34px tall and three different typefaces. One button: navy, 4px corners, at least 44px tall, Montserrat. */
.ff-btn-submit, .forminator-button-submit, .wpcf7-submit {
  background: #0A285A !important; border: 1px solid #0A285A !important; color: #fff !important; opacity: 1 !important;
  border-radius: 4px !important; min-height: 44px !important; padding: 0 28px !important; box-shadow: none !important;
  font: 600 14px/42px Montserrat, Arial, Helvetica, sans-serif !important; letter-spacing: 1px !important; text-transform: uppercase !important; }
.ff-btn-submit:hover, .forminator-button-submit:hover, .wpcf7-submit:hover,
.ff-btn-submit:active, .forminator-button-submit:active, .wpcf7-submit:active {
  background: #071d42 !important; border-color: #071d42 !important; color: #fff !important; }
.ff-btn-submit:focus-visible, .forminator-button-submit:focus-visible, .wpcf7-submit:focus-visible { outline-offset: 3px; }
/* Fluent Forms' accent (field focus border, ticks) from its stock blue to navy on every form */
.fluentform, .fluentform_wrapper, .ff-el-group { --fluentform-primary: #0A285A; }

/* Phones: 16px text in every field so iPhones don't zoom in when one is tapped (desktop sizes unchanged) */
@media only screen and (max-width: 767px) {
  input:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  select, textarea { font-size: 16px !important; }
}

/* Phones: the theme's body text is 13px everywhere (dark bands, footer); 14px below 768px wide.
   Desktop unchanged; text with its own size set by the page is unaffected. */
@media only screen and (max-width: 767px) {
  body { font-size: 14px; }
}

/* ==== One font per role on every page (font pass, 2026-10-16) ====
   Bennett: "if the hero uses one font keep it all using that same font, if the paragraphs use one font keep it".
   The theme's own three fonts, all loaded from Google Fonts on every page:
     Roboto      headings, hero titles and big numbers (the theme's h1-h6 font; most pages' headings already)
     Open Sans   paragraphs, lists, form labels and fields, footer text (the theme's body font)
     Montserrat  small capital-letter labels ("eyebrows") and buttons (the menu, theme buttons and form buttons)
   Before this, the custom sections asked for Inter (never loaded, so visitors got Segoe UI or whatever their
   computer had), the pasted sections for Verdana, two pages for Helvetica/Arial, HeliIncLink for Montserrat.
   The pages' own <style> blocks sit in <body> after this file, hence the "body" prefix; !important only
   where the page sets the font in a style="" attribute. Sizes and weights are the pages' own. */

/* Text (paragraphs, lists, everything not listed below) */
body .cn-section, body .aps-section, body .hub-section, body .atl-section, body .ch-section, body .mia-section,
body .stl-section, body .cu-section, body .emp-section, body .ct-section, body .sl-section {
  font-family: "Open Sans", Arial, Helvetica, sans-serif; }
body #content section[style*="font-family"], body #content div[style*="font-family"] {
  font-family: "Open Sans", Arial, Helvetica, sans-serif !important; }

/* Headings and big numbers: the theme's h1-h6 are Roboto already; these are the headings and numbers that
   used other fonts (the theme's "Headline" blocks were Montserrat; stat/counter numbers followed the section) */
body .headline.font-special, body .callout-text,
body .cn-faa-number, body .cn-stat-num, body .aps-stat-num, body .aps-stat-plus, body .hi-counter,
body .hub-type-num, body .hub-type-label, body .emp-rotator-phrase, body .ct-phone, body .sl-stat-num {
  font-family: Roboto, Arial, Helvetica, sans-serif; }
/* the home stats asked for weight 200, which in Roboto is the hairline Thin; 300 matches how they looked */
body .cn-section .cn-stats .cn-stat-num { font-weight: 300; }

/* Small capital-letter labels ("eyebrows", tags, stat labels) */
body #content [class*="eyebrow"],
body #content [style*="text-transform:uppercase"], body #content [style*="text-transform: uppercase"],
body .cn-faa-part, body .cn-about-tagline, body .cn-stat-label, body .cn-client-name, body .cn-service-tag,
body .aps-stat-label, body .aps-tile-sub, body .aps-onepager span[style*="letter-spacing"],
body .hub-city-label, body .hub-city-status, body .atl-use-num, body .ch-use-num, body .emp-own-num,
body .mia-dest-tag, body .stl-route-from-to, body .cu-cap-tag, body .cu-spec-label, body .cu-feature-partner,
body .sl-stat-label, body .sl-noc-status, body .ct-address-label, body .ct-phone-hours {
  font-family: Montserrat, Arial, Helvetica, sans-serif; }

/* Buttons (the form buttons above are Montserrat already) */
body #content .button, body #content [class*="cta-button"], body .cn-slide-cta, body .cn-service-readmore,
body .emp-rotator-button, body .hi-contact-cta, body .sl-btn-primary, body .sl-btn-ghost, body .sl-cta-button {
  font-family: Montserrat, Arial, Helvetica, sans-serif; }

/* Form labels and fields (Fluent Forms used the computer's system font in its fields) */
body #content label, body #content input:not([type="submit"]):not([type="button"]), body #content select,
body #content textarea, body .fluentform .ff-el-form-control, body .fluentform .ff-el-input--label label {
  font-family: "Open Sans", Arial, Helvetica, sans-serif; }
/* Open Sans is a little wider than the system font the Inter pages fell back to, so some paragraphs gained a line
   and a few ended with one word alone ("yours." under the charter intro). Browsers that support it avoid that. */
body #content p, body #content li { text-wrap: pretty; }

/* ================= FOLDER TEASER (Airborne Public Safety one-pager + HeliIncLink brochure, 2026-10-19) =================
   Moved here from airborne-public-safety.css so both pages share one copy. :is() keeps the original specificity. */
/* ---------- One-pager teaser (Bennett 2026-10-19) ----------
   The two pages stand in a navy folder pocket: the pocket (the band, drawn on top) cuts straight across them, so only
   their tops show (page 1 down to its first heading, page 2 just its banner) and the rest of each page is hidden inside.
   The images are also blurred below the top, so nothing readable is on the site; the full PDF only comes from the form.
   When the section scrolls into view the pages slide up out of the pocket (/js/aps-reveal.js); they rise a touch on hover. */
body :is(section.aps-onepager, section.hil-brochure) .op-teaser { --pw: min(480px, 78vw); --ph: calc(var(--pw) * 1.2945); position: relative; margin: 30px auto 0; max-width: 980px; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-pages { position: relative; z-index: 1; width: var(--pw); height: calc(var(--ph) * 0.565); margin: 0 auto; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-page { position: absolute; left: 0; width: var(--pw); background: #fff; border-radius: 3px 3px 0 0; overflow: hidden;
  box-shadow: 0 1px 3px rgba(10, 40, 90, .18), 0 10px 30px -12px rgba(10, 40, 90, .35); transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-page img { display: block; width: 100%; height: auto; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-p2 { top: 0; left: 3%; width: calc(var(--pw) * .94); filter: brightness(.97); }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-p1 { top: calc(var(--ph) * 0.13); }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser:hover .op-teaser-p1 { transform: translateY(-8px); }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser:hover .op-teaser-p2 { transform: translateY(-5px); }
/* the pocket */
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-band { position: relative; z-index: 2; margin-top: -2px; padding: 54px 40px 52px; text-align: center; color: #fff; border-radius: 0 0 4px 4px;
  background: #0A285A url("/images/topo-tile-white.svg") 0 0 / 300px repeat; border-top: 8px solid #163f7e; box-shadow: 0 -12px 22px -14px rgba(6, 22, 50, .55); isolation: isolate; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-band::before { content: ""; position: absolute; inset: 0; background: rgba(10, 40, 90, .9); border-radius: 0 0 4px 4px; z-index: -1; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-eyebrow { margin: 0 0 12px; font: 600 12px/1 Montserrat, Arial, sans-serif; letter-spacing: 2.5px; text-transform: uppercase; color: #c9d9f0; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-band h3 { margin: 0 0 12px !important; font: 700 34px/1.15 Roboto, Arial, sans-serif !important; color: #fff !important; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-lead { margin: 0 auto 24px; max-width: 520px; font: 400 17px/1.6 "Open Sans", Arial, sans-serif; color: #e3ebf7; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-list { list-style: none; margin: 0 auto 30px; padding: 0; max-width: 760px; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 26px; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-list li { position: relative; margin: 0; padding: 0 0 0 24px; font: 600 15px/1.5 "Open Sans", Arial, sans-serif; color: #fff; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-list li::before { content: ""; position: absolute; left: 0; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: #c9d9f0
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.3 2.3 4.7-4.9' fill='none' stroke='%230A285A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px no-repeat; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-btn { display: inline-flex; align-items: center; gap: 10px; min-height: 50px; padding: 0 28px; background: #fff; color: #0A285A !important; text-decoration: none !important;
  font: 600 14px/1 Montserrat, Arial, sans-serif; letter-spacing: 1px; text-transform: uppercase; border-radius: 4px; transition: background .2s; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-btn::after { content: "\2192"; transition: transform .2s; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-btn:hover { background: #e3ebf7; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-btn:hover::after { transform: translateX(4px); }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-btn:focus-visible { outline: 3px solid #c9d9f0; outline-offset: 3px; }
/* entrance: the pages start down inside the pocket and slide up out of it */
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal .op-teaser-p2 { transform: translateY(calc(var(--ph) * .5)); }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal .op-teaser-p1 { transform: translateY(calc(var(--ph) * .45)); }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal.is-in .op-teaser-p2 { transform: none; transition: transform 1s cubic-bezier(.2, .8, .2, 1) .1s; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal.is-in .op-teaser-p1 { transform: none; transition: transform 1s cubic-bezier(.2, .8, .2, 1) .35s; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal.is-in:hover .op-teaser-p1 { transform: translateY(-8px); transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal.is-in:hover .op-teaser-p2 { transform: translateY(-5px); transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
@media (max-width: 767px) {
  body :is(section.aps-onepager, section.hil-brochure) .op-teaser-band { padding: 40px 22px 40px; }
  body :is(section.aps-onepager, section.hil-brochure) .op-teaser-band h3 { font-size: 27px !important; }
  body :is(section.aps-onepager, section.hil-brochure) .op-teaser { --pw: min(480px, 68vw); }
  body :is(section.aps-onepager, section.hil-brochure) .op-teaser-list { flex-direction: column; align-items: flex-start; width: fit-content; gap: 10px; text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
  body :is(section.aps-onepager, section.hil-brochure) .op-teaser-page { transition: none !important; }
}
/* the pages are full height inside the pocket: clip them at the pocket's bottom edge (room at the top for the hover lift) */
body :is(section.aps-onepager, section.hil-brochure) .op-teaser { overflow: hidden; padding-top: 14px; }
/* ---------- Folder flair (Bennett 2026-10-19: "i like the folder but i wish it had a little more flair") ----------
   A lighter-navy back flap with a tab rises behind the pages, the front pocket gets a soft top edge, and a
   "Free / 2 pages" sticker sits on the corner of the pages. Entrance: flap, then the pages slide up, then the sticker pops.
   Hover: the pages fan a little and lift. (A thumb notch was tried and dropped: it cut through page 1's small text.) */
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-back { position: absolute; z-index: 0; left: 6%; right: 6%; top: calc(14px + var(--ph) * .2); bottom: 0; border-radius: 6px 6px 0 0;
  background: #163f7e url("/images/topo-tile-white.svg") 0 0 / 260px repeat; box-shadow: inset 0 0 0 1px rgba(201, 217, 240, .12); isolation: isolate; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-back::before { content: ""; position: absolute; inset: 0; background: rgba(22, 63, 126, .9); border-radius: 6px 6px 0 0; z-index: -1; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-tab { position: absolute; left: 7%; bottom: 100%; padding: 9px 22px 8px; background: #163f7e; border-radius: 6px 6px 0 0;
  font: 600 11px/1 Montserrat, Arial, sans-serif; letter-spacing: 2px; text-transform: uppercase; color: #c9d9f0; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-band { border-top: 0;
  box-shadow: none; background-color: #0A285A; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-band::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 22px; background: linear-gradient(180deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, 0)); pointer-events: none; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-sticker { position: absolute; z-index: 3; right: -46px; top: calc(var(--ph) * .1); width: 96px; height: 96px; border-radius: 50%; background: #c9d9f0; color: #0A285A;
  display: flex; flex-direction: column; align-items: center; justify-content: center; transform: rotate(12deg); box-shadow: 0 10px 22px -10px rgba(10, 40, 90, .55);
  font: 600 11px/1.1 Montserrat, Arial, sans-serif; letter-spacing: 1.5px; text-transform: uppercase; outline: 2px dashed rgba(10, 40, 90, .35); outline-offset: -8px; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser-sticker b { display: block; font: 800 22px/1 Montserrat, Arial, sans-serif; letter-spacing: 1px; margin-bottom: 4px; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser:hover .op-teaser-p1 { transform: translateY(-10px) rotate(1.5deg); }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser:hover .op-teaser-p2 { transform: translateY(-8px) rotate(-1.5deg); }
/* entrance, staged */
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal .op-teaser-back { transform: translateY(70px); opacity: 0; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal .op-teaser-sticker { transform: scale(0) rotate(-40deg); opacity: 0; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal.is-in .op-teaser-back { transform: none; opacity: 1; transition: transform .8s cubic-bezier(.2, .8, .2, 1), opacity .5s; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal.is-in .op-teaser-p2 { transition-delay: .35s; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal.is-in .op-teaser-p1 { transition-delay: .55s; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal.is-in .op-teaser-sticker { transform: rotate(12deg); opacity: 1; transition: transform .6s cubic-bezier(.3, 1.6, .5, 1) 1.35s, opacity .2s 1.35s; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal.is-in:hover .op-teaser-p1 { transform: translateY(-10px) rotate(1.5deg); transition-delay: 0s; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal.is-in:hover .op-teaser-p2 { transform: translateY(-8px) rotate(-1.5deg); transition-delay: 0s; }
body :is(section.aps-onepager, section.hil-brochure) .op-teaser.js-reveal.is-in:hover .op-teaser-sticker { transform: rotate(4deg) scale(1.06); transition: transform .4s ease; }
@media (max-width: 767px) {
  body :is(section.aps-onepager, section.hil-brochure) .op-teaser-sticker { width: 74px; height: 74px; right: -18px; font-size: 9px; }
  body :is(section.aps-onepager, section.hil-brochure) .op-teaser-sticker b { font-size: 17px; }
  body :is(section.aps-onepager, section.hil-brochure) .op-teaser-back { left: 2%; right: 2%; }
}

/* ================= FULL-SCREEN HEROES (Bennett 2026-10-19: "every hero for everypage should cover the whole screen just like
   government and heliinclink, make that a known setting"; DESIGN-RULES.md) =================
   On a computer each page's hero runs from under the header (--hdr) to the bottom of the window, never shorter than before.
   HeliIncLink, Government and ENG set this in their own files. Phones and iPad portrait keep their own layouts. */
@media (min-width: 1000px) {
  body .cn-hero, body .aps-hero, body .hub-hero, body .mia-hero, body .stl-hero, body .ch-hero, body .atl-hero, body .lease-hero,
  body .mx-hero, body .cu-hero, body .os-hero, body .emp-hero, body .ct-hero,
  body #content .wpb_row[style*="heli-inc-video-production"] {
    min-height: calc(100vh - var(--hdr)) !important; height: auto !important; box-sizing: border-box !important;
  }
  /* the ones laid out as plain blocks: centre their content in the taller box (Miami, St. Louis and Other Services are
     side-by-side splits that stretch on their own) */
  body .aps-hero, body .hub-hero, body .ch-hero, body .atl-hero, body .emp-hero, body .ct-hero,
  body .lease-hero, body .mx-hero, body .cu-hero { display: flex !important; flex-direction: column; justify-content: center; }
  /* their inner wrappers keep their full width (max-width and centring still apply) */
  body :is(.aps-hero, .hub-hero, .ch-hero, .atl-hero, .emp-hero, .ct-hero, .lease-hero, .mx-hero, .cu-hero) > :not([class*="photo"]):not(img):not([class*="overlay"]) { width: 100%; box-sizing: border-box; }
  /* Production's hero is a theme row sized by padding: centre its title in the taller box */
  body #content .wpb_row[style*="heli-inc-video-production"] { display: flex !important; align-items: center; background-size: cover !important; }
  body #content .wpb_row[style*="heli-inc-video-production"] > .col { width: 100%; }
}

/* ================= TRIALS (Bennett 2026-10-20, ideas from bellflight.com; /js/trials.js) =================
   Each one only shows while its switch in the red "Trials" panel is on (html.trial-<id>), so the originals stay one click
   away. Remove this block, /js/trials.js and its script tag in fixes/all.json to take them all out. */
.tr-panel { position: fixed; left: 16px; bottom: 16px; z-index: 99990; font: 600 12px/1.4 Montserrat, Arial, sans-serif; }
.tr-panel button.tr-panel-toggle { padding: 9px 14px !important; margin: 0 !important; border: 0 !important; border-radius: 4px !important; background: #b4231f !important; color: #fff !important;
  font: 600 11px/1 Montserrat, Arial, sans-serif !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; cursor: pointer; box-shadow: 0 6px 16px rgba(0, 0, 0, .25) !important; }
.tr-panel-body { margin-bottom: 8px; padding: 14px 16px; width: 260px; background: #fff; border: 2px solid #b4231f; border-radius: 4px; box-shadow: 0 12px 30px rgba(0, 0, 0, .2); position: absolute; bottom: 100%; left: 0; }
.tr-panel-body p { margin: 0 0 10px !important; font: 400 12px/1.4 "Open Sans", Arial, sans-serif !important; color: #555 !important; }
.tr-panel-body label { display: flex; gap: 8px; align-items: center; margin: 6px 0 0; color: #0A285A; cursor: pointer; font: 600 12px/1.3 Montserrat, Arial, sans-serif; }

/* 1. Contact Us as a button in the header (every page) */
@media (min-width: 1024px) {
  html.trial-cta .hx .hx-menu > li:last-child > a.hx-top { height: auto; margin-left: 10px; padding: 12px 20px; background: #0A285A; color: #fff !important; border-radius: 4px !important; text-decoration: none !important; transition: background .2s; }
  html.trial-cta .hx .hx-menu > li:last-child > a.hx-top:hover, html.trial-cta .hx .hx-menu > li:last-child > a.hx-top[aria-current] { background: #071d42; color: #fff !important; }
}

/* 2. HeliIncLink sticky section menu */
.tr-subnav { display: none; }
html.trial-subnav .tr-subnav { display: block; position: fixed; left: 0; right: 0; top: 72px; z-index: 900; background: #0A285A; border-bottom: 1px solid rgba(201, 217, 240, .18);
  transform: translateY(-110%); visibility: hidden; transition: transform .35s ease, visibility 0s .35s; }
html.trial-subnav .tr-subnav.is-shown { transform: none; visibility: visible; transition: transform .35s ease; }
.tr-subnav { pointer-events: auto; }
@media (min-width: 1024px) { html.trial-subnav .tr-subnav { top: var(--hdr); } }
/* it slides out from under the header, so the header sits above it */
html.trial-subnav .hx { z-index: 1000; }
.tr-subnav-in { max-width: 1200px; margin: 0 auto; padding: 0 20px; display: flex; align-items: center; gap: 18px; box-sizing: border-box; }
.tr-subnav-name { flex: none; font: 700 16px/1 Roboto, Arial, sans-serif; color: #fff; }
.tr-subnav ul { display: flex; flex: 1; gap: 4px; margin: 0 !important; padding: 0 !important; list-style: none; overflow-x: auto; scrollbar-width: none; }
.tr-subnav ul::-webkit-scrollbar { display: none; }
.tr-subnav li { margin: 0 !important; padding: 0 !important; list-style: none; flex: none; }
.tr-subnav li::before { display: none !important; }
.tr-subnav a { display: block; padding: 17px 12px 15px; border-bottom: 2px solid transparent; color: #c9d9f0 !important; text-decoration: none !important; white-space: nowrap; font: 600 12px/1 Montserrat, Arial, sans-serif; letter-spacing: 1px; text-transform: uppercase; transition: color .2s, border-color .2s; }
.tr-subnav a:hover, .tr-subnav a.is-on { color: #fff !important; border-bottom-color: #fff; }
.tr-subnav ul a { padding-left: 9px; padding-right: 9px; letter-spacing: .6px; }
.tr-subnav a.tr-subnav-cta { flex: none; margin: 8px 0; padding: 10px 16px; border: 1px solid #fff; border-radius: 4px; color: #fff !important; }
.tr-subnav a.tr-subnav-cta:hover, .tr-subnav a.tr-subnav-cta.is-on { background: #fff; color: #0A285A !important; }
html.trial-subnav [id^="hil-"], html.trial-subnav #sl-configs, html.trial-subnav #sl-leo, html.trial-subnav #demo-request { scroll-margin-top: calc(var(--hdr) + 60px); }
@media (max-width: 767px) { .tr-subnav-name { display: none; } .tr-subnav-in { padding: 0 8px; } }

/* 3. Home hero thumbnails (replace the dots while on) */
.tr-thumbs { display: none; }
@media (min-width: 900px) {
  html.trial-thumbs .cn-hero .cn-slide-dots { display: none; }
  html.trial-thumbs .cn-hero .cn-slide-content { padding-bottom: 170px; }
  html.trial-thumbs .tr-thumbs { position: absolute; z-index: 5; left: 50%; bottom: 28px; transform: translateX(-50%); display: flex; gap: 10px; }
  .tr-thumbs button.tr-thumb { position: relative; width: 116px; padding: 0 !important; margin: 0 !important; border: 0 !important; border-radius: 4px !important; background: none !important; box-shadow: none !important; cursor: pointer; overflow: hidden; text-align: left; opacity: .7; transition: opacity .25s, transform .25s; }
  .tr-thumbs button.tr-thumb:hover, .tr-thumbs button.tr-thumb.is-on { opacity: 1; transform: translateY(-3px); }
  .tr-thumb-img { display: block; height: 64px; background-size: cover; background-position: center; border-radius: 4px; border: 2px solid rgba(255, 255, 255, .35); box-sizing: border-box; }
  .tr-thumb.is-on .tr-thumb-img { border-color: #fff; }
  .tr-thumb-name { display: block; margin-top: 7px; font: 600 10px/1.2 Montserrat, Arial, sans-serif; letter-spacing: 1px; text-transform: uppercase; color: #fff; text-shadow: 0 1px 3px rgba(0, 0, 0, .6); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .tr-thumb i { position: absolute; left: 2px; right: 2px; top: 60px; height: 2px; background: #fff; transform-origin: left; transform: scaleX(0); }
  .tr-thumb.is-on i { animation: tr-thumb-run 5s linear forwards; }
  @keyframes tr-thumb-run { to { transform: scaleX(1); } }
}

/* 4. Home "Latest" row */
.tr-latest { display: none; }
html.trial-latest .tr-latest { display: block; background: #f5f8fc; border-top: 1px solid #e4e9f0; }
.tr-latest-in { max-width: 1200px; margin: 0 auto; padding: 90px 20px; box-sizing: border-box; }
.tr-latest-head { margin-bottom: 34px; }
.tr-latest-eyebrow { margin: 0 0 12px !important; font: 600 12px/1 Montserrat, Arial, sans-serif !important; letter-spacing: 2.5px; text-transform: uppercase; color: #64748B !important; }
.tr-latest h2 { margin: 0 !important; font: 700 clamp(28px, 3vw, 38px)/1.15 Roboto, Arial, sans-serif !important; color: #0A285A !important; }
.tr-latest-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.tr-card { display: flex; flex-direction: column; background: #fff; border: 1px solid #e1e7ef; border-radius: 4px; overflow: hidden; color: inherit !important; text-decoration: none !important; transition: border-color .25s, transform .25s; }
.tr-card:hover { border-color: #b9c6d8; transform: translateY(-3px); }
.tr-card-img { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #e6ebf2; }
.tr-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s; }
.tr-card:hover .tr-card-img img { transform: scale(1.05); }
.tr-card-tag { align-self: flex-start; margin: 18px 20px 10px; padding: 5px 9px; background: #0A285A; color: #fff; border-radius: 3px; font: 600 10px/1 Montserrat, Arial, sans-serif; letter-spacing: 1.5px; text-transform: uppercase; }
.tr-card b { margin: 0 20px 8px; font: 700 18px/1.3 Roboto, Arial, sans-serif; color: #0A285A; }
.tr-card-text { flex: 1; margin: 0 20px 16px; font: 400 14px/1.55 "Open Sans", Arial, sans-serif; color: #555; }
.tr-card-more { margin: 0 20px 20px; font: 600 12px/1 Montserrat, Arial, sans-serif; letter-spacing: 1px; text-transform: uppercase; color: #0A285A; }
.tr-card-more::after { content: " \2192"; }
@media (max-width: 1023px) { .tr-latest-row { grid-template-columns: 1fr 1fr; } }
@media (max-width: 599px) { .tr-latest-row { grid-template-columns: 1fr; } .tr-latest-in { padding: 64px 20px; } .tr-panel { left: 10px; bottom: 10px; } }
@media (prefers-reduced-motion: reduce) { .tr-thumb.is-on i { animation: none; transform: scaleX(1); } }

/* 5. HeliIncLink turning helicopter (/js/hil-turn.js): three screens tall, the stage pinned under the header */
html:not(.trial-turn) .hil-turn { display: none; }
.hil-turn { position: relative; height: 300vh; width: 100vw; margin-left: calc(50% - 50vw); background: radial-gradient(90% 70% at 50% 40%, #163f7e 0%, #0A285A 48%, #061633 100%); }
.hil-turn::before { content: ""; position: absolute; inset: 0; background: url("/images/topo-tile-white.svg") 0 0 / 420px repeat; opacity: .04; pointer-events: none; }
.hil-turn-stage { position: sticky; top: 72px; height: calc(100vh - 72px); overflow: hidden; }
@media (min-width: 1024px) { .hil-turn-stage { top: var(--hdr); height: calc(100vh - var(--hdr)); } }
html.trial-subnav .hil-turn-stage { top: calc(72px + 51px); height: calc(100vh - 72px - 51px); }
@media (min-width: 1024px) { html.trial-subnav .hil-turn-stage { top: calc(var(--hdr) + 51px); height: calc(100vh - var(--hdr) - 51px); } }
.hil-turn canvas { position: absolute; inset: 0; display: block; }
.hil-turn-panel { position: absolute; z-index: 2; width: min(400px, 34vw); color: #fff; opacity: 0; visibility: hidden; will-change: opacity, transform; }
.hil-turn-right { right: max(20px, calc((100vw - 1160px) / 2)); top: 50%; margin-top: -110px; }
.hil-turn-left { left: max(20px, calc((100vw - 1160px) / 2)); top: 50%; margin-top: -110px; }
.hil-turn-low { left: 50%; bottom: 7%; width: min(560px, 80vw); margin-left: calc(min(560px, 80vw) / -2); text-align: center; }
.hil-turn-eyebrow { margin: 0 0 14px !important; font: 600 12px/1 Montserrat, Arial, sans-serif !important; letter-spacing: 2.5px; text-transform: uppercase; color: #c9d9f0 !important; }
.hil-turn-panel h3 { margin: 0 0 14px !important; font: 700 clamp(26px, 2.6vw, 36px)/1.15 Roboto, Arial, sans-serif !important; color: #fff !important; text-wrap: balance; }
.hil-turn-panel p:not(.hil-turn-eyebrow) { margin: 0 !important; font: 400 17px/1.65 "Open Sans", Arial, sans-serif; color: #e3ebf7 !important; }
.hil-turn-panel::before { content: ""; display: block; width: 36px; height: 2px; margin-bottom: 18px; background: #c9d9f0; }
.hil-turn-low::before { margin-left: auto; margin-right: auto; }
@media (max-width: 899px) {
  .hil-turn-panel, .hil-turn-low { left: 20px; right: 20px; top: auto; bottom: 6%; width: auto; margin: 0; text-align: left; }
  .hil-turn-low::before { margin-left: 0; }
  .hil-turn-panel p:not(.hil-turn-eyebrow) { font-size: 15px; }
}
/* reduced motion: a plain section, panels one under another, no pinning */
.hil-turn.is-still { height: auto; }
.hil-turn.is-still .hil-turn-stage { position: relative; top: 0; height: auto; min-height: 0; padding: 380px 20px 70px; display: grid; gap: 34px; max-width: 1160px; margin: 0 auto; }
.hil-turn.is-still canvas { height: 360px; }
.hil-turn.is-still .hil-turn-panel { position: static; width: auto; margin: 0; opacity: 1; visibility: visible; text-align: left; }

/* ================= CLIENT LOGO STRIPS (Bennett 2026-11-06) =================
   A client's logos on the page about the work we do for them (agencies on Airborne Public Safety, networks on ENG),
   in the same bordered boxes as Commercial & Utility's "Trusted by utility and pipeline operators". The home page
   keeps every client in one grid. Logos never scale past their own size (most are 120x75 files). */
body .hi-clients { max-width: 1160px; margin: 0 auto; padding: 56px 20px 64px; text-align: center; }
body .hi-clients-label { margin: 0 0 22px; font: 600 12px/1.4 Montserrat, Arial, Helvetica, sans-serif; letter-spacing: 2px;
  text-transform: uppercase; color: #64748B; }
body .hi-clients .hi-clients-list { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; list-style: none; margin: 0; padding: 0; }
body .hi-clients .hi-clients-list { flex-wrap: nowrap; }
body .hi-clients .hi-clients-list li { box-sizing: border-box; list-style: none; margin: 0; padding: 0; flex: 0 1 180px; min-width: 0; height: 104px; border: 1px solid #e4e9f0;
  display: flex; align-items: center; justify-content: center; background: #ffffff; }
body .hi-clients .hi-clients-list li::before { display: none; }
body .hi-clients-list img { display: block; width: 100%; height: 100%; max-width: 82%; max-height: 72%; object-fit: contain; }
@media (max-width: 599px) {
  body .hi-clients { padding: 44px 20px 48px; }
  body .hi-clients .hi-clients-list { gap: 12px; }
  body .hi-clients .hi-clients-list { flex-wrap: wrap; }
  body .hi-clients .hi-clients-list li { flex: 0 0 calc(50% - 6px); max-width: 160px; height: 92px; }
}

/* ---------- Photo band (2026-11-12): Bennett's new photos on Public Safety, Maintenance and Careers. A short heading
   and two or three photos of the same height, cropped to 4:5 with a caption under each. Phones: one per row. ---------- */
body .hi-photos { box-sizing: border-box; max-width: 1200px; margin: 0 auto; padding: 90px 20px; }
body .hi-photos-head { text-align: center; margin: 0 0 36px; }
body .hi-photos .hi-photos-eyebrow { margin: 0 0 10px !important; font: 600 12px/1.4 Montserrat, Arial, Helvetica, sans-serif !important; letter-spacing: 2.5px;
  text-transform: uppercase; color: #64748B !important; }
body .hi-photos .hi-photos-title { margin: 0 !important; font: 700 clamp(28px, 3vw, 40px)/1.15 Roboto, Arial, Helvetica, sans-serif !important; letter-spacing: -.5px;
  color: #0A285A !important; text-transform: none !important; }
body .hi-photos-grid { display: grid; gap: 20px; }
body .hi-photos--3 .hi-photos-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body .hi-photos--2 .hi-photos-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 900px; margin: 0 auto; }
body .hi-photos figure { margin: 0; }
body .hi-photos figure img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 4px; max-width: none;
  box-shadow: 0 20px 40px -28px rgba(10, 40, 90, .55); }
body .hi-photos figcaption { margin: 12px 0 0; font: 600 13px/1.4 Montserrat, Arial, Helvetica, sans-serif; letter-spacing: .5px; color: #0A285A; }
@media (max-width: 767px) {
  body .hi-photos { padding: 64px 20px; }
  body .hi-photos--3 .hi-photos-grid, body .hi-photos--2 .hi-photos-grid { grid-template-columns: 1fr; max-width: 440px; }
}