/* Responsive — all breakpoints in one place.
   Breakpoints: 1024 (tablet-down), 768 (mobile-up), 480 (small-mobile). */

@media (max-width: 1024px) {
  :root { --fs-display: clamp(2.4rem, 6vw + 1rem, 4rem); }

  .nav-links, .nav-dropdown { display: none; }
  .nav-cta { display: none; }
  .nav-burger { display: inline-flex; }

  .home-hero { min-height: calc(100vh - var(--nav-h)); }
  .home-hero .hero-project-badge { display: none; }
  /* Hero logo (watermark) — even more subtle on tablet so text stays readable */
  .home-hero .hero-logo {
    width: clamp(280px, 60vw, 440px);
    right: -4%;
  }
  @keyframes hero-logo-in {
    from { opacity: 0; transform: translate(40px, -50%); }
    to   { opacity: .1; transform: translate(0, -50%); }
  }

  .home-about { grid-template-columns: 1fr; gap: 2rem; }
  .home-about .media { aspect-ratio: 16/10; }

  .flagship { grid-template-columns: 1fr; }
  .flagship .flagship-media { min-height: 280px; }

  .capabilities-band .inner { grid-template-columns: 1fr; gap: 1.5rem; }

  .svc-body { grid-template-columns: 1fr; }
  .svc-body .aside { position: static; }

  .contact-layout { grid-template-columns: 1fr; }

  .about-block { grid-template-columns: 1fr; gap: 2rem; }
  .split-feature { grid-template-columns: 1fr; gap: 2rem; }

  .services-index .intro-grid { grid-template-columns: 1fr; gap: 1.5rem; }

  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }

  .why-grid { grid-template-columns: 1fr; }
  .why-grid > a:nth-child(5),
  .why-grid > article:nth-child(5) { grid-column: auto; }

  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-tile { border-right: none; border-bottom: 1px solid var(--line); }
  .stat-tile:nth-child(odd) { border-right: 1px solid var(--line); }
  .stat-tile:nth-last-child(-n+2) { border-bottom: 0; }

  .home-services .services-grid { grid-template-columns: 1fr 1fr; }
  .home-services .secondary-row { grid-template-columns: 1fr 1fr; }
  .utility-strip { grid-template-columns: 1fr; }
  .cert-row { grid-template-columns: 1fr; gap: 1rem; }

  .timeline { grid-template-columns: 1fr 1fr; }
  .timeline-item { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .timeline-item:nth-child(2n) { border-right: 0; }
  .timeline-item:nth-last-child(-n+2) { border-bottom: 0; }

  .industry-grid { grid-template-columns: 1fr 1fr; }
  .apega-pillars { grid-template-columns: 1fr; }
  .gallery-strip { grid-template-columns: 1fr 1fr; }
  .gallery-strip > *:first-child { grid-column: span 2; grid-row: span 1; aspect-ratio: 16/9; }

  .form-grid { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
  .section { padding-block: var(--space-5); }
  .section-lg { padding-block: var(--space-6); }

  .home-hero { padding-block: 1.75rem 2rem; min-height: calc(100vh - var(--nav-h)); }
  /* Hide hero logo on mobile — text needs full width */
  .home-hero .hero-logo { display: none; }
  .home-hero h1 { font-size: clamp(2.1rem, 8vw + .4rem, 3rem); max-width: none; }
  .home-hero .hero-ctas .btn { flex: 1; justify-content: center; }
  .home-hero .trust-row { display: none; }
  .home-hero .hero-accent-rule { display: none; }
  /* Stronger overlay on mobile so text always reads over the video */
  .home-hero::before {
    background: linear-gradient(180deg, rgba(11,27,59,.92) 0%, rgba(11,27,59,.72) 60%, rgba(11,27,59,.85) 100%);
  }

  .home-services .services-grid { grid-template-columns: 1fr; }
  .home-services .secondary-row { grid-template-columns: 1fr; }
  .why-grid { grid-template-columns: 1fr; }
  .utility-strip { grid-template-columns: 1fr; }
  .industry-grid { grid-template-columns: 1fr; }
  .gallery-strip { grid-template-columns: 1fr; }
  .gallery-strip > *:first-child { grid-column: span 1; aspect-ratio: 16/9; }

  .footer-grid { grid-template-columns: 1fr; gap: 2rem; }
  .footer-legal { flex-direction: column; align-items: flex-start; gap: .75rem; }
  .footer-legal .credentials { gap: .75rem; }

  .stats-grid { grid-template-columns: 1fr; }
  .stat-tile { border-right: 0; border-bottom: 1px solid var(--line); min-height: 120px; }
  .stat-tile:last-child { border-bottom: 0; }

  .timeline { grid-template-columns: 1fr; }
  .timeline-item { border-right: 0; border-bottom: 1px solid var(--line); }

  .nav-inner { padding-inline: 1rem; gap: 1rem; }
  /* Mobile nav: shorter bar, bigger logo (~80% larger than the old 32px),
     vertically centered within the bar. Override --nav-h here so the body's
     fixed-nav offset and the navy backdrop band auto-match. */
  :root {
    --nav-h: 84px;
    --nav-h-compact: 64px;
  }
  .nav-brand-clip,
  .site-nav.is-compact .nav-brand-clip {
    height: 56px;
    width: auto;
  }
  .nav-brand-clip .logo-full {
    position: relative;
    height: 56px;
    width: auto;
  }
  .nav-brand-clip .logo-mark { display: none; }
  .nav-brand-lock { display: none; }

  /* Hero on mobile: drop the video, use the poster image as a static
     background. Saves ~4MB on metered data, avoids autoplay quirks, and
     B2B mobile visitors are scanning for info, not consuming motion. */
  .home-hero .hero-video { display: none; }
  .home-hero {
    background-image: url('../images/who-we-are/6-x-20-Treater-being-lifted.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }

  .page-hero { padding-block: var(--space-5) var(--space-4); }

  .home-hero .hero-media .caption { left: 1rem; right: 1rem; bottom: 1rem; }

  .capabilities-band { padding-block: var(--space-5); }
  .cta-band { padding-block: var(--space-5); }
}

@media (max-width: 480px) {
  .container { padding-inline: 1.1rem; }
  .home-hero .chip { font-size: .68rem; }
  .home-hero .hero-sub { font-size: 1rem; }
  .home-hero .hero-ctas { flex-direction: column; align-items: stretch; }
  .home-hero .hero-ctas .btn { width: 100%; }
  .cert-item { padding: 1.25rem .85rem; }
  .numbered-card { padding: 1.4rem; }
  .service-tile .body { padding: 1.1rem 1.2rem 1.3rem; }
}
