/* Custom layout and overrides for updated home page design */

/* ================================
   Hero Section - Desktop baseline
   ================================ */

/* All hero section overrides commented out to revert to original base CSS */
/*
.home-hero {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

#hero.section.home-hero {
  min-height: 595px;
  display: flex;
  align-items: center;
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

#hero .container {
  max-width: 1280px;
}

#hero .row {
  align-items: center;
}

#hero.home-hero .row > .col-lg-6:first-child {
  flex: 0 0 42%;
  max-width: 42%;
}

#hero.home-hero .row > .col-lg-6:last-child {
  flex: 0 0 58%;
  max-width: 58%;
}

#hero .hero-content {
  max-width: 580px;
}
*/

/* Hero text styling - Reverted to original base CSS styling */
/* 
#hero .hero-content h1 {
  font-size: 40px;
  line-height: 1.2;
  letter-spacing: 0;
  color: #16181B;
  margin-bottom: 24px;
}

#hero .hero-content .accent-text {
  color: #1972fa;
}

#hero .hero-content p {
  font-size: 18px;
  line-height: 28px;
  color: #494B5B;
  margin-bottom: 24px;
}
*/

/* Specific style for Chemical Industry paragraph - use old color */
#hero .hero-content p.mb-0 {
  color: #16181B !important; /* Old color for Chemical Industry text */
}

#hero .hero-content p.mb-0 strong {
  color: #16181B; /* Old color for Chemical Industry text */
}

/* Hero Description - Specific ID - Reverted to original */
/*
#hero-description {
  font-size: 17px;
  line-height: 28px;
  color: #494B5B;
  margin-bottom: 24px;
}

#hero .hero-buttons .btn-primary {
  background: #1972fa;
  border-color: #1972fa;
  border-radius: 999px;
  padding: 14px 32px;
  font-weight: 600;
}

#hero .hero-buttons .btn-primary:hover {
  background: #1454b8;
  border-color: #1454b8;
}
*/

/* Right image block - Reverted to original */
/*
#hero.home-hero .hero-image {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
}

@media (min-width: 992px) {
  #hero.home-hero #hero-main-image {
    width: 1000px !important;
    height: auto !important;
    max-width: 1000px !important;
    object-fit: contain !important;
  }

  #hero.home-hero .hero-image .main-image {
    width: 100%;
    max-width: 750px;
    height: auto;
    object-fit: contain;
  }

  #hero.home-hero #hero-main-image.img-fluid {
    max-width: 1000px !important;
    width: 1000px !important;
  }
}
*/

/* ================================
   Hero Section - Responsive
   ================================ */

/* All responsive hero overrides commented out to revert to original */
/*
@media (max-width: 1199.98px) {
  .home-hero {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  
  #hero.section.home-hero {
    min-height: auto;
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  #hero .container {
    max-width: 100%;
  }

  #hero.home-hero .row > .col-lg-6:first-child {
    flex: 0 0 45%;
    max-width: 45%;
  }

  #hero.home-hero .row > .col-lg-6:last-child {
    flex: 0 0 55%;
    max-width: 55%;
  }

  #hero.home-hero .hero-image .main-image {
    max-width: 600px;
  }
  
  #hero.home-hero #hero-main-image {
    width: 100% !important;
    max-width: 800px !important;
    height: auto !important;
  }
  }
*/

/* All responsive hero overrides commented out */
/*
@media (max-width: 991.98px) {
  .home-hero {
    padding-top: 100px !important;
    padding-bottom: 30px !important;
  }
  
  #hero.section.home-hero {
    padding-top: 100px !important;
    padding-bottom: 30px !important;
  }
  
  #hero .row > .col-lg-6:first-child,
  #hero .row > .col-lg-6:last-child {
    flex: 0 0 100%;
    max-width: 100%;
  }

  #hero .row > .col-lg-6:first-child {
    order: 1;
  }

  #hero .row > .col-lg-6:last-child {
    order: 2;
  }

  #hero .hero-content {
    max-width: 100%;
    text-align: center;
  }

  #hero .row > .col-lg-6:last-child {
    text-align: center;
    padding-left: 0;
    padding-right: 0;
  }

  #hero.home-hero .hero-image {
    justify-content: center;
    align-items: center;
    margin-top: 10px !important;
    margin-bottom: 0 !important;
    width: 100%;
    display: flex;
  }

  #hero.home-hero .hero-image .main-image {
    max-width: 560px !important;
    width: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    display: block;
  }
  
  #hero.home-hero #hero-main-image {
    max-width: 560px !important;
    width: auto !important;
    height: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    display: block !important;
    transform: translateX(-80px) !important;
  }
  }
*/

/* All responsive hero overrides commented out */
/*
@media (max-width: 767.98px) {
  .home-hero {
    padding-top: 100px !important;
    padding-bottom: 25px !important;
  }
  
  #hero.section.home-hero {
    padding-top: 100px !important;
    padding-bottom: 25px !important;
  }

  #hero .row > .col-lg-6:first-child,
  #hero .row > .col-lg-6:last-child {
    flex: 0 0 100%;
    max-width: 100%;
  }

  #hero .row > .col-lg-6:first-child {
    order: 1;
  }

  #hero .row > .col-lg-6:last-child {
    order: 2;
  }

  #hero .hero-content {
    text-align: left;
    max-width: 100%;
  }

  #hero .row > .col-lg-6:last-child {
    text-align: center;
    padding-left: 0;
    padding-right: 0;
  }

  #hero.home-hero .hero-image {
    justify-content: center;
    align-items: center;
    margin-top: 10px !important;
    margin-bottom: 0 !important;
    width: 100%;
    display: flex;
  }

  #hero.home-hero .hero-image .main-image {
    max-width: 500px !important;
    width: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    display: block;
  }
  
  #hero.home-hero #hero-main-image {
    max-width: 500px !important;
    width: auto !important;
    height: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    display: block !important;
    transform: translateX(0px) !important;
  }
  }
*/

/* All responsive hero overrides commented out */
/*
@media (max-width: 575.98px) {
  .home-hero {
    padding-top: 100px !important;
    padding-bottom: 20px !important;
  }
  
  #hero.section.home-hero {
    padding-top: 100px !important;
    padding-bottom: 20px !important;
  }
  
  #hero .row > .col-lg-6:first-child,
  #hero .row > .col-lg-6:last-child {
    flex: 0 0 100%;
    max-width: 100%;
  }

  #hero .row > .col-lg-6:first-child {
    order: 1;
  }

  #hero .row > .col-lg-6:last-child {
    order: 2;
    text-align: center;
    padding-left: 0;
    padding-right: 0;
  }

  #hero.home-hero .hero-image {
    justify-content: center;
    align-items: center;
    margin-top: -40px !important;
    margin-bottom: 0 !important;
    width: 100%;
    display: flex;
  }

  #hero.home-hero .hero-image .main-image {
    max-width: 450px !important;
    width: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    display: block;
  }
  
  #hero.home-hero #hero-main-image {
    max-width: 450px !important;
    width: auto !important;
    height: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    display: block !important;
    transform: translateX(-70px) !important;
  }
}
*/

/* ================================
   Hero Ellipse-8 Background Element
   ================================ */

/* Hero Image Container - Ensure it's relative for absolute positioning */
#hero .hero-image {
  position: relative !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Ellipse-8 Background - Behind Group-1 */
#hero-ellipse-bg,
.hero-ellipse-background {
  position: absolute;
  z-index: 1 !important; /* Behind Group-1 image */
  width: auto;
  height: auto;
  max-width: 100%;
  pointer-events: none; /* Don't interfere with interactions */
  object-fit: contain;
}

