/* =========================================
   TCM POWER VALET — RESPONSIVE V1.1
========================================= */

/* TABLETS AND SMALL DESKTOPS */

@media (max-width: 900px) {
  :root {
    --header-height: 76px;
  }

  .brand img {
    width: 170px;
  }

  .menu-toggle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    width: 44px;
    height: 44px;
    padding: 8px;
    background: transparent;
    border: 0;
    cursor: pointer;
  }

  .menu-toggle span {
    display: block;
    width: 100%;
    height: 2px;
    background: white;
  }

  .nav-links {
    display: none;
    position: absolute;
    top: var(--header-height);
    left: 0;
    right: 0;
    padding: 25px 24px 32px;
    background: #101820;
    flex-direction: column;
    align-items: stretch;
    gap: 24px;
    border-bottom: 1px solid #34414c;
  }

  .nav-links.is-open {
    display: flex;
  }

  .nav-link,
  .nav-cta {
    font-size: 15px;
  }

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

  .hero {
    background-position: 65% center;
  }

  .hero-content {
    padding-top: calc(var(--header-height) + 70px);
    padding-bottom: 85px;
  }

  .hero h1 {
    font-size: clamp(50px, 8vw, 72px);
  }
}

/* MOBILE */

@media (max-width: 600px) {
  .container {
    width: min(100% - 36px, 1180px);
  }

  .hero {
    background-position: 65% center;
  }

  .hero-overlay {
    background: linear-gradient(
      90deg,
      rgba(5, 12, 18, 0.94),
      rgba(5, 12, 18, 0.78)
    );
  }

  .hero-content {
    padding-top: calc(var(--header-height) + 65px);
    padding-bottom: 85px;
  }

  .hero h1 {
    font-size: clamp(46px, 11vw, 62px);
    line-height: 0.98;
  }

  .hero-description {
    font-size: 15px;
    line-height: 1.7;
  }

  .hero-actions {
    flex-direction: column;
  }

  .hero-actions .btn {
    width: 100%;
  }

  
.hero-sectors {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 12px;
  margin-top: 34px;
}

.hero-sector {
  padding: 0;
  font-size: 12px;
  border-right: none !important;
}

.hero-sector svg {
  width: 24px;
  height: 24px;
}


  .hero-scroll {
    display: none;
  }
}


/* =========================================
   SECTION 03 — RESPONSIVE
========================================= */

/* TABLETS */

@media (max-width: 1000px) {

  .sector-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }

  .sector-card {
    min-height: 310px;
  }

  .services-showcase {
    padding: 90px 0 100px;
  }

}

/* MOBILE */

@media (max-width: 600px) {

  .services-showcase {
    padding: 75px 0 85px;
  }

  .services-showcase-header {
    margin-bottom: 35px;
  }

  .services-showcase-header h2 {
    font-size: clamp(38px, 10vw, 50px);
  }

  .services-showcase-intro {
    font-size: 14px;
  }

  .sector-grid {
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .sector-card {
    min-height: 285px;
    padding: 25px;
  }

  .sector-card-content {
    padding-top: 45px;
    padding-bottom: 25px;
  }

  .sector-card-content h3 {
    font-size: 32px;
  }

}


/* =========================================
   SECTION 04 — RESPONSIVE
========================================= */

/* TABLETS */

@media (max-width: 1000px) {

  .why-tcm {
    padding: 95px 0;
  }

  .why-tcm-layout {
    grid-template-columns: 1fr;
    gap: 55px;
  }

  .why-tcm-intro {
    max-width: 700px;
  }

  .why-tcm-intro h2 {
    font-size: clamp(55px, 8vw, 76px);
  }

  .why-tcm-features {
    max-width: 750px;
  }

}

/* MOBILE */

@media (max-width: 600px) {

  .why-tcm {
    padding: 80px 0;
  }

  .why-tcm-layout {
    gap: 45px;
  }

  .why-tcm-intro h2 {
    font-size: clamp(52px, 12vw, 68px);
    margin-bottom: 25px;
  }

  .why-tcm-lead {
    font-size: 18px;
  }

  .why-tcm-description {
    font-size: 14px;
  }

  .why-feature {
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 18px;
    padding: 25px 0;
  }

  .why-feature-icon {
    width: 44px;
    height: 44px;
  }

  .why-feature-icon svg {
    width: 22px;
    height: 22px;
  }

  .why-feature-content h3 {
    font-size: 23px;
  }

  .why-feature-content p {
    font-size: 13px;
  }

}


/* =========================================
   SECTION 05 — RESPONSIVE
========================================= */

/* TABLETS */

@media (max-width: 1000px) {

  .how-it-works {
    padding: 95px 0;
  }

  .process-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 40px;
    row-gap: 55px;
  }

  .process-header {
    margin-bottom: 55px;
  }

  .process-footer {
    margin-top: 70px;
  }

}

