/*
 Theme Name:     Sky Climber Access Solutions
 Author:         Sky Climber Access Solutions
 Author URI:     https://skyclimberaccesssolutions.com
 Template:       Divi
 Version:        2.0
 Description:    SCAS Child Theme — Built on Divi Engineering Base
*/

/* ============================================================
   SCAS DESIGN SYSTEM  |  v2.0
   Sky Climber Access Solutions

   TABLE OF CONTENTS
   ─────────────────────────────────────────────────────────────
   01  Design Tokens (CSS Custom Properties)
   02  Global Base & Resets
   03  Typography System
   04  Divi Global Overrides
   05  Buttons
   06  Header & Navigation
   07  Desktop Dropdown / Submenu
   08  Mobile Navigation
   09  Hero — Homepage
   10  Hero — Inner Pages (Sub-page Banner)
   11  Section Eyebrow Labels
   12  Service Cards (V1 / V2 / V3)
   13  Custom Slider
   14  Project Grid
   15  Person / Team Module
   16  Expertise & Feature Sections
   17  Product & Service Content Blocks
   18  About Page Content
   19  CTA Sections ("Let's Get Connected")
   20  Logos Row
   21  Blog Layout
   22  Forms — Divi Native
   23  Forms — Gravity Forms
   24  Footer
   25  Decorative Elements (Dots & Lines)
   26  Scrollbar (ID-scoped)
   27  Slide-In Panel
   28  Utility Classes
   29  Responsive Overrides
   30  Divi Visual Builder (edit-mode only)
   ============================================================ */


/* ============================================================
   01  DESIGN TOKENS
   All brand values live here. Change once — update everywhere.
   ============================================================ */

:root {

  /* ── Core Brand Colors ─────────────────────────────────── */
  --scas-navy:        #002147;
  --scas-blue:        #0197ff;
  --scas-green:       #15a800;
  --scas-white:       #ffffff;
  --scas-off-white:   #f5f7fa;
  --scas-light-gray:  #e8ecf0;
  --scas-mid-gray:    #767676;
  --scas-dark-gray:   #333333;
  --scas-black:       #111111;

  /* ── Semantic Roles ────────────────────────────────────── */
  --color-primary:    var(--scas-navy);
  --color-accent:     var(--scas-blue);
  --color-success:    var(--scas-green);
  --color-text:       var(--scas-dark-gray);
  --color-text-light: var(--scas-mid-gray);
  --color-bg:         var(--scas-white);
  --color-bg-alt:     var(--scas-off-white);
  --color-border:     var(--scas-light-gray);

  /* ── Overlays ──────────────────────────────────────────── */
  --overlay-navy:     rgba(0, 33, 71, 0.80);
  --overlay-navy-med: rgba(0, 33, 71, 0.60);
  --overlay-blue:     rgba(1, 151, 255, 0.72);
  --overlay-dark:     rgba(0, 0, 0, 0.42);

  /* ── Typography ────────────────────────────────────────── */
  --font-primary:       'Nunito Sans', Arial, sans-serif;
  --weight-regular:     400;
  --weight-semibold:    600;
  --weight-bold:        700;
  --weight-black:       900;

  /* ── Type Scale ────────────────────────────────────────── */
  --text-xs:    12px;
  --text-sm:    14px;
  --text-base:  16px;
  --text-md:    18px;
  --text-lg:    21px;
  --text-xl:    24px;
  --text-2xl:   30px;
  --text-3xl:   38px;
  --text-4xl:   48px;
  --text-hero:  68px;

  /* ── Line Heights ──────────────────────────────────────── */
  --leading-tight:   1.15;
  --leading-snug:    1.35;
  --leading-normal:  1.65;
  --leading-loose:   1.85;

  /* ── Spacing ───────────────────────────────────────────── */
  --space-2xs: 4px;
  --space-xs:  8px;
  --space-sm:  12px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  40px;
  --space-2xl: 64px;
  --space-3xl: 96px;

  /* ── Border Radius ─────────────────────────────────────── */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   16px;
  --radius-full: 9999px;

  /* ── Shadows ───────────────────────────────────────────── */
  --shadow-sm:  0 1px 4px  rgba(0, 0, 0, 0.07);
  --shadow-md:  0 4px 16px rgba(0, 0, 0, 0.10);
  --shadow-lg:  0 8px 32px rgba(0, 0, 0, 0.13);
  --shadow-xl:  0 16px 48px rgba(0, 0, 0, 0.16);

  /* ── Transitions ───────────────────────────────────────── */
  --ease-fast:  all 0.15s ease-in-out;
  --ease-base:  all 0.25s ease-in-out;
  --ease-slow:  all 0.40s ease-in-out;
}


/* ============================================================
   02  GLOBAL BASE & RESETS
   ============================================================ */

