/* ============================================================
   Homepage spacing / layout / accessibility system
   Scoped to body.ac-homepage — affects the front page ("/") only.
   Loaded LAST (priority 100) so it wins over the other homepage CSS.

   Brand identity is intentionally PRESERVED:
     - pill buttons (radius unchanged)
     - rounded cards (radius unchanged)
     - 48px bold section headings (size/weight unchanged)

   Fully reversible: delete this file + its wp_enqueue_style() in
   functions.php ('ac-homepage-system').
   Applied 2026-07-01.
   ============================================================ */

/* Prevent horizontal scroll at all breakpoints */
body.ac-homepage { overflow-x: hidden; }

/* ── Section padding → 5rem 9rem ───────────────────────────── */
body.ac-homepage .ac-problem,
body.ac-homepage .racetrack-section,
body.ac-homepage .ac-what-we-do,
body.ac-homepage .ac-cases-scroll,
body.ac-homepage .ac-insights-posts,
body.ac-homepage .ac-industries--framed,
body.ac-homepage .ac-testimonials,
body.ac-homepage .ac-home-faq,
body.ac-homepage .ac-bottom-cta,
body.ac-homepage .ac-footer {
  padding: 5rem 9rem !important;
}
/* Its inner used to carry the gutter (0 60px) — the section pads now */
body.ac-homepage .ac-testimonials__inner {
  padding-left: 0;
  padding-right: 0;
}

/* ── Hero: join the 9rem side-gutter rule so the LEFT-aligned hero copy lines
      up with the content in the sections below. Horizontal only — the hero's
      vertical sizing stays 0 (it's a full-height section). The full-bleed
      background video is unaffected (position:absolute; inset:0 fills the
      padding box regardless of padding). ── */
body.ac-homepage .ac-hero {
  padding-left: 9rem !important;
  padding-right: 9rem !important;
}
@media (max-width: 960px) {
  body.ac-homepage .ac-hero { padding-left: 3rem !important; padding-right: 3rem !important; }
}
@media (max-width: 600px) {
  body.ac-homepage .ac-hero { padding-left: 1.25rem !important; padding-right: 1.25rem !important; }
}

/* ── Content width: widen toward the gutters for an edge-to-edge
      feel. The section side padding (2rem) becomes the gutter on
      typical screens; caps at 1680px on very large monitors.
      !important guards against any inline / wp-container constraint. */
body.ac-homepage .ac-problem__inner,
body.ac-homepage .ac-what-we-do__inner,
body.ac-homepage .ac-approach__inner,
body.ac-homepage .ac-roi-embed__inner,
body.ac-homepage .ac-testimonials__inner,
body.ac-homepage .ac-insights-posts__inner,
body.ac-homepage .ac-home-faq__layout {
  max-width: 1680px !important;
  margin-left: auto;
  margin-right: auto;
}

/* ── Card grid gap ───────────────────────────────────────── */
body.ac-homepage .ac-insights-posts__grid { gap: 0.75rem; }

/* ── Headlines: balanced wrapping (no size/weight change) ─── */
body.ac-homepage .ac-hero__title,
body.ac-homepage .racetrack-headline,
body.ac-homepage .ac-what-we-do__headline,
body.ac-homepage .ac-industries__title,
body.ac-homepage .ac-cases-heading,
body.ac-homepage .ac-testimonials__heading,
body.ac-homepage .ac-insights-posts__title,
body.ac-homepage .ac-bottom-cta__heading {
  text-wrap: balance;
}

/* ── Buttons: 44px minimum tap target (shape unchanged) ───── */
body.ac-homepage .ac-btn,
body.ac-homepage .ac-hero-btn-primary,
body.ac-homepage .ac-hero-btn-secondary,
body.ac-homepage .ac-bottom-cta__btn-primary,
body.ac-homepage .ac-bottom-cta__btn-secondary,
body.ac-homepage .ac-roi-cta-btn {
  min-height: 44px;
}

/* ── Tablet ≤960px ───────────────────────────────────────── */
@media (max-width: 960px) {
  body.ac-homepage .ac-problem,
  body.ac-homepage .racetrack-section,
  body.ac-homepage .ac-what-we-do,
  body.ac-homepage .ac-cases-scroll,
  body.ac-homepage .ac-insights-posts,
  body.ac-homepage .ac-industries--framed,
  body.ac-homepage .ac-testimonials,
  body.ac-homepage .ac-home-faq,
  body.ac-homepage .ac-bottom-cta,
  body.ac-homepage .ac-footer {
    padding: 5rem 3rem !important;
  }
  body.ac-homepage .ac-insights-posts__grid { grid-template-columns: 1fr; }
}

/* ── Mobile ≤600px ───────────────────────────────────────── */
@media (max-width: 600px) {
  body.ac-homepage .ac-problem,
  body.ac-homepage .racetrack-section,
  body.ac-homepage .ac-what-we-do,
  body.ac-homepage .ac-cases-scroll,
  body.ac-homepage .ac-insights-posts,
  body.ac-homepage .ac-industries--framed,
  body.ac-homepage .ac-testimonials,
  body.ac-homepage .ac-home-faq,
  body.ac-homepage .ac-bottom-cta,
  body.ac-homepage .ac-footer {
    padding: 3rem 1.25rem !important;
  }
  body.ac-homepage .ac-insights-posts__grid { grid-template-columns: 1fr; }
}