/* Group-1 Main Image - In front of Ellipse-8 */
#hero-main-image {
  position: relative;
  z-index: 2 !important; /* In front of Ellipse-8 */
  width: 100%;
  height: auto;
}

/* Desktop - Base positioning */
@media (min-width: 992px) {
  #hero-ellipse-bg,
  .hero-ellipse-background {
    max-width: 950px;
    width: 950px;
    height: auto;
    /* Adjust position relative to Group-1 - moved closer to content */
    top: 50%;
    left: 50%;
    transform: translate(calc(-50% - 40px), -50%); /* Move 40px left (closer to content) */
  }
  
  /* Group-1 - Move closer to content */
  #hero.home-hero #hero-main-image {
    transform: translateX(-40px); /* Move 40px left (closer to content) */
  }
}

/* Tablet - Medium screens */
@media (max-width: 1199.98px) and (min-width: 992px) {
  #hero-ellipse-bg,
  .hero-ellipse-background {
    max-width: 850px;
    width: 850px;
    transform: translate(calc(-50% - 35px), -50%); /* Move 35px left */
  }
  
  #hero.home-hero #hero-main-image {
    transform: translateX(-35px); /* Move 35px left */
  }
}

/* Tablet - Small screens */
@media (max-width: 991.98px) and (min-width: 768px) {
  #hero-ellipse-bg,
  .hero-ellipse-background {
    max-width: 850px; /* Increased from 720px */
    width: 850px; /* Increased from 720px */
    top: 50%;
    left: 50%;
    transform: translate(calc(-50% - 15px), -50%); /* Move 15px left (reduced from 30px) */
  }
  
  #hero.home-hero #hero-main-image {
    transform: translateX(-10px); /* Move 10px left (moved right from -30px) */
  }
}

/* Mobile - Large */
@media (max-width: 767.98px) and (min-width: 576px) {
  #hero-ellipse-bg,
  .hero-ellipse-background {
    max-width: 700px; /* Increased from 600px */
    width: 700px; /* Increased from 600px */
    top: 50%;
    left: 50%;
    transform: translate(calc(-50% - 12px), -50%); /* Move 12px left (reduced from 25px) */
  }
  
  #hero.home-hero #hero-main-image {
    transform: translateX(-8px); /* Move 8px left (moved right from -25px) */
  }
}

/* Mobile - Small */
@media (max-width: 575.98px) {
  #hero-ellipse-bg,
  .hero-ellipse-background {
    max-width: 480px;
    width: 480px;
    top: 50%;
    left: 50%;
    transform: translate(calc(-50% - 10px), -50%); /* Move 10px left (reduced from 20px) */
  }
  
  #hero.home-hero #hero-main-image {
    transform: translateX(-5px); /* Move 5px left (moved right from -20px) */
  }
}

/* Large Desktop - 1440px and above */
@media (min-width: 1440px) {
  #hero-ellipse-bg,
  .hero-ellipse-background {
    max-width: 1050px;
    width: 1050px;
    transform: translate(calc(-50% - 50px), -50%); /* Move 50px left */
  }
  
  /* Adjust Group-1 - combine with existing transform */
  #hero.home-hero #hero-main-image {
    transform: translateX(calc(110px - 50px)) !important; /* Original 110px minus 50px = 60px */
  }
}

/* 4K Resolution - 1920px and above */
@media (min-width: 1920px) {
  #hero-ellipse-bg,
  .hero-ellipse-background {
    max-width: 1200px;
    width: 1200px;
    transform: translate(calc(-50% - 60px), -50%); /* Move 60px left */
  }
  
  /* Adjust Group-1 - combine with existing transform */
  #hero.home-hero #hero-main-image {
    transform: translateX(calc(220px - 60px)) !important; /* Original 220px minus 60px = 160px */
  }
}

/* ================================
   Our Vision is Clear Section
   ================================ */

#about.about.blue-bg {
  background-color: #1C274C; /* Dark blue background */
  padding: 80px 0;
}

#about .container {
  max-width: 1280px; /* Match Figma frame width */
}

/* Text Content Section */
#about .vision-text-content {
  max-width: 1280px;
  margin: 0 auto 60px;
}

#about .vision-heading {
  font-family: "Montserrat", sans-serif;
  font-size: 48px;
  font-weight: 600; /* Reduced from 700 for better visual hierarchy */
  line-height: 1.2;
  color: #FFFFFF !important; /* Match other content in section */
  margin-bottom: 24px;
  letter-spacing: 0;
}

#about .vision-subheading {
  font-family: "Roboto", sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.5;
  color: #FFFFFF;
  margin-bottom: 32px;
  max-width: 100%;
}

#about .vision-subheading strong {
  font-weight: 400; /* Changed from 700 to remove bold */
}

#about .vision-paragraph {
  font-family: "Roboto", sans-serif;
  font-size: 15px; /* Updated to 15px */
  line-height: 19px; /* Updated to 19px */
  color: #FFFFFF;
  text-align: center;
  max-width: 1280px;
  margin: 0 auto;
  letter-spacing: 0;
}

#about .vision-paragraph a {
  color: #FFFFFF;
  text-decoration: underline;
  text-underline-offset: 5px;
}

#about .vision-paragraph a:hover {
  opacity: 0.8;
  text-decoration: none;
}

/* Diagram Section with Overlay */
#about .vision-diagram-wrapper {
  max-width: 1280px;
  margin: 0 auto;
  position: relative;
  min-height: 656.5px; /* Match Figma diagram height */
  display: flex;
  align-items: center;
  justify-content: center;
}

#about .vision-diagram-container {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

#about .vision-background-img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: 100%;
  height: auto;
  z-index: 1;
  object-fit: contain;
}

#about .vision-diagram-img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* Center exactly over Ellipse */
  width: 100%;
  max-width: 100%;
  height: auto;
  z-index: 2;
  object-fit: contain;
}

/* ================================
   Our Vision Section - Responsive
   ================================ */

@media (max-width: 1199.98px) {
  #about.about.blue-bg {
    padding: 60px 0;
  }

  #about .vision-text-content {
    margin-bottom: 50px;
  }

  #about .vision-heading {
    font-size: 42px;
  }

  #about .vision-subheading {
    font-size: 18px;
  }

  #about .vision-diagram-wrapper {
    min-height: 550px;
  }
}

@media (max-width: 991.98px) {
  #about.about.blue-bg {
    padding: 50px 0;
  }

  #about .vision-text-content {
    margin-bottom: 40px;
    padding: 0 20px;
  }

  #about .vision-heading {
    font-size: 36px;
    margin-bottom: 20px;
  }

  #about .vision-subheading {
    font-size: 17px;
    margin-bottom: 24px;
  }

  #about .vision-paragraph {
    font-size: 15px; /* Updated to 15px */
    line-height: 19px; /* Updated to 19px */
    padding: 0 20px;
    text-align: center;
  }

  #about .vision-diagram-wrapper {
    min-height: 450px;
    padding: 0 20px;
  }
}

@media (max-width: 767.98px) {
  #about.about.blue-bg {
    padding: 40px 0;
  }

  #about .vision-text-content {
    margin-bottom: 35px;
    padding: 0 15px;
  }

  #about .vision-heading {
    font-size: 32px;
    margin-bottom: 18px;
  }

  #about .vision-subheading {
    font-size: 16px;
    margin-bottom: 20px;
    line-height: 1.4;
  }

  #about .vision-paragraph {
    font-size: 14px; /* Slightly smaller for tablet */
    line-height: 18px; /* Proportional line height */
    padding: 0 15px;
    text-align: center;
  }

  #about .vision-diagram-wrapper {
    min-height: 380px;
    padding: 0 15px;
  }
}