*, *::before, *::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-primary) !important;
  font-size: var(--text-base);
  font-weight: var(--weight-regular);
  line-height: var(--leading-normal);
  color: var(--color-text);
  background-color: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: var(--color-accent);
  text-decoration: none;
  transition: var(--ease-fast);
}

a:hover {
  color: var(--color-primary);
}

/* ── Hide reCAPTCHA badge ────────────────────────────────── */
.grecaptcha-badge {
  visibility: hidden !important;
}


/* ============================================================
   03  TYPOGRAPHY SYSTEM
   Establishes the SCAS type hierarchy globally so Divi
   modules inherit correct fonts without per-module config.
   ============================================================ */

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-primary) !important;
  font-weight: var(--weight-bold);
  line-height: var(--leading-tight);
  /* color intentionally omitted — set per section in Divi */
  margin-top: 0;
}

h1 { font-size: var(--text-hero);  }
h2 { font-size: var(--text-3xl);   }
h3 { font-size: var(--text-2xl);   }
h4 { font-size: var(--text-xl);    }
h5 { font-size: var(--text-md);    }
h6 { font-size: var(--text-base);  }

p {
  font-family: var(--font-primary) !important;
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  /* color intentionally omitted — set per section in Divi */
  margin-top: 0;
}

ul, ol {
  font-family: var(--font-primary) !important;
}

strong, b {
  font-weight: var(--weight-bold);
}

/* Responsive type scale */
@media (max-width: 980px) {
  h1 { font-size: var(--text-4xl); }
  h2 { font-size: var(--text-3xl); }
  h3 { font-size: var(--text-2xl); }
}

@media (max-width: 479px) {
  h1 { font-size: var(--text-3xl); }
  h2 { font-size: var(--text-2xl); }
  h3 { font-size: var(--text-xl);  }
}


/* ============================================================
   04  DIVI GLOBAL OVERRIDES
   Makes every Divi module inherit the brand type system.
   ============================================================ */

/* ── Module headings ─────────────────────────────────────── */
.et_pb_module_header,
.et_pb_text h1, .et_pb_text h2, .et_pb_text h3,
.et_pb_text h4, .et_pb_text h5, .et_pb_text h6,
.et_pb_blurb_content .et_pb_module_header,
.et_pb_blurb_container .et_pb_module_header,
.et_pb_pricing_heading h2,
.et_pb_team_member_description h4 {
  font-family: var(--font-primary) !important;
  font-weight: var(--weight-bold);
  line-height: var(--leading-tight);
  /* color intentionally omitted — controlled by Divi module settings */
}

/* ── Module body copy ────────────────────────────────────── */
.et_pb_text_inner,
.et_pb_text_inner p,
.et_pb_text p,
.et_pb_blurb_description,
.et_pb_blurb_description p,
.et_pb_tab_content p,
.et_pb_accordion_item p,
.et_pb_toggle_content p {
  font-family: var(--font-primary) !important;
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  /* color intentionally omitted — controlled by Divi module settings */
}

/* ── Module inputs ───────────────────────────────────────── */
input, textarea, select {
  font-family: var(--font-primary) !important;
}

/* ── Divi contact form ───────────────────────────────────── */
.et_pb_contact_field input,
.et_pb_contact_field textarea,
.et_pb_contact_field select {
  font-family: var(--font-primary) !important;
  font-size: var(--text-base);
  border-radius: var(--radius-sm) !important;
  border: 1px solid var(--color-border) !important;
  transition: border-color var(--ease-fast);
}

.et_pb_contact_field input:focus,
.et_pb_contact_field textarea:focus {
  border-color: var(--color-accent) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(1, 151, 255, 0.12) !important;
}

/* ── Divi contact form success ───────────────────────────── */
.et-pb-contact-message p {
  font-family: var(--font-primary) !important;
  color: var(--color-accent);
  font-size: var(--text-lg);
  font-weight: var(--weight-bold);
  text-transform: uppercase;
}

/* ── Section / row spacing ───────────────────────────────── */
/* Remove default Divi top-margin on first row per section */
.et_pb_section .et_pb_row:first-child {
  margin-top: 0;
}


/* ============================================================
   05  BUTTONS
   ============================================================ */

.et_pb_button,
a.et_pb_button,
.et_pb_more_button {
  font-family: var(--font-primary) !important;
  font-weight: var(--weight-bold) !important;
  font-size: var(--text-sm) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  border-radius: var(--radius-sm) !important;
  transition: var(--ease-base) !important;
  padding: 14px 30px !important;
}

/* Primary button (navy bg) */
.et_pb_button.btn-primary,
a.et_pb_button.btn-primary {
  background-color: var(--color-primary) !important;
  color: var(--scas-white) !important;
  border-color: var(--color-primary) !important;
}