/* ── Accessibility: reduced motion ───────────────────────── */
@media (prefers-reduced-motion: reduce) {
  body.ac-homepage *,
  body.ac-homepage *::before,
  body.ac-homepage *::after {
    transition: none !important;
    animation: none !important;
    scroll-behavior: auto !important;
  }
}

/* ── Consistent vertical rhythm between ALL homepage sections ──────────────
   Loads last, so this normalises every band's top/bottom spacing regardless
   of the ad-hoc values each section carried (industries 100/200px, cta 60/0,
   faq 2.5rem margin, the rest 5rem). Vertical only — each section keeps its
   own horizontal gutters. Added 2026-07-03.
   ───────────────────────────────────────────────────────────────────────── */
body.ac-homepage .ac-trust-band,
body.ac-homepage .racetrack-section,
body.ac-homepage .ac-what-we-do,
body.ac-homepage .ac-industries,
body.ac-homepage .ac-cases-scroll,
body.ac-homepage .ac-testimonials,
body.ac-homepage .ac-home-faq,
body.ac-homepage .ac-capp-faq,
body.ac-homepage .ac-insights-posts,
body.ac-homepage .ac-bottom-cta,
body.ac-homepage .ac-lead-form,
body.ac-homepage .ac-cta-wrapper-bg {
  padding-top: 7rem !important;
  padding-bottom: 7rem !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
@media (max-width: 960px) {
  body.ac-homepage .ac-trust-band,
  body.ac-homepage .racetrack-section,
  body.ac-homepage .ac-what-we-do,
  body.ac-homepage .ac-industries,
  body.ac-homepage .ac-cases-scroll,
  body.ac-homepage .ac-testimonials,
  body.ac-homepage .ac-home-faq,
  body.ac-homepage .ac-capp-faq,
  body.ac-homepage .ac-insights-posts,
  body.ac-homepage .ac-bottom-cta,
  body.ac-homepage .ac-lead-form,
  body.ac-homepage .ac-cta-wrapper-bg {
    padding-top: 5rem !important;
    padding-bottom: 5rem !important;
  }
}
@media (max-width: 600px) {
  body.ac-homepage .ac-trust-band,
  body.ac-homepage .racetrack-section,
  body.ac-homepage .ac-what-we-do,
  body.ac-homepage .ac-industries,
  body.ac-homepage .ac-cases-scroll,
  body.ac-homepage .ac-testimonials,
  body.ac-homepage .ac-home-faq,
  body.ac-homepage .ac-capp-faq,
  body.ac-homepage .ac-insights-posts,
  body.ac-homepage .ac-bottom-cta,
  body.ac-homepage .ac-lead-form,
  body.ac-homepage .ac-cta-wrapper-bg {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }
}
/* Every band — including .ac-cases-scroll directly under the hero — follows the
   shared 7rem / 5rem / 3.5rem vertical rhythm above, so the gap on either side
   of each section divider is identical page-wide. (The old .ac-trust-band /
   cases-scroll top-padding trims were removed 2026-07-07: the trust logos now
   live INSIDE the hero as .ac-trust-carousel, and the trimmed 4rem cases top
   read too tight against the hero.) */

/* (Client Impact / case-studies redesigned to a horizontal-card list — the old
   sticky-scroll full-bleed centring fix was removed; the section now uses the
   standard 9rem gutters and its inner .ac-impact__list is max-width-centred.) */

/* Subtle divider line between homepage sections. Applied as a top border on each
   section, so a line sits at every section boundary — EXCEPT after the hero: the
   quote section (which sits directly under the hero) is intentionally omitted, so
   there is no divider between the hero and the quote. The line is inset 9rem on
   each side (matching the section gutters) via a border-image gradient that is
   transparent for the first/last --ac-divider-inset. Added 2026-07-06. */
body.ac-homepage { --ac-divider-inset: 9rem; }
@media (max-width: 960px) { body.ac-homepage { --ac-divider-inset: 2rem; } }
@media (max-width: 600px) { body.ac-homepage { --ac-divider-inset: 1.5rem; } }

body.ac-homepage .ac-cases-scroll,
body.ac-homepage .racetrack-section,
body.ac-homepage .ac-what-we-do,
body.ac-homepage .ac-industries,
body.ac-homepage .ac-testimonials,
body.ac-homepage .ac-home-faq,
body.ac-homepage .ac-insights-posts,
body.ac-homepage .ac-lead-form,
body.ac-homepage .ac-cta-wrapper-bg {
  border-top: 1px solid transparent;
  border-image: linear-gradient(
    to right,
    transparent var(--ac-divider-inset),
    rgba(9, 32, 42, 0.22) var(--ac-divider-inset),
    rgba(9, 32, 42, 0.22) calc(100% - var(--ac-divider-inset)),
    transparent calc(100% - var(--ac-divider-inset))
  ) 1;
}