
  .video-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    max-width: 100%;
  }

  .video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .location-map {
    position: relative;
    width: 100%;
    max-width: 720px;
    height: 0;
    min-height: 260px;
    padding-bottom: 56.25%;
    margin: 1.5rem auto 0;
    overflow: hidden;
    border-radius: 0.5rem;
  }

  .location-map iframe {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    min-height: 260px;
    border: 0;
  }

  @media (max-width: 575.98px) {
    .location-map {
      max-width: 100%;
      min-height: 320px;
      padding-bottom: 75%;
      border-radius: 0.375rem;
    }

    .location-map iframe {
      min-height: 320px;
    }
  }


.pager {font-size: 35px;}.pager a {color: black;padding: 8px 4px;text-decoration: none;transition: background-color .3s;}.pager a.active {background-color: dodgerblue;color: white;}.pager a:hover:not(.active) {background-color: #ddd;}
.hedbg {background-image: url("/images/all-purpose-safety-training-solutions-banner.jpg");background-size: cover;}.hedbg, h1 {color: white;}h5 span { background-color: black; }

.hedbg h1,
.hedbg h5 {
  background: none;
  color: #18324a;
  -webkit-text-fill-color: #18324a;
}

.sub-header-title,
.sub-header-tagline {
  font-size: 30px;
}

.sub-header-training-box {
  margin: 0 auto;
  max-width: 700px;
}

.ctct-inline-form h1,
.ctct-inline-form h2,
.ctct-inline-form h3,
.ctct-inline-form h4,
.ctct-inline-form h5,
.ctct-inline-form h6 {
  background: none !important;
  color: #18324a !important;
  -webkit-text-fill-color: #18324a !important;
}





/* 360training logo online page */

.powered-by-360 {
  position: fixed;
  bottom: 20px;
  left: 20px;
  z-index: 999;
  background: rgba(255, 255, 255, 0.85);
  padding: 0.5rem 0.75rem;
  border-radius: 1rem;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transition: transform 0.3s ease;
}

.powered-by-360 img {
  height: 50px;
  width: auto;
  display: block;
}

.powered-by-360:hover {
  transform: scale(1.05);
}




/* Locations Page */

/* Glass Cards for Columns */
.glass-card {
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: 1.5rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: var(--shadow-card);
  transition: var(--transition-fast);
}

/* Link List Refined */
.city-list li {
  margin-bottom: 0.75rem;
}

.city-list a {
  color: var(--primary-blue);
  font-weight: 600;
  text-decoration: none;
  display: inline-block;
  padding: 0.5rem 0.75rem;
  border-radius: 0.5rem;
  transition: var(--transition-fast);
}

.city-list a:hover {
  color: var(--accent-gold);
  background: rgba(186, 131, 13, 0.08);
  transform: translateX(6px);
  box-shadow: 0 2px 6px rgba(17, 106, 179, 0.25);
}




/* ========================================
   Root Variables for Theme & Shadows
======================================== */
:root {
  --primary-blue: #116ab3;
  --accent-gold: #ba830d;
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.1);
  --shadow-pop: 0 12px 32px rgba(0, 0, 0, 0.2);
  --shadow-card: 0 8px 24px rgba(0, 0, 0, 0.05);
  --transition-fast: all 0.3s ease;
}

/* ========================================
   Global Smooth Transitions
======================================== */
a, img, .web3-card, .web3-btn, .web3-list li {
  transition: var(--transition-fast);
}

/* ========================================
   Gradient Heading Styles (Global h1Ã¢ÂÂh6)
======================================== */
h1, h2, h3, h4, h5, h6 {
  display: inline-block;
  font-weight: bold;
  background: none;
  color: #18324a;
  margin-bottom: 1rem;
  transition: var(--transition-fast);
  text-align: center;
  -webkit-text-fill-color: #18324a;
}

.bg-dark h1,
.bg-dark h2,
.bg-dark h3,
.bg-dark h4,
.bg-dark h5,
.bg-dark h6,
.bg-primary h1,
.bg-primary h2,
.bg-primary h3,
.bg-primary h4,
.bg-primary h5,
.bg-primary h6,
.bg-secondary h1,
.bg-secondary h2,
.bg-secondary h3,
.bg-secondary h4,
.bg-secondary h5,
.bg-secondary h6,
.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.card-header.text-white h1,
.card-header.text-white h2,
.card-header.text-white h3,
.card-header.text-white h4,
.card-header.text-white h5,
.card-header.text-white h6 {
  color: #fff;
  -webkit-text-fill-color: #fff;
}

.bg-dark p,
.bg-dark li,
.bg-dark span,
.bg-primary p,
.bg-primary li,
.bg-primary span,
.bg-secondary p,
.bg-secondary li,
.bg-secondary span,
.text-white p,
.text-white li,
.text-white span {
  color: inherit;
}

.bg-warning.text-dark h1,
.bg-warning.text-dark h2,
.bg-warning.text-dark h3,
.bg-warning.text-dark h4,
.bg-warning.text-dark h5,
.bg-warning.text-dark h6 {
  color: #111;
  -webkit-text-fill-color: #111;
}

/* Responsive & accessible enhancements */
h1 { font-size: 3rem; line-height: 1.2; }
h2 { font-size: 2.2rem; }
h3 { font-size: 1.8rem; }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.2rem; }
h6 { font-size: 1rem; }

h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover {
  transform: none;
}

/* ========================================
   Hero Header Inner Stack (Inside Jumbotron)
======================================== */
.hero-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem; /* spacing between <p> and <h1> */
  margin-bottom: 2rem;
}

/* ========================================
   H1 Glass Background Enhancement Ã¢ÂÂ Brighter Glass
======================================== */
.h1-overlay {
  display: inline-block;
  padding: 1rem 2rem;
  border-radius: 1rem;
  background: rgba(255, 255, 255, 0.4); /* Brighter white background */
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.25); /* Softer, cleaner border */
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08); /* Light shadow */
  animation: fade-in 0.8s ease-out forwards;
}

/* Clean, natural brand-colored h1 text (solid color, no gradient) */
.h1-overlay h1 {
  color: #116ab3; /* Primary brand color */
  font-size: 3rem;
  font-weight: bold;
  text-align: center;
  margin: 0;
  line-height: 1.2;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: color 0.3s ease, transform 0.3s ease;

  /* Remove gradient styling explicitly in case of inheritance */
  background: none;
  -webkit-background-clip: unset;
  -webkit-text-fill-color: unset;
  background-clip: unset;
}

/* Optional hover color change */
.h1-overlay h1:hover {
  color: #ba830d; /* Accent gold on hover */
  transform: none;
}

/* ========================================
   Highlighted Text Tag Above Heading Ã¢ÂÂ Matching h1-overlay
======================================== */
.highlighted-text {
  display: inline-block;
  padding: 1rem 2rem;
  border-radius: 1rem;
  background: rgba(255, 255, 255, 0.4); /* Match h1-overlay background */
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.25); /* Match h1-overlay border */
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08); /* Match h1-overlay shadow */
  font-size: 1.8rem;
  font-weight: 600;
  color: #ba830d; /* Accent gold */
  text-align: center;
  animation: fade-in 0.8s ease-out forwards;
  margin: 0;
  line-height: 1.4;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


/* ========================================
   Fade In Animation
======================================== */
@keyframes fade-in {
  0% { opacity: 0; transform: scale(0.95); }
  100% { opacity: 1; transform: scale(1); }
}

.animate-fade-in {
  animation: fade-in 1s ease-out forwards;
}

/* ========================================
   Service Image Section
======================================== */
.service-image-container {
  margin: 0 auto;
  display: block;
  border-radius: 1.5rem;
  overflow: hidden;
  border: 4px solid var(--primary-blue);
  box-shadow: var(--shadow-lg);
  transition: var(--transition-fast);
  max-width: 600px; /* Add this line */
  width: 100%;       /* Optional: makes it responsive */
}


.service-image-container:hover {
  box-shadow: 0 0 25px var(--accent-gold);
  transform: scale(1.02);
}

.service-image {
  display: block;
  width: 100%;
  height: auto;
  transition: transform 0.5s ease;
}

.service-image-container:hover .service-image {
  transform: scale(1.05);
}

/* ========================================
   Web3 CTA Box
======================================== */
.web3-cta-box {
  background: linear-gradient(135deg, rgba(17, 106, 179, 0.1), rgba(186, 131, 13, 0.1));
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 2rem;
  padding: 2rem;
  box-shadow: var(--shadow-card);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: var(--transition-fast);
}

.cta-text {
  font-size: 1.2rem;
  color: #333;
  font-weight: 500;
}

.web3-btn {
  background: linear-gradient(to left, var(--primary-blue), var(--accent-gold));
  color: #fff;
  font-weight: 600;
  padding: 0.75rem 1.75rem;
  font-size: 1rem;
  border-radius: 999px;
  box-shadow: 0 8px 20px rgba(17, 106, 179, 0.25);
  text-decoration: none;
  border: none;
  white-space: normal; /* Allow line break */
  text-align: center;  /* Center multiline text */
  display: inline-block;
  line-height: 1.4;
  word-break: break-word;
  max-width: 320px;   /* Keeps it clean on mobile */
  width: 100%;
  margin: 0 auto;     /* Center horizontally */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.web3-btn:hover {
  transform: scale(1.05);
  box-shadow: 0 12px 28px rgba(186, 131, 13, 0.3); /* Slight golden glow */
  color: #fff;
}


/* ========================================
   Dropdown Menu
======================================== */
.dropdown-menu {
  max-height: 300px;
  overflow-y: auto;
}

/* ========================================
   Glass Table Style
======================================== */
.training-table-glass h3 {
  text-align: center;
}

.training-table-glass {
  background: rgba(255, 255, 255, 0.15);
  border-radius: 1.5rem;
  padding: 2rem;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: var(--shadow-lg);
}

/* Table Link List */
.glass-link-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.glass-link-list li {
  margin-bottom: 0.6rem;
}

.glass-link-list a {
  color: var(--primary-blue);
  font-weight: 600;
  text-decoration: none;
  display: inline-block;
  padding: 0.3rem 0.5rem;
  border-radius: 0.5rem;
}

.glass-link-list a:hover {
  color: var(--accent-gold);
  background: rgba(17, 106, 179, 0.08);
  transform: translateX(4px);
}

/* ========================================
   Web3 Section & Cards
======================================== */
.web3-section {
  background: linear-gradient(to bottom left, #f9fafc, #f0f4f9);
  border-radius: 2rem;
  padding: 2rem;
  box-shadow: var(--shadow-card);
}

.web3-title,
.web3-heading,
.section-heading {
  font-size: 2rem;
  font-weight: bold;
  background: linear-gradient(to left, var(--primary-blue), var(--accent-gold));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.section-description,
.intro-text {
  font-size: 1.1rem;
  color: #333;
}

/* Web3 List */
.web3-list {
  list-style: none;
  padding-left: 0;
}

.web3-list li {
  background: #fff;
  border-radius: 1rem;
  box-shadow: var(--shadow-card);
  margin-bottom: 1rem;
  padding: 1rem 1.5rem;
  font-weight: 500;
}

.web3-list li:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(17, 106, 179, 0.15);
}



/* ========================================
   Web3 Card (Updated for Clean UX & Spacing)
======================================== */
.web3-card {
  background: #ffffff;
  border-radius: 1.75rem;
  padding: 1.75rem;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.05);
  transition: all 0.4s ease;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
  gap: 1.5rem;
}

.web3-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.12);
}