/* MOBILE */

@media (max-width: 600px) {

  .how-it-works {
    padding: 80px 0;
  }

  .process-header {
    margin-bottom: 45px;
  }

  .process-header h2 {
    font-size: clamp(45px, 11vw, 60px);
  }

  .process-intro {
    font-size: 14px;
  }

  .process-grid {
    grid-template-columns: 1fr;
    gap: 35px;
  }

  .process-step-top {
    height: 70px;
  }

  .process-number {
    font-size: 58px;
  }

  .process-step-content {
    padding-top: 25px;
  }

  .process-step-content > svg {
    margin-bottom: 18px;
  }

  .process-step-content h3 {
    font-size: 25px;
  }

  .process-step-content p {
    max-width: 420px;
    font-size: 14px;
  }

  .process-footer {
    flex-direction: column;
    align-items: stretch;
    gap: 22px;
    margin-top: 55px;
  }

  .process-footer .btn {
    width: 100%;
  }

}


/* =========================================
   SECTION 06 — RESPONSIVE
========================================= */

@media (max-width: 1000px) {

  .service-area {
    padding: 95px 0;
  }

  .service-area-layout {
    grid-template-columns: 1fr;
    gap: 60px;
  }

  .service-area-content {
    max-width: 750px;
  }

  .radius-panel {
    min-height: 500px;
  }

}

@media (max-width: 600px) {

  .service-area {
    padding: 80px 0;
  }

  .service-area-layout {
    gap: 45px;
  }

  .service-area-content h2 {
    font-size: clamp(52px, 12vw, 70px);
  }

  .service-area-lead {
    font-size: 18px;
  }

  .service-area-description {
    font-size: 14px;
  }

  .service-area-details {
    margin: 35px 0;
  }

  .radius-panel {
    min-height: 420px;
    padding: 20px;
  }

  .radius-panel-header {
    font-size: 8px;
    letter-spacing: 0.8px;
  }

  .radius-graphic {
    inset: 55px 0 80px;
  }

  .radius-ring-outer {
    width: 290px;
  }

  .radius-ring-middle {
    width: 205px;
  }

  .radius-ring-inner {
    width: 110px;
  }

  .radius-centre {
    width: 50px;
    height: 50px;
  }

  .radius-panel-footer {
    left: 20px;
    right: 20px;
    bottom: 22px;
  }

  .radius-distance strong {
    font-size: 60px;
  }

  .radius-distance strong span {
    font-size: 20px;
  }

  .radius-distance p {
    font-size: 9px;
  }

}


/* SECTION 07 — RESPONSIVE ENQUIRY HUB */

@media (max-width: 900px) {
  .enquiry-hub {
    padding: 85px 0;
  }

  .enquiry-sector-tab {
    min-height: 90px;
    flex-direction: column;
    gap: 8px;
    font-size: 12px;
  }

  .enquiry-sector-tab svg {
    width: 25px;
    height: 25px;
  }
}

