/* --- logo  --- */
/* Target the logo column */
.header-logo {
  display: flex;
  align-items: center;     /* vertical alignment: top | center | bottom */
  justify-content: flex-end; /* horizontal alignment: flex-start | center | flex-end */
  height: 100%;            /* optional - ensures vertical alignment applies */
}

/* Control the logo size (optional) */
.header-logo img {
  max-width: 280px;
  height: auto;
}

@media (max-width: 768px) {
  .header-logo {
    content: url("https://code4cooking.com/joomla/images/logos/horizontal-logo-est.png");
    justify-content: center;  /* center logo on mobile */
  }
  .header-logo img {
    max-width: 140px;         /* smaller logo size */
  }
}
/* --- // logo  --- */

/* --- button  --- */
.header-button {
  text-align: right; /* align only the button to the right */
  margin-top: 10px;  /* optional spacing */
  margin-bottom: 10px;  /* optional spacing */
}
/* --- // button  --- */

/* --- logo footer --- */
/* Target the logo column */
.footer-logo {
  display: flex;
  align-items: bottom;     /* vertical alignment: top | center | bottom */
  justify-content: flex-start; /* horizontal alignment: flex-start | center | flex-end */
  height: 100%;            /* optional - ensures vertical alignment applies */
}

/* Control the logo size (optional) */
.footer-logo img {
  max-width: auto;
  height: auto;
}

@media (max-width: 744px) {
  .footer-logo {
    content: url("https://code4cooking.com/joomla/images/logos/horizontal-logo-est.png");
    justify-content: center;  /* center logo on mobile */
  }
  .footer-logo img {
    max-width: 140px;         /* smaller logo size */
  }
}
/* --- // logo  --- */



/* --- topbar unified  --- */
  /* Top bar container */
  .batc-topbar {
    background: linear-gradient(90deg, #0f5132, #198754);
    border-bottom: 1px solid rgba(255, 255, 255, 0.25); /* thin bottom border */
    color: #fff;
    font-weight: 600;
  }

  /* Info text */
  .batc-info {
    color: #fff;
    font-size: clamp(.85rem, .8rem + .25vw, 1rem);
    line-height: 1.5;
  }
  .batc-info .info-line {
    margin: 0;
    padding: .15rem 0;
    transition: color .3s ease, transform .2s ease;
  }
  .batc-info .info-line:hover,
  .batc-info .info-line:focus {
    color: #e8f5ee;
    transform: translateY(-1px);
  }

  /* Phone link */
  .batc-topbar .top-link {
    color: #fff;
    text-decoration: none;
    font-weight: 700;
    transition: color .3s ease, transform .2s ease;
    font-size: clamp(1rem, .95rem + .3vw, 1.125rem);
  }
  .batc-topbar .top-link:hover,
  .batc-topbar .top-link:focus {
    color: #e8f5ee;
    text-decoration: underline;
    transform: translateY(-1px);
  }

  /* Shared circle style */
  .batc-topbar .icon,
  .batc-social .social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, .2);
    color: #fff;
    line-height: 1;
    transition: background .3s ease, color .3s ease, transform .2s ease;
    text-decoration: none;
    flex-shrink: 0;
  }
  .batc-topbar .icon svg { width: 1rem; height: 1rem; }

  /* Hover invert effect */
  .top-link:hover .icon,
  .top-link:focus .icon,
  .batc-social .social-icon:hover,
  .batc-social .social-icon:focus {
    background: #e8f5ee;
    color: #0f5132;
    transform: translateY(-1px);
  }

  /* Phone text no wrap */
  .phone-text { white-space: nowrap; }

  /* Social icon font size */
  .batc-social .social-icon i { font-size: 1rem; }

  /* <!-- Center: Info --> font size */
 @media (max-width: 767.98px) {
  .info-line.main-line {
    font-size: 1.4rem;
    font-weight: 600;
  }
}



/* --- // topbar unified  --- */

/* --- topbar & header spacing  --- */
/* 1) Set your sticky header heights (adjust if needed) */
:root{
  --header-offset-sm: 92px;   /* top bar + nav on phones */
  --header-offset-lg: 128px;  /* top bar + nav on desktop */
}