.web3-card img {
  width: 100%;
  height: auto;
  max-height: 190px;
  object-fit: contain;
  border-radius: 1.25rem;
  border: 4px solid var(--primary-blue);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  transition: transform 0.4s ease;
}

.web3-card:hover img {
  transform: scale(1.035);
}

.web3-card .web3-btn {
  margin-top: auto;
}


/* ===============================
   Web3-Inspired Sidebar Styles
================================= */

.sidebar-wrapper {
  padding: 1.5rem;
}

.sidebar-courses {
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 2rem;
  padding: 2rem;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.1);
  animation: fade-in 0.8s ease-out forwards;
  transition: all 0.3s ease-in-out;
}

/* Heading */
.sidebar-courses .sidebar-heading {
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 1.5rem;
  background: linear-gradient(to left, #116ab3, #ba830d);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Course List */
.course-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.course-list li {
  background: #ffffff;
  margin-bottom: 1rem;
  padding: 1rem 1.25rem;
  border-radius: 1.25rem;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
  font-weight: 500;
  position: relative;
  line-height: 1.4;
  color: #222;
  transition: all 0.3s ease;
}

.course-list li:hover {
  transform: translateY(-4px) scale(1.015);
  box-shadow: 0 12px 28px rgba(17, 106, 179, 0.2);
}

/* Date Tag */
.date-tag a {
  display: inline-block;
  margin-top: 0.4rem;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  color: #116ab3;
  background: rgba(17, 106, 179, 0.08);
  padding: 0.4rem 0.8rem;
  border-radius: 0.6rem;
  transition: all 0.3s ease-in-out;
  box-shadow: 0 4px 10px rgba(17, 106, 179, 0.1);
}

.date-tag a:hover {
  color: #ba830d;
  background: rgba(186, 131, 13, 0.08);
  box-shadow: 0 6px 14px rgba(186, 131, 13, 0.2);
  transform: translateX(4px);
}

/* Fade-in Animation */
@keyframes fade-in {
  from {
    opacity: 0;
    transform: scale(0.96);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/** Custom CSS Blog Pagination **/

.blog-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  flex-wrap: nowrap;
  flex-direction: row;
  margin-top: 2rem;
  margin-bottom: 3rem; /* Adds spacing above CTA */
}

.blog-pagination .web3-btn {
  padding: 0.75rem 1.5rem;
  border-radius: 999px;
  font-weight: 600;
  font-size: 1rem;
  background: linear-gradient(to right, var(--accent-gold), var(--primary-blue));
  color: #fff;
  text-decoration: none;
  box-shadow: 0 4px 14px rgba(17, 106, 179, 0.15);
  transition: transform 0.2s ease, background 0.3s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 50px;
}

.blog-pagination .web3-btn:hover {
  transform: scale(1.05);
  background: linear-gradient(to left, var(--primary-blue), var(--accent-gold));
}

.blog-pagination .web3-btn.active {
  background: linear-gradient(to right, #116ab3, #5fa8e0);
  color: #fff;
  pointer-events: none;
  box-shadow: 0 0 12px rgba(17, 106, 179, 0.35);
  opacity: 1;
}

@media (max-width: 480px) {
  .blog-pagination {
    flex-direction: column;
    gap: 0.75rem;
  }
}

/** Custom CSS For AP Crane Training **/
#goldbar {
      width: 100%;
        height: 10px;
background-color:gold;
padding:5px;
}


 hr {
    height:10px;
    border-width:0;
    color:gray;
    background-color:#ba830d
  }



/** button color **/
.cta {
            text-align: center;
            margin-top: 30px;
            padding: 20px;
            background: #ba830d;
            color: #fff;
            border-radius: 8px;
        }
        .cta a {
            display: inline-block;
            margin-top: 10px;
            padding: 10px 20px;
            background: #fff;
            color: #ba830d;
            text-decoration: none;
            font-weight: bold;
            border-radius: 5px;
        }
        .cta a:hover {
            background: #ddd;
        }



/* === Banner logo=== */
.custom-logo-left,
.custom-logo-right {

  transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
    top: 100px;
    z-index: 1000; /* Ensure the logos are in front of the banner */
  
}

.custom-logo-left {
    /* Move the logo 50% from the left edge */

}

.custom-logo-right {
    padding-top: 75px;
    right: 30px;

}
.hidden {
    opacity: 0;
    visibility: hidden;
}


/* === banner callout ===*/

  .custom-btn {
    background-color: #ba830d; /* Set the button color of the white from the button */
    color: #ffffff; /* White text color */
    border: none; /* Remove the default outline */
  }

  .custom-btn:hover {
    background-color: rgb(37, 40, 98); /* Darker blue on hover */
    color: white; /* Keep white text color */
  }

  /* Flexbox layout to keep boxes side by side, with stacking on small screens */
  .box-container {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    max-width: 700px;
    margin: 0 auto;
  }

  .box-container div {
    background-color: #ffffff; /* Box color */
    flex: 1;
    padding: 20px;
    border-radius: 10px; /* Rounded corners */
  }

  /* Media query to stack the boxes on smaller screens */
  @media (max-width: 768px) {
    .box-container {
      flex-direction: column;
      gap: 10px; /* Reduce space between boxes when stacked */
    }
  }

  /* Remove the white border line */
  .no-border {
    border: none;
  }





/* === Navbar === */

a { 
	color: #ba830d;
}

.navbar {
    position: sticky;
}

.navbar .navbar-brand {
    position: absolute;
    top: 0;
    padding-top: 0;
    margin-right: 0px;
}

.navbar-dark .navbar-nav .nav-link {
    text-transform: uppercase;
    font-weight: bold
}

.navbar-brand img {
    transition: all .25s ease;
    width: 200px;
padding-top: 100px;
}

.sticky-nav .navbar-brand img {
    width: 90px;
}

.sticky-nav {
    justify-content: center;
    width: 100%;
    display: block;
}

.navbar .logo-wrap {
    width: 0px;
}

.float-right {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
}

.navbar-nav {
    transition: all .25s ease;
}

/* === Subheader === */

.hedbg {
    background-image: url('/images/all-purpose-safety-training-solutions-banner.jpg');
    position: relative;
    /* background-color: rgba(5, 19, 54, 0.6); */
    /* background-blend-mode: darken; */
}

.jumbotron {
    margin-bottom: 0;
}

.d-flex {
    gap: 20px;
}

.bg-warning {
    background-color: #fc9026;
}

/* === Mailing Form === */

#form69 {
    text-align: center !important;
}

#form69 #header>div {
    display: none;
}

.redesigned-theme-2018 .wufoo li {
    padding: 0px !important;
}

#form69 #header {
    margin-bottom: 20px !important;
    padding-bottom: 0px !important;
}

.redesigned-theme-2018 li>div,
.redesigned-theme-2018 li>div input,
.redesigned-theme-2018 li>span,
.redesigned-theme-2018 li>span input {
    width: 100%;
}

#form69 ul {
    max-width: 640px;
    margin: auto;
    width: 100%;
}

#form69 .buttons {
    margin-top: 20px;
}


@media (max-width: 1499px) {
    .navbar-nav {
        margin-left: 0px !important;
        padding-left: 160px;
    }

    .sticky-nav .navbar-nav {
        margin-left: 0px !important;
        padding-left: 120px;
    }
}

@media (max-width: 1399px) {
    .nav-link {
        font-size: 13px;
        line-height: 24px;
    }
}

@media (min-width: 1250px) {
    .visible-mobile {
        display: none;
    }
}

@media (max-width: 1249px) {
    .visible-desktop {
        display: none;
    }

    .mobile-cta {
        text-align: center;
        padding: 5px 0px;
        background: #000;
    }
}

@media (max-width: 999px) {
    .d-flex {
        display: block !important;
    }

    .d-flex a {
        width: 100%;
    }

    .d-flex>div+div {
        margin-top: 11px;
    }

}

@media (max-width: 991px) {

    .card-deck .card {
        margin: 0px 0px 20px;
    }
}

@media (min-width: 980px) {

    .toc-thumb>img {
        max-width: 100%;
    }
}

@media (max-width: 979px) {

    .toc-thumb>img {
        max-width: 100%;
        margin-bottom: 20px;
    }


    .navbar-brand img {
        width: 90px;
    }

    .navbar-expand-md .navbar-toggler {
        display: block;
    }

    .navbar {
        float: right;
        display: block;
        width: 100%;
    }

    .navbar-collapse:not(.show) .navbar-nav {
        display: none;
    }

    .navbar-toggler {
        margin-right: 0px;
        margin-left: auto;
    }

    .navbar-collapse.show .navbar-nav {
        display: block;
    }

    .navbar-nav {
        padding-left: 110px;
        margin-top: 0;
    }
}

@media (min-width: 576px) {
    .card-deck .card {
        margin-left: 5px;
        margin-right: 5px;
    }
}

/* Train the Trainer page */
.ttt-page {
    --ttt-brand-blue: #116ab3;
    --ttt-brand-gold: #ba830d;
    --ttt-soft: #f5f8fb;
    --ttt-line: #dfe6ee;
    --ttt-text: #26323f;
    color: var(--ttt-text);
}

.ttt-page .ttt-section-title {
    background: none;
    color: #18324a;
    font-weight: 800;
    -webkit-text-fill-color: #18324a;
}

.ttt-page .ttt-kicker {
    color: var(--ttt-brand-gold);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-size: .78rem;
}

.ttt-page .ttt-card,
.ttt-page .ttt-info-panel {
    border: 1px solid var(--ttt-line);
    border-radius: 8px;
    box-shadow: 0 14px 36px rgba(24, 50, 74, .08);
}

.ttt-page .ttt-card {
    --ttt-course-color: var(--ttt-brand-blue);
    --ttt-course-soft: #e9f3fb;
    --ttt-course-dark: #0e4f87;
    background: #fff;
    border-top: 6px solid var(--ttt-course-color);
    height: 100%;
    overflow: hidden;
}

.ttt-page .ttt-course-mobile {
    --ttt-course-color: #116ab3;
    --ttt-course-soft: #e9f3fb;
    --ttt-course-dark: #0e4f87;
}

.ttt-page .ttt-course-overhead {
    --ttt-course-color: #ba830d;
    --ttt-course-soft: #fbf4e3;
    --ttt-course-dark: #7a5609;
}

.ttt-page .ttt-course-rigging {
    --ttt-course-color: #f58220;
    --ttt-course-soft: #fff0e1;
    --ttt-course-dark: #8d4509;
}

.ttt-page .ttt-course-aerial {
    --ttt-course-color: #34745b;
    --ttt-course-soft: #e9f4ef;
    --ttt-course-dark: #22513f;
}

.ttt-page .ttt-course-forklift {
    --ttt-course-color: #c84a32;
    --ttt-course-soft: #fae9e5;
    --ttt-course-dark: #7a2f20;
}