@media (max-width: 600px) {
  .enquiry-hub {
    padding: 70px 0 85px;
  }

  .enquiry-intro {
    margin-bottom: 38px;
  }

  .enquiry-intro > p {
    font-size: 15px;
  }

  .enquiry-sector-tabs {
    grid-template-columns: repeat(2, 1fr);
  }

  .enquiry-sector-tab {
    min-height: 76px;
    flex-direction: row;
    gap: 9px;
  }

  .enquiry-panel {
    padding: 25px 18px;
  }

  .enquiry-panel-icon {
    width: 48px;
    height: 48px;
  }

  .enquiry-panel-icon svg {
    width: 25px;
    height: 25px;
  }

  .enquiry-form-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .enquiry-field-full {
    grid-column: auto;
  }

  .enquiry-form-section {
    padding: 32px 0;
  }

  .enquiry-submit-row {
    flex-direction: column;
    align-items: stretch;
  }

  .enquiry-submit {
    width: 100%;
  }
}


/* =========================================
   SECTION 09 — FOOTER RESPONSIVE
========================================= */

/* TABLET */

@media (max-width: 1024px) {
  .footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 50px;
  }

  .site-footer {
    padding-top: 70px;
  }
}

/* MOBILE */

@media (max-width: 600px) {
  .site-footer {
    padding-top: 60px;
  }

  .footer-grid {
    grid-template-columns: 1fr;
    gap: 42px;
    padding-bottom: 55px;
  }

  .footer-logo img {
  width: 200px;
  max-width: 100%;
}

  .footer-column h3 {
    margin-bottom: 22px;
  }

  .footer-column li {
    margin-bottom: 14px;
  }

  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
    padding: 25px 0;
  }

  .footer-legal {
    flex-wrap: wrap;
    gap: 15px 25px;
  }
}















/* =========================================
   TCM POWER VALET — RESPONSIVE V2.0
   NEW MOBILE & TABLET OVERRIDES
   ========================================= */




/* =========================================
   RESPONSIVE V2.0 — MOBILE FOOTER
   ========================================= */