.et_pb_button.btn-primary:hover,
a.et_pb_button.btn-primary:hover {
  background-color: var(--color-accent) !important;
  border-color: var(--color-accent) !important;
  color: var(--scas-white) !important;
}

/* Accent button (blue bg) */
.et_pb_button.btn-accent,
a.et_pb_button.btn-accent {
  background-color: var(--color-accent) !important;
  color: var(--scas-white) !important;
  border-color: var(--color-accent) !important;
}

.et_pb_button.btn-accent:hover,
a.et_pb_button.btn-accent:hover {
  background-color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
}

/* Outline button (white outline for dark backgrounds) */
.et_pb_button.btn-outline,
a.et_pb_button.btn-outline {
  background-color: transparent !important;
  color: var(--scas-white) !important;
  border: 2px solid var(--scas-white) !important;
}

.et_pb_button.btn-outline:hover,
a.et_pb_button.btn-outline:hover {
  background-color: var(--scas-white) !important;
  color: var(--color-primary) !important;
}


/* ============================================================
   06  HEADER & NAVIGATION
   ============================================================ */

.header-column {
  display: flex;
}

.header-menu {
  display: flex;
  align-items: center;
}

.de-custom-menu,
.et_pb_menu_inner_container {
  width: 100%;
}

.header-menu .et_pb_menu_inner_container {
  height: 100%;
}

/* ── Nav items ───────────────────────────────────────────── */
.header-menu.et_pb_menu--with-logo .et_pb_menu__menu > nav > ul > li {
  margin-top: 0;
  border-left: 1px solid var(--color-border);
  padding: 0 30px;
  transition: var(--ease-fast);
}

.header-menu.et_pb_menu--with-logo .et_pb_menu__menu > nav > ul > li > a {
  align-self: center;
  font-family: var(--font-primary) !important;
  font-weight: var(--weight-semibold);
  font-size: var(--text-sm);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  transition: var(--ease-fast);
}

/* Header V2 nav divider */
.header-v2 .header-menu.et_pb_menu--with-logo .et_pb_menu__menu > nav > ul > li {
  border-left: 1px solid rgba(255, 255, 255, 0.20);
}

/* Header V4 active / hover */
.header-v4 .de-custom-menu li {
  transition: var(--ease-fast);
}

.header-v4 .de-custom-menu {
  padding-right: 0 !important;
}

.header-v4 .de-custom-menu li.current-menu-item,
.header-v4 .de-custom-menu li:hover {
  background-color: var(--color-primary);
}

.header-v4 .de-custom-menu.et_pb_menu ul li.current-menu-item a,
.header-v4 .de-custom-menu.et_pb_menu ul li:hover a {
  color: var(--scas-white) !important;
  opacity: 1;
}

/* ── Phone blurb in header ───────────────────────────────── */
.blurb-header-phone .et_pb_blurb_content {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.blurb-header-phone .et_pb_main_blurb_image {
  margin-bottom: 0;
}

.blurb-header-phone h4.et_pb_module_header {
  padding-bottom: 0;
  font-size: var(--text-base) !important;
}

.top-custom-header {
  display: flex;
  align-items: center;
}

.header-slide-in-icon .et_pb_icon_wrap {
  height: 100%;
  display: flex;
  align-items: center;
}


/* ============================================================
   07  DESKTOP DROPDOWN / SUBMENU
   ============================================================ */

.de-custom-menu.et_pb_menu .et-menu-nav > ul ul {
  padding: 0 !important;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  overflow: hidden;
}

/* Scrollable if very tall */
#top-menu li li ul,
#top-menu .sub-menu,
.et_pb_menu .sub-menu {
  max-height: 70vh;
  overflow-y: auto;
}

.de-custom-menu .nav li li {
  padding: 0 !important;
  border-top: 1px solid rgba(0, 0, 0, 0.07);
  transition: var(--ease-fast);
}

.header-v2 .de-custom-menu .nav li li,
.header-v3 .de-custom-menu .nav li li,
.header-v4 .de-custom-menu .nav li li {
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.de-custom-menu .nav li ul {
  width: 240px;
}

.de-custom-menu .et-menu li li a {
  width: 240px !important;
  padding: 12px 20px;
  font-size: var(--text-sm) !important;
  font-family: var(--font-primary) !important;
  font-weight: var(--weight-regular);
  transition: var(--ease-fast);
}

.de-custom-menu .nav li li:last-child {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.de-custom-menu .fas {
  padding-right: 10px;
}

.de-custom-menu .et-menu li li.menu-item-has-children > a:first-child:after {
  top: 12px !important;
}


/* ============================================================
   08  MOBILE NAVIGATION
   ============================================================ */

.et_mobile_menu {
  max-height: 80vh;
  overflow-y: auto !important;
}

#et_mobile_nav_menu .et_mobile_menu {
  max-height: 80vh;
  overflow-y: auto !important;
}

@media (max-width: 980px) {
  .de-custom-menu.et_pb_menu .et_mobile_nav_menu {
    float: right;
  }
}

/* Toggle icon */
ul.et_mobile_menu li.menu-item-has-children .mobile-toggle-icon::after,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle-icon::after {
  top: 10px;
  position: relative;
  font-family: "ETModules";
  content: '\33';
  border-radius: 50%;
  padding: 3px;
  color: var(--color-primary);
  background: var(--scas-off-white);
}

ul.et_mobile_menu li.menu-item-has-children.mobile-toggle-open > .mobile-toggle-icon::after,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children.mobile-toggle-open > .mobile-toggle-icon::after {
  content: '\32';
}

.et_mobile_menu .menu-item-has-children > a {
  font-weight: var(--weight-semibold) !important;
  font-family: var(--font-primary) !important;
}

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle-icon,
ul.et_mobile_menu li.page_item_has_children .mobile-toggle-icon,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle-icon,
.et-db #et-boc .et-l ul.et_mobile_menu li.page_item_has_children .mobile-toggle-icon {
  width: 44px;
  height: 100%;
  padding: 0 !important;
  max-height: 44px;
  border: none;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 999;
  background-color: transparent;
}

ul.et_mobile_menu > li.menu-item-has-children,
ul.et_mobile_menu > li.page_item_has_children,
ul.et_mobile_menu > li.menu-item-has-children .sub-menu li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu > li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu > li.page_item_has_children,
.et-db #et-boc .et-l ul.et_mobile_menu > li.menu-item-has-children .sub-menu li.menu-item-has-children {
  position: relative;
}