@media (max-width: 575.98px) {
  #about.about.blue-bg {
    padding: 35px 0;
  }

  #about .vision-text-content {
    margin-bottom: 30px;
    padding: 0 10px;
  }

  #about .vision-heading {
    font-size: 28px;
    margin-bottom: 16px;
  }

  #about .vision-subheading {
    font-size: 15px;
    margin-bottom: 18px;
    line-height: 1.4;
  }

  #about .vision-paragraph {
    font-size: 13px; /* Slightly smaller for mobile */
    line-height: 17px; /* Proportional line height */
    padding: 0 10px;
    text-align: center;
  }

  #about .vision-diagram-wrapper {
    min-height: 320px;
    padding: 0 10px;
  }
}

/* ================================
   Section Divider
   ================================ */

/* Remove vertical padding from sections that have dividers between them */
.what-we-do.section,
.features.section,
.osha-compliance.section,
.osha-features.section,
.osha-accuracy.section,
.osha-audit.section {
  padding-top: 0;
  padding-bottom: 0;
}

.section-divider {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 64px 0; /* total space between sections */
  width: 100%;
  max-width: 1064px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 2; /* Divider above background */
  background-color: transparent; /* Allow Rectangle-9 to show through */
}

/* Hide divider line after statistics/features section (before accuracy section) but keep spacing */
.osha-features.section + .section-divider .divider-line {
  display: none !important;
}

.divider-line {
  width: 100%;
  max-width: 1064px;
  height: 1px;
  background-color: #a0a0a0;
}

/* Specific styling for divider before call-to-action - reduces bottom spacing only */
.section-divider-before-cta {
  margin-bottom: 24px !important;
}

/* ================================
   What We Do Section
   ================================ */

.what-we-do.section {
  background-color: #FFFFFF;
  padding-top: 80px; /* Add top padding since there's no divider before this section */
  padding-bottom: 0;
}

.what-we-do .container {
  max-width: 1440px; /* Match Figma frame width */
}