.ttt-page .ttt-course-photo {
    background: #fff;
    border-bottom: 1px solid var(--ttt-line);
    overflow: hidden;
}

.ttt-page .ttt-course-photo img {
    aspect-ratio: 4 / 3;
    display: block;
    object-fit: cover;
    width: 100%;
}

.ttt-page .ttt-check-list {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}

.ttt-page .ttt-check-list li {
    position: relative;
    padding-left: 1.65rem;
    margin-bottom: .75rem;
}

.ttt-page .ttt-check-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: var(--ttt-course-color, #34745b);
    font-weight: 900;
}

.ttt-page .ttt-band {
    background: var(--ttt-soft);
}

.ttt-page .ttt-step {
    border-left: 4px solid var(--ttt-brand-gold);
    background: #fff;
    border-radius: 8px;
}

.ttt-page .ttt-pill {
    background: var(--ttt-course-soft, #fbf4e3);
    border: 1px solid var(--ttt-course-color, var(--ttt-brand-gold));
    color: var(--ttt-course-dark, #7a5609);
    font-weight: 800;
}

.ttt-page .ttt-benefit-tile {
    background: #fff;
    border: 1px solid var(--ttt-line);
    border-radius: 8px;
    box-shadow: 0 10px 26px rgba(24, 50, 74, .06);
    height: 100%;
    padding: 1.5rem;
}

.ttt-page .ttt-benefit-icon {
    align-items: center;
    background: rgba(186, 131, 13, .14);
    border-radius: 8px;
    color: #18324a;
    display: inline-flex;
    font-size: 1.35rem;
    font-weight: 900;
    height: 3rem;
    justify-content: center;
    margin-bottom: 1rem;
    width: 3rem;
}

.ttt-page .ttt-photo-card {
    background: #fff;
    border: 1px solid var(--ttt-line);
    border-radius: 8px;
    box-shadow: 0 14px 36px rgba(24, 50, 74, .08);
    overflow: hidden;
}

.ttt-page .ttt-photo-card img {
    display: block;
    object-fit: cover;
    width: 100%;
}

.ttt-page .ttt-large-photo img {
    aspect-ratio: 4 / 3;
}

.ttt-page .ttt-faq-list {
    display: grid;
    gap: 1rem;
}

.ttt-page .ttt-faq-item {
    background: #fff;
    border: 1px solid var(--ttt-line);
    border-radius: 8px;
    box-shadow: 0 10px 26px rgba(24, 50, 74, .06);
    color: #18324a;
    padding: 1.25rem;
}

.ttt-page .ttt-faq-item h3 {
    background: none;
    color: #18324a;
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.35;
    margin: 0 0 .5rem;
    -webkit-text-fill-color: #18324a;
}

.ttt-page .ttt-faq-item p {
    color: #26323f;
    margin: 0;
}

.ttt-page .ttt-btn {
    background: var(--ttt-brand-gold);
    border-color: var(--ttt-brand-gold);
    color: #111;
    font-weight: 800;
}

.ttt-page .ttt-btn:hover,
.ttt-page .ttt-btn:focus {
    background: #d89913;
    border-color: #d89913;
    color: #111;
}

/* Webinar Training page */
.webinar-training-page {
    --wt-blue: #116ab3;
    --wt-gold: #ba830d;
    --wt-navy: #18324a;
    --wt-soft: #f5f8fb;
    --wt-line: #dfe6ee;
    --wt-text: #26323f;
    color: var(--wt-text);
}

.webinar-training-page .wt-intro {
    background:
        linear-gradient(135deg, rgba(17, 106, 179, .08), rgba(186, 131, 13, .1)),
        #fff;
}

.webinar-training-page .wt-title,
.webinar-training-page .wt-card h3 {
    color: var(--wt-navy);
    font-weight: 800;
}

.webinar-training-page .wt-kicker {
    color: var(--wt-gold);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.webinar-training-page .wt-btn {
    background: var(--wt-gold);
    border-color: var(--wt-gold);
    color: #111;
    font-weight: 800;
}

.webinar-training-page .wt-btn:hover,
.webinar-training-page .wt-btn:focus {
    background: #d89913;
    border-color: #d89913;
    color: #111;
}

.webinar-training-page .wt-photo-card,
.webinar-training-page .wt-card,
.webinar-training-page .wt-mini-panel {
    background: #fff;
    border: 1px solid var(--wt-line);
    border-radius: 8px;
    box-shadow: 0 14px 36px rgba(24, 50, 74, .08);
    overflow: hidden;
}

.webinar-training-page .wt-photo-card img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
    width: 100%;
}

.webinar-training-page .wt-photo-caption {
    border-top: 5px solid var(--wt-gold);
    padding: 1rem;
}

.webinar-training-page .wt-photo-caption strong,
.webinar-training-page .wt-photo-caption span {
    display: block;
}

.webinar-training-page .wt-photo-caption span,
.webinar-training-page .wt-card p {
    color: #607080;
}

.webinar-training-page .wt-card {
    --wt-topic-color: var(--wt-blue);
    border-top: 6px solid var(--wt-topic-color);
    height: 100%;
    padding: 1.5rem;
}

.webinar-training-page .wt-topic-mobile {
    --wt-topic-color: #116ab3;
}

.webinar-training-page .wt-topic-overhead {
    --wt-topic-color: #ba830d;
}

.webinar-training-page .wt-topic-rigging {
    --wt-topic-color: #f58220;
}

.webinar-training-page .wt-topic-aerial {
    --wt-topic-color: #34745b;
}

.webinar-training-page .wt-topic-forklift {
    --wt-topic-color: #c84a32;
}

.webinar-training-page .wt-icon {
    align-items: center;
    background: rgba(17, 106, 179, .09);
    border-radius: 8px;
    color: var(--wt-topic-color);
    display: inline-flex;
    font-size: 1.55rem;
    height: 3.25rem;
    justify-content: center;
    margin-bottom: 1rem;
    width: 3.25rem;
}

.webinar-training-page .wt-info-card {
    border-top-color: var(--wt-gold);
}

.webinar-training-page .wt-band {
    background: var(--wt-soft);
}

.webinar-training-page .wt-mini-panel {
    color: var(--wt-navy);
    font-weight: 800;
    height: 100%;
    padding: 1.5rem;
}

@media (max-width: 991px) {
    .webinar-training-page .wt-band {
        text-align: center;
    }
}

/* Online Training page */
.online-training-page {
    --ot-blue: #116ab3;
    --ot-gold: #ba830d;
    --ot-navy: #18324a;
    --ot-soft: #f5f8fb;
    --ot-line: #dfe6ee;
    --ot-text: #26323f;
    color: var(--ot-text);
}

.online-training-page .ot-intro {
    background:
        linear-gradient(135deg, rgba(17, 106, 179, .08), rgba(186, 131, 13, .1)),
        #fff;
}

.online-training-page .ot-title,
.online-training-page .ot-section-title {
    color: var(--ot-navy);
    font-weight: 800;
}

.online-training-page .ot-kicker {
    color: var(--ot-gold);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.online-training-page .ot-btn {
    background: var(--ot-gold);
    border-color: var(--ot-gold);
    color: #111;
    font-weight: 800;
}

.online-training-page .ot-btn:hover,
.online-training-page .ot-btn:focus {
    background: #d89913;
    border-color: #d89913;
    color: #111;
}

.online-training-page .ot-photo-card,
.online-training-page .ot-category,
.online-training-page .ot-help {
    border: 1px solid var(--ot-line);
    border-radius: 8px;
    box-shadow: 0 14px 36px rgba(24, 50, 74, .08);
    overflow: hidden;
}

.online-training-page .ot-photo-card {
    background: #fff;
    position: relative;
}

.online-training-page .ot-photo-card img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
    width: 100%;
}

.online-training-page .ot-photo-caption {
    background: #fff;
    border-top: 5px solid var(--ot-gold);
    padding: 1rem;
}

.online-training-page .ot-photo-caption strong,
.online-training-page .ot-photo-caption span {
    display: block;
}

.online-training-page .ot-photo-caption span {
    color: #5f6d7a;
}

.online-training-page .ot-jump-card {
    --ot-category-color: var(--ot-blue);
    background: #fff;
    border: 1px solid var(--ot-line);
    border-left: 5px solid var(--ot-category-color);
    border-radius: 8px;
    color: var(--ot-navy);
    display: block;
    height: 100%;
    padding: 1rem;
    text-decoration: none;
}

.online-training-page .ot-jump-card:hover,
.online-training-page .ot-course-link:hover {
    color: var(--ot-blue);
    transform: translateY(-2px);
}

.online-training-page .ot-jump-card span,
.online-training-page .ot-jump-card small {
    color: #5f6d7a;
    display: block;
    font-size: .82rem;
}

.online-training-page .ot-jump-card strong {
    display: block;
    line-height: 1.25;
    margin: .25rem 0;
}

.online-training-page .ot-category {
    --ot-category-color: var(--ot-blue);
    background: #fff;
}

.online-training-page .ot-category-media {
    background: var(--ot-soft);
    height: 100%;
    min-height: 280px;
    position: relative;
}

.online-training-page .ot-category-media img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.online-training-page .ot-category-safety .ot-category-media img {
    object-position: right center;
}

.online-training-page .ot-category-aerial .ot-category-media img {
    object-position: 42% center;
}

.online-training-page .ot-category-crane .ot-category-media img {
    object-position: 18% center;
}

.online-training-page .ot-category-forklift .ot-category-media img {
    object-position: 55% center;
}

.online-training-page .ot-category-heavy .ot-category-media img {
    object-position: 52% center;
}

.online-training-page .ot-category-badge {
    background: var(--ot-category-color);
    border-radius: 999px;
    bottom: 1rem;
    color: #fff;
    font-weight: 800;
    left: 1rem;
    padding: .45rem .8rem;
    position: absolute;
}

.online-training-page .ot-category-content {
    border-top: 6px solid var(--ot-category-color);
    height: 100%;
    padding: 2rem;
}

.online-training-page .ot-course-link {
    align-items: center;
    background: #fff;
    border: 1px solid var(--ot-line);
    border-left: 4px solid var(--ot-category-color);
    border-radius: 8px;
    color: var(--ot-navy);
    display: flex;
    font-weight: 700;
    gap: .75rem;
    height: 100%;
    justify-content: space-between;
    line-height: 1.35;
    padding: .85rem;
    text-decoration: none;
    transition: all .2s ease;
}

.online-training-page .ot-course-link strong,
.online-training-page .ot-course-link small {
    display: block;
}

.online-training-page .ot-course-link strong {
    font-size: .98rem;
    line-height: 1.3;
}

.online-training-page .ot-course-link small {
    color: #607080;
    font-weight: 500;
    line-height: 1.45;
    margin-top: .4rem;
}

.online-training-page .ot-course-link i {
    color: var(--ot-category-color);
    flex: 0 0 auto;
}

.online-training-page .ot-show-more {
    background: var(--ot-category-color);
    border-color: var(--ot-category-color);
    color: #fff;
    font-weight: 800;
}

.online-training-page .ot-show-more:hover,
.online-training-page .ot-show-more:focus {
    background: var(--ot-navy);
    border-color: var(--ot-navy);
    color: #fff;
}

.online-training-page .ot-category-safety {
    --ot-category-color: #116ab3;
}

.online-training-page .ot-category-aerial {
    --ot-category-color: #34745b;
}

.online-training-page .ot-category-crane {
    --ot-category-color: #ba830d;
}

.online-training-page .ot-category-forklift {
    --ot-category-color: #c84a32;
}

.online-training-page .ot-category-heavy {
    --ot-category-color: #5b6675;
}

.online-training-page .ot-help {
    background: var(--ot-soft);
}

@media (max-width: 991px) {
    .online-training-page .ot-category-media {
        min-height: 220px;
    }

    .online-training-page .ot-category-content {
        padding: 1.5rem;
    }
}

/* On-Site Training page */
.onsite-training-page {
    --ost-blue: #116ab3;
    --ost-gold: #ba830d;
    --ost-navy: #18324a;
    --ost-soft: #f5f8fb;
    --ost-line: #dfe6ee;
    --ost-text: #26323f;
    color: var(--ost-text);
}

.onsite-training-page .ost-intro {
    background:
        linear-gradient(135deg, rgba(17, 106, 179, .08), rgba(186, 131, 13, .1)),
        #fff;
}

.onsite-training-page .ost-title,
.onsite-training-page .ost-info-panel h3,
.onsite-training-page .ost-topic-card h3 {
    color: var(--ost-navy);
    font-weight: 800;
}

.onsite-training-page .ost-kicker {
    color: var(--ost-gold);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.onsite-training-page .ost-btn,
.onsite-training-page .ost-show-more {
    background: var(--ost-gold);
    border-color: var(--ost-gold);
    color: #111;
    font-weight: 800;
}

.onsite-training-page .ost-btn:hover,
.onsite-training-page .ost-btn:focus,
.onsite-training-page .ost-show-more:hover,
.onsite-training-page .ost-show-more:focus {
    background: #d89913;
    border-color: #d89913;
    color: #111;
}

.onsite-training-page .ost-photo-card,
.onsite-training-page .ost-info-panel,
.onsite-training-page .ost-topic-card {
    background: #fff;
    border: 1px solid var(--ost-line);
    border-radius: 8px;
    box-shadow: 0 14px 36px rgba(24, 50, 74, .08);
    overflow: hidden;
}

.onsite-training-page .ost-photo-card img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
    width: 100%;
}

.onsite-training-page .ost-photo-caption {
    border-top: 5px solid var(--ost-gold);
    padding: 1rem;
}

.onsite-training-page .ost-photo-caption strong,
.onsite-training-page .ost-photo-caption span {
    display: block;
}

.onsite-training-page .ost-photo-caption span,
.onsite-training-page .ost-topic-card p,
.onsite-training-page .ost-info-panel p {
    color: #607080;
}

.onsite-training-page .ost-info-panel {
    padding: 1.5rem;
}

.onsite-training-page .ost-topic-card {
    --ost-topic-color: var(--ost-blue);
    border-top: 6px solid var(--ost-topic-color);
    height: 100%;
    padding: 1.5rem;
    transition: all .2s ease;
}

.onsite-training-page .ost-topic-card:hover {
    box-shadow: 0 18px 44px rgba(24, 50, 74, .12);
    transform: translateY(-3px);
}

.onsite-training-page .ost-topic-icon {
    align-items: center;
    background: #eef5fb;
    border-radius: 8px;
    color: var(--ost-topic-color);
    display: inline-flex;
    font-size: 1.55rem;
    height: 3.25rem;
    justify-content: center;
    margin-bottom: 1rem;
    width: 3.25rem;
}

.onsite-training-page .ost-topic-card a {
    color: var(--ost-topic-color);
    font-weight: 800;
    text-decoration: none;
}

.onsite-training-page .ost-topic-card a:hover {
    color: var(--ost-navy);
}

.onsite-training-page .ost-theme-blue {
    --ost-topic-color: #116ab3;
}

.onsite-training-page .ost-theme-gold {
    --ost-topic-color: #ba830d;
}

.onsite-training-page .ost-theme-green {
    --ost-topic-color: #34745b;
}

.onsite-training-page .ost-theme-orange {
    --ost-topic-color: #f58220;
}

.onsite-training-page .ost-theme-red {
    --ost-topic-color: #c84a32;
}

.onsite-training-page .ost-theme-slate {
    --ost-topic-color: #5b6675;
}

.onsite-training-page .ost-help {
    background: var(--ost-soft);
}

@media (max-width: 991px) {
    .onsite-training-page .ost-help {
        text-align: center;
    }

    .onsite-training-page .ost-help img {
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .onsite-training-page .ost-help .col-lg-7 {
        max-width: 720px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* About Us page */
.about-page {
    --about-blue: #116ab3;
    --about-gold: #ba830d;
    --about-navy: #18324a;
    --about-soft: #f5f8fb;
    --about-line: #dfe6ee;
    --about-text: #26323f;
    color: var(--about-text);
}

.about-page .about-intro {
    background:
        linear-gradient(135deg, rgba(17, 106, 179, .08), rgba(186, 131, 13, .1)),
        #fff;
}

.about-page .about-title,
.about-page .about-feature-card h3,
.about-page .about-step h3 {
    color: var(--about-navy);
    font-weight: 800;
}

.about-page .about-kicker {
    color: var(--about-gold);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.about-page .about-btn {
    background: var(--about-gold);
    border-color: var(--about-gold);
    color: #111;
    font-weight: 800;
}

.about-page .about-btn:hover,
.about-page .about-btn:focus {
    background: #d89913;
    border-color: #d89913;
    color: #111;
}

.about-page .about-photo-card,
.about-page .about-feature-card,
.about-page .about-mini-panel,
.about-page .about-step {
    background: #fff;
    border: 1px solid var(--about-line);
    border-radius: 8px;
    box-shadow: 0 14px 36px rgba(24, 50, 74, .08);
    overflow: hidden;
}

.about-page .about-photo-card img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
    width: 100%;
}

.about-page .about-photo-caption {
    border-top: 5px solid var(--about-gold);
    padding: 1rem;
}

.about-page .about-photo-caption strong,
.about-page .about-photo-caption span,
.about-page .about-mini-panel strong,
.about-page .about-mini-panel span {
    display: block;
}

.about-page .about-photo-caption span,
.about-page .about-feature-card p,
.about-page .about-mini-panel span,
.about-page .about-step p {
    color: #607080;
}

.about-page .about-feature-card,
.about-page .about-step,
.about-page .about-mini-panel {
    height: 100%;
    padding: 1.5rem;
}

.about-page .about-icon {
    align-items: center;
    background: rgba(17, 106, 179, .09);
    border-radius: 8px;
    color: var(--about-blue);
    display: inline-flex;
    font-size: 1.55rem;
    height: 3.25rem;
    justify-content: center;
    margin-bottom: 1rem;
    width: 3.25rem;
}

.about-page .about-band,
.about-page .about-cta {
    background: var(--about-soft);
}

.about-page .about-side-image {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.about-page .about-step {
    border-top: 6px solid var(--about-gold);
}

.about-page .about-step span {
    align-items: center;
    background: var(--about-blue);
    border-radius: 999px;
    color: #fff;
    display: inline-flex;
    font-weight: 900;
    height: 2.5rem;
    justify-content: center;
    margin-bottom: 1rem;
    width: 2.5rem;
}

@media (max-width: 991px) {
    .about-page .about-band,
    .about-page .about-cta {
        text-align: center;
    }
}

/* Contact page */
.contact-page {
    --contact-blue: #116ab3;
    --contact-gold: #ba830d;
    --contact-navy: #18324a;
    --contact-soft: #f5f8fb;
    --contact-line: #dfe6ee;
    --contact-text: #26323f;
    color: var(--contact-text);
}

.contact-page .contact-intro {
    background:
        linear-gradient(135deg, rgba(17, 106, 179, .08), rgba(186, 131, 13, .1)),
        #fff;
}

.contact-page .contact-side-photo {
    border-radius: 8px;
    box-shadow: 0 14px 36px rgba(24, 50, 74, .08);
    overflow: hidden;
}

.contact-page .contact-side-photo img {
    aspect-ratio: 16 / 9;
    display: block;
    height: clamp(210px, 26vw, 300px);
    object-fit: cover;
    object-position: 62% center;
    width: 100%;
}

.contact-page .contact-request-panel,
.contact-page .contact-popular-panel {
    background: rgba(255, 255, 255, .82);
    border: 1px solid var(--contact-line);
    border-radius: 8px;
    box-shadow: 0 14px 36px rgba(24, 50, 74, .06);
    padding: 1.25rem;
}

.contact-page .contact-detail-list {
    display: grid;
    gap: .7rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.contact-page .contact-detail-list li {
    align-items: flex-start;
    color: #435366;
    display: flex;
    font-weight: 700;
    gap: .65rem;
    line-height: 1.35;
}

.contact-page .contact-detail-list i {
    color: var(--contact-blue);
    flex: 0 0 auto;
    font-size: 1.1rem;
    line-height: 1.25;
}

.contact-page .contact-topic-list {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
}

.contact-page .contact-topic-list span {
    background: rgba(17, 106, 179, .08);
    border: 1px solid rgba(17, 106, 179, .18);
    border-radius: 999px;
    color: var(--contact-navy);
    font-size: .86rem;
    font-weight: 800;
    padding: .45rem .75rem;
}

.contact-page .contact-title,
.contact-page .contact-card h3 {
    color: var(--contact-navy);
    font-weight: 800;
}

.contact-page .contact-kicker {
    color: var(--contact-gold);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.contact-page .contact-form-shell,
.contact-page .contact-card {
    background: #fff;
    border: 1px solid var(--contact-line);
    border-radius: 8px;
    box-shadow: 0 14px 36px rgba(24, 50, 74, .08);
    height: 100%;
    padding: 1.5rem;
}

.contact-page .contact-form-shell {
    border-top: 6px solid var(--contact-gold);
}

.contact-page .contact-field-preview {
    background: var(--contact-soft);
    border: 1px dashed #b9c6d3;
    border-radius: 8px;
    color: #607080;
    font-weight: 700;
    padding: .9rem 1rem;
}

.contact-page .contact-field-preview-lg {
    min-height: 7rem;
}

.contact-page .contact-card {
    border-top: 6px solid var(--contact-blue);
}

.contact-page .contact-card p {
    color: #607080;
}

.contact-page .contact-icon {
    align-items: center;
    background: rgba(17, 106, 179, .09);
    border-radius: 8px;
    color: var(--contact-blue);
    display: inline-flex;
    font-size: 1.55rem;
    height: 3.25rem;
    justify-content: center;
    margin-bottom: 1rem;
    width: 3.25rem;
}

.contact-page .contact-card a {
    color: var(--contact-blue);
    font-weight: 800;
    text-decoration: none;
}

.contact-page .contact-card a:hover {
    color: var(--contact-navy);
}

/* Individual and Company Training pages */
.training-audience-page {
    --tap-blue: #116ab3;
    --tap-gold: #ba830d;
    --tap-navy: #18324a;
    --tap-soft: #f5f8fb;
    --tap-line: #dfe6ee;
    --tap-text: #26323f;
    color: var(--tap-text);
}

.training-audience-page .tap-intro {
    background:
        linear-gradient(135deg, rgba(17, 106, 179, .08), rgba(186, 131, 13, .1)),
        #fff;
}

.training-audience-page .tap-title,
.training-audience-page .tap-card h3 {
    color: var(--tap-navy);
    font-weight: 800;
}

.training-audience-page .tap-kicker {
    color: var(--tap-gold);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.training-audience-page .tap-btn {
    background: var(--tap-gold);
    border-color: var(--tap-gold);
    color: #111;
    font-weight: 800;
}

.training-audience-page .tap-btn:hover,
.training-audience-page .tap-btn:focus {
    background: #d89913;
    border-color: #d89913;
    color: #111;
}

.training-audience-page .tap-actions {
    gap: 1rem;
}

.training-audience-page .tap-primary-actions {
    gap: .75rem;
}

.training-audience-page .tap-actions > * {
    margin-bottom: .75rem;
}

.training-audience-page .tap-actions > *:not(:last-child) {
    margin-right: 1rem;
}

.training-audience-page .tap-primary-actions > .btn:not(:last-child) {
    margin-bottom: .75rem;
}

.training-audience-page .tap-photo-card,
.training-audience-page .tap-card,
.training-audience-page .tap-mini-panel {
    background: #fff;
    border: 1px solid var(--tap-line);
    border-radius: 8px;
    box-shadow: 0 14px 36px rgba(24, 50, 74, .08);
    overflow: hidden;
}

.training-audience-page .tap-photo-card img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
    width: 100%;
}

.training-audience-page .tap-photo-caption {
    border-top: 5px solid var(--tap-gold);
    padding: 1rem;
}

.training-audience-page .tap-photo-caption strong,
.training-audience-page .tap-photo-caption span {
    display: block;
}

.training-audience-page .tap-photo-caption span,
.training-audience-page .tap-card p {
    color: #607080;
}

.training-audience-page .tap-card,
.training-audience-page .tap-mini-panel {
    height: 100%;
    padding: 1.5rem;
}

.training-audience-page .tap-card {
    border-top: 6px solid var(--tap-blue);
}

.company-training-page .tap-card {
    border-top-color: var(--tap-gold);
}

.training-audience-page .tap-icon {
    align-items: center;
    background: rgba(17, 106, 179, .09);
    border-radius: 8px;
    color: var(--tap-blue);
    display: inline-flex;
    font-size: 1.55rem;
    height: 3.25rem;
    justify-content: center;
    margin-bottom: 1rem;
    width: 3.25rem;
}

.company-training-page .tap-icon {
    background: rgba(186, 131, 13, .12);
    color: var(--tap-gold);
}

.training-audience-page .tap-band {
    background: var(--tap-soft);
}

.training-audience-page .tap-mini-panel {
    color: var(--tap-navy);
    font-weight: 800;
}

.training-audience-page .tap-side-image {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 991px) {
    .training-audience-page .tap-band {
        text-align: center;
    }
}

/* Footer company logos */
.footer-company-logos {
    background: #000;
    margin-top: 10px;
    padding: 18px 0 14px;
    text-align: center;
}

.footer-company-logo-grid {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 14px 20px;
    justify-content: center;
    padding: 18px 0 42px;
}

.footer-company-logo {
    height: auto;
    object-fit: contain;
}

.footer-company-logo-small {
    max-height: 60px;
    max-width: min(108px, 34vw);
}

.footer-company-logo-brand {
    max-height: 78px;
    max-width: min(136px, 40vw);
}

.footer-company-logo-original {
    display: block;
    margin: 0 auto 14px;
    max-height: 84px;
    max-width: min(300px, 82vw);
}

.footer-company-logo-grid .footer-company-logo:nth-child(1),
.footer-company-logo-grid .footer-company-logo:nth-child(5) {
    transform: translateY(42px);
}

.footer-company-logo-grid .footer-company-logo:nth-child(2),
.footer-company-logo-grid .footer-company-logo:nth-child(4) {
    transform: translateY(18px);
}

.footer-company-logo-grid .footer-company-logo:nth-child(3) {
    transform: translateY(-18px);
}

.footer-company-credit {
    color: #ba830d;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.35;
    margin: 0 0 14px;
}

.footer-company-credit a {
    color: inherit;
    font: inherit;
    text-decoration: none;
}

.footer-company-credit a:hover,
.footer-company-credit a:focus {
    color: inherit;
    text-decoration: underline;
}

@media (max-width: 575px) {
    .footer-company-logo-grid {
        gap: 12px;
        padding: 12px 0 28px;
    }

    .footer-company-logo-small {
        max-height: 54px;
        max-width: 39vw;
    }

    .footer-company-logo-brand {
        max-height: 70px;
        max-width: 44vw;
    }

    .footer-company-logo-original {
        max-height: 76px;
        max-width: 82vw;
    }

    .footer-company-logo-grid .footer-company-logo:nth-child(1),
    .footer-company-logo-grid .footer-company-logo:nth-child(5) {
        transform: translateY(26px);
    }

    .footer-company-logo-grid .footer-company-logo:nth-child(2),
    .footer-company-logo-grid .footer-company-logo:nth-child(4) {
        transform: translateY(12px);
    }

    .footer-company-logo-grid .footer-company-logo:nth-child(3) {
        transform: translateY(-12px);
    }
}

/* State safety training location template */
.state-training-page {
    background: #f6f8fb;
    color: #1d2939;
    overflow: hidden;
}

.state-training-page h1,
.state-training-page h2,
.state-training-page h3,
.state-training-page h4,
.state-training-page h5,
.state-training-page h6 {
    display: block;
    letter-spacing: 0;
    text-align: inherit;
    transform: none;
}

.state-training-page h1:hover,
.state-training-page h2:hover,
.state-training-page h3:hover,
.state-training-page h4:hover,
.state-training-page h5:hover,
.state-training-page h6:hover {
    transform: none;
}

.state-training-hero {
    background:
        linear-gradient(135deg, rgba(13, 47, 76, 0.96), rgba(17, 106, 179, 0.9)),
        url("/images/safety-training-slide.jpg") center / cover;
    padding: clamp(3rem, 6vw, 6rem) 0;
}

.state-training-hero h1 {
    color: #fff;
    font-size: clamp(2.25rem, 4vw, 4.25rem);
    line-height: 1.08;
    margin-bottom: 1.25rem;
    -webkit-text-fill-color: #fff;
}

.state-training-eyebrow,
.state-training-label {
    display: inline-flex;
    align-items: center;
    background: rgba(255, 193, 7, 0.16);
    border: 1px solid rgba(255, 193, 7, 0.28);
    border-radius: .5rem;
    color: #8a5d00;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .08em;
    margin-bottom: 1rem;
    padding: .45rem .7rem;
    text-transform: uppercase;
}

.state-training-eyebrow {
    color: #ffe39a;
}

.state-training-lead {
    color: rgba(255, 255, 255, 0.9);
    font-size: 1.18rem;
    line-height: 1.7;
    max-width: 720px;
}

.state-training-actions,
.state-training-trust,
.state-training-cta-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .85rem;
}

.state-training-actions {
    margin: 2rem 0 1.5rem;
}

.state-training-trust span {
    align-items: center;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: .5rem;
    color: #fff;
    display: inline-flex;
    font-weight: 700;
    padding: .6rem .75rem;
}

.state-training-photo {
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: .5rem;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.28);
    overflow: hidden;
    position: relative;
}

.state-training-photo img,
.state-training-image-panel img {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.state-training-photo-card {
    background: #fff;
    border-radius: .5rem;
    bottom: 1rem;
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22);
    color: #1d2939;
    left: 1rem;
    max-width: calc(100% - 2rem);
    padding: .9rem 1rem;
    position: absolute;
}

.state-training-photo-card strong,
.state-training-photo-card span {
    display: block;
}

.state-training-photo-card strong {
    color: #116ab3;
    font-size: 1.05rem;
}

.state-training-section {
    padding-bottom: clamp(2.5rem, 5vw, 5rem);
    padding-top: clamp(2.5rem, 5vw, 5rem);
}

.state-training-heading {
    margin: 0 auto 2rem;
    max-width: 820px;
}

.state-training-heading h2,
.state-training-intro h2,
.state-training-section h2 {
    color: #18324a;
    font-size: clamp(1.75rem, 3vw, 2.6rem);
    line-height: 1.18;
    -webkit-text-fill-color: #18324a;
}

.state-training-heading p,
.state-training-intro p,
.state-training-section p {
    color: #556170;
    line-height: 1.7;
}

.state-training-intro,
.state-training-feature,
.state-training-format,
.state-training-topic-grid > div {
    background: #fff;
    border: 1px solid #e4e9f2;
    border-radius: .5rem;
    box-shadow: 0 14px 40px rgba(24, 50, 74, 0.08);
}

.state-training-intro {
    padding: clamp(1.5rem, 3vw, 2.5rem);
}

.state-training-feature {
    padding: 1.35rem;
}

.state-training-feature i,
.state-training-format i,
.state-training-topic-grid i {
    align-items: center;
    background: #eaf4ff;
    border-radius: .5rem;
    color: #116ab3;
    display: inline-flex;
    font-size: 1.65rem;
    height: 3rem;
    justify-content: center;
    margin-bottom: 1rem;
    width: 3rem;
}

.state-training-feature h3,
.state-training-format h3 {
    color: #18324a;
    font-size: 1.1rem;
    margin-bottom: .65rem;
    -webkit-text-fill-color: #18324a;
}

.state-training-feature p,
.state-training-format p {
    font-size: .96rem;
    margin-bottom: 0;
}

.state-training-format {
    color: inherit;
    display: block;
    padding: 1.35rem;
    text-decoration: none;
}

.state-training-format:hover,
.state-training-format:focus {
    border-color: #116ab3;
    box-shadow: 0 18px 48px rgba(17, 106, 179, 0.16);
    color: inherit;
    transform: translateY(-4px);
}

.state-training-format span {
    color: #116ab3;
    display: inline-flex;
    font-weight: 800;
    margin-top: 1rem;
}

.state-training-image-panel {
    aspect-ratio: 4 / 3;
    border-radius: .5rem;
    box-shadow: 0 18px 48px rgba(24, 50, 74, 0.16);
    overflow: hidden;
}

.state-training-steps {
    display: grid;
    gap: .85rem;
    margin-top: 1.5rem;
}

.state-training-steps div {
    align-items: flex-start;
    background: #fff;
    border: 1px solid #e4e9f2;
    border-radius: .5rem;
    display: flex;
    gap: .85rem;
    padding: 1rem;
}

.state-training-steps strong {
    align-items: center;
    background: #116ab3;
    border-radius: 50%;
    color: #fff;
    display: inline-flex;
    flex: 0 0 2rem;
    height: 2rem;
    justify-content: center;
    width: 2rem;
}

.state-training-topic-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.state-training-topic-grid > div {
    padding: 1.25rem;
}

.state-training-topic-grid strong,
.state-training-topic-grid span {
    display: block;
}

.state-training-topic-grid strong {
    color: #18324a;
    margin-bottom: .45rem;
}

.state-training-topic-grid span {
    color: #556170;
    line-height: 1.55;
}

.state-training-faq .accordion-item {
    border: 1px solid #e4e9f2;
    border-radius: .5rem;
    margin-bottom: .75rem;
    overflow: hidden;
}

.state-training-faq .accordion-button {
    color: #18324a;
    font-weight: 800;
}

.state-training-faq .accordion-button:not(.collapsed) {
    background: #eaf4ff;
    color: #116ab3;
}

.state-training-cta {
    align-items: center;
    background: linear-gradient(135deg, #116ab3, #18324a);
    border-radius: .5rem;
    display: grid;
    gap: 2rem;
    grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr);
    padding: clamp(1.5rem, 4vw, 3rem);
}

.state-training-cta h2 {
    color: #fff;
    -webkit-text-fill-color: #fff;
}

.state-training-cta p {
    color: rgba(255, 255, 255, 0.86);
    margin-bottom: 0;
}

.state-training-cta-actions {
    justify-content: flex-start;
}

.state-training-cta-actions span {
    color: rgba(255, 255, 255, 0.76);
    display: block;
    flex-basis: 100%;
    font-size: .9rem;
}

@media (max-width: 991px) {
    .state-training-topic-grid,
    .state-training-cta {
        grid-template-columns: 1fr 1fr;
    }

    .state-training-cta {
        align-items: start;
    }
}

@media (max-width: 767px) {
    .state-training-actions .btn,
    .state-training-cta-actions .btn {
        width: 100%;
    }

    .state-training-topic-grid,
    .state-training-cta {
        grid-template-columns: 1fr;
    }

    .state-training-photo-card {
        position: static;
        max-width: none;
    }
}

/* City safety training location pages */
.city-local-page {
  --city-primary: #123a5d;
  --city-accent: #f2a900;
  --city-soft: #f6f9fc;
  --city-border: #dbe6ef;
  --city-text: #24384a;
}

.city-local-page * {
  transition: none !important;
  animation: none !important;
}

.city-local-page .city-hero {
  background: #ffffff;
  border: 1px solid var(--city-border);
  border-radius: 1.25rem;
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(18, 58, 93, 0.10);
}

.city-local-page .city-hero-main {
  position: relative;
  isolation: isolate;
  background:
    linear-gradient(90deg, rgba(18,58,93,.92) 0%, rgba(18,58,93,.72) 42%, rgba(18,58,93,.18) 100%),
    url('/images/city-safety-training-hero.png') center center / cover no-repeat,
    linear-gradient(135deg, #123a5d 0%, #1f6f8f 100%);
  color: #fff;
  padding: clamp(1.25rem, 3vw, 2.5rem);
  min-height: 100%;
  overflow: hidden;
}

.city-local-page .city-hero-main::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.18));
  pointer-events: none;
  z-index: -1;
}

.city-local-page .city-hero-main::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 18% 22%, rgba(255,255,255,.16), transparent 24%),
    radial-gradient(circle at 82% 70%, rgba(242,169,0,.16), transparent 26%);
  pointer-events: none;
  z-index: -2;
}

.city-local-page .city-hero-main h2,
.city-local-page .city-hero-main p,
.city-local-page .city-hero-main .city-pill {
  position: relative;
  z-index: 1;
}

.city-local-page .city-hero-main h2,
.city-local-page .city-hero-main p {
  color: #fff;
  overflow-wrap: anywhere;
}

.city-local-page .city-hero-main h2 {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.35);
}

.city-local-page .city-hero-panel {
  background: #fff;
  padding: clamp(1.25rem, 3vw, 2rem);
  height: 100%;
}

.city-local-page .city-pill {
  display: inline-block;
  background: rgba(242,169,0,.18);
  color: #fff;
  border: 1px solid rgba(255,255,255,.45);
  padding: .35rem .75rem;
  border-radius: 999px;
  font-size: .85rem;
  font-weight: 700;
  margin-bottom: .75rem;
}

.city-local-page .city-card {
  background: #fff;
  border: 1px solid var(--city-border);
  border-radius: 1rem;
  padding: clamp(1rem, 2vw, 1.45rem);
  height: 100%;
  box-shadow: 0 6px 18px rgba(18,58,93,.07);
}

.city-local-page .city-card:hover,
.city-local-page .city-mini-stat:hover,
.city-local-page .city-course-grid div:hover,
.city-local-page .city-chip-list li:hover {
  transform: none !important;
  box-shadow: inherit;
}

.city-local-page .city-card h3,
.city-local-page .city-card h2 {
  color: var(--city-primary);
}

.city-local-page .city-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #eaf5fb;
  color: var(--city-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  margin-bottom: .75rem;
  flex: 0 0 auto;
}

.city-local-page .city-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  padding: 0;
  margin: 0;
  list-style: none;
}