@media (max-width: 600px) {

  /* Main footer */
  .site-footer {
    padding-top: 35px;
  }

  /* Two-column footer layout */
  .footer-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
    row-gap: 32px;
    padding-bottom: 32px;
    border-top: 1px solid #34414c;
    padding-top: 32px;
  }

  /* Quick Links and Our Services */
  .footer-grid > .footer-column:nth-child(2),
  .footer-grid > .footer-column:nth-child(3) {
    grid-column: auto;
    min-width: 0;
  }

  .footer-column h3 {
    font-size: 13px;
    letter-spacing: 1px;
    margin-bottom: 18px;
  }

  .footer-column li {
    margin-bottom: 12px;
  }

  .footer-column li a {
    font-size: 12px;
    line-height: 1.5;
  }

  /* Contact details beneath both columns */
  .footer-grid > .footer-contact {
    grid-column: 1 / -1;
    text-align: center;
    justify-self: center;
    width: 100%;
  }

  .footer-contact h3 {
    margin-bottom: 20px;
  }

  .footer-contact p {
    justify-content: center;
    font-size: 12px;
  }

  .footer-contact p a,
  .footer-contact p span {
    font-size: 12px;
    overflow-wrap: anywhere;
  }

  /* Full logo below contact */
  .footer-grid > .footer-brand {
    grid-column: 1 / -1;
    grid-row: 3;
    justify-self: center;
    text-align: center;
    margin: 0;
  }

  .footer-logo {
    display: block;
    width: 170px;
    height: 70px;
    background-image: url("../ASSETS/01 MAIN (w) trimmed.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }

  /* Hide original M visually on mobile */
  .footer-logo img {
    opacity: 0;
    width: 100%;
    height: 100%;
  }

  /* Bottom copyright and legal links */
  .footer-bottom {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 14px;
    padding: 25px 0;
    border-top: 1px solid #34414c;
  }

  .footer-bottom > p {
    font-size: 11px;
    line-height: 1.6;
    margin: 0;
  }

  .footer-legal {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
  }

  .footer-legal a {
    font-size: 11px;
  }

}





/* =========================================
   RESPONSIVE V2.0 — FOOTER REFINEMENT 01
   ========================================= */

@media (max-width: 600px) {

  /* Move footer content down slightly */
  .footer-grid {
    padding-top: 48px;
    padding-bottom: 24px;
    row-gap: 26px;
    column-gap: 12px;
  }

  /* Centre both link columns within their grid spaces */
  .footer-grid > .footer-column:nth-child(2),
  .footer-grid > .footer-column:nth-child(3) {
    justify-self: center;
    width: max-content;
    max-width: 100%;
    text-align: left;
  }

  /* Keep headings and links left-aligned */
  .footer-grid > .footer-column:nth-child(2) h3,
  .footer-grid > .footer-column:nth-child(3) h3,
  .footer-grid > .footer-column:nth-child(2) ul,
  .footer-grid > .footer-column:nth-child(3) ul {
    text-align: left;
  }

  /* Slightly increase contact information */
  .footer-contact h3 {
    font-size: 14px;
    margin-bottom: 18px;
  }

  .footer-contact p,
  .footer-contact p a,
  .footer-contact p span {
    font-size: 13px;
  }

  .footer-contact p svg {
    width: 20px;
    height: 20px;
  }

  /* Reduce excessive spacing around logo */
  .footer-grid > .footer-brand {
    margin-top: 0;
    margin-bottom: 0;
  }

  .footer-logo {
    width: 155px;
    height: 55px;
  }

  /* Tighten spacing before bottom border */
  .footer-grid {
    padding-bottom: 18px;
  }

  /* Compact copyright section */
  .footer-bottom {
    padding: 20px 0;
    gap: 10px;
  }

}


/* RESPONSIVE V2.0 — FOOTER LOGO POSITION */

@media (max-width: 600px) {
  .footer-grid > .footer-brand {
    transform: translateY(15px);
  }
}


/* RESPONSIVE V2.0 — MOBILE NAVBAR LOGO */

@media (max-width: 600px) {
  .site-header .brand img {
    width: 115px;
    height: auto;
  }
}

/* RESPONSIVE V2.0 — HERO SECTOR ALIGNMENT */

@media (max-width: 600px) {
  .hero-sectors {
    grid-template-columns: repeat(2, max-content);
    justify-content: center;
    column-gap: 35px;
  }

  .hero-sector {
    justify-content: flex-start;
    text-align: left;
  }
}



/* =========================================
   RESPONSIVE V2.0 — HOMEPAGE SERVICE CARDS
   ========================================= */

@media (max-width: 600px) {

  /* Four cards in a 2x2 grid */
  .sector-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  /* Smaller, more compact cards */
  .sector-card {
    min-width: 0;
    min-height: 260px;
    padding: 18px 14px;
  }

  /* Reduce internal spacing */
  .sector-card-content {
    padding-top: 20px;
    padding-bottom: 12px;
  }

  /* Smaller sector headings */
  .sector-card-content h3 {
    font-size: clamp(19px, 5vw, 24px);
    line-height: 1.05;
    overflow-wrap: break-word;
  }

  /* Smaller descriptions */
  .sector-card-content p {
    font-size: 11px;
    line-height: 1.5;
  }

  /* Smaller icons */
  .sector-card svg {
    width: 25px;
    height: 25px;
  }

  /* Smaller numbering */
  .sector-card-number {
    font-size: 10px;
  }

  /* Compact service links */
  .sector-card-content a {
    font-size: 10px;
  }

}



/* =========================================
   RESPONSIVE V2.0 — HOMEPAGE ABOUT POINTS
   ========================================= */

@media (max-width: 600px) {

  /* Four points in a 2x2 grid */
  .why-tcm-features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    max-width: 100%;
  }

  /* Individual point cards */
  .why-feature {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    height: 100%;
    padding: 18px 14px;
    gap: 12px;
    border: 1px solid #24506a;
    border-radius: 12px;
    background: linear-gradient(
      145deg,
      #192b36,
      #0b151d
    );
  }

  /* Compact icons */
  .why-feature-icon {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
  }

  .why-feature-icon svg {
    width: 20px;
    height: 20px;
  }

  /* Number */
  .why-feature-number {
    font-size: 10px;
  }

  /* Point heading */
  .why-feature-content h3 {
    font-size: clamp(17px, 4.5vw, 21px);
    line-height: 1.15;
    margin-bottom: 10px;
    overflow-wrap: break-word;
  }

  /* Description */
  .why-feature-content p {
    font-size: 11px;
    line-height: 1.55;
  }

}