/* Desktop - Exact dimensions for 1440px and above */
@media (min-width: 1440px) {
  .what-we-do.section {
    width: 1440px;
    max-width: 1440px;
    min-height: 820px;
    height: 820px;
    margin: 0 auto;
    box-sizing: border-box;
  }

  .what-we-do .container {
    width: 1320px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
}

/* Section Header */
.what-we-do-header {
  max-width: 1064px; /* Match Figma content width */
  margin: 0 auto 30px; /* Reduced from 60px */
  text-align: center;
}

.what-we-do-title {
  font-family: "Montserrat", sans-serif;
  font-size: 2rem; /* Match Industry Impact & Market Stats h2 font size (Bootstrap default) */
  font-weight: 700; /* Bold as per Figma */
  line-height: 1.2;
  color: #2d465e; /* Updated color */
  margin-bottom: 24px; /* Adjusted spacing */
  letter-spacing: 0;
  white-space: nowrap; /* Keep on single line */
}

.what-we-do-subtitle {
  font-family: "Roboto", sans-serif;
  font-size: 24px;
  font-weight: 400; /* Regular weight */
  line-height: 1.5;
  color: #16181B; /* Dark grey from Figma */
  margin-bottom: 24px;
  letter-spacing: 0;
}

.what-we-do-description {
  font-family: "Roboto", sans-serif;
  font-size: 19px; /* Updated to 19px */
  font-weight: 400;
  line-height: 28px; /* Adjusted line height for better readability */
  color: #494B5B; /* Updated to #494B5B */
  margin: 0 auto;
  max-width: 1064px; /* Match Figma content width */
  letter-spacing: 0;
  text-align: center;
}

/* Feature Cards */
.what-we-do-cards {
  max-width: 1064px; /* Default width */
  margin: 0 auto;
}

/* Desktop - Exact dimensions for 1440px and above */
@media (min-width: 1440px) {
  .what-we-do-cards {
    max-width: 1281px; /* Overall 3 cards container width */
    width: 1281px;
    height: 500px; /* Overall 3 cards container height */
    margin: 0 auto; /* Center with equal left and right spacing */
    display: flex;
    gap: 24px; /* Space between cards (1281 - 411*3 = 48px total, so 24px gap) */
  }

  /* Override Bootstrap row/col for What We Do cards */
  .what-we-do-cards.row {
    display: flex !important;
    flex-wrap: nowrap !important;
    margin: 0 !important;
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;
  }

  .what-we-do-cards .col-lg-4,
  .what-we-do-cards .col-md-6 {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
  }
}

.what-we-do-card {
  background-color: #FFFFFF;
  border-radius: 12px;
  padding: 32px 32px 20px 32px; /* Reduced bottom padding from 32px to 20px */
  height: 100%;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

/* Desktop - Exact card dimensions for 1440px and above */
@media (min-width: 1440px) {
  .what-we-do-description {
    font-size: 19px !important; /* Ensure 19px at desktop */
    color: #494B5B !important; /* Updated to #494B5B */
  }

  .what-we-do-card {
    width: 411px !important; /* Each card width */
    height: 500px !important; /* Each card height */
    flex: 0 0 411px !important; /* Fixed width, no grow/shrink */
    max-width: 411px !important;
  }

  .what-we-do-card-title {
    font-size: 19px !important; /* Ensure 19px at desktop */
  }

  .what-we-do-card-description {
    font-size: 18px !important; /* Ensure 18px at desktop */
    line-height: 24px !important; /* Ensure 24px line height at desktop */
  }
}

.what-we-do-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.what-we-do-card-image {
  margin-bottom: 12px; /* Reduced from 24px */
  text-align: center;
  flex-shrink: 0;
}

.what-we-do-card-image img {
  max-width: 100%;
  height: auto;
  border-radius: 0; /* Removed border radius */
  display: block;
}

/* Desktop - Exact image dimensions for 1440px and above */
@media (min-width: 1440px) {
  .what-we-do-card-image {
    width: 398px !important; /* Full card width (extends to edges) */
    height: 284px !important; /* Image container height */
    overflow: hidden;
    margin-left: -25px; /* Offset left padding */
    margin-right: -32px; /* Offset right padding */
    margin-top: -19px; /* Offset top padding */
    margin-bottom: 12px; /* Keep bottom margin */
  }

  .what-we-do-card-image img {
    width: 411px !important; /* Full card width */
    height: 284px !important; /* Each image height */
    object-fit: cover; /* Cover the container while maintaining aspect ratio */
    display: block;
  }

  /* Ensure Frame-02 (second card) matches Frame-01 and Frame-03 exactly */
  .what-we-do-cards .col-lg-4:nth-child(2) .what-we-do-card-image,
  .what-we-do-cards .col-md-6:nth-child(2) .what-we-do-card-image {
    width: 411px !important;
    height: 284px !important;
    transform: translateX(-8px) !important; /* Move image a bit to the left */
  }

  .what-we-do-cards .col-lg-4:nth-child(2) .what-we-do-card-image img,
  .what-we-do-cards .col-md-6:nth-child(2) .what-we-do-card-image img {
    width: 411px !important;
    height: 284px !important;
    object-fit: cover !important;
  }
}

.what-we-do-card-title {
  font-family: "Montserrat", sans-serif;
  font-size: 19px; /* Updated to 19px */
  font-weight: 700; /* Bold */
  line-height: 1.3;
  color: #000000; /* Pure black to match Figma */
  margin-bottom: 16px;
  letter-spacing: 0;
  text-align: left; /* Left-aligned in cards */
}

.what-we-do-card-description {
  font-family: "Roboto", sans-serif;
  font-size: 18px; /* Updated to 18px */
  font-weight: 400; /* Regular weight */
  line-height: 24px; /* Updated to 24px */
  color: #494B5B; /* Medium grey for card descriptions */
  margin: 0;
  letter-spacing: 0;
  text-align: left !important; /* Left-aligned in cards - matches Figma image */
  display: block;
}

/* ================================
   What We Do Section - Responsive
   ================================ */

@media (max-width: 1199.98px) {
  .what-we-do.section {
    padding-top: 60px; /* Match about section padding */
    padding-bottom: 0;
  }

  .what-we-do-header {
    margin-bottom: 25px; /* Reduced from 50px */
    padding: 0 20px;
  }

  .what-we-do-title {
    font-size: 36px;
    white-space: normal; /* Allow wrapping on smaller screens */
  }

  .what-we-do-subtitle {
    font-size: 22px;
  }

  .what-we-do-description {
    font-size: 18px; /* Increased from 13px */
    line-height: 24px;
    font-family: "Roboto", sans-serif;
    color: #494B5B; /* Updated to #494B5B */
  }

  .what-we-do-cards {
    padding: 0 20px;
  }

  .what-we-do-card {
    padding: 28px 28px 18px 28px; /* Reduced bottom padding */
  }

  .what-we-do-card-title {
    font-size: 13px;
  }
}

@media (max-width: 991.98px) {
  .what-we-do.section {
    padding-top: 50px; /* Match about section padding */
    padding-bottom: 0;
  }

  .what-we-do-header {
    margin-bottom: 20px; /* Reduced from 40px */
    padding: 0 20px;
  }

  .what-we-do-title {
    font-size: 32px;
    margin-bottom: 18px;
    white-space: normal; /* Allow wrapping on smaller screens */
  }

  .what-we-do-subtitle {
    font-size: 20px;
    margin-bottom: 20px;
  }

  .what-we-do-description {
    font-size: 16px; /* Increased from 13px */
    line-height: 24px;
    font-family: "Roboto", sans-serif;
    color: #494B5B; /* Updated to #494B5B */
  }

  .what-we-do-cards {
    padding: 0 20px;
  }

  .what-we-do-card {
    padding: 24px 24px 16px 24px; /* Reduced bottom padding */
    margin-bottom: 24px;
  }

  .what-we-do-card-image {
    margin-bottom: 10px; /* Reduced from 20px */
  }

  .what-we-do-card-title {
    font-size: 13px;
    margin-bottom: 14px;
  }

  .what-we-do-card-description {
    font-size: 12px; /* Increased from 11px */
    line-height: 17px;
    text-align: left !important; /* Left-aligned - matches Figma */
    display: block;
  }
}

@media (max-width: 767.98px) {
  .section-divider {
    margin: 48px 0;
  }

  /* Reduce spacing for divider before call-to-action on tablet */
  .section-divider-before-cta {
    margin-bottom: 20px !important;
  }

  .what-we-do.section {
    padding-top: 40px; /* Match about section padding */
    padding-bottom: 0;
  }

  .what-we-do-header {
    margin-bottom: 18px; /* Reduced from 35px */
    padding: 0 15px;
  }

  .what-we-do-title {
    font-size: 28px;
    margin-bottom: 16px;
    white-space: normal; /* Allow wrapping on smaller screens */
  }

  .what-we-do-subtitle {
    font-size: 18px;
    margin-bottom: 18px;
    line-height: 1.4;
  }

  .what-we-do-description {
    font-size: 15px; /* Increased from 12px */
    line-height: 22px;
    font-family: "Roboto", sans-serif;
    color: #494B5B; /* Updated to #494B5B */
  }

  .what-we-do-cards {
    padding: 0 15px;
  }

  .what-we-do-card {
    padding: 20px 20px 14px 20px; /* Reduced bottom padding */
    margin-bottom: 20px;
  }

  .what-we-do-card-image {
    margin-bottom: 10px; /* Reduced from 18px */
  }

  .what-we-do-card-title {
    font-size: 13px;
    margin-bottom: 12px;
  }

  .what-we-do-card-description {
    font-size: 12px; /* Increased from 11px */
    line-height: 17px;
    text-align: left !important; /* Left-aligned - matches Figma */
    display: block;
  }
}

@media (max-width: 575.98px) {
  .section-divider {
    margin: 32px 0;
  }

  /* Reduce spacing for divider before call-to-action on mobile */
  .section-divider-before-cta {
    margin-bottom: 16px !important;
  }

  .what-we-do.section {
    padding-top: 35px; /* Match about section padding */
    padding-bottom: 0;
  }

  .what-we-do-header {
    margin-bottom: 15px; /* Reduced from 30px */
    padding: 0 10px;
  }

  .what-we-do-title {
    font-size: 24px;
    margin-bottom: 14px;
    white-space: normal; /* Allow wrapping on smaller screens */
  }

  .what-we-do-subtitle {
    font-size: 16px;
    margin-bottom: 16px;
    line-height: 1.4;
  }

  .what-we-do-description {
    font-size: 12px; /* Reduced proportionally from 14px */
    line-height: 16px;
    color: #494B5B; /* Updated to #494B5B */
  }

  .what-we-do-cards {
    padding: 0 10px;
  }

  .what-we-do-card {
    padding: 18px 18px 12px 18px; /* Reduced bottom padding */
    margin-bottom: 18px;
  }

  .what-we-do-card-image {
    margin-bottom: 10px; /* Reduced from 16px */
  }

  .what-we-do-card-title {
    font-size: 13px;
    margin-bottom: 10px;
  }

  .what-we-do-card-description {
    font-size: 12px; /* Increased from 11px */
    line-height: 17px;
    text-align: left !important; /* Left-aligned - matches Figma */
    display: block;
  }
}

/* ================================
   Simplify OSHA Compliance Section
   ================================ */

.osha-compliance.section {
  background-color: #1C274C; /* Dark blue background */
  padding-top: 0;
  padding-bottom: 0;
}

.osha-compliance .container {
  max-width: 1280px; /* Match Figma frame width */
}

.osha-compliance .row.g-0 {
  padding: 20px 0; /* Match Figma padding */
}

/* Left Content Column */
.osha-content-col {
  display: flex;
  align-items: center;
  padding-right: 44px; /* Half of 88px gap */
}

.osha-content {
  max-width: 100%;
}

.osha-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(90deg, #FFFFFF 0%, #FFFFFF 10%, #D3E8FF 100%); /* Left-to-right: "Automated" area white, rest light blue */
  color: #16181B;
  font-family: "Roboto", sans-serif;
  font-size: 14px;
  font-weight: 400; /* Figma: Regular */
  line-height: 1.45; /* Figma: 145% */
  padding: 8px 16px; /* ~36px tall pill */
  border-radius: 18px; /* 36px height / 2 */
  border: 1px solid rgba(255, 255, 255, 0.6);
  margin-bottom: 24px;
  letter-spacing: 0;
}

.osha-heading {
  font-family: "Montserrat", sans-serif;
  font-size: 39px; /* Updated to match Figma */
  font-weight: 700;
  line-height: 1.2;
  color: #FFFFFF;
  margin-bottom: 24px;
  letter-spacing: 0;
}

.osha-description {
  font-family: "Roboto", sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  color: #FFFFFF;
  margin-bottom: 32px;
  letter-spacing: 0;
}

.osha-btn {
  background-color: #FFFFFF;
  color: #16181B;
  border: 1px solid #FFFFFF;
  border-radius: 8px; /* Match Figma box radius */
  padding: 12px 20px; /* Match Figma button size */
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  font-weight: 400; /* Figma: Regular */
  line-height: 1.45; /* Figma: 145% */
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: all 0.3s ease;
}

.osha-btn:hover {
  background-color: transparent;
  color: #FFFFFF;
  border-color: #FFFFFF;
}

.osha-btn i {
  font-size: 18px;
}

/* Right Image Column */
.osha-image-col {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 44px; /* Half of 88px gap */
}

.osha-image-wrapper {
  width: 100%;
  position: relative;
}

.osha-image {
  width: 100%;
  height: auto;
  max-width: 100%;
}

/* Statistics Section */
.osha-stats {
  margin-top: 60px;
  padding: 60px 0;
  background-color: transparent;
  position: relative;
  overflow: visible; /* Allow background to extend to cover accuracy section */
}

.osha-stats .container {
  max-width: 1280px;
  position: relative;
  z-index: 1; /* Content above background */
}

/* Rectangle-9 background - extends to cover stats, features, and accuracy sections */
.osha-stats::before {
  content: '';
  position: absolute;
  top: -85px; /* Moved slightly up */
  left: 50%; /* Center horizontally */
  transform: translateX(-50%); /* Center the container */
  width: 100%;
  max-width: 1280px; /* Match container max-width */
  height: 1400px; /* Extended height to cover stats + features + accuracy sections */
  background-image: url('../images/global/home/main-page-updation/Rectangle-9.png');
  background-repeat: no-repeat;
  background-size: contain; /* Scale to fit within dimensions without stretching */
  background-position: center top;
  z-index: 0;
  pointer-events: none;
  opacity: 1;
}

.osha-stats .row {
  align-items: center;
}

.osha-stats-row {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
}

.osha-stat-col {
  flex: 0 0 auto;
  max-width: 33.333333%;
}

.osha-stat-item {
  text-align: center;
  padding: 0 40px;
  position: relative;
  z-index: 3; /* Statistics above background */
}

/* Vertical divider lines between statistics */
.osha-stat-divider {
  width: 1px;
  height: 98px;
  background-color: #D5D5D5;
  flex-shrink: 0;
}

.osha-stat-number {
  font-family: "Montserrat", sans-serif;
  font-size: 48px;
  font-weight: 500;
  line-height: 1.2;
  color: #16181B;
  margin-bottom: 12px;
  letter-spacing: 0;
}

.osha-stat-text {
  font-family: "Roboto", sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.5;
  color: #494B5B;
  margin: 0;
  letter-spacing: 0;
}

/* ================================
   Built for OSHA Compliance Features Section
   ================================ */

.osha-features.section {
  background-color: transparent !important; /* Transparent to show Rectangle-9 background */
  padding-top: 0;
  padding-bottom: 0;
  position: relative;
  overflow: visible; /* Allow background to extend */
  margin-top: 0; /* Remove any gap */
  margin-bottom: 0; /* Remove any gap */
  z-index: 1; /* Above background */
}

/* Rectangle-9 background continues - extends from stats section */
.osha-features.section::before {
  display: none; /* Use stats section background that extends down - no separate background */
}

.osha-features .container {
  max-width: 1280px;
  position: relative;
  z-index: 2; /* Content above background */
  padding-left: 15px;
  padding-right: 15px;
}

.osha-features-header {
  max-width: 1064px;
  margin: 0 auto 24px;
  position: relative;
  z-index: 3; /* Above background to be visible */
}

.osha-features-title {
  font-family: "Montserrat", sans-serif;
  font-size: 40px;
  font-weight: 500;
  line-height: 1.2;
  color: #16181B;
  margin-bottom: 0;
  letter-spacing: 0;
  position: relative;
  z-index: 3; /* Above background to be visible */
}

.osha-features-cards {
  max-width: 1280px; /* Match container width */
  width: 100%;
  margin: 0 auto;
  position: relative;
  z-index: 3; /* Above background to be visible */
}

/* Ensure Bootstrap row/col classes work properly */
.osha-features-cards.row {
  margin-left: 0;
  margin-right: 0;
  display: flex; /* Ensure flexbox is enabled */
}

.osha-features-cards .col-lg-4,
.osha-features-cards .col-md-6 {
  padding-left: 12px;
  padding-right: 12px;
  display: flex; /* Make columns flex containers */
}

.osha-feature-card {
  background-color: #FFFFFF; /* Solid white background for readability */
  padding: 24px; /* Reduced padding to fit 199px height */
  border-radius: 12px;
  min-height: 199px; /* Minimum height as per image */
  height: 100%; /* Fill full height of column for equal heights */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  position: relative;
  z-index: 4; /* Cards above background to be visible */
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: 100%; /* Ensure full width */
}

.osha-feature-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.osha-feature-icon {
  margin-bottom: 16px; /* Reduced spacing to fit 199px height */
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
}

.osha-feature-icon svg {
  width: 24px;
  height: 24px;
}

.osha-feature-icon svg path,
.osha-feature-icon svg rect,
.osha-feature-icon svg circle {
  stroke: #000000 !important;
  fill: none;
}

.osha-feature-title {
  font-family: "Montserrat", sans-serif;
  font-size: 21px; /* Increased from 20px */
  font-weight: 700;
  line-height: 1.3;
  color: #000000;
  margin-bottom: 12px; /* Reduced spacing to fit 199px height */
  letter-spacing: 0;
  flex-shrink: 0;
}

.osha-feature-description {
  font-family: "Roboto", sans-serif;
  font-size: 15px; /* Increased from 14px */
  font-weight: 400;
  line-height: 20px;
  color: #494B5B;
  margin: 0;
  letter-spacing: 0;
  flex: 1;
  overflow: visible; /* Allow content to be fully visible */
}

/* ================================
   Optimised for Compliance Accuracy Section
   ================================ */

.osha-accuracy.section {
  background-color: transparent !important; /* Transparent to show Rectangle-10 background */
  padding-top: 0;
  padding-bottom: 0;
  position: relative;
  overflow: visible; /* Allow background to extend */
  margin-top: 0; /* Remove any gap */
  margin-bottom: -700px !important; /* Increased negative margin to reduce gap with audit section */
  z-index: 1; /* Above Rectangle-9 background */
  min-height: 1200px !important; /* Ensure section has enough height for background */
}

/* Rectangle-10 background - extends from accuracy section to audit section */
.osha-accuracy.section::before {
  content: '';
  position: absolute;
  top: 120px; /* Start slightly above the section */
  left: 50%; /* Center horizontally */
  transform: translateX(-50%); /* Center the container */
  width: 100%;
  max-width: 1280px; /* Match container max-width */
  height: 1200px !important; /* Increased height to cover accuracy + audit sections */
  min-height: 1200px !important; /* Ensure minimum height */
  max-height: none !important; /* Remove any max-height constraint */
  background-image: url('../images/global/home/main-page-updation/Rectangle-10.png');
  background-repeat: no-repeat;
  background-size: 100% 1000px !important; /* Force specific height for background */
  background-position: center top;
  z-index: 0;
  pointer-events: none;
  opacity: 1;
}

.osha-accuracy .container {
  max-width: 1280px;
  position: relative;
  z-index: 2; /* Content above background */
  padding-bottom: 0 !important; /* Remove bottom padding to reduce gap */
  top: -50px;
}

.osha-accuracy .row.g-0 {
  align-items: center;
  margin-bottom: 0 !important; /* Remove bottom margin */
}

.osha-accuracy-content-col {
  padding-right: 24px;
}

.osha-accuracy-image-col {
  padding-left: 24px;
}

.osha-accuracy-content {
  max-width: 100%;
}

.osha-accuracy-heading {
  font-family: "Montserrat", sans-serif;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.2;
  color: #16181B;
  margin-bottom: 12px;
  letter-spacing: 0;
}

.osha-accuracy-description {
  font-family: "Roboto", sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
  color: #494B5B;
  margin: 0;
  letter-spacing: 0;
}

.osha-accuracy-image-wrapper {
  width: 100%;
  position: relative;
}

.osha-accuracy-image {
  width: 100%;
  height: auto;
  max-width: 100%;
}

/* ================================
   Audit-Ready by Design Section
   ================================ */

.osha-audit.section {
  background-color: transparent !important; /* Transparent to show Rectangle-10 background */
  padding-top: 0;
  padding-bottom: 0;
  position: relative;
  z-index: 1 !important; /* Above Rectangle-10 background */
  overflow: visible; /* Allow background to show through */
  margin-top: -700px !important; /* Increased negative margin to reduce gap with accuracy section */
}

.osha-audit .container {
  max-width: 1280px;
  position: relative;
  z-index: 2 !important; /* Content above section */
}

.osha-audit .row.g-0 {
  align-items: center;
  position: relative;
  z-index: 3 !important; /* Row above background */
}

.osha-audit-image-col {
  padding-right: 24px;
  position: relative;
  z-index: 4 !important; /* Image column above background */
}

.osha-audit-content-col {
  padding-left: 24px;
  position: relative;
  z-index: 4 !important; /* Content column above background */
}

.osha-audit-content {
  max-width: 100%;
  position: relative;
  z-index: 5 !important; /* Content above background */
}

.osha-audit-heading {
  font-family: "Montserrat", sans-serif;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.2;
  color: #16181B;
  margin-bottom: 12px;
  letter-spacing: 0;
  position: relative;
  z-index: 6 !important; /* Heading above background */
}

.osha-audit-description {
  font-family: "Roboto", sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
  color: #494B5B;
  margin: 0;
  letter-spacing: 0;
  position: relative;
  z-index: 6 !important; /* Description above background */
}

.osha-audit-image-wrapper {
  width: 100%;
  position: relative;
  z-index: 5 !important; /* Image wrapper above background */
}

.osha-audit-image {
  width: 100%;
  height: auto;
  max-width: 100%;
  position: relative;
  z-index: 6 !important; /* Image above background */
}

/* ================================
   OSHA Compliance Section - Responsive
   ================================ */

/* Laptop L (1440px and above) - Reduce bottom to stop before divider */
@media (min-width: 1440px) {
  .osha-stats::before {
    bottom: -1528px !important; /* Reduced to stop before divider */
    background-position: 85% top !important; /* Same as base laptop */
    background-size: 120% auto !important; /* Same as base laptop */
    min-height: 1600px !important; /* Reduced to stop before divider */
  }

  /* Group-1 image adjustments for Laptop L */
  #hero.home-hero #hero-main-image {
    margin-left: auto !important;
    margin-right: auto !important;
    transform: translateX(calc(110px - 50px)) !important; /* Original 110px minus 50px to move closer to content */
  }
}

/* 4K Resolution (1920px and above) - Reduce bottom to stop before divider */
@media (min-width: 1920px) {
  .osha-stats::before {
    bottom: -1528px !important; /* Reduced to stop before divider */
    background-position: 85% top !important; /* Same as base laptop */
    background-size: 120% auto !important; /* Same as base laptop */
    min-height: 1600px !important; /* Reduced to stop before divider */
  }

  /* Group-1 image adjustments for 4K */
  #hero.home-hero #hero-main-image {
    margin-left: auto !important;
    margin-right: auto !important;
    transform: translateX(calc(220px - 60px)) !important; /* Original 220px minus 60px to move closer to content */
  }
}