.city-local-page .city-chip-list li {
  background: #fff;
  border: 1px solid #f1d38a;
  border-radius: 999px;
  padding: .45rem .75rem;
  font-size: .92rem;
  color: #4a3710;
}

.city-local-page .city-snapshot {
  background: #f8fbff;
  border-left: 5px solid var(--city-accent);
}

.city-local-page .city-mini-stat {
  border: 1px solid var(--city-border);
  border-radius: .85rem;
  padding: 1rem;
  background: #fff;
  min-height: 100%;
}

.city-local-page .city-mini-stat strong {
  display: block;
  color: var(--city-primary);
  font-size: 1.02rem;
  margin-bottom: .25rem;
}

.city-local-page .city-course-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
}

.city-local-page .city-course-grid div {
  background: var(--city-soft);
  border: 1px solid var(--city-border);
  border-radius: .85rem;
  padding: .9rem;
  min-width: 0;
}

.city-local-page .city-nearby-box {
  background: #fff8e6;
  border-color: #f1d38a;
}

.city-local-page .city-focus-list {
  margin-bottom: 0;
}

@media (max-width: 991px) {
  .city-local-page .city-hero-main,
  .city-local-page .city-hero-panel {
    height: auto;
  }
}

@media (max-width: 767px) {
  .city-local-page .city-course-grid {
    grid-template-columns: 1fr;
  }
}

