/* ==========================================================================
   Responsive refinements — main.css is mobile-first with inline breakpoints;
   this file holds cross-cutting adjustments at specific widths.
   ========================================================================== */

/* Large desktop: give the wrap a touch more breathing room */
@media (min-width: 1440px) {
  :root { --content-pad: 3.5rem; }
}

/* Laptop */
@media (max-width: 1279px) and (min-width: 1024px) {
  .hero-grid { gap: 3rem; }
}

/* Tablet */
@media (max-width: 1023px) and (min-width: 768px) {
  .footer-top { grid-template-columns: 1fr 1fr; }
  .card-grid.cols-4 { grid-template-columns: repeat(2, 1fr); }
  .card-grid.cols-3 { grid-template-columns: repeat(2, 1fr); }
}

/* Small tablet / large phone */
@media (max-width: 767px) {
  .hero h1 { max-width: none; }
  .trust-strip ul { grid-template-columns: repeat(2, 1fr); }
  .section-head.split { align-items: flex-start; }
  .title-block { font-size: 0.8rem; }
}

/* Narrow phones */
@media (max-width: 430px) {
  :root { --header-h: 76px; }
  .brand img { height: 34px; }
  .brand-text { font-size: 1rem; }
  .btn { padding: 0.9rem 1.35rem; font-size: 0.78rem; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 360px) {
  h1 { font-size: 2.4rem; }
  .title-block dl { grid-template-columns: 1fr; }
  .title-block dt { padding-top: 0; }
}

/* Prevent horizontal overflow from long words / URLs in copy */
p, li, dd, address { overflow-wrap: anywhere; }

/* Landscape phones: shrink hero vertical padding */
@media (max-height: 480px) and (orientation: landscape) {
  .hero { padding-block: 2.5rem; }
}