.et_mobile_menu .menu-item-has-children > a,
.et-db #et-boc .et-l .et_mobile_menu .menu-item-has-children > a {
  background-color: transparent;
}

ul.et_mobile_menu .menu-item-has-children .sub-menu,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu {
  display: none !important;
  visibility: hidden !important;
}

ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible {
  display: block !important;
  visibility: visible !important;
}

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle-icon,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle-icon {
  text-align: center;
  opacity: 1;
}


/* ============================================================
   09  HERO — HOMEPAGE
   ============================================================ */

.hero-home-column-1 {
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.hero-home-column-1 h1 {
  font-family: var(--font-primary) !important;
  font-weight: var(--weight-black);
  line-height: var(--leading-tight);
}

@media (min-width: 981px) and (max-width: 1200px) {
  .hero-home-column-1 {
    padding: 35px !important;
  }
}

@media (min-width: 1201px) and (max-width: 1500px) {
  .hero-home-column-1 {
    padding: 75px !important;
  }
}

@media (min-width: 981px) and (max-width: 1500px) {
  .hero-home-column-1 h1 {
    font-size: var(--text-4xl) !important;
  }
}

@media (max-width: 980px) {
  .hero-home-column-1 h1 {
    font-size: var(--text-3xl) !important;
  }
}

@media (max-width: 479px) {
  .hero-home-column-1 h1 {
    font-size: var(--text-2xl) !important;
  }
}


/* ============================================================
   10  HERO — INNER PAGES (SUB-PAGE BANNER)
   ============================================================ */

.sub-page-hero h1,
.page-hero h1,
.page-header h1 {
  font-family: var(--font-primary) !important;
  font-size: var(--text-4xl);
  font-weight: var(--weight-black);
  color: var(--scas-white);
  line-height: var(--leading-tight);
}

@media (max-width: 980px) {
  .sub-page-hero h1,
  .page-hero h1 {
    font-size: var(--text-3xl);
  }
}

@media (max-width: 479px) {
  .sub-page-hero h1,
  .page-hero h1 {
    font-size: var(--text-2xl);
  }
}


/* ============================================================
   11  SECTION EYEBROW LABELS
   Used for "Building the future" and similar labels that
   appear above section headings. Assign the CSS class
   .section-eyebrow to those text modules in Divi to activate.
   ============================================================ */

.section-eyebrow,
.et_pb_text.section-eyebrow .et_pb_text_inner,
.et_pb_text.section-eyebrow p {
  font-family: var(--font-primary) !important;
  font-size: var(--text-xs) !important;
  font-weight: var(--weight-bold) !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--color-accent) !important;
  line-height: 1 !important;
  margin-bottom: var(--space-xs) !important;
}


/* ============================================================
   12  SERVICE CARDS
   ============================================================ */

/* ── V1: Slide-up blurb on hover ─────────────────────────── */
.service-card-blurb-v1 {
  position: absolute;
  bottom: -125px;
  transition: var(--ease-slow);
}

.active-card-blurb-v1 .service-card-blurb-v1 {
  bottom: 0;
}