/* 2) Give anchors and the page natural scroll padding so they don't hide under the header */
html { scroll-padding-top: var(--header-offset-sm); }
@media (min-width: 992px){
  html { scroll-padding-top: var(--header-offset-lg); }
}

/* 3) Push the hero's content down from the top edge */
.svc-hero .bg{ padding-top: calc(var(--header-offset-sm) + 1.25rem); }
@media (min-width: 992px){
  .svc-hero .bg{ padding-top: calc(var(--header-offset-lg) + 1.75rem); }
}

/* 4) Optional: add a bit more general breathing room too */
.svc-hero .container{
  padding-left: max(1.25rem, env(safe-area-inset-left));
  padding-right: max(1.25rem, env(safe-area-inset-right));
}
/* --- // topbar & header spacing  --- */

/* front page top box left of elfsight */
.bg-top-box {
background: linear-gradient(90deg, #271f14 0%, #755a40 100%);
}
/* --- // END front page top box left of elfsight --- */

/* Mobile-only sticky header */
@media (max-width: 991.98px) {
  .batc-sticky-header,
  .t4-header {            /* keep .t4-header as a fallback if you can't add a custom class */
    position: sticky;
    top: 0;
    z-index: 1030;        /* above nav/dropdowns */
    background: #fff;     /* ensure solid background over content */
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
  }

  /* Avoid Bootstrap/Navbars trying to be fixed and fighting sticky */
  .t4-mainnav .navbar {
    position: static !important;
  }

  /* Make sure dropdowns appear above everything */
  .t4-mainnav .dropdown-menu {
    z-index: 1040;
  }
}
/* // END Mobile-only sticky header */

/* Optional: if you see overlap with Joomla admin bar while logged in, nudge down */
@media (max-width: 991.98px) {
  body.view-site .batc-sticky-header,
  body.view-site .t4-header {
    top: 32px; /* comment this out if not needed */
  }
}

/* Mainnav button */
/* Change on hover */
.button .btn-success:hover {
  background-color: #145c32; /* darker green or your custom color */
  border-color: #145c32;
  color: #fff;
}
/* // end Mainnav button */

/* Serrvice Area Menu */
.city-link {
  transition: all 0.25s ease-in-out;
  position: relative;
  overflow: hidden;
  z-index: 0;
}

/* Gradient hover */
.city-link::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #0f5132, #198754);
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  z-index: -1;
  border-radius: inherit;
}

.city-link:hover::before,
.city-link:focus::before {
  opacity: 1;
}

.city-link:hover,
.city-link:focus {
  color: #fff !important;
  border-color: #198754;
  transform: translateY(-1px);
}

.city-link:hover i,
.city-link:focus i {
  color: #fff !important;
}
/* // END Serrvice Area Menu */

/* Make the header logo sticky across all devices */
/* // END Make the header logo sticky across all devices */