@media (max-width: 1199.98px) {
  .osha-compliance.section {
    padding-top: 0;
    padding-bottom: 0;
  }

  .osha-compliance .row.g-0 {
    padding: 20px 0;
  }

  .osha-content-col {
    padding-right: 30px;
  }

  .osha-image-col {
    padding-left: 30px;
  }

  .osha-heading {
    font-size: 35px; /* Reduced proportionally from 39px */
  }

  .osha-description {
    font-size: 17px;
    line-height: 26px;
  }

  .osha-tag {
    font-size: 13px;
    padding: 7px 16px;
  }

  .osha-btn {
    padding: 12px 28px;
    font-size: 15px;
  }

  .osha-stats {
    margin-top: 50px;
    padding: 50px 0;
  }

  .osha-stats-row {
    flex-wrap: nowrap;
  }

  .osha-stat-col {
    max-width: 33.333333%;
  }

  .osha-stat-item {
    padding: 0 35px;
  }

  .osha-stat-divider {
    height: 90px;
    display: block;
  }

  .osha-stat-number {
    font-size: 42px;
    font-weight: 500;
  }

  .osha-stat-text {
    font-size: 17px;
  }

  /* New Sections Responsive */
  .osha-features.section {
    padding-top: 0;
    padding-bottom: 0;
  }

  .osha-features .container {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }

  .osha-features-cards {
    max-width: 100%;
    width: 100%;
    padding: 0;
  }

  .osha-features-cards .col-lg-4,
  .osha-features-cards .col-md-6 {
    padding-left: 10px;
    padding-right: 10px;
  }

  .osha-features-header {
    margin-bottom: 20px;
    padding: 0;
  }

  .osha-features-title {
    font-size: 36px;
    font-weight: 500;
  }

  .osha-feature-icon svg {
    width: 24px;
    height: 24px;
  }

  .osha-feature-title {
    font-size: 19px; /* Increased from 18px */
  }

  .osha-feature-description {
    font-size: 14px; /* Increased from 13px */
    line-height: 18px;
  }

  .osha-accuracy.section,
  .osha-audit.section {
    padding-top: 0;
    padding-bottom: 0;
  }

  .osha-accuracy-content-col {
    padding-right: 20px;
  }

  .osha-accuracy-image-col {
    padding-left: 20px;
  }

  /* Ensure Rectangle-9 background scales properly on all devices */
  .osha-stats::before,
  .osha-features.section::before,
  .osha-accuracy.section::before {
    background-size: 120% auto !important; /* Bigger size for larger tablets */
    background-position: 85% top !important; /* Moved to the right */
    z-index: -1 !important;
  }

  .osha-audit-image-col {
    padding-right: 20px;
  }

  .osha-audit-content-col {
    padding-left: 20px;
  }

  .osha-accuracy-heading,
  .osha-audit-heading {
    font-size: 36px;
    margin-bottom: 10px;
  }

  .osha-accuracy-description,
  .osha-audit-description {
    font-size: 17px;
    line-height: 22px;
  }

  /* Ensure Rectangle-9 background scales properly on all devices */
  .osha-stats::before,
  .osha-features.section::before,
  .osha-accuracy.section::before {
    background-size: 120% auto !important; /* Bigger size for larger tablets */
    background-position: 85% top !important; /* Moved to the right */
  }
}