/* ── V2: Triangle reveal on hover ────────────────────────── */
.card-overlay-triangle:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: -70%;
  right: -70%;
  z-index: 9;
  transform: rotate(45deg);
  background-color: var(--color-primary);
  transition: var(--ease-slow);
}

.active-card-v2 .service-card-v2:before {
  width: 300%;
  height: 300%;
  background-color: var(--overlay-navy-med);
}

.card-overlay-triangle:after {
  content: "Learn More";
  color: var(--scas-white);
  font-size: var(--text-md);
  font-weight: var(--weight-black);
  font-family: var(--font-primary);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  opacity: 0;
  transition: var(--ease-slow);
}

.active-card-v2 .service-card-v2:after {
  opacity: 1;
}

/* ── V3: Drop-down blurb on hover ────────────────────────── */
.service-card-blurb-v3 {
  position: absolute;
  top: 100%;
  margin-top: -8px;
  height: 100%;
  display: flex;
  align-items: center;
  transition: var(--ease-slow);
}

.active-card-blurb-v3 .service-card-blurb-v3 {
  top: 0;
  margin-top: 0;
}


/* ============================================================
   13  CUSTOM SLIDER
   JS in divi-engineer-custom-scripts.js toggles the active
   classes. CSS controls visibility and transitions.
   ============================================================ */

.icon-row {
  display: flex;
  flex-wrap: wrap;
}

#slider-icon-row .slide-icon {
  margin-left: 0 !important;
  margin-right: 20px !important;
}

/* Active / hover icon state */
.slide-active .et_pb_icon_wrap,
.slide-icon:hover .et_pb_icon_wrap {
  background-color: var(--color-primary);
  border: 1px solid var(--color-accent);
  color: var(--scas-white);
  cursor: pointer;
}

.slide-active .et_pb_icon_wrap .et-pb-icon,
.slide-icon:hover .et_pb_icon_wrap .et-pb-icon {
  color: var(--scas-white) !important;
}

.slide-icon .et_pb_icon_wrap {
  transition: var(--ease-base);
}

/* Slide text */
.slider-text {
  display: none;
}

.slider-text.active-slide-text {
  display: block;
}

/* Slide images */
.slider-image {
  position: absolute;
  visibility: hidden;
  opacity: 0;
  transition: var(--ease-slow);
}

.slider-image.active-slide-image {
  visibility: visible;
  opacity: 1;
  position: relative;
}


/* ============================================================
   14  PROJECT GRID
   ============================================================ */

.project-blurb {
  position: absolute;
  top: 100%;
  margin-top: -8px;
  height: 100%;
  display: flex;
  align-items: center;
  transition: var(--ease-slow);
}

.active-project .project-blurb {
  top: 0;
  margin-top: 0;
}

/* Column hover overlay */
.project-row .et_pb_column:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: -1;
  background-color: var(--overlay-dark);
  transition: var(--ease-base);
}

.project-row .et_pb_column:hover:before {
  opacity: 1;
}

/* ── 2-column ────────────────────────────────────────────── */
@media (min-width: 981px) {
  .project-row.et_pb_gutters2 .et_pb_column_1_2,
  .project-row.et_pb_gutters2.et_pb_row .et_pb_column_1_2 {
    width: 49.75%;
  }

  .project-row.et_pb_gutters2 .et_pb_column,
  .project-row.et_pb_gutters2.et_pb_row .et_pb_column {
    margin-right: 0.5%;
  }
}

/* ── 4-column ────────────────────────────────────────────── */
@media (min-width: 981px) {
  .project-row.et_pb_gutters2 .et_pb_column_1_4,
  .project-row.et_pb_gutters2.et_pb_row .et_pb_column_1_4 {
    width: 24.625%;
  }
}

/* ── 5-column ────────────────────────────────────────────── */
@media (min-width: 981px) {
  .project-row.et_pb_gutters2 .et_pb_column_1_5,
  .project-row.et_pb_gutters2.et_pb_row .et_pb_column_1_5 {
    width: 19.6%;
  }
}

/* ── 5-column gutters1 ───────────────────────────────────── */
@media (min-width: 981px) {
  .project-5-column.et_pb_gutters1 .et_pb_column_1_5,
  .project-5-column.et_pb_gutters1.et_pb_row .et_pb_column_1_5 {
    width: 19.68%;
  }

  .project-5-column.et_pb_gutters1 .et_pb_column,
  .project-5-column.et_pb_gutters1.et_pb_row .et_pb_column {
    margin-right: 0.4%;
  }
}