/* Compact compliance + local news boxes for city pages */
.city-local-page .city-compact-list {
  display: grid;
  gap: .55rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.city-local-page .city-compact-list li {
  background: #f6f9fc;
  border: 1px solid #dbe6ef;
  border-radius: .65rem;
  padding: .62rem .75rem;
  font-size: .94rem;
  line-height: 1.35;
}

.city-local-page .city-news-item {
  border-top: 1px solid #dbe6ef;
  padding-top: .85rem;
  margin-top: .85rem;
}

.city-local-page .city-news-item:first-of-type {
  border-top: 0;
  padding-top: 0;
  margin-top: 0;
}

.city-local-page .city-news-item a {
  font-weight: 700;
  color: #123a5d;
  text-decoration: none;
}

.city-local-page .city-news-item a:hover {
  text-decoration: underline;
}

.city-local-page .city-news-item p {
  margin: .25rem 0 0;
  font-size: .93rem;
}

.city-local-page .city-news-title {
  font-weight: 700;
  color: #123a5d;
  line-height: 1.3;
}

/* Image placeholder for city landing pages */
.city-local-page .city-image-placeholder {
  border: 2px dashed #b8c8d8;
  border-radius: 1.25rem;
  background: linear-gradient(135deg, #f8fbff 0%, #eef5fb 100%);
  min-height: 210px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: left;
  overflow: hidden;
}

.city-local-page .city-image-placeholder-inner {
  display: flex;
  align-items: center;
  gap: 1rem;
  color: #24465f;
  padding: 1.5rem;
}

.city-local-page .city-image-placeholder i {
  font-size: 2.5rem;
  color: #2d6f9f;
  flex: 0 0 auto;
}

.city-local-page .city-image-placeholder strong,
.city-local-page .city-image-placeholder span {
  display: block;
}

.city-local-page .city-image-placeholder span {
  color: #5a6f7f;
  font-size: .96rem;
  margin-top: .2rem;
}

/* City page text polish - noticeable but clean */
.city-local-page .state-training-heading {
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
}

.city-local-page .state-training-heading h2 {
  color: var(--city-primary);
  font-weight: 800;
  letter-spacing: -.025em;
  margin-bottom: .75rem;
}

.city-local-page .state-training-heading p {
  font-size: clamp(1rem, 1.5vw, 1.12rem);
  line-height: 1.75;
  color: #405568;
}

.city-local-page .state-training-label {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  background: #fff7df;
  border: 1px solid #f1d38a;
  color: #7a5600;
  border-radius: 999px;
  padding: .42rem .85rem;
  font-weight: 800;
  letter-spacing: .03em;
  text-transform: uppercase;
  font-size: .78rem;
  margin-bottom: .75rem;
}

.city-local-page .state-training-label::before {
  content: "";
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background: var(--city-accent);
  box-shadow: 0 0 0 4px rgba(242,169,0,.18);
}

.city-local-page .city-hero-main h2,
.city-local-page .city-card h2,
.city-local-page .city-card h3 {
  font-weight: 800;
  letter-spacing: -.018em;
}

.city-local-page .city-hero-main .lead {
  font-size: clamp(1.04rem, 1.6vw, 1.22rem);
  line-height: 1.65;
  max-width: 760px;
}

.city-local-page .city-hero-main p.mb-0 {
  border-left: 4px solid var(--city-accent);
  padding-left: .9rem;
  margin-top: 1rem;
  font-weight: 600;
  color: rgba(255,255,255,.95);
}

.city-local-page .city-card {
  position: relative;
}

.city-local-page .city-card::before {
  content: "";
  position: absolute;
  left: 1.25rem;
  right: 1.25rem;
  top: 0;
  height: 4px;
  border-radius: 0 0 999px 999px;
  background: linear-gradient(90deg, var(--city-accent), rgba(31,111,143,.35));
}

.city-local-page .city-card p {
  color: #405568;
  line-height: 1.65;
}

.city-local-page .state-training-list {
  display: grid;
  gap: .55rem;
  padding-left: 0;
  list-style: none;
}

.city-local-page .state-training-list li {
  position: relative;
  padding-left: 1.55rem;
  line-height: 1.5;
  color: #30485b;
}

.city-local-page .state-training-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .55em;
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  background: var(--city-accent);
  box-shadow: 0 0 0 4px rgba(242,169,0,.14);
}

.city-local-page .city-focus-list li::before {
  background: #1f6f8f;
  box-shadow: 0 0 0 4px rgba(31,111,143,.12);
}

.city-local-page .city-mini-stat {
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.75);
}

