/* =====================================================================
   MOBILE FIXES — automationconsulting.com.au
   ===================================================================== */


/* ── GLOBAL: smooth scroll offset so nav doesn't cover anchors ── */
html {
  scroll-padding-top: 90px;
}


/* ===================================================================
   1. BODY TEXT — bigger, darker, easier to read on mobile
   =================================================================== */
@media (max-width: 768px) {

  body,
  p,
  li,
  td,
  .wp-block-paragraph,
  [class*="body-text"],
  [class*="description"],
  [class*="subtitle"],
  [class*="content"] p {
    font-size: 16px !important;
    line-height: 1.7 !important;
  }

  /* Body text on white/light backgrounds — near-black for readability */
  .light-bg p,
  .white-section p,
  section[style*="background: #fff"] p,
  section[style*="background:#fff"] p,
  section[style*="background: white"] p {
    color: #111111 !important;
  }


/* ===================================================================
   2. HERO SECTION — consistent line-height, no overlap, no giant gaps
   =================================================================== */

  /* Hero headings — consistent across all pages */
  .hero h1,
  .hero-section h1,
  [class*="hero"] h1,
  .page-hero h1,
  .wp-block-cover h1,
  .entry-content > h1:first-child {
    font-size: clamp(28px, 8vw, 44px) !important;
    line-height: 1.15 !important;
    letter-spacing: -0.02em !important;
    margin-bottom: 16px !important;
  }

  /* Hero subtext / descriptor line */
  .hero p,
  .hero-section p,
  [class*="hero"] p,
  .page-hero p {
    font-size: clamp(15px, 4vw, 18px) !important;
    line-height: 1.6 !important;
    margin-bottom: 24px !important;
  }

  /* Tighten hero section top/bottom padding — fixes giant gaps */
  .hero,
  .hero-section,
  [class*="hero-wrap"],
  [class*="hero-inner"],
  .page-hero {
    padding-top: 60px !important;
    padding-bottom: 40px !important;
    min-height: unset !important;
  }


/* ===================================================================
   3. "Headquartered in Sydney" meta line — readable & styled
   =================================================================== */

  [class*="hq-line"],
  [class*="meta-line"],
  [class*="location-line"],
  .hero .location,
  .hero small,
  p.hq-meta {
    font-size: 13px !important;
    color: rgba(255,255,255,0.55) !important;
    letter-spacing: 0.03em !important;
    line-height: 1.6 !important;
    display: block !important;
    text-align: center !important;
    margin-bottom: 20px !important;
  }


/* ===================================================================
   4. CTA BUTTONS — font size larger than section labels
   =================================================================== */

  a.wp-block-button__link,
  .wp-element-button,
  a.ac-btn.ac-btn--primary,
  a.btn-primary,
  a.btn-primary-lg,
  a.btn-primary-nav,
  a.cta-btn-primary,
  a.btn-cta,
  a.hero-btn-primary,
  a.nav-cta,
  a.ac-nav-cta {
    font-size: 16px !important;
    padding: 14px 28px !important;
    min-height: 50px !important;
    white-space: normal !important;      /* allow wrap if needed */
    text-align: center !important;
    line-height: 1.3 !important;
  }

  /* Section label tags (e.g. "Industries", "Our Capabilities") */
  [class*="section-tag"],
  [class*="section-label"],
  [class*="eyebrow"],
  .wp-block-button.is-style-outline a,
  .tag-label {
    font-size: 11px !important;
    letter-spacing: 0.08em !important;
  }


/* ===================================================================
   0. HERO — badge one line + CTA buttons in one row
   =================================================================== */

  /* Hide "Book appointment" on mobile — only show primary CTA */
  .ac-hero-btn.ac-hero-btn-secondary {
    display: none !important;
  }


/* ===================================================================
   0b. HERO BADGE — one line, smaller on mobile
   =================================================================== */

  .ac-badge {
    font-size: 12px !important;
    padding: 6px 14px !important;
    white-space: nowrap !important;
    letter-spacing: 0.02em !important;
  }


/* ===================================================================
   5. TRUSTED BY — pinned label + swipeable logo track
   =================================================================== */

  /* Carousel: label on its own line above, track scrolls below */
  .ac-trust-carousel {
    display: block !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  /* Hide fade-edge gradients — not needed with swipe layout */
  .ac-trust-carousel::before,
  .ac-trust-carousel::after {
    display: none !important;
  }

  /* Label: own line above the logos, not inside the scroll container */
  .ac-trust-carousel__label {
    display: block !important;
    margin-bottom: 14px !important;
    font-size: 11px !important;
  }

  /* Track: the scroll container — logos swipe left/right below the label */
  .ac-trust-carousel__track {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    animation: none !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: auto !important;
    margin: 0 !important;
    gap: 2.5rem !important;
    padding: 4px 0 !important;
  }

  .ac-trust-carousel__track::-webkit-scrollbar {
    display: none !important;
  }

  /* Logos: slightly larger */
  .ac-trust-logo {
    height: 30px !important;
    width: auto !important;
    max-width: 110px !important;
    flex-shrink: 0 !important;
  }

  .ac-trust-logo--no-filter {
    height: 30px !important;
    max-width: 110px !important;
  }


/* ===================================================================
   6b. GARAGE / OUR CAPABILITIES — mobile swipe carousel
   =================================================================== */

  /* Hide desktop mind map and the existing mobile grid layout */
  .garage-diagram,
  .garage-mobile-centre,
  .garage-cta {
    display: none !important;
  }

  /* Keep section background, reset padding */
  .garage-section {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }

  .garage-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Heading: centred */
  .garage-heading {
    padding-left: 24px !important;
    padding-right: 24px !important;
    margin-bottom: 20px !important;
    text-align: center !important;
  }

  /* Tool list becomes a swipe carousel — same pattern as Trusted By */
  .garage-mobile-grid {
    display: block !important;
  }

  .garage-mobile-tools {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    gap: 2.5rem !important;
    align-items: center !important;
    padding: 4px 24px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .garage-mobile-tools::-webkit-scrollbar {
    display: none !important;
  }

  /* Each tool circle becomes a plain logo — remove the circle decoration */
  .garage-mobile-tool {
    flex-shrink: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Logo images: same height as Trusted By logos */
  .garage-mobile-tool img,
  .garage-mobile-tool .garage-tool-logo {
    height: 30px !important;
    width: auto !important;
    max-width: 110px !important;
    filter: brightness(0) invert(1) !important;
    opacity: 0.85 !important;
    flex-shrink: 0 !important;
  }

  /* n8n logo has its own colour — keep it */
  .garage-mobile-tool .garage-tool-logo:not(.garage-tool-logo--inverted) {
    filter: brightness(0) invert(1) !important;
  }


/* ===================================================================
   6. "OUR CAPABILITIES" SECTION — homepage
   =================================================================== */

  /* Tab row — horizontally scrollable, no wrapping */
  [class*="capabilities-tabs"],
  [class*="capability-nav"],
  [class*="tab-nav"],
  [class*="tab-list"] {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    gap: 8px !important;
    padding-bottom: 6px !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }

  [class*="capabilities-tabs"]::-webkit-scrollbar,
  [class*="tab-nav"]::-webkit-scrollbar {
    display: none !important;
  }

  [class*="capabilities-tabs"] > *,
  [class*="tab-list"] > * {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
  }

  /* Capability cards below the tabs */
  [class*="capability-card"],
  [class*="capabilities-grid"],
  [class*="service-card"] {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }


/* ===================================================================
   7. FINAL CTA SECTION — bottom padding, headline size, button text
   =================================================================== */

  .ac-cta-wrapper-bg {
    padding-bottom: 80px !important;
  }

  [class*="final-cta"],
  [class*="cta-section"],
  [class*="cta-block"],
  section.ac-cta,
  .ac-cta {
    padding-bottom: 80px !important;
    padding-top: 80px !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  /* Headline — match homepage CTA size, beats cap-hero inline 28px override */
  body .ac-cta__title,
  body .ac-cta__heading {
    font-size: clamp(26px, 7vw, 36px) !important;
    line-height: 1.2 !important;
  }

  /* Supporting text below CTA buttons */
  .ac-cta__support-text {
    color: #ffffff !important;
    font-size: 15px !important;
    margin-top: 20px !important;
    margin-bottom: 0 !important;
    opacity: 0.85 !important;
    letter-spacing: 0.01em !important;
  }

  /* Button row — stack vertically, full width */
  .ac-cta__buttons {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
  }

  /* Final CTA button text — should NOT be 4-5 lines */
  [class*="final-cta"] a,
  [class*="cta-section"] a,
  .ac-cta a,
  [class*="cta-block"] a {
    font-size: 16px !important;
    padding: 15px 32px !important;
    white-space: normal !important;
    max-width: 100% !important;
    width: auto !important;
    display: inline-flex !important;
  }


/* ===================================================================
   8. THE FIRM PAGE — reduce glitches, tighten sections
   =================================================================== */

  /* "We find the root causes" heading — prevent overflow */
  [class*="root-causes"],
  [class*="firm-hero"] h1,
  [class*="firm-hero"] h2,
  .firm-page h1,
  .firm-page h2 {
    font-size: clamp(26px, 7vw, 38px) !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    word-break: break-word !important;
  }

  /* Our Approach section — tighter, no excessive height */
  [class*="our-approach"],
  [class*="approach-section"],
  [id*="approach"] {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
    overflow: hidden !important;
  }

  [class*="our-approach"] [class*="step"],
  [class*="approach-section"] [class*="step"] {
    padding: 20px !important;
    margin-bottom: 16px !important;
  }

  /* Our Team section */
  [class*="our-team"],
  [class*="team-section"],
  [id*="team"] {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }

  [class*="team-grid"],
  [class*="team-members"] {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
  }

  /* Open Roles — font size fix + wrap properly */
  [class*="open-roles"],
  [class*="roles-section"],
  [id*="roles"],
  [class*="careers"] {
    padding: 40px 20px !important;
  }

  [class*="open-roles"] p,
  [class*="roles-section"] p,
  [class*="careers"] p,
  [class*="role-item"] {
    font-size: 15px !important;
    line-height: 1.6 !important;
    white-space: normal !important;
    word-break: break-word !important;
  }

  [class*="role-item"],
  [class*="job-listing"] {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    padding: 16px !important;
    box-sizing: border-box !important;
  }

  /* Stop scroll glitches from elements wider than viewport */
  .firm-page,
  body.page-template-firm,
  [class*="firm-page"] {
    overflow-x: hidden !important;
  }


/* ===================================================================
   9. CAPABILITIES INNER PAGES (e.g. /cto-as-a-service/)
   =================================================================== */

  /* Challenge quote — wider on mobile, still overlaps image bottom-right */
  .ac-capp-challenge__quote-overlay {
    width: 85% !important;
  }

  /* Push problem list below the overhanging quote overlay */
  .ac-capp-challenge__img-wrap {
    margin-bottom: 4rem !important;
  }

  /* Challenge section headline — <p> tag gets crushed by global p rule; match other section titles */
  .ac-capp-challenge__title {
    font-size: 28px !important;
    line-height: 1.2 !important;
    letter-spacing: -0.02em !important;
  }

  /* Quote block in Challenge section —
     give it proper margin from screen edges, stop it overlapping cards */
  [class*="challenge"] blockquote,
  [class*="challenge-quote"],
  [class*="quote-block"],
  .wp-block-quote {
    margin: 0 16px 32px 16px !important;
    padding: 24px 20px !important;
    width: calc(100% - 32px) !important;
    box-sizing: border-box !important;
    position: relative !important;
    z-index: 1 !important;
    float: none !important;
    clear: both !important;
  }

  /* Challenge problem blocks — ensure they sit below the quote */
  [class*="challenge-problem"],
  [class*="problem-block"],
  [class*="challenge_problem"] {
    margin-top: 16px !important;
    position: relative !important;
    z-index: 0 !important;
    clear: both !important;
  }

  /* Solution section — tighter horizontal padding, half height, background zoomed to top-centre */
  .ac-capp-solution {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
    padding-left: 28px !important;
    padding-right: 28px !important;
    background-size: 180% !important;
    background-position: top center !important;
  }

  /* Bigquote — centred on all sides, larger text */
  .ac-capp-bigquote {
    padding-left: 16px !important;
    padding-right: 16px !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .ac-capp-bigquote__text {
    font-size: clamp(1.6rem, 5.5vw, 2rem) !important;
    line-height: 1.5 !important;
    text-align: center !important;
  }


/* ===================================================================
   9b. INDUSTRIES PAGE — banner text colour
   =================================================================== */

/* ===================================================================
   9c. FOOTER — touch target size
   =================================================================== */

  /* Column headings */
  .ac-footer__heading {
    font-size: 12px !important;
    margin-top: 28px !important;
    margin-bottom: 8px !important;
  }

  /* Links: larger text + tall touch target via padding */
  .ac-footer__links li {
    list-style: none !important;
  }

  .ac-footer__links a {
    display: block !important;
    font-size: 15px !important;
    padding: 11px 0 !important;
    line-height: 1.4 !important;
  }

  /* Hide the "Connect" column (last column in footer) */
  .ac-footer .wp-block-columns .wp-block-column:last-child {
    display: none !important;
  }

  /* Brand description */
  .ac-footer__desc {
    font-size: 15px !important;
    line-height: 1.6 !important;
  }

  /* Bottom bar copyright */
  .ac-footer p,
  .ac-footer .wp-block-paragraph {
    font-size: 13px !important;
  }




  .ac-industries__banner-text {
    color: #ffffff !important;
  }


/* ===================================================================
   10. GLOBAL OVERFLOW GUARD — nothing breaks out of viewport
   =================================================================== */

  body {
    overflow-x: hidden !important;
  }

  img:not(.ac-trust-logo):not(.ac-logo img):not(.garage-tool-logo),
  video,
  iframe,
  figure {
    max-width: 100% !important;
    height: auto !important;
  }

  * {
    box-sizing: border-box !important;
  }

  section,
  .wp-block-group {
    padding-left: max(16px, 4vw) !important;
    padding-right: max(16px, 4vw) !important;
  }


/* ===================================================================
   11. MOBILE MENU — drill-down (push) navigation
   =================================================================== */

  /* Overlay: clip panels, no padding (panels handle their own) */
  .ac-mobile-menu {
    display: block !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  /* Panels container fills the overlay */
  .ac-mob-panels {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    overflow: hidden !important;
  }

  /* Each panel fills the overlay and slides horizontally */
  .ac-mob-panel {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 96px 24px 100px !important;
    box-sizing: border-box !important;
    background: rgba(1, 13, 18, 0.98) !important;
    transform: translateX(100%) !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  }

  .ac-mob-panel--active {
    transform: translateX(0) !important;
  }

  .ac-mob-panel--exit {
    transform: translateX(-30%) !important;
  }

  /* Shared nav list — override base .ac-mobile-menu ul centering */
  .ac-mob-nav {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 32px !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
  }

  /* Every nav item row */
  .ac-mob-nav li {
    width: 100% !important;
    border-bottom: none !important;
  }

  /* Plain link row — also resets base .ac-mobile-menu a bleed */
  .ac-mob-nav__link {
    display: block !important;
    width: 100% !important;
    padding: 18px 0 !important;
    color: #fff !important;
    text-decoration: none !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;
    border-radius: 0 !important;
    background: none !important;
    text-align: left !important;
    box-sizing: border-box !important;
  }

  /* "All Capabilities / All Industries" heading row */
  .ac-mob-nav__link--all {
    font-weight: 700 !important;
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 12px !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    padding-bottom: 14px !important;
  }

  .ac-mob-nav__link:hover,
  .ac-mob-nav__link.active {
    color: #07AECF !important;
    background: none !important;
  }

  /* Drill button (has sub-panel) — same height as plain links */
  .ac-mob-nav__drill {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    background: none !important;
    border: none !important;
    padding: 18px 0 !important;
    color: #fff !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;
    text-align: left !important;
    cursor: pointer !important;
    touch-action: manipulation !important;
    box-sizing: border-box !important;
  }

  .ac-mob-nav__drill.active span,
  .ac-mob-nav__drill:hover span {
    color: #07AECF !important;
  }

  .ac-mob-nav__drill svg {
    flex-shrink: 0 !important;
    opacity: 0.5 !important;
  }

  /* Back button at top of sub-panels */
  .ac-mob-back {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: none !important;
    border: none !important;
    color: rgba(255, 255, 255, 0.5) !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    padding: 0 0 28px !important;
    cursor: pointer !important;
    touch-action: manipulation !important;
  }

  /* CTA — inline at bottom of each panel's content */
  .ac-mob-cta {
    display: inline-flex !important;
    margin-top: 32px !important;
    position: static !important;
  }

  /* "See all" — styled as a dimmed list item, clearly not a button */
  .ac-mob-nav__link--see-all {
    color: rgba(255, 255, 255, 0.45) !important;
    font-size: 13px !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    padding-top: 14px !important;
  }

  .ac-mob-nav__link--see-all:hover {
    color: #07AECF !important;
  }


/* ===================================================================
   12. HEADER — flat bar: logo top-left, icons top-right
   =================================================================== */

  /* Remove pill padding so bar sits flush to screen edges */
  .ac-header-wrap,
  .ac-header-wrap.wp-block-template-part {
    padding: 0 !important;
    /* keep zoom:1.25 from homepage CSS — do not override here */
  }

  /* Pill becomes a full-width flat bar */
  .ac-header-pill {
    width: 100% !important;
    border-radius: 0 !important;
    padding: 14px 20px !important;
    justify-content: space-between !important;
    box-shadow: 0 2px 24px rgba(0, 0, 0, 0.5) !important;
  }

  /* Hide the decorative gradient border on mobile */
  .ac-header-pill::before {
    display: none !important;
  }

  /* Right-side icon group: search + hamburger */
  .ac-header-icons {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    margin-left: auto !important;
  }

  /* Search trigger button */
  .ac-search-trigger {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    padding: 0 !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #fff !important;
    touch-action: manipulation !important;
  }

  /* Search bar — slides in below the header */
  .ac-search-bar {
    position: fixed !important;
    top: 68px !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1199 !important;
    background: rgba(5, 10, 20, 0.98) !important;
    padding: 14px 20px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  .ac-search-bar[hidden] {
    display: none !important;
  }

  .ac-search-bar form {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .ac-search-bar input[type="search"] {
    flex: 1 !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 24px !important;
    padding: 10px 18px !important;
    color: #fff !important;
    font-size: 16px !important;
    outline: none !important;
    -webkit-appearance: none !important;
  }

  .ac-search-bar input[type="search"]::placeholder {
    color: rgba(255, 255, 255, 0.4) !important;
  }

  .ac-search-bar button[type="submit"] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #07AECF !important;
    border: none !important;
    border-radius: 50% !important;
    width: 42px !important;
    height: 42px !important;
    flex-shrink: 0 !important;
    cursor: pointer !important;
  }

/* ===================================================================
   13. "WHO NEEDS THIS" — same stacking card design as "What We Deliver"
   =================================================================== */

  .ac-capp-scenarios__grid {
    display: flex !important;
    flex-direction: column !important;
    isolation: isolate !important;
    gap: 0 !important;
  }

  .ac-capp-scenarios__card {
    border-radius: 16px !important;
    box-shadow: 0 4px 0 rgba(255,255,255,1), 0 -4px 24px rgba(0,0,0,0.09) !important;
    margin-top: -10px !important;
    position: relative !important;
  }

  .ac-capp-scenarios__card:first-child {
    margin-top: 0 !important;
  }

  .ac-capp-scenarios__card:nth-child(1) { z-index: 1 !important; }
  .ac-capp-scenarios__card:nth-child(2) { z-index: 2 !important; }
  .ac-capp-scenarios__card:nth-child(3) { z-index: 3 !important; }
  .ac-capp-scenarios__card:nth-child(4) { z-index: 4 !important; }
  .ac-capp-scenarios__card:nth-child(5) { z-index: 5 !important; }
  .ac-capp-scenarios__card:nth-child(6) { z-index: 6 !important; }


/* ===================================================================
   14. "HOW WE TRANSFORM" — hide SVG visual on mobile
   =================================================================== */

  .hwt-visual {
    display: none !important;
  }

  .hwt-step-num {
    display: none !important;
  }


/* ===================================================================
   15. "MORE FROM THE GARAGE" — prevent line overlap on mobile
   =================================================================== */

  .ac-capp-related h2 {
    font-size: clamp(24px, 7vw, 36px) !important;
    line-height: 1.2 !important;
  }


/* ===================================================================
   16. POPUP FORM — centred vertically on mobile
   =================================================================== */

  .ac-modal {
    align-items: center !important;
    justify-content: center !important;
    padding: 1rem !important;
  }

  .ac-modal__dialog {
    margin: auto !important;
    max-height: 82vh !important;
    width: 100% !important;
  }

} /* end @media (max-width: 768px) */