/* ── Special 2x2 section ─────────────────────────────────── */
@media (min-width: 981px) {
  .project-special-section
  .et_pb_column.et_pb_column_1_2 > .et_pb_row_inner.et_pb_gutters2 > .et_pb_column_1_4,
  .project-special-section
  .et_pb_gutters2 .et_pb_column_1_2 > .et_pb_row_inner > .et_pb_column_1_4 {
    width: 49.25%;
    margin-right: 1.5%;
  }

  .project-special-section .et_pb_gutters2 .et_pb_column_1_2,
  .project-special-section .et_pb_gutters2.et_pb_row .et_pb_column_1_2 {
    width: 49.65%;
    margin-right: 0.7%;
  }

  .project-overlay:before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    opacity: 0;
    background-color: var(--overlay-dark);
    transition: var(--ease-base);
  }

  .project-overlay:hover:before {
    opacity: 1;
  }
}

/* ── Project blurb responsive ────────────────────────────── */
@media (min-width: 981px) and (max-width: 1400px) {
  .project-column .et_pb_blurb.project-blurb {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }

  .project-column .et_pb_blurb.project-blurb .et_pb_blurb_description {
    font-size: var(--text-xs);
    line-height: 1.5;
  }

  .project-column .et_pb_blurb.project-blurb .et_pb_main_blurb_image {
    display: inline-block;
    margin-bottom: 10px;
  }
}


/* ============================================================
   15  PERSON / TEAM MODULE
   ============================================================ */

.person-module .et_pb_member_social_links {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 5px 20px 0;
  visibility: hidden;
  z-index: -999;
  background-color: var(--color-primary);
  transition: var(--ease-slow);
}

.person-module:hover .et_pb_member_social_links {
  bottom: -32px;
  visibility: visible;
  z-index: 1;
}

.et_pb_team_member_description {
  padding: 10px 20px;
}

.et_pb_team_member_description h4.et_pb_module_header {
  padding-bottom: 0;
}

.person-module .et_pb_team_member_image:before {
  content: "Learn More";
  font-size: var(--text-md);
  font-weight: var(--weight-black);
  font-family: var(--font-primary);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--scas-white);
  background-color: var(--overlay-navy);
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  opacity: 0;
  transition: var(--ease-slow);
}

.person-module:hover .et_pb_team_member_image:before {
  opacity: 1;
}


/* ============================================================
   16  EXPERTISE & FEATURE SECTIONS
   The 3-card "Our Expertise" row (Rental, Service, Training)
   and similar feature grids across the site.
   ============================================================ */

/* Blurb module image alignment */
.expertise-section .et_pb_main_blurb_image {
  margin-bottom: var(--space-md);
}

.expertise-section .et_pb_module_header {
  font-size: var(--text-xl) !important;
  font-weight: var(--weight-bold) !important;
  color: var(--color-primary) !important;
  margin-bottom: var(--space-sm);
}

.expertise-section .et_pb_blurb_description p {
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  color: var(--color-text-light);
}


/* ============================================================
   17  PRODUCT & SERVICE CONTENT BLOCKS
   Rentals & Sales page — product category sections
   ============================================================ */

/* Category h5 headers (Swing Staging, Lifting & Hoists, etc.) */
.et_pb_text h5 {
  font-family: var(--font-primary) !important;
  font-size: var(--text-md) !important;
  font-weight: var(--weight-bold) !important;
  color: var(--color-primary) !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding-bottom: var(--space-sm);
  border-bottom: 2px solid var(--color-accent);
  margin-bottom: var(--space-md);
}

/* Bullet lists in content */
.et_pb_text ul,
.et_pb_blurb_description ul {
  list-style: none;
  margin: 0 0 var(--space-lg) 0;
  padding: 0;
}

.et_pb_text ul li,
.et_pb_blurb_description ul li {
  font-family: var(--font-primary) !important;
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  color: var(--color-text);
  position: relative;
  padding-left: var(--space-lg);
  margin-bottom: var(--space-xs);
}

.et_pb_text ul li::before,
.et_pb_blurb_description ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 10px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: var(--color-accent);
  flex-shrink: 0;
}

/* Blog sidebar list keeps its own bullet style */
.blog-sidebar .et_pb_widget ul li::before {
  content: "\25a0";
  background: none;
  border-radius: 0;
  width: auto;
  height: auto;
  color: var(--color-primary);
  font-weight: var(--weight-bold);
  display: inline-block;
  width: 1.5em;
  margin-left: -1.5em;
  margin-top: -2px;
  float: left;
}

/* Bold inline text */
.et_pb_text strong,
.et_pb_blurb_description strong {
  font-weight: var(--weight-bold);
  color: var(--color-primary);
}

/* Lead paragraph (larger intro text) */
.et_pb_text.intro-text p,
.intro-text .et_pb_text_inner p {
  font-size: var(--text-lg) !important;
  line-height: var(--leading-loose) !important;
  color: var(--color-text) !important;
}