/* =========================================
   RESPONSIVE V2.0 — ABOUT GRID REFINEMENT
   ========================================= */

@media (max-width: 600px) {

  /* Keep the 2x2 layout */
  .why-tcm-features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 22px;
    row-gap: 30px;
  }

  /* Remove card styling */
  .why-feature {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 10px 0 28px;
    gap: 12px;
  }

  /* First row: horizontal divider underneath */
  .why-feature:nth-child(-n+2) {
    border-bottom: 1px solid #34414c;
  }

  /* Second row */
  .why-feature:nth-child(n+3) {
    padding-top: 4px;
    padding-bottom: 0;
  }

}



/* =========================================
   RESPONSIVE V2.0 — ABOUT GRID REFINEMENT 02
   ========================================= */

@media (max-width: 600px) {

  .why-tcm-features {
    position: relative;
    column-gap: 26px;
    row-gap: 0;
    border-top: none;
    border-bottom: 1px solid #34414c;
  }

  /* Continuous vertical divider through the centre */
  .why-tcm-features::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    background: #34414c;
    transform: translateX(-50%);
    pointer-events: none;
  }

  /* Remove existing individual divider lines */
  .why-tcm-features > .why-feature {
    border: none;
    border-radius: 0;
    background: transparent;
    padding: 22px 0;
    margin: 0;
  }

  /* Remove the unwanted top divider */
  .why-tcm-features > .why-feature:first-child,
  .why-tcm-features > .why-feature:nth-child(2) {
    border-top: none;
  }

  /* Divider between first and second rows */
  .why-tcm-features > .why-feature:nth-child(-n+2) {
    border-bottom: 1px solid #34414c;
  }

  /* Bottom row */
  .why-tcm-features > .why-feature:nth-child(n+3) {
    padding-top: 28px;
    padding-bottom: 28px;
  }

}



/* =========================================
   RESPONSIVE V2.0 — ABOUT VERTICAL DIVIDER
   ========================================= */

@media (max-width: 600px) {

  /* Remove the original continuous vertical line */
  .why-tcm-features::before,
  .why-tcm-features::after {
    content: none;
  }

  /* Create a vertical line for each row */
  .why-feature:nth-child(odd) {
    position: relative;
  }

  .why-feature:nth-child(odd)::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 15px;
    right: -13px;
    width: 0.5px;
    background: #34414c;
    pointer-events: none;
  }

  /* Start the second vertical segment below the horizontal divider */
  .why-feature:nth-child(3)::after {
    top: 15px;
    bottom: 0;
  }

  /* Move bottom divider down slightly */
  .why-tcm-features {
    padding-bottom: 20px;
  }

}




/* =========================================
   RESPONSIVE V2.0 — HOMEPAGE PROCESS
   ========================================= */

@media (max-width: 600px) {

  /* Reduce spacing between process steps */
  .process-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  /* Compact number and divider area */
  .process-step-top {
    height: 52px;
  }

  /* Reduce large step numbers */
  .process-number {
    font-size: 42px;
    line-height: 1;
  }

  /* Bring icon and content closer to divider */
  .process-step-content {
    padding-top: 15px;
  }

  /* Slightly smaller icons */
  .process-step-content > svg {
    width: 23px;
    height: 23px;
    margin-bottom: 12px;
  }

  /* Smaller step headings */
  .process-step-content h3 {
    font-size: 21px;
    line-height: 1.15;
    margin-bottom: 10px;
  }

  /* Compact descriptions */
  .process-step-content p {
    font-size: 13px;
    line-height: 1.55;
    max-width: 100%;
  }

}


/* RESPONSIVE V2.0 — PROCESS NUMBER POSITION */

@media (max-width: 600px) {
  .process-number {
    transform: translateY(10px);
  }
}


/* =========================================
   RESPONSIVE V2.0 — SERVICE AREA RADAR
   ========================================= */

