/* ==========================================================================
   PANALO Pipes & Structurals Pty Ltd - Mobile Responsive Stylesheet
   ========================================================================== */

/* 1. Universal Box-Sizing & Horizontal Overflow Prevention */
html, body {
  max-width: 100% !important;
  overflow-x: hidden !important;
}

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

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

/* 2. Overwrite Hardcoded Desktop Widths Across All Viewports */
#ilft, #ibfo4, #i2x6h, #inyky, #ix4uk, #i0jzpj, #irt3rg, #ir7zxw, 
#ismpwl, #ie8tgs, #imi72q, #project-description, #project-gallery, 
#project-images, #ipidl, #iedswl, #iwdi, #izvk, #contact-body,
#iwulbo, #isinjc, #testimonial-carousel, .carousel-item,
.bs-stepper, #map, #footer-boxes {
  max-width: 100% !important;
}

/* Universal Link Normalization & Underline Removal */
a, 
a:hover, 
a:focus, 
a:active,
.footer-links a,
.footer-links a:hover,
.footer-links a:focus,
.iq2h3p,
.view-project {
  text-decoration: none !important;
}

/* Navigation Link Colors & Active States */
#imbpa a,
#incysp,
#isrqyx,
#iazkeo,
#i3onuu,
#iamfku {
  color: #ffffff !important;
  text-decoration: none !important;
}

#imbpa a:hover,
#incysp:hover,
#isrqyx:hover,
#iazkeo:hover,
#i3onuu:hover,
#iamfku:hover {
  color: #f1a81e !important;
  text-decoration: none !important;
}

/* Footer Social Links Alignment (Global) */
#i01aq4 {
  width: auto !important;
  max-width: 160px !important;
  margin: 20px auto !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 20px !important;
  padding: 0 !important;
}

#i01aq4 a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  padding: 0 !important;
  margin: 0 !important;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

#i01aq4 a:hover {
  opacity: 0.8;
  transform: translateY(-2px);
}

#i01aq4 img,
#iocv9v,
#i1ca17,
#iyjvuk {
  display: block !important;
  height: 22px !important;
  width: auto !important;
  max-width: 26px !important;
  margin: 0 !important;
  object-fit: contain !important;
}

/* 3. Desktop Viewports (>= 992px) */
@media (min-width: 992px) {
  .panalo-nav-toggle {
    display: none !important;
  }
  #ilft {
    max-width: 1200px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
  }
  #il7d {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }
  #i81vv {
    margin: 0 !important;
    flex-shrink: 0 !important;
  }
  #ivg28 {
    display: flex !important;
    justify-content: flex-end !important;
    float: none !important;
  }
  #imbpa {
    display: flex !important;
    flex-direction: row-reverse !important;
    align-items: center !important;
    float: none !important;
    flex-wrap: nowrap !important;
  }
  #imbpa > div {
    width: auto !important;
    padding: 8px 14px !important;
    float: none !important;
  }
  #ia1bvo {
    display: none !important;
  }
  #inyky {
    max-width: 1200px !important;
    margin: 56px auto auto auto !important;
  }
  #isch9 {
    width: 594px !important;
    max-width: 100% !important;
    height: 505px !important;
    box-sizing: border-box !important;
  }
  #ip4dg {
    margin: 376px 0 0 42px !important;
  }
  #testimonial-carousel .carousel-item,
  #testimonial-carousel .testimonial-carousel-item {
    display: flex !important;
    justify-content: center !important;
  }
}