/* ============================================================
   18  ABOUT PAGE CONTENT
   Vision / Mission / Quality / Safety / Environment blocks
   ============================================================ */

.content-pillar h5,
.content-pillar h4 {
  font-family: var(--font-primary) !important;
  font-size: var(--text-md) !important;
  font-weight: var(--weight-bold) !important;
  color: var(--color-primary) !important;
  margin-bottom: var(--space-sm);
}

.content-pillar p {
  font-size: var(--text-base);
  line-height: var(--leading-loose);
  color: var(--color-text);
}

/* Info columns: address / email / phone */
.info-column h4,
.info-column .et_pb_module_header {
  font-family: var(--font-primary) !important;
  font-size: var(--text-sm) !important;
  font-weight: var(--weight-bold) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--color-accent) !important;
  margin-bottom: var(--space-2xs);
}

.info-column p,
.info-column a {
  font-size: var(--text-base);
  color: var(--color-text);
  line-height: var(--leading-normal);
}

.info-column a:hover {
  color: var(--color-accent);
}


/* ============================================================
   19  CTA SECTIONS ("LET'S GET CONNECTED")
   Recurring pattern on inner pages: small circular photo,
   eyebrow label, heading, and a button.
   ============================================================ */

.cta-connect {
  text-align: center;
}

.cta-connect .et_pb_module_header,
.cta-connect h2,
.cta-connect h3 {
  font-family: var(--font-primary) !important;
  font-weight: var(--weight-bold) !important;
  color: var(--color-primary) !important;
}

/* Circular employee photo */
.cta-connect .et_pb_image img,
.cta-circle-photo img {
  border-radius: 50%;
  border: 3px solid var(--color-accent);
  max-width: 100px;
}

/* Eyebrow text above CTA heading */
.cta-connect .et_pb_text p:first-child {
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: var(--space-xs);
}


/* ============================================================
   20  LOGOS ROW
   ============================================================ */

@media (min-width: 981px) {
  .logos-row {
    display: flex;
    align-items: center;
  }
}


/* ============================================================
   21  BLOG LAYOUT
   ============================================================ */

.blog-fullwidth article {
  padding-bottom: 45px;
  border-bottom: 5px solid var(--color-primary) !important;
}

.blog-sidebar .et_pb_widget {
  padding: 25px;
  box-shadow: var(--shadow-md);
  border-radius: var(--radius-sm);
  background-color: var(--scas-white);
  border-bottom: 5px solid var(--color-primary);
  margin-bottom: var(--space-lg);
}

.blog-sidebar.et_pb_widget_area ul {
  margin: 0 0 1.5em 1.5em !important;
}


/* ============================================================
   22  FORMS — DIVI NATIVE
   ============================================================ */

/* Success message */
.et-pb-contact-message p {
  font-family: var(--font-primary) !important;
  color: var(--color-accent);
  font-size: var(--text-lg);
  font-weight: var(--weight-bold);
  text-transform: uppercase;
}


/* ============================================================
   23  FORMS — GRAVITY FORMS
   Contact page uses Gravity Forms.
   ============================================================ */

.gform_wrapper label.gfield_label,
.gform_wrapper .gfield_label {
  font-family: var(--font-primary) !important;
  font-size: var(--text-sm) !important;
  font-weight: var(--weight-semibold) !important;
  color: var(--color-primary) !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: var(--space-2xs);
}

.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="number"],
.gform_wrapper select,
.gform_wrapper textarea {
  font-family: var(--font-primary) !important;
  font-size: var(--text-base) !important;
  color: var(--color-text) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: var(--radius-sm) !important;
  padding: 10px 14px !important;
  width: 100% !important;
  transition: var(--ease-fast);
  background-color: var(--scas-white) !important;
}

.gform_wrapper input:focus,
.gform_wrapper select:focus,
.gform_wrapper textarea:focus {
  border-color: var(--color-accent) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(1, 151, 255, 0.12) !important;
}

.gform_wrapper .gfield_required {
  color: var(--color-accent) !important;
}

.gform_wrapper .gform_button,
.gform_wrapper input[type="submit"] {
  font-family: var(--font-primary) !important;
  font-size: var(--text-sm) !important;
  font-weight: var(--weight-bold) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  background-color: var(--color-primary) !important;
  color: var(--scas-white) !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  padding: 14px 32px !important;
  cursor: pointer !important;
  transition: var(--ease-base) !important;
}

.gform_wrapper .gform_button:hover,
.gform_wrapper input[type="submit"]:hover {
  background-color: var(--color-accent) !important;
}

.gform_wrapper .gfield_error input,
.gform_wrapper .gfield_error select,
.gform_wrapper .gfield_error textarea {
  border-color: #cc0000 !important;
}