@media (max-width: 600px) {

  .radius-panel {
    min-height: 300px;
    padding: 15px;
  }

  .radius-graphic {
    inset: 42px 0 65px;
  }

  .radius-ring-outer {
    width: 200px;
  }

  .radius-ring-middle {
    width: 145px;
  }

  .radius-ring-inner {
    width: 80px;
  }

  .radius-centre {
    width: 38px;
    height: 38px;
  }

  .radius-panel-footer {
    left: 15px;
    right: 15px;
    bottom: 15px;
  }

  .radius-distance strong {
    font-size: 42px;
  }

  .radius-distance strong span {
    font-size: 15px;
  }

  .radius-distance p {
    font-size: 8px;
  }

}


/* RESPONSIVE V2.0 — HIDE FINAL CTA LOGO */

@media (max-width: 600px) {
  .final-cta-decoration-logo {
    display: none;
  }
}




/* =========================================
   RESPONSIVE V2.0 — SERVICES & PRICING
========================================= */

@media (max-width: 600px) {

  /* SPACE BELOW MOBILE NAVBAR */

  .service-sector-nav {
    padding-top: 130px;
  }

  /* 2 × 2 SECTOR GRID */

  .service-sector-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  /* COMPACT SECTOR CARDS */

  .service-sector-card {
    min-width: 0;
    min-height: 260px;
    padding: 18px 14px;
  }

  .service-sector-card > svg {
    width: 25px;
    height: 25px;
  }

  .service-sector-number {
    font-size: 10px;
  }

  .service-sector-card h3 {
    font-size: clamp(19px, 5vw, 24px);
    line-height: 1.05;
    overflow-wrap: break-word;
  }

  .service-sector-card p {
    font-size: 11px;
    line-height: 1.5;
  }

  .service-sector-link {
    font-size: 10px;
  }

  .service-sector-link svg {
    width: 13px;
    height: 13px;
  }

}


/* =========================================
   RESPONSIVE V2.0 — DOMESTIC VALETING
========================================= */

@media (max-width: 600px) {

  /* TOP SPACING — MATCH SERVICES PAGE */

  .domestic-section {
    padding-top: 130px;
  }

  /* CENTRE FAQ FOOTER */

  .domestic-faq-footer {
    text-align: center;
  }

  .domestic-faq-email {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-left: auto;
  margin-right: auto;
}

}




/* =========================================
   RESPONSIVE V2.0 — AGRICULTURAL PAGE
========================================= */

@media (max-width: 600px) {

  /* 01 — HERO SPACING */

  .agri-hero {
    padding-top: 130px;
  }

  /* 02 — SERVICE CARDS: 2 × 2 */

  .agri-service-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .agri-service-card {
    min-width: 0;
    min-height: 260px;
    padding: 18px 14px;
  }

  .agri-service-card > svg {
    width: 25px;
    height: 25px;
  }

  .agri-service-card > span {
    font-size: 10px;
  }

  .agri-service-card h3 {
    font-size: clamp(19px, 5vw, 24px);
    line-height: 1.05;
    overflow-wrap: break-word;
  }

  .agri-service-card p {
    font-size: 11px;
    line-height: 1.5;
  }

  /* 03 — COMPACT ENQUIRY STEPS */

  .agri-process-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .agri-process-step {
    min-height: 0;
    padding: 24px 22px;
  }

  .agri-process-step > span {
    font-size: 42px;
    line-height: 1;
  }

  .agri-process-step > svg {
    width: 25px;
    height: 25px;
  }

  .agri-process-step h3 {
    font-size: 21px;
    line-height: 1.15;
  }

  .agri-process-step p {
    font-size: 13px;
    line-height: 1.55;
  }

}




/* =========================================
   RESPONSIVE V2.0 — AVIATION PAGE
========================================= */