/* 4. Mobile & Tablet Viewports (<= 991px) */
@media (max-width: 991px) {
  #ilft {
    width: 100% !important;
  }

  /* --- Top Bar & Social Links --- */
  #iedswl {
    padding: 8px 15px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: #141414 !important;
  }

  #iopzjr {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    float: none !important;
  }

  #i2pipg {
    margin: 0 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 16px !important;
    float: none !important;
    width: auto !important;
    max-width: none !important;
  }

  #i3jhuk, #i9urtp, #ijevy4 {
    min-height: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-basis: auto !important;
    flex-grow: 0 !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  #i3jhuk a, #i9urtp a, #ijevy4 a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  #i7lrk4, #iufbp2, #izmfd8 {
    padding: 0 !important;
    height: 18px !important;
    width: auto !important;
    max-width: 22px !important;
    display: block !important;
    object-fit: contain !important;
    margin: 0 !important;
  }

  #idmz2s {
    padding: 7px 14px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    margin: 0 !important;
    float: none !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    background-image: linear-gradient(#f1a81e 0%, #f1a81e 100%) !important;
    color: #ffffff !important;
    white-space: nowrap !important;
  }

  /* --- Header Navigation Bar & Hamburger Menu --- */
  #ipidl {
    padding: 12px 16px !important;
    margin: 0 !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    position: relative !important;
    background: #1c1c1c !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  #i81vv {
    flex: 0 0 auto !important;
    max-width: 150px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #ijlzp {
    max-height: 42px !important;
    width: auto !important;
    max-width: 100% !important;
    display: block !important;
  }

  /* Hamburger Toggle Button */
  .panalo-nav-toggle {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    width: 42px !important;
    height: 38px !important;
    background: rgba(241, 168, 30, 0.1) !important;
    border: 1px solid #f1a81e !important;
    border-radius: 6px !important;
    padding: 9px 8px !important;
    cursor: pointer !important;
    z-index: 10005 !important;
    outline: none !important;
  }

  .panalo-nav-toggle span {
    display: block !important;
    width: 100% !important;
    height: 2px !important;
    background-color: #f1a81e !important;
    border-radius: 2px !important;
    transition: all 0.25s ease-in-out !important;
  }

  body.nav-open .panalo-nav-toggle span:nth-child(1) {
    transform: translateY(8px) rotate(45deg) !important;
  }

  body.nav-open .panalo-nav-toggle span:nth-child(2) {
    opacity: 0 !important;
  }

  body.nav-open .panalo-nav-toggle span:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg) !important;
  }

  /* Mobile Dropdown Menu Container */
  #ivg28 {
    display: none !important;
  }

  body.nav-open #ivg28 {
    display: block !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    background: #181818 !important;
    border-bottom: 3px solid #f1a81e !important;
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.85) !important;
    padding: 8px 0 14px 0 !important;
    z-index: 10000 !important;
  }

  #imbpa {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Order links cleanly on mobile: HOME, ABOUT US, SERVICES, PROJECTS, CONTACT/INQUIRY */
  #i6uwn { order: 1 !important; }
  #i94qc { order: 2 !important; }
  #ia0ei { order: 3 !important; }
  #i5y13 { order: 4 !important; }
  #iy6j4 { order: 5 !important; }
  #ia1bvo { display: none !important; }

  #i6uwn, #i94qc, #ia0ei, #i5y13, #iy6j4 {
    float: none !important;
    width: 100% !important;
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
  }

  #i6uwn a, #i94qc a, #ia0ei a, #i5y13 a, #iy6j4 a,
  #imbpa a, #imbpa div a, #ivg28 a {
    display: block !important;
    float: none !important;
    width: 100% !important;
    text-align: left !important;
    padding: 13px 24px !important;
    color: #ffffff !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
    transition: all 0.2s ease !important;
    box-sizing: border-box !important;
  }

  #i6uwn a:hover, #i94qc a:hover, #ia0ei a:hover, #i5y13 a:hover, #iy6j4 a:hover,
  #imbpa a:hover, #imbpa div a:hover, #ivg28 a:hover {
    background: rgba(241, 168, 30, 0.12) !important;
    color: #f1a81e !important;
    padding-left: 28px !important;
  }

  /* --- Hero Banner Section --- */
  #ijk1 {
    height: auto !important;
    min-height: auto !important;
    padding: 0 0 50px 0 !important;
    background-position: center top !important;
  }

  #inyky {
    margin: 25px auto 0 auto !important;
    padding: 0 15px !important;
    display: block !important;
  }

  #ircjh {
    height: auto !important;
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    border: 3px solid #f1a81e !important;
    background: rgba(15, 15, 15, 0.75) !important;
    backdrop-filter: blur(5px) !important;
    -webkit-backdrop-filter: blur(5px) !important;
    border-radius: 8px !important;
    padding: 26px 18px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  #isch9 {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 10px 0 0 0 !important;
    padding: 0 !important;
    border: none !important;
    position: static !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    background: transparent !important;
    backdrop-filter: none !important;
  }

  #i9ml9 {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 14px 0 !important;
    padding: 0 !important;
    font-size: 28px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
    text-align: center !important;
    color: #ffffff !important;
  }

  #iehgc {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    text-align: center !important;
    color: #eaeaea !important;
  }

  #ikv5d {
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
  }

  #id4g7 {
    min-height: auto !important;
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
  }

  #ip4dg {
    position: static !important;
    margin: 0 auto !important;
    width: auto !important;
    min-width: 210px !important;
    padding: 12px 26px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
  }

  /* Subpage Hero Titles (e.g. Services, About Us, Projects) */
  #i48k0j {
    font-size: 32px !important;
    line-height: 1.25 !important;
    padding: 15px 10px !important;
    text-align: center !important;
  }

  #ivq3nq {
    margin: 25px auto 0 auto !important;
    width: 100% !important;
  }

  /* --- Highlighted Services Section (Home) --- */
  #i4iky {
    height: auto !important;
    margin: 0 0 40px 0 !important;
    padding: 40px 15px 40px 15px !important;
  }

  #ibfo4 {
    width: 100% !important;
    margin: 0 auto 25px auto !important;
    display: flex !important;
    flex-direction: column !important;
    text-align: center !important;
  }

  #iuzpn {
    font-size: 26px !important;
    line-height: 1.3 !important;
    padding: 5px 0 !important;
  }

  #iwm3h {
    margin: 12px auto 0 auto !important;
    width: 100% !important;
    padding: 0 !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
  }

  #ix4uk {
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    margin: 0 auto !important;
  }

  .ir4nm {
    width: 100% !important;
    margin: 0 !important;
    height: auto !important;
    min-height: 400px !important;
    border-radius: 8px !important;
    overflow: hidden !important;
  }

  #imeqxj {
    margin: 25px auto 0 auto !important;
    display: flex !important;
    justify-content: center !important;
    position: static !important;
  }

  .iq2h3p {
    width: auto !important;
    min-width: 220px !important;
    font-size: 15px !important;
    padding: 12px 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* --- "Who We Are" Section (Home) --- */
  #i0jzpj {
    margin: 0 auto 40px auto !important;
    padding: 0 15px !important;
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
  }

  #i0jzpj > .gjs-cell,
  #ivzsdj {
    flex: 0 0 auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
  }

  #ivzsdj > div {
    height: auto !important;
  }

  #ignxjp, #ignxjp2 {
    font-size: 26px !important;
    line-height: 1.3 !important;
    margin: 0 !important;
  }

  #ijnat6 {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
    margin: 20px auto 0 auto !important;
    float: none !important;
  }

  #learn-more-about-us {
    position: static !important;
    display: block !important;
    margin: 20px auto 10px auto !important;
    max-width: 140px !important;
    height: auto !important;
  }

  /* --- Projects Showcase Section --- */
  #iwiif3 {
    padding: 40px 15px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #iwiif3 .gjs-row {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  #iuureb {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  #irt3rg {
    display: flex !important;
    flex-direction: column !important;
    text-align: center !important;
    margin-left: 0 !important;
  }

  #irt3rg .gjs-cell {
    margin-left: 0 !important;
  }

  #ihylgi {
    font-size: 26px !important;
    line-height: 1.3 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #i6uswj {
    margin: 12px 0 20px 0 !important;
    text-align: center !important;
    display: block !important;
    padding: 0 !important;
  }

  #ir7zxw {
    display: flex !important;
    flex-direction: column !important;
    gap: 25px !important;
    margin: 0 auto !important;
  }

  #ir7zxw .gjs-cell {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  .our-projects-imgs {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    border-radius: 6px !important;
  }

  #i3jwqh, #i5idpw, #iybtzh {
    width: 100% !important;
    text-align: center !important;
    font-size: 16px !important;
    padding: 10px 0 !important;
  }

  /* --- Testimonials Section --- */
  #iwulbo {
    height: auto !important;
    padding: 40px 15px !important;
    overflow: hidden !important;
  }

  #isinjc {
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  #ismpwl {
    display: block !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #i2ymxj {
    font-size: 26px !important;
    line-height: 1.3 !important;
    margin: 0 0 15px 0 !important;
  }

  #testimonial-carousel {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    margin: 0 auto !important;
  }

  #testimonial-carousel .carousel-item,
  #testimonial-carousel .testimonial-carousel-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  /* On mobile, display only the middle active card for clean single-card carousel */
  #testimonial-carousel .carousel-item > div:nth-child(1),
  #testimonial-carousel .testimonial-carousel-item > div:nth-child(1),
  #testimonial-carousel .carousel-item > div:nth-child(3),
  #testimonial-carousel .testimonial-carousel-item > div:nth-child(3) {
    display: none !important;
  }

  #testimonial-carousel .carousel-item > div:nth-child(2),
  #testimonial-carousel .testimonial-carousel-item > div:nth-child(2) {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    height: auto !important;
    min-height: 260px !important;
    padding: 24px 18px !important;
    background: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08) !important;
    margin: 10px auto !important;
  }

  #testimonial-carousel .carousel-item > div:nth-child(2) .card-template,
  #testimonial-carousel .testimonial-carousel-item > div:nth-child(2) .card-template {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* --- Projects Page Bootstrap Carousel (#carouselExample) Responsive --- */
  #carouselExample {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    overflow: hidden !important;
  }

  #carouselExample .carousel-item.active {
    display: block !important;
  }

  #carouselExample .gjs-row {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 15px 10px !important;
  }

  #carouselExample .gjs-cell {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
  }

  #carouselExample .project-img {
    width: 100% !important;
    max-width: 400px !important;
    margin: 10px auto !important;
  }

  #carouselExample .project-img img {
    width: 100% !important;
    height: auto !important;
    max-height: 280px !important;
    object-fit: cover !important;
    border-radius: 6px !important;
    display: block !important;
    margin: 0 auto !important;
  }

  #carouselExample #isuivg,
  #carouselExample #i6gqhr,
  #carouselExample #izt1tb {
    margin: 15px auto !important;
    display: inline-flex !important;
    justify-content: center !important;
  }

  /* --- Recognition Carousel (#recognition-carousel) Responsive --- */
  #recognition-carousel {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    margin: 0 auto !important;
  }

  #recognition-carousel .carousel-inner,
  #recognition-carousel .carousel-item {
    max-width: 100% !important;
    overflow: hidden !important;
  }

  #recognition-and-media {
    max-width: 100% !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  #recognition-and-media #card-1,
  #recognition-and-media #card-2,
  #recognition-and-media #card-3 {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .carousel-arrows {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 15px !important;
    margin-top: 20px !important;
    position: static !important;
    width: 100% !important;
  }

  .carousel-control-prev, .carousel-control-next {
    position: static !important;
    width: auto !important;
    opacity: 1 !important;
  }

  /* --- Workshop Images & Footer --- */
  #it9ao7 {
    height: auto !important;
    margin: 0 auto !important;
    position: static !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
    padding: 0 15px !important;
  }

  #izqm6c {
    height: auto !important;
    width: 100% !important;
  }

  #ifmmcz, #ilmo1l {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    float: none !important;
    border-radius: 6px !important;
    margin: 0 auto !important;
  }

  #iypxe3 {
    height: auto !important;
    min-height: auto !important;
    padding: 35px 15px 25px 15px !important;
    display: block !important;
  }

  #iyfglk {
    padding: 0 !important;
  }

  #ie8tgs {
    margin: 0 auto !important;
    width: 100% !important;
  }

  .footer-links {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 10px 16px !important;
    margin: 15px 0 !important;
  }

  .footer-links a {
    font-size: 13px !important;
    text-align: center !important;
    line-height: 1.4 !important;
  }

  #i01aq4.footer-links {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 20px !important;
    margin: 20px auto 10px auto !important;
    width: auto !important;
    max-width: 160px !important;
  }

  #ifvc3g {
    width: 150px !important;
    max-width: 60% !important;
    margin: 0 auto !important;
    display: block !important;
  }

  #footer-boxes {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 15px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 30px auto !important;
  }

  #footer-boxes img {
    width: 100% !important;
    max-width: 280px !important;
    height: auto !important;
    margin: 0 auto !important;
  }

  /* --- Contact Page Form & Stepper --- */
  #contact-body {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 25px !important;
    padding: 0 10px !important;
  }

  .bs-stepper {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .bs-stepper-header {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 20px auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 5px !important;
  }

  .bs-stepper .line {
    flex: 1 1 20px !important;
    min-width: 15px !important;
    max-width: 40px !important;
    margin: 0 4px !important;
  }

  .bs-stepper .step {
    flex: 0 0 auto !important;
  }

  .bs-stepper .step-trigger {
    padding: 4px !important;
    width: 36px !important;
    height: 36px !important;
  }

  .bs-stepper-circle {
    width: 32px !important;
    height: 32px !important;
    font-size: 14px !important;
    line-height: 32px !important;
  }

  #map {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
  }

  #gmaps {
    width: 100% !important;
    max-width: 100% !important;
    height: 320px !important;
    border-radius: 6px !important;
  }

  #contact-body input, #contact-body select, #contact-body textarea {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    font-size: 16px !important;
  }

  /* --- Request a Quote Form --- */
  #iq5tr5.booking-form-container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 18px 14px !important;
    box-shadow: none !important;
  }

  .input-field, .form-control {
    font-size: 16px !important; /* Prevents auto-zoom on iOS Safari */
    width: 100% !important;
    max-width: 100% !important;
  }

  #ife957.gjs-row {
    flex-direction: column !important;
    gap: 15px !important;
    padding: 0 !important;
  }

  /* --- Project & Service Content Detail Pages --- */
  #project-title {
    font-size: 26px !important;
    line-height: 1.3 !important;
    padding: 0 15px !important;
    text-align: center !important;
  }

  #project-description {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 15px !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    text-align: center !important;
  }

  #project-gallery {
    margin-top: 25px !important;
  }

  #project-images {
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
    margin-top: 20px !important;
  }

  #project-images div {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
  }

  #project-images img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
    border-radius: 6px !important;
  }

  /* ==========================================================================
     About Us Page Mobile Responsiveness
     ========================================================================== */
  #i074er {
    display: flex !important;
    flex-direction: column !important;
    margin: 30px auto !important;
    padding: 0 15px !important;
  }

  #i5akin, #ie0wac {
    font-size: 30px !important;
    margin: 20px 0 10px 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  #i31tgl, #imm4oz {
    padding: 0 !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    margin-bottom: 20px !important;
    text-align: left !important;
    color: #555555 !important;
  }

  #i3wlrg {
    margin: 15px auto !important;
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
  }

  #ioth0n {
    width: 100% !important;
    max-width: 420px !important;
    height: auto !important;
    display: block !important;
    border-radius: 6px !important;
    margin: 0 auto !important;
  }

  /* Our Mission Section */
  #icxem5 {
    height: auto !important;
    min-height: auto !important;
    margin: 40px auto !important;
    padding: 40px 15px !important;
    background-size: cover !important;
    background-position: center center !important;
  }

  #iqxrs5 {
    width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
  }

  #i9vfbj {
    height: auto !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    margin: 0 auto !important;
  }

  #imiwn {
    width: 100% !important;
    min-height: auto !important;
    margin: 0 auto !important;
  }

  #imsmv7 {
    position: static !important;
    top: 0 !important;
    width: 100% !important;
    max-width: 420px !important;
    height: auto !important;
    margin: 0 auto 25px auto !important;
    display: block !important;
    border-radius: 6px !important;
  }

  #idai1f {
    width: 100% !important;
    padding: 0 10px !important;
    text-align: center !important;
  }

  #i6l4yp {
    padding: 0 !important;
    margin: 0 0 15px 0 !important;
    font-size: 32px !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    text-align: center !important;
  }

  #ix1qky {
    padding: 0 !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: #ffffff !important;
    text-align: center !important;
  }

  /* Our Values & Our Services Section */
  #ifooav {
    font-size: 32px !important;
    margin: 40px auto 20px auto !important;
    padding: 0 15px !important;
    text-align: center !important;
  }

  #iq4mqi {
    height: auto !important;
    min-height: auto !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 0 15px !important;
    margin: 0 auto !important;
  }

  #ivknf, #i0hz45 {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 0 20px 0 !important;
    text-align: center !important;
  }

  #io0j0h, #iocxnr, #ifpqbh, #imc4wq {
    display: block !important;
    margin: 25px auto 12px auto !important;
    width: 44px !important;
    height: 44px !important;
    float: none !important;
    padding: 0 !important;
  }

  #iezud8, #ix10b7, #ijug7b, #icplhk {
    font-size: 22px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  #iri6zj, #id9pig, #iinoyh, #idygle {
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: #555555 !important;
    margin: 0 auto 20px auto !important;
    padding: 0 !important;
    max-width: 360px !important;
    text-align: center !important;
  }

  #ihrl4 {
    position: static !important;
    top: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 30px auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  #ivwkde {
    padding: 24px 18px !important;
    border-radius: 8px !important;
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  #i1ypho {
    font-size: 26px !important;
    padding: 12px !important;
    text-align: center !important;
    border-radius: 6px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  #iyowvp {
    width: 100% !important;
    flex-basis: 100% !important;
  }

  #ibckps, #io1cll {
    display: none !important;
  }

  #i87oag {
    font-size: 15px !important;
    line-height: 1.5 !important;
    margin: 20px 0 15px 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  #in2l32, #i8m2pe, #ic58pl, #iyoomg, #i6e8np, #iad9cw, #ilqna6, #i87gxj {
    display: none !important;
  }

  #i5132u, #ih7xx9, #iqv492, #iksosj, #i127uj, #i1vvxg, #ikaj76, #if6v4g {
    padding: 12px 16px !important;
    margin: 6px 0 !important;
    border-radius: 4px !important;
    display: block !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  #ikpp5l, #iowdo4, #ifbgji, #i8lfje, #icu3kn, #i3vgxq, #i6709z, #ibp3b9 {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  #i8xn5f, #ica2sh, #i70plk, #itegn9, #isq1c1, #izrzbq, #ipq6km, #i32j6h {
    font-size: 15px !important;
    font-weight: 500 !important;
    padding: 0 !important;
    text-align: center !important;
    color: #ffffff !important;
    margin: 0 !important;
  }

  /* Why Choose Us Section */
  #i3edv8 {
    position: static !important;
    height: auto !important;
    margin-top: 30px !important;
    padding: 40px 15px !important;
    display: block !important;
  }

  #isv3ai {
    font-size: 30px !important;
    text-align: center !important;
    margin-bottom: 25px !important;
    padding: 0 !important;
  }

  #iza1df {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    padding: 0 !important;
  }

  #iza1df .gjs-cell {
    width: 100% !important;
    padding: 0 !important;
  }

  #i43fkp, #injd2h, #im1cgz, #ilgvdh {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 14px !important;
    margin-bottom: 18px !important;
  }

  #io0azg, #iyqcyi, #igtthv, #iw15yv {
    flex: 0 0 28px !important;
    width: 28px !important;
    min-height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  #iy8i15, #imnj5h, #i0mar3, #ic9u6q {
    width: 24px !important;
    height: 24px !important;
    display: block !important;
    margin-top: 2px !important;
  }

  #in2204, #il1h6m, #i314xz, #ire60f {
    flex: 1 1 auto !important;
    padding: 0 !important;
    min-height: auto !important;
  }

  #ijlhjj, #ijpe9x, #ij394j, #i8bxgh {
    font-size: 19px !important;
    font-weight: 600 !important;
    padding: 0 !important;
    margin: 0 0 6px 0 !important;
    text-align: left !important;
    color: #f1a81e !important;
  }

  #ie4pio, #i2633p, #igf5ho, #i0ccwf {
    font-size: 14px !important;
    line-height: 1.5 !important;
    color: #dddddd !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
  }

  /* Recognition & Media Features */
  #iaet2d {
    display: block !important;
    padding: 0 15px !important;
    margin: 30px auto !important;
  }

  #recognition-and-media {
    display: flex !important;
    flex-direction: column !important;
    gap: 25px !important;
    padding: 0 !important;
  }

  #card-1, #card-2 {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    display: block !important;
    margin: 0 0 24px 0 !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    background: #ffffff !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
  }

  #card-3.hide-card {
    display: none !important;
  }

  #iy27di, .ioxl1t {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    padding: 24px 16px !important;
    box-sizing: border-box !important;
  }

  #i0a2zy, .ioub4u {
    width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    flex: 0 0 auto !important;
    flex-basis: auto !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 0 0 16px 0 !important;
  }

  #card-1 .gjs-cell:last-child,
  #card-2 .gjs-cell:last-child,
  #card-3 .gjs-cell:last-child {
    width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    flex: 0 0 auto !important;
    flex-basis: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  #i8eqax, #iyfbmg, #acciona-img {
    max-width: 220px !important;
    width: 100% !important;
    height: auto !important;
    max-height: 260px !important;
    object-fit: contain !important;
    border-radius: 4px !important;
    display: block !important;
    margin: 0 auto !important;
  }

  #ij9s7w, #it3wut {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #101010 !important;
    text-align: center !important;
    margin: 0 0 10px 0 !important;
    padding: 0 !important;
  }

  #if5ztj, .ie525u {
    padding: 0 !important;
    margin: 0 0 15px 0 !important;
    text-align: center !important;
  }

  #icz3l7, #ixmqaa, #acciona-text {
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #555555 !important;
    text-align: center !important;
    display: block !important;
    white-space: normal !important;
  }

  .view-here-span {
    margin-top: 15px !important;
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
  }

  .view-here {
    text-align: center !important;
    display: inline-block !important;
  }

  .view-here.lower-rect {
    display: none !important;
  }

  #recognition-arrows {
    display: none !important;
  }

  /* ==========================================================================
     Services Page Mobile Responsiveness
     ========================================================================== */
  #i8x35h {
    font-size: 30px !important;
    margin: 40px auto 10px auto !important;
    text-align: center !important;
    padding: 0 15px !important;
  }

  #io107r {
    font-size: 15px !important;
    line-height: 1.5 !important;
    margin: 0 auto 30px auto !important;
    text-align: center !important;
    padding: 0 15px !important;
    color: #555555 !important;
  }

  #irxr4w, #ic6p62, #ir939u {
    display: flex !important;
    flex-direction: column !important;
    gap: 30px !important;
    margin: 0 auto 30px auto !important;
    padding: 0 15px !important;
  }

  #i54tid, #iwjnvi, #idatbl, #i1awnh, #i1n64r, #igisjs, #ixodbl, #iafj7y, #ir8glq {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  #iau149, #i04nxf, #i6135c, #ia43wv, #ily5ti, #iq68kc, #i07awg, #isa8qj {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    border-radius: 6px !important;
    display: block !important;
    margin: 0 auto !important;
  }

  #ibt13j, #id8ci9, #i369zt, #iwxccx, #iu36xj, #i05qrt, #i6m7el, #izptst {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 15px 0 8px 0 !important;
    padding: 0 !important;
  }

  #iuck92, #ilx36b, #ik04d6, #inrvc4, #iexvpr, #i3gdoi, #iy9wz8, #i66f5o {
    flex: 0 0 6px !important;
    width: 6px !important;
    height: 26px !important;
    min-height: 26px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: #f1a81e !important;
    border-radius: 2px !important;
    display: block !important;
  }

  #iedvnp, #i7a6ia, #ijpcay, #itpg2q, #il6gyl, #ikdxlo, #irj08b, #ils4fh {
    flex: 1 1 auto !important;
    padding: 0 !important;
    min-height: auto !important;
  }

  .service-link, #i57ytf, #i94aha, #iiu5lk, #ixe83g, #i9orni, #is4oin, #iyznyf, #icowwi {
    font-size: 20px !important;
    font-weight: 600 !important;
    color: #101010 !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
    line-height: 1.3 !important;
  }

  #itldld, #i7jj9q, #ixjm64, #ikepuy, #ic4lqh, #ivpkaz, #ikqz46, #idxqn3 {
    font-size: 15px !important;
    line-height: 1.5 !important;
    color: #555555 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  #ir8glq {
    padding: 30px 20px !important;
    border-radius: 8px !important;
    background: #f1a81e !important;
    text-align: center !important;
    margin: 0 auto !important;
  }

  #iiclrg {
    font-size: 28px !important;
    line-height: 1.2 !important;
    margin: 0 0 15px 0 !important;
    padding: 0 !important;
    color: #ffffff !important;
  }

  #ieg5dk {
    font-size: 15px !important;
    line-height: 1.5 !important;
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
    color: #ffffff !important;
  }

  #ieg3c2 {
    display: inline-block !important;
    margin: 0 auto !important;
    padding: 12px 30px !important;
    border: 1px solid #ffffff !important;
    border-radius: 25px !important;
    color: #ffffff !important;
    font-weight: 500 !important;
    text-decoration: none !important;
  }
}