.gform_wrapper .validation_error,
.gform_wrapper .gfield_description.validation_message {
  font-family: var(--font-primary) !important;
  color: #cc0000 !important;
  font-size: var(--text-sm) !important;
}

.gform_confirmation_wrapper {
  font-family: var(--font-primary) !important;
  color: var(--color-success) !important;
  font-size: var(--text-lg) !important;
  font-weight: var(--weight-bold) !important;
}


/* ============================================================
   24  FOOTER
   ============================================================ */

.et-l--footer .et_builder_inner_content {
  z-index: 99999;
}

.et-l--footer a,
.et-l--footer p,
.et-l--footer li {
  font-family: var(--font-primary) !important;
  transition: var(--ease-fast);
}

.et-l--footer .et_pb_widget_area ul li {
  font-family: var(--font-primary) !important;
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  margin-bottom: var(--space-xs);
}

.et-l--footer .et_pb_widget_area a {
  color: inherit;
}

.et-l--footer .et_pb_widget_area a:hover {
  color: var(--color-accent);
}


/* ============================================================
   25  DECORATIVE ELEMENTS (DOTS & LINES)
   ============================================================ */

.dot-right-bottom:after,
.dot-left-top:after,
.dot-left-bottom:after,
.dot-right-top:after,
.sub-page-dot.dot-right-bottom:after {
  content: '\25CF';
  font-size: 20px;
  position: absolute;
  color: var(--color-primary);
}

.dot-right-bottom:after              { right: -7px; top: 65px;  }
.dot-left-top:after                  { left: -7px;  top: -15px; }
.dot-left-bottom:after               { left: -7px;  top: 65px;  }
.dot-right-top:after                 { right: -7px; top: -15px; }
.sub-page-dot.dot-right-bottom:after { right: -7px; top: 15px;  }


/* ============================================================
   26  SCROLLBAR (ID-scoped)
   ============================================================ */

#style-scrollbar::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  border-radius: 0;
  background-color: var(--scas-off-white);
}

#style-scrollbar::-webkit-scrollbar {
  width: 10px;
  background-color: var(--scas-off-white);
}

#style-scrollbar::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: var(--color-primary);
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}


/* ============================================================
   27  SLIDE-IN PANEL
   Toggled by .custom-menu-v1-button via JS.
   ============================================================ */

.slide-in-section .custom-menu-v1-row:before {
  content: "";
  background-color: var(--scas-black);
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.custom-menu-v1-row {
  overflow: hidden;
  transform: translateX(100%);
  transition: all 0.3s ease;
  opacity: 1;
}

.custom-menu-v1-row.active-menu-v1 {
  transform: translateX(0%);
  transition: all 0.3s ease;
}

@media (max-width: 980px) {
  .menu-v1-desktop-column {
    height: 100vh;
  }
}


/* ============================================================
   28  UTILITY CLASSES
   ============================================================ */

/* Remove column bottom margin on mobile */
@media (max-width: 980px) {
  .remove-margin-column {
    margin-bottom: 0 !important;
  }
}

/* Circle counter percent symbol */
.circle-counter-percent .percent-sign {
  font-size: var(--text-xl);
}

/* Circle counter stacks on mobile */
@media (max-width: 980px) {
  .circle-counter-row .et_pb_column_1_6 {
    width: 100% !important;
    margin-right: 0 !important;
    margin-bottom: 30px !important;
  }
}

/* Blurb under hero — mobile padding */
@media (max-width: 479px) {
  .blurbs-hero .et_pb_blurb_container {
    padding-left: 6px !important;
  }
}

/* Test overflow class (from original) */
.test {
  overflow-x: hidden;
  overflow-y: hidden;
}


/* ============================================================
   29  RESPONSIVE OVERRIDES
   ============================================================ */

/* Nav item spacing on smaller desktops */
@media (min-width: 981px) and (max-width: 1100px) {
  .header-menu.et_pb_menu--with-logo .et_pb_menu__menu > nav > ul > li {
    padding: 0 20px !important;
  }
}

/* Single service page — mid-range screens */
@media (min-width: 981px) and (max-width: 1400px) {
  .single-service-column-2 {
    padding: 20px !important;
  }

  .single-service-column-2 .et_pb_blurb_description p {
    font-size: var(--text-md) !important;
  }

  .single-service-column-2 .et_pb_blurb_0 .et_pb_main_blurb_image .et_pb_image_wrap {
    width: 50px !important;
  }
}


/* ============================================================
   30  DIVI VISUAL BUILDER (edit-mode only)
   Hides non-primary slider images inside the builder
   so layout stays manageable while editing.
   ============================================================ */

.et-fb .slide-image-2,
.et-fb .slide-image-3,
.et-fb .slide-image-4,
.et-fb .slide-image-5,
.et-fb .slide-image-6 {
  display: none;
}