@media (max-width: 600px) {

  /* 01 — HERO SPACING */

  .avi-hero {
    padding-top: 130px;
  }

  /* 02 — SERVICE CARDS: 2 × 2 */

  .avi-service-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .avi-service-card {
    min-width: 0;
    min-height: 260px;
    padding: 18px 14px;
  }

  .avi-service-card > svg {
    width: 25px;
    height: 25px;
  }

  .avi-service-card > span {
    font-size: 10px;
  }

  .avi-service-card h3 {
    font-size: clamp(19px, 5vw, 24px);
    line-height: 1.05;
    overflow-wrap: break-word;
  }

  .avi-service-card p {
    font-size: 11px;
    line-height: 1.5;
  }

  /* 03 — COMPACT ENQUIRY STEPS */

  .avi-process-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .avi-process-step {
    min-height: 0;
    padding: 24px 22px;
  }

  .avi-process-step > span {
    font-size: 42px;
    line-height: 1;
  }

  .avi-process-step > svg {
    width: 25px;
    height: 25px;
  }

  .avi-process-step h3 {
    font-size: 21px;
    line-height: 1.15;
  }

  .avi-process-step p {
    font-size: 13px;
    line-height: 1.55;
  }

}



/* =========================================
   RESPONSIVE V2.0 — INDUSTRIAL PAGE
========================================= */

@media (max-width: 600px) {

  /* 01 — HERO SPACING */

  .ind-hero {
    padding-top: 130px;
  }

  /* 02 — SERVICE CARDS: 2 × 2 + CENTRED FIFTH */

  .ind-service-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .ind-service-card {
    min-width: 0;
    min-height: 260px;
    padding: 18px 14px;
  }

  .ind-service-card > svg {
    width: 25px;
    height: 25px;
  }

  .ind-card-number {
    font-size: 10px;
  }

  .ind-service-card h3 {
    font-size: clamp(19px, 5vw, 24px);
    line-height: 1.05;
    overflow-wrap: break-word;
  }

  .ind-service-card p {
    font-size: 11px;
    line-height: 1.5;
  }

  /* FIFTH CARD — CENTRED */

  .ind-service-card:nth-child(5) {
    grid-column: 1 / -1;
    width: calc(50% - 6px);
    justify-self: center;
  }

  /* 03 — COMPACT ENQUIRY STEPS */

  .ind-process-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .ind-process-card {
    min-height: 0;
    padding: 24px 22px;
  }

  .ind-process-number {
    font-size: 42px;
    line-height: 1;
  }

  .ind-process-card > svg {
    width: 25px;
    height: 25px;
  }

  .ind-process-card h3 {
    font-size: 21px;
    line-height: 1.15;
  }

  .ind-process-card p {
    font-size: 13px;
    line-height: 1.55;
  }

  /* 04 — CENTRE FAQ CONTACT */

  .ind-faq-contact {
    text-align: center;
  }

  .ind-faq-contact > span {
    display: block;
    text-align: center;
  }

  .ind-faq-contact > a {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-left: auto;
    margin-right: auto;
  }

}




/* =========================================
   RESPONSIVE V2.0 — ABOUT PAGE
========================================= */