.city-local-page .city-mini-stat strong {
  display: inline-block;
  border-bottom: 2px solid rgba(242,169,0,.65);
  padding-bottom: .12rem;
  margin-bottom: .45rem;
}

.city-local-page .city-chip-list li {
  font-weight: 700;
  box-shadow: 0 3px 10px rgba(122,86,0,.08);
}

.city-local-page .city-chip-list a {
  color: #123a5d;
  text-decoration: none;
}

.city-local-page .city-chip-list a:hover {
  text-decoration: underline;
}

.city-local-page .accordion-item {
  border: 1px solid var(--city-border);
  border-radius: .9rem !important;
  overflow: hidden;
  margin-bottom: .75rem;
  box-shadow: 0 4px 12px rgba(18,58,93,.05);
}

.city-local-page .accordion-button {
  font-weight: 800;
  color: var(--city-primary);
  background: #f8fbff;
}

.city-local-page .accordion-button:not(.collapsed) {
  color: #0f324f;
  background: #fff8e6;
  box-shadow: inset 0 -1px 0 #f1d38a;
}

.city-local-page .accordion-body {
  color: #405568;
  line-height: 1.7;
}

/* Mobile nav: keep the opened hamburger menu usable on short screens */
@media (max-width: 767.98px) {
  .navbar.fixed-top .navbar-collapse {
    max-height: calc(100vh - 88px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  .navbar.fixed-top .navbar-collapse.show,
  .navbar.fixed-top .navbar-collapse.collapsing {
    display: block;
  }
}

/* Mobile nav: hide the fixed left logo on smaller screens */
@media (max-width: 767.98px) {
  .navbar .logo-wrap,
  .navbar .navbar-brand,
  .navbar-brand img {
    display: none !important;
  }
}

/* California locations directory page */
.state-locations-page {
  background: linear-gradient(180deg, #f6fbff 0%, #ffffff 38%, #f8fbff 100%);
}

.state-locations-page .container {
  max-width: 1180px;
}

.state-locations-hero {
  position: relative;
  overflow: hidden;
  border-radius: 1.6rem;
  padding: clamp(1.5rem, 3vw, 2.75rem);
  color: #fff;
  background:
    radial-gradient(circle at 88% 12%, rgba(242,169,0,.45), transparent 28%),
    linear-gradient(135deg, #123a5d 0%, #1f6f8f 58%, #0f324f 100%);
}

.state-locations-hero::after {
  content: "";
  position: absolute;
  inset: auto -4rem -6rem auto;
  width: 16rem;
  height: 16rem;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
}

.state-locations-hero .location-hero-title {
  max-width: 820px;
  margin: .4rem 0 1rem;
  font-weight: 900;
  letter-spacing: -.035em;
  color: #fff;
  -webkit-text-fill-color: #fff;
}

.state-locations-hero h1 {
  max-width: 820px;
  margin: .4rem 0 1rem;
  font-weight: 900;
  letter-spacing: -.035em;
}

.state-locations-hero .lead {
  max-width: 850px;
  color: rgba(255,255,255,.88);
  line-height: 1.7;
}

.state-locations-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #c98500;
}

.state-locations-hero .state-locations-eyebrow {
  color: #ffd56b;
}

.state-locations-stat-card {
  position: relative;
  z-index: 1;
  padding: 1.25rem;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 1.25rem;
  background: rgba(255,255,255,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2);
  backdrop-filter: blur(8px);
}

.state-locations-stat-card strong {
  display: block;
  font-size: clamp(2.35rem, 4vw, 3.5rem);
  line-height: 1;
  font-weight: 950;
}

.state-locations-stat-card span {
  display: block;
  margin-top: .35rem;
  font-weight: 850;
}

.state-locations-stat-card small {
  display: block;
  margin-top: .45rem;
  color: rgba(255,255,255,.78);
}

.state-locations-featured,
.state-locations-toolbar,
.state-locations-letter-group {
  border: 1px solid #dbe9f3;
  border-radius: 1.3rem;
  background: #fff;
  box-shadow: 0 14px 35px rgba(18,58,93,.08);
}

.state-locations-featured,
.state-locations-toolbar {
  padding: clamp(1rem, 2vw, 1.5rem);
}

.state-locations-contact {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .7rem 1rem;
  border-radius: 999px;
  color: #123a5d;
  font-weight: 900;
  text-decoration: none;
  background: #fff4cf;
  border: 1px solid #f1d38a;
}

.state-locations-contact:hover {
  color: #0f324f;
  background: #ffe9a3;
}

.state-locations-feature-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .8rem;
}

.state-locations-feature-grid a,
.state-location-link {
  position: relative;
  display: block;
  min-height: 100%;
  border: 1px solid #dbe9f3;
  border-radius: 1rem;
  text-decoration: none;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}

.state-locations-feature-grid a {
  padding: 1rem;
}

.state-locations-feature-grid a:hover,
.state-location-link:hover {
  border-color: #f2a900;
  background: #fffdf5;
}

.state-locations-feature-grid span,
.state-location-link span {
  display: block;
  color: #123a5d;
  font-weight: 900;
}

.state-locations-feature-grid small,
.state-location-link small {
  display: block;
  margin-top: .25rem;
  color: #5c7080;
  line-height: 1.35;
}

.state-locations-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.state-locations-jump {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .35rem;
}

.state-locations-jump a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 2rem;
  border-radius: .65rem;
  color: #123a5d;
  font-weight: 900;
  text-decoration: none;
  background: #eef6fb;
  border: 1px solid #dbe9f3;
}

.state-locations-jump a:hover {
  color: #fff;
  background: #1f6f8f;
  border-color: #1f6f8f;
}

.state-locations-directory {
  display: grid;
  gap: 1rem;
}

.state-locations-letter-group {
  overflow: hidden;
}

.state-locations-letter-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem 1rem;
  background: linear-gradient(90deg, #123a5d 0%, #1f6f8f 100%);
  color: #fff;
}

.state-locations-letter-heading span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.2rem;
  height: 2.2rem;
  border-radius: .8rem;
  color: #123a5d;
  font-size: 1.2rem;
  font-weight: 950;
  background: #ffd56b;
}

