/* ============================================================
   RESPONSIVE RULES
   Breakpoints: 1200 / 992 / 768 / 576
   ============================================================ */

@media (max-width: 1200px){
  :root{ --container-max: 1040px; }
  .hero-inner{ gap: var(--space-4); }
  .card-grid{ grid-template-columns: repeat(3,1fr); gap: var(--space-2); }
  .card-grid-4{ grid-template-columns: repeat(3,1fr); gap: var(--space-2); }
  .header-cta{ gap: 1rem; }
}

/* Nav switches to the off-canvas menu earlier than the 992px content
   breakpoint: with 8 top-level items plus the phone number and CTA
   button, anything narrower than ~1240px wraps the phone number. */
@media (max-width: 1240px){
  .main-nav{ display:none; }
  .nav-toggle{ display:flex; }
  .header-phone{ display:none; }
}

@media (max-width: 992px){
  .hero-inner{ grid-template-columns:1fr; text-align:left; }
  .hero-visual{ height:340px; margin-top:2rem; }
  .tri-card{ width:190px; padding:1.1rem; }
  .trivand{ grid-template-columns:1fr; }
  .trivand-item{ border-left:none; border-top:1px solid var(--line); }
  .trivand-item:first-child{ border-top:none; }
  .card-grid{ grid-template-columns: repeat(2,1fr); }
  .card-grid-2{ grid-template-columns: repeat(2,1fr); }
  .card-grid-4{ grid-template-columns: repeat(2,1fr); }
  .footer-top{ grid-template-columns: 1fr 1fr; gap: var(--space-4) var(--space-3); }
  .footer-brand{ grid-column: 1/-1; }
  .split{ grid-template-columns:1fr; gap: var(--space-4); }
  .split-media{ order:-1; }
  .stats-strip{ grid-template-columns: repeat(2,1fr); gap: var(--space-4) var(--space-2); }
  .stat-item{ border-right:none; border-bottom:1px solid var(--line-on-dark); padding-bottom: var(--space-3); }
  .gallery-grid{ grid-template-columns: repeat(3,1fr); }
}

@media (max-width: 768px){
  :root{ --space-6: 4.5rem; --space-7: 6rem; }
  .section{ padding: var(--space-5) 0; }
  .hero{ min-height:auto; padding-bottom: 4rem; }
  .card-grid{ grid-template-columns: 1fr; }
  .card-grid-2{ grid-template-columns: 1fr; }
  .card-grid-4{ grid-template-columns: 1fr 1fr; gap: var(--space-2); }
  .footer-top{ grid-template-columns: 1fr; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; }
  .page-hero{ padding: 8rem 0 3.5rem; }
  .gallery-grid{ grid-template-columns: repeat(2,1fr); }
  .job-card{ flex-direction:column; align-items:flex-start; }
  .job-card .btn{ width:100%; }
  .split-media{ max-height:280px; }
  .contact-info-card{ flex-direction:column; }
  body{ padding-bottom: 4.6rem; }
  .mobile-cta-bar{ display:flex; }
  .wa-float{ display:none; }
  .back-to-top{ bottom: 5.3rem; }
}

@media (max-width: 576px){
  .container{ padding: 0 1.1rem; }
  .hero-visual{ display:none; }
  .btn{ padding: 0.85em 1.4em; font-size:0.86rem; }
  .card-grid-4{ grid-template-columns: 1fr; gap: var(--space-2); }
  .gallery-grid{ grid-template-columns: repeat(2,1fr); gap:0.5rem; }
  .newsletter-box{ flex-direction:column; }
  .back-to-top, .wa-float{ width:44px; height:44px; bottom:1.1rem; }
  .back-to-top{ right:1.1rem; }
  .wa-float{ left:1.1rem; }
  .stats-strip{ grid-template-columns: 1fr 1fr; }
  .section-head h2{ font-size:1.7rem; }
  .map-embed{ height:260px; }
}