/* Rectangle-9 background adjustments for Tablet */
@media (max-width: 991.98px) {
  .osha-stats::before {
    background-size: 110% auto !important; /* Slightly smaller for tablet */
    background-position: 80% top !important; /* Adjusted position for tablet */
  }

  .osha-compliance.section {
    padding-top: 0;
    padding-bottom: 0;
  }

  .osha-compliance .row.g-0 {
    padding: 20px;
  }

  .osha-content-col {
    padding-right: 20px;
    padding-left: 0;
  }

  .osha-image-col {
    padding-left: 20px;
    padding-right: 0;
  }

  .osha-content-col {
    margin-bottom: 40px;
  }

  .osha-heading {
    font-size: 32px; /* Reduced proportionally from 39px */
    margin-bottom: 20px;
  }

  .osha-description {
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 28px;
  }

  .osha-tag {
    font-size: 13px;
    padding: 7px 14px;
    margin-bottom: 20px;
  }

  .osha-btn {
    padding: 12px 28px;
    font-size: 15px;
  }

  .osha-stats {
    margin-top: 50px;
    padding: 50px 0;
  }

  .osha-stats-row {
    flex-wrap: nowrap;
  }

  .osha-stat-col {
    max-width: 33.333333%;
  }

  .osha-stat-item {
    padding: 0 30px;
  }

  .osha-stat-divider {
    display: none; /* Hide dividers on tablet when columns may stack */
  }

  .osha-stat-number {
    font-size: 42px;
    font-weight: 500;
  }

  .osha-stat-text {
    font-size: 17px;
  }

  /* New Sections Responsive */
  .osha-features.section {
    padding-top: 0;
    padding-bottom: 0;
  }

  .osha-features .container {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }

  .osha-features-cards {
    max-width: 100%;
    width: 100%;
    padding: 0;
  }

  .osha-features-cards .col-lg-4,
  .osha-features-cards .col-md-6 {
    padding-left: 8px;
    padding-right: 8px;
  }

  .osha-features-header {
    margin-bottom: 18px;
    padding: 0;
  }

  .osha-features-title {
    font-size: 32px;
    font-weight: 500;
  }

  .osha-feature-icon svg {
    width: 24px;
    height: 24px;
  }

  .osha-feature-title {
    font-size: 19px; /* Increased from 18px */
  }

  .osha-feature-description {
    font-size: 14px; /* Increased from 13px */
    line-height: 18px;
  }

  /* Reduce Bootstrap gap for mobile L (tablet) */
  .osha-features-cards.row {
    --bs-gutter-y: 0.5rem; /* Further reduced from 1rem */
  }

  .osha-accuracy.section,
  .osha-audit.section {
    padding-top: 0;
    padding-bottom: 0;
  }

  /* Add space between sections for Tablet */
  .osha-accuracy.section {
    margin-bottom: -400px !important; /* Less negative to add space (was -700px) */
  }

  .osha-audit.section {
    margin-top: -400px !important; /* Less negative to add space (was -700px) */
  }

  .osha-accuracy-content-col,
  .osha-accuracy-image-col,
  .osha-audit-image-col,
  .osha-audit-content-col {
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 20px;
  }

  /* Ensure row uses flexbox for ordering */
  .osha-audit .row.g-0 {
    display: flex;
    flex-direction: column;
  }

  /* Reorder Audit section: content first, then image for Tablet */
  .osha-audit-image-col {
    order: 2 !important; /* Image comes second */
  }

  .osha-audit-content-col {
    order: 1 !important; /* Content comes first */
  }

  .osha-accuracy-heading,
  .osha-audit-heading {
    font-size: 32px;
    margin-bottom: 10px;
  }

  .osha-accuracy-description,
  .osha-audit-description {
    font-size: 16px;
    line-height: 22px;
  }

  /* Make images bigger and centered for Tablet */
  .osha-accuracy-image-wrapper,
  .osha-audit-image-wrapper {
    text-align: center;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 10px;
  }

  .osha-accuracy-image,
  .osha-audit-image {
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
    display: block !important;
    object-fit: contain;
  }
}

