/* ===========================================================
   Triveni Power - Mobile
   Comprehensive mobile overrides (≤ 767 px).

   Design rationale
   ─────────────────
   • All section headlines: 35 px → 26 px
   • Card / sub-titles:     30 px → 22 px
   • Body copy:             18 px → 16 px (min readable size)
   • Container gutter:      32 px → 20 px (more breathing room)
   • Section vertical pad:  nudged down where clamp starts too large
   • Touch targets:         never below 44 px
   • No horizontal overflow anywhere
   =========================================================== */

@media (max-width: 767px) {

  /* ── Global gutter tightening ─────────────────────────── */
  :root {
    --gutter: 20px;
  }


  /* ============================================================
     HERO
     ============================================================ */
  /* Title stays 35 px - bold all-caps reads well even on phones.
     Buttons already stack full-width via hero.css. */

  .hero__title {
    line-height: 1.15;                     /* font-size handled by fluid clamp in hero.css */
  }

  .hero__actions {
    gap: 10px;
  }


  /* ============================================================
     STATS - By the Numbers
     ============================================================ */
  .stats__headline {
    font-size: var(--fs-l);
    letter-spacing: 0.01em;
  }

  .stats__num {
    font-size: var(--fs-l);
  }

  .stats__label {
    font-size: var(--fs-m);
  }

  .stats__cell {
    padding: clamp(20px, 5vw, 32px) clamp(16px, 4vw, 24px);
  }


  /* ============================================================
     POSITIONING - Partners for the Long Run
     ============================================================ */
  .positioning__title {
    font-size: var(--fs-l);
    letter-spacing: 0.01em;
  }

  /* Band body paragraphs */
  .positioning__band-right .positioning__body {
    font-size: var(--fs-m);
  }

  .positioning__band-right .positioning__body--muted {
    font-size: var(--fs-m);
  }

  /* "Who We Are" CTA */
  .positioning__cta {
    height: 48px;
    font-size: var(--fs-s);
    padding: 0 22px;
  }

  /* Slider pagination dots */
  .positioning__slider-dot {
    width: 7px;
    height: 7px;
  }
  .positioning__slider-dot[aria-current="true"] {
    width: 20px;
  }


  /* ============================================================
     INDUSTRIES - Industries We Keep Running
     ============================================================ */
  .industries {
    padding: clamp(56px, 8vw, 88px) 0;
  }

  .industries__title {
    font-size: var(--fs-l);
    letter-spacing: 0.01em;
  }

  .industries__body {
    font-size: var(--fs-m);
  }

  .industries__header {
    margin-bottom: clamp(32px, 5vw, 56px);
  }

  .industries__row-head {
    font-size: var(--fs-m);
    min-height: 56px;
    gap: 12px;
  }

  .industries__meta-row dt {
    font-size: var(--fs-xs);
    letter-spacing: 0.10em;
  }

  .industries__meta-row dd {
    font-size: var(--fs-m);
  }

  .industries__cta {
    font-size: var(--fs-s);
    padding: 10px 18px;
    height: auto;
  }


  /* ============================================================
     ENGINEERING - the-engineering-inside
     ============================================================ */
  .engineering {
    padding: clamp(56px, 8vw, 96px) 0 clamp(32px, 4vw, 56px);
  }

  .engineering__title {
    font-size: var(--fs-l);
    letter-spacing: 0.01em;
  }

  .engineering__body {
    font-size: var(--fs-m);
  }

  /* Cards - reduce stagger offset and min-height on small screens */
  .engineering__card-slot {
    top: calc(68px + var(--i, 0) * 10px);
    margin-bottom: 36px;
  }

  .engineering__card {
    min-height: 0;
  }

  .engineering__card-title {
    font-size: var(--fs-m);
    letter-spacing: -0.01em;
  }

  .engineering__card-desc {
    font-size: var(--fs-m);
    line-height: 1.6;
  }


  /* ============================================================
     AFTERMARKET - Any Brand, Any Make, Anywhere
     ============================================================ */
  .aftermarket__title {
    font-size: var(--fs-l);
    letter-spacing: 0.01em;
  }

  .aftermarket__body {
    font-size: var(--fs-m);
  }

  .aftermarket__card-title {
    font-size: var(--fs-m);
    letter-spacing: -0.01em;
  }

  .aftermarket__card-desc {
    font-size: var(--fs-m);
  }


  /* ============================================================
     PREDICTION - From Precision to Prediction
     ============================================================ */
  .prediction {
    padding: clamp(48px, 7vw, 80px) 0 clamp(48px, 7vw, 72px);
    min-height: 0;
  }

  .prediction__title {
    font-size: var(--fs-l);
    letter-spacing: 0.01em;
  }

  .prediction__body {
    font-size: var(--fs-m);
  }

  /* Cards - already use clamp widths; just nudge content */
  .prediction__card-title {
    font-size: var(--fs-m);
    line-height: 1.35;
  }

  /* Dots */
  .prediction__dot {
    width: 7px;
    height: 7px;
  }


  /* ============================================================
     DEFENCE - engineered-for-the-forces-that-protect
     ============================================================ */
  .defence {
    padding: clamp(56px, 8vw, 96px) 0 clamp(56px, 8vw, 88px);
    min-height: 0;
  }

  .defence__header {
    gap: clamp(16px, 3vw, 24px);
    margin-bottom: clamp(36px, 5vw, 56px);
  }

  .defence__title {
    font-size: var(--fs-l);
    letter-spacing: 0.01em;
    line-height: 1.15;
  }

  .defence__body {
    font-size: var(--fs-m);
    max-width: 100%;
  }

  /* "Explore" CTA - full-width on small screens */
  .defence__cta {
    width: 100%;
    justify-content: center;
    height: 48px;
    font-size: var(--fs-s);
  }

  /* Cards - tighten icon and text */
  .defence__card {
    max-width: 100%;
  }

  .defence__card-icon {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
  }

  .defence__card-text {
    font-size: var(--fs-m);
  }

  .defence__card-text strong {
    font-size: var(--fs-m);
  }


  /* ============================================================
     PROOF - Proof, at Full Speed
     ============================================================ */
  .proof {
    padding: clamp(48px, 7vw, 80px) 0 clamp(48px, 7vw, 72px);
    min-height: 0;
  }

  .proof__title {
    font-size: var(--fs-l);
    letter-spacing: 0.01em;
  }

  .proof__body {
    font-size: var(--fs-m);
  }

  /* Nav arrow buttons - keep 44 px touch target */
  .proof__nav-btn {
    width: 44px;
    height: 44px;
  }

  /* Card content */
  .proof__card-title {
    font-size: var(--fs-m);
  }

  .proof__card-point dt {
    font-size: var(--fs-xs);
  }

  .proof__card-point dd {
    font-size: var(--fs-s);
  }

  .proof__card-cta {
    font-size: var(--fs-s);
    padding: 10px 18px;
  }


  /* ============================================================
     CONNECT - Let's Start the Conversation
     ============================================================ */
  .connect {
    padding: clamp(48px, 7vw, 80px) 0 clamp(40px, 6vw, 64px);
  }

  /* Remove nowrap so title doesn't overflow */
  .connect__title {
    font-size: var(--fs-l);
    letter-spacing: 0.01em;
    white-space: normal;
    line-height: 1.15;
  }

  .connect__body {
    font-size: var(--fs-m);
  }

  /* CTAs - already full-width at 600 px via connect.css */
  .connect__cta {
    height: 48px;
    font-size: var(--fs-s);
  }


  /* ============================================================
     FOOTER
     ============================================================ */
  .footer__logo svg {
    height: 34px;
  }

  .footer__tagline {
    font-size: var(--fs-m);
    letter-spacing: -0.01em;
  }

  .footer__copy {
    font-size: var(--fs-s);
  }

  .footer__address {
    font-size: var(--fs-s);
  }

  /* Stack brand + columns to single column on phones */
  .footer__top {
    grid-template-columns: 1fr;
  }

  /* Columns - keep 2-col grid on mobile (readable at 16 px) */
  .footer__cols {
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(24px, 5vw, 40px) clamp(16px, 4vw, 32px);
  }

  .footer__col-title {
    font-size: var(--fs-s);
    margin-bottom: 12px;
  }

  .footer__list a {
    font-size: var(--fs-s);
  }

  .footer__legal {
    font-size: var(--fs-s);
  }

  .footer__legal-links a {
    font-size: var(--fs-s);
  }

  .footer__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }

  /* Breadcrumbs (au-breadcrumb + milestones mst-breadcrumb): on narrow
     screens each crumb's text was wrapping mid-phrase ("Industry &" /
     "Applications"), which misaligned the > separators. Keep every crumb
     whole and let the ROW wrap as clean units instead. */
  .au-breadcrumb__inner,
  .mst-breadcrumb {
    flex-wrap: wrap;
    row-gap: 4px;
  }
  .au-breadcrumb__inner > *,
  .mst-breadcrumb > * {
    white-space: nowrap;
  }

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


/* ============================================================
   SMALL PHONES - 375 px and below
   Targeted fixes for the smallest common viewport.
   ============================================================ */
@media (max-width: 375px) {

  .stats__headline,
  .industries__title,
  .engineering__title,
  .aftermarket__title,
  .prediction__title,
  .defence__title,
  .proof__title,
  .connect__title,
  .positioning__title {
    font-size: var(--fs-m);
  }

  .industries__row-head {
    font-size: var(--fs-m);
  }

  .engineering__card-title,
  .aftermarket__card-title {
    font-size: var(--fs-m);
  }

}