/* Mobile-only sticky Phone CTA */
.btn-phone-cta{
background: linear-gradient(90deg, #fe8259 0%, #b3522e 100%);
  border: none;
  color: #fff;
  transition: all 0.3s ease;
  margin-top: 1.5rem; /* adds space above */
}

.btn-phone-cta:hover {
background: linear-gradient(90deg, #fe8259 0%, #b3522e 100%);
  transform: translateY(-2px);
}

@media (max-width: 575.98px) {
  .-phone-cta {
    display: block;
    width: 100%;
  }
}

/* // END Mobile-only sticky Phone CTA */


/* Hero section */
/* More generous padding inside the hero */
.svc-hero .bg {
  /* top/bottom breathing room */
  padding-block: clamp(2rem, 6vw, 5rem);
}

/* Stronger left/right padding than Bootstrap's default on small screens */
.svc-hero .container {
  padding-left: max(1.25rem, env(safe-area-inset-left));
  padding-right: max(1.25rem, env(safe-area-inset-right));
}

@media (min-width: 768px){
  .svc-hero .container {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-width: 1200px){
  .svc-hero .container {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}

.city-hero{position:relative; overflow:hidden; border-radius:.75rem}
.city-hero .bg-cover{background-size:cover;background-position:center;background-repeat:no-repeat;min-height:380px}
.badge-strip .icon{font-size:1.25rem; line-height:1; width:2.25rem; height:2.25rem; display:inline-flex; align-items:center; justify-content:center; border-radius:0.35rem;}
.service-card{transition:transform .15s ease, box-shadow .15s ease}
.service-card:hover{transform:translateY(-2px); box-shadow:0 .75rem 1.5rem rgba(0,0,0,.08)}
ul.checks{list-style:none;padding-left:0;margin:0}
ul.checks li{padding-left:1.75rem; position:relative; margin:.35rem 0}
ul.checks li:before{content:"✓"; position:absolute; left:0; top:0; width:1.25rem; height:1.25rem; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-weight:700}
.cta-band{background:linear-gradient(90deg,#0f5132,#198754)}
.text-shadow{text-shadow:0 2px 12px rgba(0,0,0,.4)}
/* -- // Hero section */


/* Dark scrim over the hero image for consistent contrast */
.svc-hero .bg{
  position: relative;
  /* extra breathing room you already added is fine to keep */
}
.svc-hero .bg::before{
  content:"";
  position:absolute; inset:0;
  /* gradient + slight darkening; adjust .45 to taste */
  background: linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.35));
  pointer-events:none;
}

/* A soft panel directly behind the copy for maximum legibility */
.svc-hero .hero-copy{
  position: relative;                 /* above the scrim */
  z-index: 1;
  background: rgba(0,0,0,.35);        /* subtle dark glass */
  backdrop-filter: blur(2px);         /* gentle blur so busy photos don't show through text */
  -webkit-backdrop-filter: blur(2px);
  border-radius: .75rem;
  padding: 1rem 1.25rem;
  box-shadow: 0 .75rem 1.25rem rgba(0,0,0,.18);
}

/* Stronger, cleaner text rendering */
.svc-hero .hero-copy h1{
  color:#fff;
  text-shadow: 0 2px 18px rgba(0,0,0,.45);
  font-weight: 800;
  line-height: 1.05;
  /* responsive size without overflowing small screens */
  font-size: clamp(1.9rem, 2.2rem + 1.5vw, 3.25rem);
  letter-spacing: .2px;
}
.svc-hero .hero-copy .lead{
  color: rgba(255,255,255,.92);
  text-shadow: 0 1px 12px rgba(0,0,0,.35);
  font-size: clamp(1rem, .95rem + .4vw, 1.25rem);
}

/* Buttons: a touch brighter by default, clear hover */
.svc-hero .hero-copy .btn.btn-success{
  box-shadow: 0 .5rem 1rem rgba(16,123,74,.28);
}
.svc-hero .hero-copy .btn.btn-success:hover{
  transform: translateY(-2px);
}
.svc-hero .hero-copy .btn.btn-outline-light{
  border-width:2px;
  color:#fff; border-color:rgba(255,255,255,.9);
}
.svc-hero .hero-copy .btn.btn-outline-light:hover{
  background:#fff; color:#0f5132;
  box-shadow: 0 .5rem 1rem rgba(255,255,255,.25);
}

/* Comfortable edges on phones + safe-area support */
.svc-hero .container{
  position: relative; z-index: 1;
  padding-left: max(1.25rem, env(safe-area-inset-left));
  padding-right: max(1.25rem, env(safe-area-inset-right));
}

/* Space between the hero top and your sticky header (tune if needed) */
:root{
  --header-offset: 110px;             /* change to your exact combined header height */
}
html{ scroll-padding-top: var(--header-offset); }
.svc-hero .bg{ padding-top: calc(var(--header-offset) + 1rem); }

/* Reduce the panel on large screens so it feels lighter */
@media (min-width: 992px){
  .svc-hero .hero-copy{
    background: rgba(0,0,0,.28);
    padding: 1.25rem 1.5rem;
  }
}
/* --- END Hero section --- */


/* TRUST STRIP — larger icons + better spacing */
.badge-strip .icon{
  /* bigger circle */
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 50%;

  /* bigger glyph */
  font-size: 1.9rem;     /* works for emoji, BI, FA text glyphs */
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* optional: add a touch more space between icon and text */
.badge-strip .d-flex.gap-2 { gap: .85rem !important; }

/* scale up a bit more on larger screens */
@media (min-width: 768px){
  .badge-strip .icon{
    width: 3.5rem;
    height: 3.5rem;
    font-size: 2.1rem;
  }
}
@media (min-width: 1200px){
  .badge-strip .icon{
    width: 3.75rem;
    height: 3.75rem;
    font-size: 2.25rem;
  }
}

/* If your icon is an SVG or <i> inside .icon, scale that too */
.badge-strip .icon svg,
.badge-strip .icon i {
  width: 1.9em;
  height: 1.9em;
}

.badge-strip .icon { box-shadow: 0 .35rem .9rem rgba(0,0,0,.06); }

/* Make all TRUST STRIP boxes the same height */
.badge-strip .row { align-items: stretch; }           /* stretch columns */
.badge-strip .col { display: flex; }                  /* allow inner box to fill */
.badge-strip .col > .d-flex {
  flex: 1 1 auto;                                     /* fill the column */
  min-height: 108px;                                  /* set a consistent box height */
}

/* Adjust per breakpoint if you want a bit taller on larger screens */
@media (min-width: 768px){
  .badge-strip .col > .d-flex { min-height: 118px; }
}
@media (min-width: 1200px){
  .badge-strip .col > .d-flex { min-height: 128px; }
}

--fa-primary-color: #198754;  /* main success tone */
--fa-secondary-color: #c5e8d1; /* soft green tint */
/* Fix Duotone Alignment */
.badge-strip .trust-item {
  gap: 0.75rem;
  align-items: center;
}

.badge-strip .trust-icon {
  background-color: #e9f6ec; /* subtle green background */
  color: #198754;
  width: 2.8rem;
  height: 2.8rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 1;
}

.badge-strip .trust-icon i {
  font-size: 1.25rem;
  line-height: 1;
  vertical-align: middle;
  display: inline-block;
  transform: translateY(1px); /* subtle vertical centering fix for FA duotone */
  --fa-primary-color: #198754;
  --fa-secondary-color: #a3d9b1;
}

/* Optional hover effect */
.badge-strip .trust-icon:hover {
  background-color: #198754;
  color: #fff;
  transition: all 0.25s ease;
}

.badge-strip .trust-icon:hover i {
  --fa-primary-color: #fff;
  --fa-secondary-color: #cfead9;
  transform: scale(1.1);
}
/*--- //  TRUST STRIP — larger icons + better spacing */

/* Stack and full-width buttons on small screens */
@media (max-width: 767.98px) {
  .d-flex.gap-2 a.btn,
  .d-flex.gap-2 .btn,
  .cta-section .btn,
  .city-hero .btn {
    display: block !important;
    width: 100% !important;
  }

  .d-flex.gap-2 {
    flex-direction: column !important;
    gap: 0.75rem !important;
  }

  /* Center button text for clean layout */
  .btn {
    text-align: center;
  }
}
/* // END Stack and full-width buttons on small screens */

/* button gradients */
.btn-primary-gradient:hover{
background: linear-gradient(90deg, #fe8259 0%, #b3522e 100%);
}
/* --- // END button gradients */

/* --- this is for white & Orange Buttons [Primary] --- */
/* Ensure primary buttons are primary bg + white text (with hover/active states) */
.btn-primary{
  color:#fff !important;
  border-width:2px;
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}
.btn-primary:hover,
.btn-primary:focus{
  color:#fff !important;
  /* fallback hover if your primary is #0f5132 */
  background-color:#0c3f26 !important;
  border-color:#0c3f26 !important;
}
/* Optional active state */
.btn-primary:active,
.btn-primary.active{
  color:#fff !important;
  background-color:#0a351f !important;
  border-color:#0a351f !important;
}
/* --- // this is for white & Orange Buttons [Primary] --- */

/* --- this is for white & Green Buttons  --- */
.cus-btn {
      border: 2px solid white;
      background-color: #0d4c1d;
      transition: background-color 0.3s ease;
      color: white;
      padding: 14px 28px;
      font-size: 16px;
      cursor: pointer;
    }
     
    .cus-default {
      border-color: #ffffff;
      color: #1d1d1d;
    }
    
    .cus-default:hover {
    background-color: #146b2a; /* lighter green hover */
	  text-decoration: none;
	  color: #1d1d1d;
    }

/* --- // END white & Green Buttons --- */

/* --- CTA Buttons  --- */
.cta-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 12px; /* space between buttons */
}

.cta-buttons a {
  flex: 1; /* allows equal widths if multiple */
  text-align: center;
}

@media (max-width: 576px) {
  .cta-buttons {
    flex-direction: column; /* stack on small screens */
    align-items: stretch;
  }
  .cta-buttons a {
    width: 100%; /* full-width button */
  }
}
/* --- // CTA Buttons  --- */



/* ---  Elf Sight Cards front Page --- */
.bg-custom-green {
  background-color: #0d4c1d !important;
  color: #fff; /* optional: ensures text is readable */
}
/* --- // END Elf Sight Cards front Page --- */

/* --- Below the Elf Sight Cards front Page --- */
.lic-white { color: #ffffff; }
.card-body .cus-btn {
  display: inline-block; /* ensures margin works properly */
  margin-top: 1rem;      /* adjust spacing (1rem ≈ 16px) */
}

/* --- // END Below the Elf Sight Cards front Page --- */


/* --- footer logo  --- */
.footer-logo-img {
  max-width: 200px;  /* adjust as needed */
  height: auto;      /* keeps aspect ratio */
  width: auto;       /* lets it shrink properly */
  display: block;    /* removes inline spacing issues */
}
/* --- // footer logo  --- */


  /* --- about us article  --- */
 .about-hero{position:relative;border-radius:.75rem;overflow:hidden}
  .about-hero .bg{min-height:420px;background-size:cover;background-position:center}
  .fact{border-radius:.75rem}
  .value-card{transition:transform .15s ease, box-shadow .15s ease}
  .value-card:hover{transform:translateY(-2px); box-shadow:0 .75rem 1.5rem rgba(0,0,0,.08)}
  .timeline:before{content:"";position:absolute;left:1rem;top:0;bottom:0;width:2px;background:rgba(0,0,0,.08)}
  .timeline .t-item{position:relative;padding-left:2.5rem}
  .timeline .t-item:before{content:"";position:absolute;left:.9rem;top:.4rem;width:.65rem;height:.65rem;border-radius:50%;background:#198754}

/* Add padding inside CTA sections */
.cta-section, 
#acm-hero-111, 
.acm-hero.style-1 {
  padding-left: 2rem;   /* space on left */
  padding-right: 2rem;  /* space on right */
}

/* Optional: Add vertical breathing room */
.cta-section .hero-content {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

  /* CTA Section Centering */
#acm-hero-111 .hero-content {
  display: flex;
  flex-direction: column;     /* stack heading and button */
  justify-content: center;    /* vertical centering */
  align-items: center;        /* horizontal centering */
  text-align: center;
  min-height: 250px;          /* base height */
  padding: 2rem;              /* space from edges */
}

/* Space between heading and button */
#acm-hero-111 .hero-btn {
  margin-top: 1.5rem;
}

/* Tablet screens and up */
@media (min-width: 768px) {
  #acm-hero-111 .hero-content {
    min-height: 350px;
    padding: 3rem;
  }
}

/* Large desktop screens */
@media (min-width: 1200px) {
  #acm-hero-111 .hero-content {
    min-height: 450px;
    padding: 4rem 6rem;
  }
}

  /*  SERVICE AREAS - Where We Work */
  /* Equal column distribution */
  .service-areas .city-list {
    column-gap: 1.25rem;
    column-count: 1;
  }
  @media (min-width: 576px) { .service-areas .city-list { column-count: 2; } }
  @media (min-width: 768px) { .service-areas .city-list { column-count: 3; } }
  @media (min-width: 992px) { .service-areas .city-list { column-count: 4; } }

  .service-areas .city-list li {
    break-inside: avoid;
    margin-bottom: .25rem;
    white-space: nowrap;
  }

  /* Base link styling */
  .service-areas .city-link {
    display: inline-block;
    color: #212529;
    text-decoration: none;
    transform: translateY(0) scale(1);
    transition: transform 0.25s ease;
  }

  .service-areas .city-list i {
    transition: transform 0.25s ease;
  }

  /* Hover lift + zoom (no color shift or shadow) */
  @media (min-width: 992px) {
    .service-areas .city-link:hover,
    .service-areas .city-link:focus-visible {
      transform: translateY(-3px) scale(1.05);
    }
    .service-areas .city-list li:hover i {
      transform: translateY(-1px);
    }
  }

  @media (max-width: 991.98px),
         (prefers-reduced-motion: reduce) {
    .service-areas .city-link,
    .service-areas .city-list i {
      transition: none;
      transform: none;
    }
  }

  /* Slightly widen right column */
  @media (min-width: 992px) {
    .service-areas .right-wide {
      flex: 0 0 30%;
      max-width: 30%;
    }
  }

  /* Pale green background for CTA box */
  .service-areas .bg-light-green {
    background-color: #e6f4ea; /* soft pale green */
  }

/* // end SERVICE AREAS - Where We Work */

  /* --- // about us article  --- */

/* From Page-wide tweaks */
.get-a-quote-page .trust-pill{
  background:#0d4c1d10;
  border:1px solid #0d4c1d33;
  color:#0d4c1d;
  padding:.4rem .75rem;
  border-radius: 0.35rem;
  font-weight:600;
}

/* Make the form truly edge-to-edge and breathe nicely */
.get-a-quote-page .form-section .form-wrap{
  max-width: 1280px;      /* keep the fields readable on ultrawide */
  margin: 0 auto;         /* center the form block */
  width: 100%;
}

/* Remove container padding inside full-width sections */
.get-a-quote-page .container-fluid.px-0, 
.get-a-quote-page .container-fluid .row.g-0{
  --bs-gutter-x: 0;
  --bs-gutter-y: 0;
}

/* Optional: make inputs comfy if your form uses Bootstrap */
.get-a-quote-page .form-wrap .form-control{
  padding:.9rem 1rem;
  border-radius:.6rem;
}
.get-a-quote-page .form-wrap .btn{
  padding:.8rem 1.25rem;
  border-radius:.6rem;
}
/*-- //  From Page-wide tweaks */



/* Accordian active color change is here */
/* Scope to this one accordion */
#faq .accordion-button:not(.collapsed) {
  background-color: #0d4c1d;  /* open state bg */
  color: #fff;                /* open state text */
  box-shadow: none;
}

/* Optional: closed state text color */
#faq .accordion-button {
  color: #0d4c1d;
}

/* Focus ring to match your green */
#faq .accordion-button:focus {
  border-color: #0d4c1d;
  box-shadow: 0 0 0 .25rem rgba(13, 76, 29, .25);
}

/* Make the chevron white when open */
#faq .accordion-button:not(.collapsed)::after {
  filter: invert(1) brightness(100%);
}