.state-locations-letter-heading strong {
  font-size: .9rem;
  color: rgba(255,255,255,.86);
}

.state-locations-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .7rem;
  padding: 1rem;
}

.state-location-link {
  padding: .85rem .9rem;
}

.state-location-link::before {
  content: "";
  position: absolute;
  left: .9rem;
  top: .85rem;
  bottom: .85rem;
  width: 3px;
  border-radius: 999px;
  background: #f2a900;
  opacity: .75;
}

.state-location-link span,
.state-location-link small {
  padding-left: .75rem;
}

@media (max-width: 991.98px) {
  .state-locations-feature-grid,
  .state-locations-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .state-locations-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .state-locations-jump {
    justify-content: flex-start;
  }
}

@media (max-width: 767.98px) {
  .state-locations-page {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
  }

  .state-locations-feature-grid,
  .state-locations-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 479.98px) {
  .state-locations-feature-grid,
  .state-locations-grid {
    grid-template-columns: 1fr;
  }
}
/* End California locations directory page */

/* California locations page: prevent heading hover flicker/repaint while scrolling */
.state-locations-page h1,
.state-locations-page h2,
.state-locations-page h3,
.state-locations-hero,
.state-locations-hero * {
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

.state-locations-page h1:hover,
.state-locations-page h2:hover,
.state-locations-page h3:hover,
.state-locations-hero:hover {
  transform: none !important;
  filter: none !important;
  text-shadow: none !important;
}
/* Global heading hover stability override */
h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover,
.h1-overlay h1:hover {
  transform: none !important;
}

/* Training format callout include */
.training-format-callout {
  overflow: hidden;
}

.training-format-callout .training-format-card {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  padding: 1.25rem;
  border: 1px solid rgba(15, 42, 61, .12);
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
  box-shadow: 0 14px 30px rgba(15, 42, 61, .08);
}

.training-format-callout .training-format-label {
  display: inline-flex;
  align-self: flex-start;
  padding: .3rem .65rem;
  border-radius: 999px;
  background: rgba(242, 169, 0, .14);
  color: #7a5200;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.training-format-callout h2 {
  margin-bottom: 0;
  font-size: 1.35rem;
}

.training-format-callout p {
  margin-bottom: 0;
}

.training-format-callout ul {
  margin: 0;
  padding-left: 1.15rem;
}

.training-format-callout li {
  margin-bottom: .45rem;
}

.training-format-callout .tap-btn {
  margin-top: auto;
  color: #ffffff;
  background: #0f5f8f;
  border-color: #0f5f8f;
  font-weight: 700;
}

.training-format-callout .tap-btn:hover,
.training-format-callout .tap-btn:focus {
  color: #ffffff;
  background: #0b496e;
  border-color: #0b496e;
}
/* End training format callout include */

/* Breadcrumb navigation */
.breadcrumb-shell {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

.apst-breadcrumb-nav {
  background: #ffffff;
  border: 1px solid #dbe9f3;
  border-radius: 0.9rem;
  box-shadow: 0 8px 24px rgba(16, 44, 72, 0.08);
  padding: 0.85rem 1rem;
}

.apst-breadcrumb-list {
  align-items: center;
  background: transparent;
  margin-bottom: 0;
}

.apst-breadcrumb-list .breadcrumb-item,
.apst-breadcrumb-list .breadcrumb-item a {
  color: #18324a;
  font-size: 0.95rem;
}

.apst-breadcrumb-list .breadcrumb-item a {
  color: #1f6f8f;
  font-weight: 700;
  text-decoration: none;
}

.apst-breadcrumb-list .breadcrumb-item a:hover {
  text-decoration: underline;
}

.apst-breadcrumb-list .breadcrumb-item.active {
  color: #556170;
}

/* FAQ blocks */
.apst-faq-section {
  padding: 2.5rem 0;
}

.apst-faq-card {
  background: #ffffff;
  border: 1px solid #dbe9f3;
  border-radius: 1.25rem;
  box-shadow: 0 10px 30px rgba(16, 44, 72, 0.08);
  padding: clamp(1.25rem, 3vw, 2rem);
}

.apst-faq-card h2 {
  color: #18324a;
  font-size: clamp(1.65rem, 2.7vw, 2.35rem);
  line-height: 1.2;
  margin-bottom: 1.25rem;
  -webkit-text-fill-color: #18324a;
}

.apst-faq-accordion .accordion-button {
  color: #18324a;
  font-weight: 700;
}

.apst-faq-accordion .accordion-button:not(.collapsed) {
  background: #f6fbff;
  color: #1f6f8f;
}

.apst-faq-accordion .accordion-body {
  color: #556170;
  line-height: 1.7;
}

/* Service page internal training pathway cards */
.service-training-pathways {
  background: linear-gradient(135deg, #f7fbff 0%, #eef6fb 100%);
  border: 1px solid #d9e8f1;
  border-radius: 1.5rem;
  box-shadow: 0 16px 40px rgba(16, 44, 72, 0.08);
  padding: clamp(1.25rem, 3vw, 2rem);
}

.service-training-pathways-header {
  max-width: 820px;
  margin: 0 auto 1.5rem;
  text-align: center;
}

.service-training-pathways-kicker,
.service-pathway-label {
  background: #fff7d8;
  border-radius: 999px;
  color: #5f4610;
  display: inline-flex;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1.2;
  padding: 0.42rem 0.7rem;
  text-transform: uppercase;
}

.service-training-pathways-header h2 {
  color: #18324a;
  font-size: clamp(1.6rem, 2.5vw, 2.25rem);
  line-height: 1.2;
  margin: 0.8rem 0 0.65rem;
  -webkit-text-fill-color: #18324a;
}

.service-training-pathways-header p {
  color: #5c6978;
  font-size: 1rem;
  line-height: 1.7;
  margin: 0;
}

.service-training-pathways-grid {
  align-items: stretch;
}

.service-pathway-card {
  background: #ffffff;
  border: 1px solid rgba(21, 70, 105, 0.14);
  border-radius: 1.25rem;
  box-shadow: 0 10px 24px rgba(16, 44, 72, 0.07);
  color: #2f3e4c;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  height: 100%;
  padding: 1.25rem;
  position: relative;
  text-decoration: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.service-pathway-card::before {
  border-radius: 1.25rem 1.25rem 0 0;
  content: "";
  height: 5px;
  left: -1px;
  position: absolute;
  right: -1px;
  top: -1px;
}

.service-pathway-card:hover,
.service-pathway-card:focus {
  border-color: rgba(31, 111, 143, 0.35);
  box-shadow: 0 12px 28px rgba(16, 44, 72, 0.1);
  color: #2f3e4c;
  text-decoration: none;
}

.service-pathway-card h3 {
  color: #142f46;
  font-size: 1.25rem;
  font-weight: 800;
  line-height: 1.25;
  margin: 0;
  -webkit-text-fill-color: #142f46;
}

.service-pathway-card p {
  color: #4f5e6b;
  line-height: 1.65;
  margin: 0;
}

.service-pathway-card ul {
  color: #2f3e4c;
  line-height: 1.55;
  margin: 0;
  padding-left: 1.1rem;
}

.service-pathway-card li + li {
  margin-top: 0.45rem;
}

.service-pathway-cta {
  align-items: center;
  align-self: stretch;
  background: #064b73;
  border: 1px solid #053f61;
  border-radius: 0.45rem;
  box-shadow: 0 3px 0 rgba(3, 39, 61, 0.18);
  color: #ffffff;
  display: inline-flex;
  font-weight: 800;
  justify-content: center;
  line-height: 1.25;
  margin-top: auto;
  padding: 0.75rem 1rem;
  text-align: center;
  width: 100%;
}

.service-pathway-card:hover .service-pathway-cta,
.service-pathway-card:focus .service-pathway-cta {
  background: #053f61;
  border-color: #033452;
  color: #ffffff;
}


.service-pathway-online::before { background: linear-gradient(90deg, #2c7be5, #58c6ff); }
.service-pathway-webinar::before { background: linear-gradient(90deg, #18a058, #7bd88f); }
.service-pathway-onsite::before { background: linear-gradient(90deg, #f59f00, #ffd166); }
.service-pathway-trainer::before { background: linear-gradient(90deg, #6f42c1, #b197fc); }

@media (max-width: 1199.98px) {
  .service-training-pathways {
    padding: 1.25rem;
  }
}

@media (max-width: 575.98px) {
  .service-training-pathways {
    border-radius: 1rem;
    margin-left: -0.25rem;
    margin-right: -0.25rem;
    padding: 1rem;
  }

  .service-training-pathways-header {
    text-align: left;
  }

  .service-pathway-card {
    border-radius: 1rem;
    padding: 1rem;
  }

  .service-pathway-card::before {
    border-radius: 1rem 1rem 0 0;
  }

  .service-pathway-card h3 {
    font-size: 1.15rem;
  }
}

/* Unique city employer training sections */
.city-employer-training-section {
  background: linear-gradient(135deg, #ffffff 0%, #f7fbff 100%);
  border: 1px solid #dbe9f3;
  border-radius: 1.25rem;
  box-shadow: 0 12px 32px rgba(16, 44, 72, 0.08);
  padding: clamp(1.25rem, 3vw, 2rem);
}

.city-section-kicker {
  background: #fff3cd;
  border-radius: 999px;
  color: #5f4610;
  display: inline-flex;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  margin-bottom: 0.75rem;
  padding: 0.42rem 0.7rem;
  text-transform: uppercase;
}

.city-employer-training-section h2,
.city-course-planner h3 {
  color: #18324a;
  -webkit-text-fill-color: #18324a;
}

.city-employer-training-section p {
  color: #4f5e6b;
  line-height: 1.7;
}

.city-course-planner {
  background: #0b4f73;
  border-radius: 1rem;
  color: #ffffff;
  padding: 1.25rem;
}

.city-course-planner h3,
.city-course-planner p {
  color: #ffffff;
  -webkit-text-fill-color: #ffffff;
}

.city-course-planner ul {
  display: grid;
  gap: 0.6rem;
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
}

.city-course-planner a {
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 0.6rem;
  color: #ffffff;
  display: block;
  font-weight: 800;
  padding: 0.7rem 0.85rem;
  text-decoration: none;
}

.city-course-planner a:hover,
.city-course-planner a:focus {
  background: rgba(255, 255, 255, 0.2);
  color: #ffffff;
  text-decoration: none;
}

@media (max-width: 767.98px) {
  .city-employer-training-section {
    border-radius: 1rem;
    padding: 1rem;
  }

  .city-course-planner {
    border-radius: 0.9rem;
    padding: 1rem;
  }
}


/* Services dropdown visibility and mobile scrolling */
.navbar .services-dropdown-menu {
  max-height: min(70vh, 520px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-top: 0;
  padding-bottom: 0;
  border-top: 4px solid #ba830d;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.22);
}

.navbar .services-dropdown-menu::after {
  content: "End of services list";
  position: sticky;
  bottom: 0;
  display: block;
  padding: 0.45rem 1rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-align: center;
  color: #ffffff;
  background: linear-gradient(180deg, rgba(17, 106, 179, 0.92), #0d4f86);
  pointer-events: none;
}


.navbar .services-dropdown-header,
.navbar .services-dropdown-footer {
  position: sticky;
  z-index: 2;
  padding: 0.5rem 1rem;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #0d4f86;
  background: #fff6df;
  border-bottom: 1px solid rgba(186, 131, 13, 0.25);
}

.navbar .services-dropdown-header {
  top: 0;
}

.navbar .services-dropdown-footer {
  bottom: 0;
  color: #4b5563;
  background: #f8f9fa;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  border-bottom: 0;
}

.navbar .services-dropdown-menu .dropdown-item {
  padding-top: 0.55rem;
  padding-bottom: 0.55rem;
  white-space: normal;
}

@media (min-width: 768px) {
  .navbar .services-dropdown-menu {
    min-width: 320px;
  }
}

@media (max-width: 979px) {
  .navbar .nav-item.dropdown {
    position: static;
  }

  .navbar .services-dropdown-menu {
    position: relative;
    left: auto;
    right: auto;
    transform: none;
    max-height: 60vh;
    width: min(360px, calc(100vw - 2rem));
    max-width: calc(100vw - 2rem);
    margin-top: 0.35rem;
    margin-left: calc((100vw - min(360px, calc(100vw - 2rem))) / 2 - 110px);
    margin-right: auto;
    text-align: left;
  }

  .navbar .services-dropdown-menu .dropdown-item {
    padding: 0.7rem 1rem;
  }
}

/* Shared on-site services banner above paired service-list boxes */
.apst-onsite-services-banner {
  padding: clamp(1.6rem, 3vw, 2.6rem) 1.25rem;
  margin-bottom: .25rem;
}

.apst-onsite-services-banner,
.apst-onsite-services-banner h3,
.apst-onsite-services-banner i {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

.apst-onsite-services-card {
  margin-top: .25rem;
}

/* Service detail pages: aerial lift, crane, forklift, and heavy equipment */
.service-detail-page .service-hero-panel {
  background: linear-gradient(135deg, rgba(17, 106, 179, 0.1), rgba(186, 131, 13, 0.12));
  border: 1px solid rgba(17, 106, 179, 0.12);
  border-radius: 1.5rem;
  padding: 2.5rem 1.5rem;
  box-shadow: var(--shadow-card);
}

.service-detail-page .service-hero-panel h1 {
  display: block;
  color: #18324a;
  -webkit-text-fill-color: #18324a;
}

.service-detail-page .service-kicker {
  color: var(--accent-gold);
  font-weight: 700;
  letter-spacing: 0.08em;
  margin-bottom: 0.75rem;
  text-transform: uppercase;
}

.service-detail-page .service-highlight-card {
  background: #fff;
  border: 1px solid rgba(17, 106, 179, 0.12);
  border-radius: 1rem;
  box-shadow: var(--shadow-card);
  padding: 1.5rem;
}

.service-detail-page .service-highlight-card h2,
.service-detail-page .service-final-cta h2 {
  display: block;
}

.service-detail-page .service-objectives .list-group-item {
  border-left: 4px solid var(--primary-blue);
}

.service-detail-page .service-conversion-panel {
  border-left: 6px solid var(--accent-gold);
}

.service-detail-page .accordion-button:not(.collapsed) {
  background-color: rgba(17, 106, 179, 0.1);
  color: #18324a;
  font-weight: 700;
}

@media (max-width: 575.98px) {
  .service-detail-page .service-hero-panel {
    padding: 1.75rem 1rem;
  }
}

.service-format-note {
  background: #fff;
  border: 1px solid rgba(186, 131, 13, 0.35);
  border-left: 5px solid var(--accent-gold);
  border-radius: 0.75rem;
  box-shadow: var(--shadow-card);
  margin: 1.25rem auto;
  max-width: 780px;
  padding: 1rem 1.25rem;
  text-align: left;
}

.service-format-note strong {
  color: #18324a;
}

/* Additional Train the Trainer service cards */
.ttt-page .ttt-additional-services .ttt-card h3 a {
  color: inherit;
  text-decoration: none;
}

.ttt-page .ttt-additional-services .ttt-card h3 a:hover {
  color: var(--ttt-course-color, var(--ttt-brand-blue));
}

.ttt-page .ttt-course-heavy-equipment,
.ttt-page .ttt-course-electrical,
.ttt-page .ttt-course-hazcom,
.ttt-page .ttt-course-eap {
  --ttt-course-color: #116ab3;
  --ttt-course-soft: #e9f3fb;
  --ttt-course-dark: #0e4f87;
}

.ttt-page .ttt-course-hazwoper,
.ttt-page .ttt-course-hot-work,
.ttt-page .ttt-course-fall-protection {
  --ttt-course-color: #f58220;
  --ttt-course-soft: #fff0e1;
  --ttt-course-dark: #8d4509;
}

.ttt-page .ttt-course-ladder,
.ttt-page .ttt-course-osha-outreach,
.ttt-page .ttt-course-silica {
  --ttt-course-color: #ba830d;
  --ttt-course-soft: #fbf4e3;
  --ttt-course-dark: #7a5609;
}

.ttt-page .ttt-course-loto,
.ttt-page .ttt-course-traffic,
.ttt-page .ttt-course-fire {
  --ttt-course-color: #c84a32;
  --ttt-course-soft: #fae9e5;
  --ttt-course-dark: #7a2f20;
}

.ttt-page .ttt-course-machine-guarding,
.ttt-page .ttt-course-scaffold,
.ttt-page .ttt-course-asbestos {
  --ttt-course-color: #53606c;
  --ttt-course-soft: #eef1f3;
  --ttt-course-dark: #2f3840;
}

.ttt-page .ttt-course-ppe,
.ttt-page .ttt-course-confined-space,
.ttt-page .ttt-course-eye-face {
  --ttt-course-color: #34745b;
  --ttt-course-soft: #e9f4ef;
  --ttt-course-dark: #22513f;
}