@media (max-width: 767.98px) {
  /* Rectangle-9 background adjustments for Mobile */
  .osha-stats::before {
    background-size: 105% auto !important; /* Adjusted for mobile */
    background-position: 75% top !important; /* Adjusted position for mobile */
  }

  .osha-compliance.section {
    padding-top: 0;
    padding-bottom: 0;
  }

  .osha-compliance .row.g-0 {
    padding: 15px;
  }

  .osha-content-col {
    padding-right: 15px;
    padding-left: 0;
  }

  .osha-image-col {
    padding-left: 15px;
    padding-right: 0;
  }

  .osha-content-col {
    margin-bottom: 35px;
  }

  .osha-heading {
    font-size: 28px; /* Reduced proportionally from 39px */
    margin-bottom: 18px;
  }

  .osha-description {
    font-size: 15px;
    line-height: 22px;
    margin-bottom: 24px;
  }

  .osha-tag {
    font-size: 12px;
    padding: 7px 12px;
    margin-bottom: 18px;
  }

  .osha-btn {
    padding: 10px 24px;
    font-size: 14px;
  }

  .osha-stats {
    margin-top: 40px;
    padding: 40px 0;
  }

  .osha-stats-row {
    flex-wrap: nowrap;
  }

  .osha-stat-col {
    max-width: 33.333333%;
  }

  .osha-stat-item {
    padding: 0 15px;
    margin-bottom: 0;
  }

  .osha-stat-divider {
    display: none; /* Hide dividers on mobile */
  }

  .osha-stat-number {
    font-size: 36px;
    font-weight: 500;
    margin-bottom: 10px;
  }

  .osha-stat-text {
    font-size: 16px;
  }

  /* New Sections Responsive */
  .osha-features.section {
    padding-top: 0;
    padding-bottom: 0;
  }

  .osha-features .container {
    max-width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }

  .osha-features-cards {
    max-width: 100%;
    width: 100%;
    padding: 0;
  }

  .osha-features-cards .col-lg-4,
  .osha-features-cards .col-md-6 {
    padding-left: 8px;
    padding-right: 8px;
  }

  .osha-features-header {
    margin-bottom: 16px;
    padding: 0;
  }

  .osha-features-title {
    font-size: 28px;
    font-weight: 500;
    margin-bottom: 0;
  }

  .osha-feature-card {
    padding: 24px;
    margin-bottom: 8px; /* Further reduced from 12px */
  }

  /* Reduce Bootstrap gap for mobile M */
  .osha-features-cards.row {
    --bs-gutter-y: 0.5rem; /* Further reduced from 0.75rem */
  }

  .osha-feature-icon svg {
    width: 24px;
    height: 24px;
  }

  .osha-feature-title {
    font-size: 19px; /* Increased from 18px */
  }

  .osha-feature-description {
    font-size: 14px; /* Increased from 13px */
    line-height: 18px;
  }

  .osha-accuracy.section,
  .osha-audit.section {
    padding-top: 0;
    padding-bottom: 0;
  }

  /* Slightly add space between sections for Mobile L */
  .osha-accuracy.section {
    margin-bottom: -750px !important; /* Less negative to add slight space (was -800px) */
  }

  .osha-audit.section {
    margin-top: -750px !important; /* Less negative to add slight space (was -800px) */
  }

  .osha-accuracy-content-col,
  .osha-accuracy-image-col,
  .osha-audit-image-col,
  .osha-audit-content-col {
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 18px;
  }

  /* Ensure row uses flexbox for ordering */
  .osha-audit .row.g-0 {
    display: flex;
    flex-direction: column;
  }

  /* Reorder Audit section: content first, then image for Mobile */
  .osha-audit-image-col {
    order: 2 !important; /* Image comes second */
  }

  .osha-audit-content-col {
    order: 1 !important; /* Content comes first */
  }

  .osha-accuracy-heading,
  .osha-audit-heading {
    font-size: 28px;
    margin-bottom: 10px;
  }

  .osha-accuracy-description,
  .osha-audit-description {
    font-size: 15px;
    line-height: 20px;
  }

  /* Make images bigger and centered for Mobile */
  .osha-accuracy-image-wrapper,
  .osha-audit-image-wrapper {
    text-align: center;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 10px;
  }

  .osha-accuracy-image,
  .osha-audit-image {
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
    display: block !important;
    object-fit: contain;
  }
}