@media (max-width: 600px) {

  /* 01 — HERO SPACING */

  .abt-hero {
    padding-top: 130px;
  }

  /* EXTEND BRAND BOX VERTICALLY */

  .abt-hero-visual {
    min-height: 420px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .abt-visual-content > p {
  max-width: 230px;
  margin-left: auto;
  margin-right: auto;
  font-size: 11px;
  line-height: 1.6;
  letter-spacing: 1.5px;
  text-align: center;
}

  .abt-visual-content {
    width: 100%;
    min-height: 360px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    text-align: center;
    padding: 30px 18px;
  }

  /* 02 — OUR APPROACH: 2 × 2 */

  .abt-principles-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .abt-principle {
    min-width: 0;
    min-height: 260px;
    padding: 18px 14px;
  }

  .abt-principle > svg {
    width: 25px;
    height: 25px;
  }

  .abt-principle > span {
    font-size: 10px;
  }

  .abt-principle h3 {
    font-size: clamp(19px, 5vw, 24px);
    line-height: 1.05;
    overflow-wrap: break-word;
  }

  .abt-principle p {
    font-size: 11px;
    line-height: 1.5;
  }

  /* 03 — OUR CAPABILITIES: 2 × 2 */

  .abt-sector-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .abt-sector-card {
    min-width: 0;
    min-height: 260px;
    padding: 18px 14px;
  }

  .abt-sector-card > svg {
    width: 25px;
    height: 25px;
  }

  .abt-sector-card > span {
    font-size: 10px;
  }

  .abt-sector-card h3 {
    font-size: clamp(19px, 5vw, 24px);
    line-height: 1.05;
    overflow-wrap: break-word;
  }

  .abt-sector-card p {
    font-size: 11px;
    line-height: 1.5;
  }

  .abt-sector-card > strong {
    font-size: 10px;
  }

}


/* RESPONSIVE V2.0 — ABOUT SERVICE AREA MAP */

@media (max-width: 600px) {
  .abt-location-map {
    padding: 0;
    background: transparent;
    border: none;
  }

  .abt-location-map img {
    width: 100%;
    max-width: 340px;
    height: auto;
  }
}




/* =========================================
   RESPONSIVE V2.0 — CONTACT PAGE
========================================= */

@media (max-width: 600px) {

  /* 01 — HERO SPACING */

  .ct-hero {
    padding-top: 130px;
  }

  /* 02 — TELEPHONE + EMAIL SIDE BY SIDE */

  .ct-details-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .ct-detail-card {
    min-width: 0;
    min-height: 280px;
    padding: 18px 14px;
  }

  .ct-card-top {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }

  .ct-card-top svg {
    width: 25px;
    height: 25px;
  }

  .ct-card-top span {
    font-size: 10px;
  }

  .ct-detail-card h3 {
    font-size: clamp(19px, 5vw, 24px);
    line-height: 1.05;
    overflow-wrap: break-word;
  }

  .ct-detail-card p {
    font-size: 11px;
    line-height: 1.5;
  }

  .ct-detail-value {
    font-size: 13px;
    overflow-wrap: anywhere;
  }

  .ct-email-value {
    font-size: 11px;
  }

  .ct-card-link {
    font-size: 10px;
  }

  /* 03 — HIDE THIRD SERVICE AREA CARD */

  .ct-detail-card:nth-child(3) {
    display: none;
  }

  /* 04 — MOBILE MAP SIZE */

  .ct-coverage-map {
    padding: 0;
  }

  .ct-coverage-map img {
    max-width: 280px;
    max-height: 400px;
  }

}


/* CONTACT — MOBILE EMAIL SIZE */

@media (max-width: 600px) {
  .ct-detail-card .ct-email-value {
    font-size: 10px !important;
    white-space: nowrap;
    letter-spacing: -0.3px;
  }
}



/* =========================================
   RESPONSIVE V2.0 — BOOKING PAGE
========================================= */

@media (max-width: 600px) {

  /* 01 — HERO SPACING */

  .bk-hero {
    padding-top: 130px;
  }

  /* 02 — CONTACT EMAIL */

  .bk-contact-email {
    font-size: 15px;
    line-height: 1.5;
  }

}





/* =========================================
   RESPONSIVE V2.0 — CTA ALIGNMENT
========================================= */

@media (max-width: 600px) {

  .agri-hero-actions,
  .avi-hero-actions,
  .ind-hero-actions,
  .abt-hero-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

}


/* RESPONSIVE V2.0 — INDIVIDUAL QUOTE BUTTONS */

@media (max-width: 600px) {

  .agri-tailored-content > .domestic-cta,
  .avi-tailored-content > .domestic-cta,
  .ind-tailored-content > .ind-button {
    display: table;
    margin-left: auto;
    margin-right: auto;
  }

}

/* RESPONSIVE V2.0 — ABOUT FINAL CTA */

@media (max-width: 600px) {

  .abt-final-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

}


/* RESPONSIVE V2.0 — CONTACT BUTTON ALIGNMENT */

@media (max-width: 600px) {

  /* 01 — Contact Hero */
  .ct-hero-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  /* 02 — Before You Enquire */
  .ct-guidance-intro > .ct-button {
    display: flex;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
  }

  /* 03 — Final CTA */
  .ct-final-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

}