/* Accordian active color change is here */


/* template over-rides */
/* section over-rides */
#main-top-1,
#main-bottom-1 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* template over-rides */



  /* Forms Page*/

/* Footer Nav List for Resouces Module */
.batc-navlist .list-group-item { border: 0; padding: .5rem 0; background: transparent; }
.batc-navlist .nav-link { color: #212529; font-weight: 500; }
.batc-navlist .nav-link:hover { text-decoration: none; color: #fe8259; }
.batc-navlist .nav-link.active,
.batc-navlist .nav-link[aria-current="page"] {
  color: #fe8259;
  position: relative;
}
.batc-navlist .nav-link.active::before,
.batc-navlist .nav-link[aria-current="page"]::before {
  content: "";
  position: absolute;
  left: -12px;
  top: 50%;
  transform: translateY(-50%);
  width: 4px; height: 24px; border-radius: 2px;
  background: linear-gradient(90deg,#0f5132,#198754);
}
/* Footer Nav List for Resouces Module */


/* Align all footnav columns to the bottom */
.footer .row {
  display: flex;
  align-items: flex-end; /* Aligns all columns to the bottom */
}

/* Ensure all columns flex correctly */
.footer .row > [class*="footnav-"] {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

/* Optional: Make sure spacing between columns stays even */
.footer .row > div {
  margin-bottom: 0 !important;
}
.t4-footnav .t4-row {
  display: flex;
  align-items: flex-end;
}
/* // END Align all footnav columns to the bottom */


/* --- Service card hover animation --- */
.service-card { border-radius: .75rem; overflow: hidden; }
.service-card .icon {
  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
  will-change: transform;
}
.service-card:hover .icon,
.service-card:focus-within .icon {
  transform: scale(1.08);
  box-shadow:
    0 10px 24px rgba(0,0,0,.12),
    0 0 0 6px var(--accent-ring, rgba(20,107,42,.22)); /* fallback ring */
}
.service-card .service-panel {
  transition: border-color .25s ease, background-color .25s ease;
}
.service-card:hover .service-panel,
.service-card:focus-within .service-panel {
  border-bottom-color: var(--accent, #146b2a); /* subtle accent tweak */
}

/* Accessibility: reduce motion */
@media (prefers-reduced-motion: reduce) {
  .service-card .icon { transition: none; }
}

/* ===========================
   SECTION: ABOUT US CTA STYLING
   =========================== */
.about-cta-h6 {
  font-size: 1.25rem;
  color: #fe8259; /* primary for subhead */
}


.section-about-cta {
  background: linear-gradient(90deg, #146b2a, #198754);
  color: #fff;
  padding: 4rem 0;
  border-radius: 0.5rem;
}

/* Typography inside this section */
.section-about-cta h2,
.section-about-cta h3,
.section-about-cta p {
  color: #f8f9fa;
  margin-bottom: 0.75rem;
}

/* Heading hierarchy */
.section-about-cta h2 {
  font-size: 2rem;
  font-weight: 700;
}

.section-about-cta h3 {
  font-size: 1.25rem;
  color: #ffe082; /* warm accent for subhead */
}


/* Paragraphs */
.section-about-cta p {
  font-size: 1rem;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.85);
}

/* Buttons within this section */
.section-about-cta .btn {
  font-weight: 600;
  border-radius: 0.375rem;
  padding: 0.75rem 1.25rem;
  transition: all 0.3s ease;
}

.section-about-cta .btn-primary {
  background: #ffe082;
  color: #0f5132;
  border: none;
}

.section-about-cta .btn-primary:hover {
  background: #fff3cd;
  color: #0d3e26;
}

.section-about-cta .btn-outline-light {
  border: 2px solid #f8f9fa;
  color: #f8f9fa;
}

.section-about-cta .btn-outline-light:hover {
  background: #f8f9fa;
  color: #0f5132;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .section-about-cta {
    padding: 3rem 1.5rem;
    text-align: center;
  }

  .section-about-cta h2 {
    font-size: 1.625rem;
  }

  .section-about-cta p {
    font-size: 0.9375rem;
  }
}

 /*  PAGE-SPECIFIC STYLES (scoped) Safety, Training & Standards */
  /* Icon chip used across the page */
  .icon {
    display:inline-flex; align-items:center; justify-content:center;
    width:48px; height:48px; border-radius:50%;
    font-size:24px; line-height:1; background:#e6f4ea; color:#146b2a;
    border:1px solid rgba(20,107,42,.15);
  }
  .icon-lg { width:64px; height:64px; font-size:30px; }
  .icon-xl { width:72px; height:72px; font-size:34px; }

  /* Headline underline (matches your service pages) */
  .heading-underline {
    position:relative; display:inline-block; padding-bottom:.25rem;
  }
  .heading-underline::after {
    content:""; position:absolute; left:0; bottom:0;
    width:48px; height:3px; background:#fe8259; border-radius:2px;
  }

  /* Card accents similar to your service cards */
  .accent-card {
    border:1px solid rgba(20,107,42,.15);
    box-shadow: 0 2px 10px rgba(0,0,0,0.04);
  }
  .accent-soft {
    background:#fdf9f2; border-bottom:2px solid #f7e7cc;
  }

  /* Checklist */
  .checks { padding-left:1.25rem; margin-bottom:0; }
  .checks li { margin: .25rem 0; }
  .checks li::marker { content: "✓ "; color:#198754; font-weight:600; }

  /* CTA gradient (reused pattern) */
  .btn-primary-gradient {
    background: linear-gradient(90deg,#0f5132,#198754);
    border-color: transparent;
  }
  .btn-primary-gradient:hover { filter:brightness(1.05); }

  /* FAQ accordion tweaks */
  .faq-accordion .accordion-button:focus { box-shadow: none; }
  .faq-accordion .accordion-button.collapsed { background:#fff; }
  .faq-accordion .accordion-item { border:1px solid rgba(0,0,0,.06); border-radius:.5rem; overflow:hidden; }

  /* Responsive fine-tuning */
  @media (max-width: 576px) {
    .icon-xl { width:64px; height:64px; font-size:30px; }
  }
 /* // END PAGE-SPECIFIC STYLES (scoped) Safety, Training & Standards */



 /* MODAL FOR CALL-OUT SERIVES SECTION */