@media (max-width: 575.98px) {
  .osha-compliance.section {
    padding-top: 0;
    padding-bottom: 0;
  }

  .osha-compliance .row.g-0 {
    padding: 10px;
  }

  .osha-content-col {
    padding-right: 10px;
    padding-left: 0;
  }

  .osha-image-col {
    padding-left: 10px;
    padding-right: 0;
  }

  .osha-content-col {
    margin-bottom: 30px;
  }

  .osha-heading {
    font-size: 24px; /* Reduced proportionally from 39px */
    margin-bottom: 16px;
  }

  .osha-description {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 20px;
  }

  .osha-tag {
    font-size: 11px;
    padding: 6px 10px;
    margin-bottom: 16px;
  }

  .osha-btn {
    padding: 10px 20px;
    font-size: 13px;
    width: 100%;
    justify-content: center;
  }

  .osha-stats {
    margin-top: 35px;
    padding: 35px 0;
  }

  .osha-stats-row {
    flex-wrap: nowrap; /* Keep in single line even on small mobile */
  }

  .osha-stat-col {
    max-width: 33.333333%;
  }

  .osha-stat-item {
    padding: 0 10px;
    margin-bottom: 0;
  }

  .osha-stat-divider {
    display: none; /* Hide dividers on small mobile when columns stack */
  }

  .osha-stat-number {
    font-size: 32px;
    font-weight: 500;
    margin-bottom: 10px;
  }

  .osha-stat-text {
    font-size: 15px;
  }

  /* New Sections Responsive */
  .osha-features.section {
    padding-top: 0;
    padding-bottom: 0;
  }

  .osha-features .container {
    max-width: 100%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .osha-features-cards {
    max-width: 100%;
    width: 100%;
    padding: 0;
  }

  .osha-features-cards .col-lg-4,
  .osha-features-cards .col-md-6 {
    padding-left: 6px;
    padding-right: 6px;
  }

  .osha-features-header {
    margin-bottom: 14px;
    padding: 0;
  }

  .osha-features-title {
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 0;
  }

  .osha-feature-card {
    padding: 20px;
    margin-bottom: 8px; /* Further reduced from 12px */
  }

  /* Reduce Bootstrap gap for mobile S */
  .osha-features-cards.row {
    --bs-gutter-y: 0.5rem; /* Further reduced from 0.75rem */
  }

  .osha-feature-icon {
    margin-bottom: 16px;
  }

  .osha-feature-icon svg {
    width: 24px;
    height: 24px;
  }

  .osha-feature-title {
    font-size: 17px; /* Increased from 16px */
    margin-bottom: 12px;
  }

  .osha-feature-description {
    font-size: 13px; /* Increased from 12px */
    line-height: 16px;
  }

  .osha-accuracy.section,
  .osha-audit.section {
    padding-top: 0;
    padding-bottom: 0;
  }

  /* Slightly add space between sections for Mobile S */
  .osha-accuracy.section {
    margin-bottom: -750px !important; /* Less negative to add slight space (was -850px) */
  }

  .osha-audit.section {
    margin-top: -750px !important; /* Less negative to add slight space (was -850px) */
  }

  .osha-accuracy-content-col,
  .osha-accuracy-image-col,
  .osha-audit-image-col,
  .osha-audit-content-col {
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 16px;
  }

  /* Ensure row uses flexbox for ordering */
  .osha-audit .row.g-0 {
    display: flex;
    flex-direction: column;
  }

  /* Reorder Audit section: content first, then image for Mobile S */
  .osha-audit-image-col {
    order: 2 !important; /* Image comes second */
  }

  .osha-audit-content-col {
    order: 1 !important; /* Content comes first */
  }

  .osha-accuracy-heading,
  .osha-audit-heading {
    font-size: 24px;
    margin-bottom: 10px;
  }

  .osha-accuracy-description,
  .osha-audit-description {
    font-size: 14px;
    line-height: 18px;
  }

  /* Make images bigger and centered for Mobile S */
  .osha-accuracy-image-wrapper,
  .osha-audit-image-wrapper {
    text-align: center;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 10px;
  }

  .osha-accuracy-image,
  .osha-audit-image {
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
    display: block !important;
    object-fit: contain;
  }

  /* Ensure Rectangle-9 background scales properly on all devices */
  .osha-stats::before,
  .osha-features.section::before,
  .osha-accuracy.section::before {
    background-size: 120% auto !important; /* Bigger size for larger tablets */
    background-position: 65% top !important; /* Moved to the right */
  }
}

/* ================================
   Footer Email Responsive Fix
   ================================ */

/* Tablet - Fix email wrapping */
@media (max-width: 991.98px) and (min-width: 576px) {
  .footer .footer-contact p a {
    flex-wrap: wrap !important;
  }

  .footer .footer-contact p a span {
    overflow-wrap: break-word;
    word-break: break-word;
    min-width: 0;
    flex: 1 1 auto;
    max-width: 100%;
  }
}

/* Mobile S (320px to 575px) - Specific adjustments */
@media (max-width: 575.98px) and (min-width: 320px) {
  .footer .footer-contact p a {
    flex-wrap: wrap !important;
    align-items: flex-start !important;
  }

  .footer .footer-contact p a i {
    flex-shrink: 0;
    margin-top: 2px;
  }

  .footer .footer-contact p a span {
    overflow-wrap: break-word;
    word-break: break-word;
    font-size: 14px;
    line-height: 1.4;
    min-width: 0;
    flex: 1 1 auto;
    max-width: calc(100% - 40px);
    display: inline-block;
  }
}

/* ================================
   Industry Impact & Market Stats - Mobile S to Tablet
   Alternating white-blue pattern
   ================================ */

/* Mobile S to Tablet: 320px to 991px */
@media (min-width: 320px) and (max-width: 991.98px) {
  .home-state-items .col:nth-child(1) .feature-box {
    background-color: #FFFFFF !important;
    background: #FFFFFF !important;
  }
  .home-state-items .col:nth-child(1) .feature-box * {
    color: inherit !important;
  }
  
  .home-state-items .col:nth-child(2) .feature-box {
    background: var(--dark-gradient) !important;
  }
  .home-state-items .col:nth-child(2) .feature-box * {
    color: var(--background-color) !important;
  }
  
  .home-state-items .col:nth-child(3) .feature-box {
    background-color: #FFFFFF !important;
    background: #FFFFFF !important;
  }
  .home-state-items .col:nth-child(3) .feature-box * {
    color: inherit !important;
  }
  
  .home-state-items .col:nth-child(4) .feature-box {
    background: var(--dark-gradient) !important;
  }
  .home-state-items .col:nth-child(4) .feature-box * {
    color: var(--background-color) !important;
  }
  
  .home-state-items .col:nth-child(5) .feature-box {
    background-color: #FFFFFF !important;
    background: #FFFFFF !important;
  }
  .home-state-items .col:nth-child(5) .feature-box * {
    color: inherit !important;
  }
  
  .home-state-items .col:nth-child(6) .feature-box {
    background: var(--dark-gradient) !important;
  }
  .home-state-items .col:nth-child(6) .feature-box * {
    color: var(--background-color) !important;
  }
  
  .home-state-items .col:nth-child(7) .feature-box {
    background-color: #FFFFFF !important;
    background: #FFFFFF !important;
  }
  .home-state-items .col:nth-child(7) .feature-box * {
    color: inherit !important;
  }
  
  .home-state-items .col:nth-child(8) .feature-box {
    background: var(--dark-gradient) !important;
  }
  .home-state-items .col:nth-child(8) .feature-box * {
    color: var(--background-color) !important;
  }
}