/*
 * responsive.css — Lawssolute single source of truth for responsive layout
 */

/* ══════════════════════════════════════════════════════════
   NAVBAR — Forced single row on all screen sizes
   ══════════════════════════════════════════════════════════ */
.navbar { padding-inline: 4%; }

.navbar__inner {
  max-width: 1160px;
  margin-inline: auto;
  height: 68px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 0;
}
.navbar__logo { flex-shrink: 0; }
.navbar__logo svg { height: 32px; }

.navbar__links {
  display: flex;
  align-items: center;
  gap: 0;
  flex: 1;
  justify-content: center;
  flex-wrap: nowrap;
}
.navbar__link {
  font-size: 12.5px;
  font-weight: 600;
  padding: 6px 11px;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.navbar__actions {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 6px;
}
.btn.btn-sm { font-size: 11.5px; padding: 7px 14px; }
.navbar__search-btn { width: 32px; height: 32px; }

/* CCFS urgent pill */
.navbar__link--urgent {
  background: rgba(229,62,62,0.12) !important;
  color: #FC8181 !important;
  border: 1px solid rgba(229,62,62,0.30) !important;
  border-radius: 6px !important;
  font-weight: 700 !important;
  font-size: 11.5px !important;
  padding: 5px 9px !important;
  animation: ccfs-pulse 2.5s ease-in-out infinite;
}
@keyframes ccfs-pulse {
  0%,100% { background: rgba(229,62,62,0.12); }
  50%      { background: rgba(229,62,62,0.22); }
}
.navbar__link--urgent:hover { background: rgba(229,62,62,0.28) !important; color: white !important; }

/* Mega dropdown */
.nav-mega {
  display: grid !important;
  grid-template-columns: repeat(4,1fr) !important;
  gap: 0;
  min-width: 860px !important;
  left: 0 !important;
  transform: translateX(-8%) translateY(8px) !important;
  padding: 8px 4px !important;
}
.navbar__item:hover .nav-mega,
.navbar__item:focus-within .nav-mega {
  transform: translateX(-8%) translateY(0) !important;
}
.nav-mega__col { padding: 8px 4px; border-right: 1px solid rgba(255,255,255,0.06); }
.nav-mega__col:last-child { border-right: none; }
.nav-mega__label {
  font-size: 9px; font-weight: 800; letter-spacing: 2px;
  text-transform: uppercase; color: #E5C77A;
  padding: 6px 12px 8px; display: block;
}

/* ══════════════════════════════════════════════════════════
   1280px – Large laptop
   ══════════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
  .navbar { padding-inline: 3%; }
  .navbar__link { font-size: 12px; padding: 6px 9px; }
  .nav-mega { min-width: 780px !important; }
}

/* ══════════════════════════════════════════════════════════
   1100px – Small laptop / large tablet landscape
   ══════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
  .navbar { padding-inline: 2%; }
  .navbar__link { font-size: 11.5px; padding: 5px 8px; }
  .btn.btn-sm { font-size: 11px; padding: 6px 11px; }
  .nav-mega { min-width: 700px !important; grid-template-columns: repeat(2,1fr) !important; }
}

/* ══════════════════════════════════════════════════════════
   1024px – Switch to hamburger menu
   ══════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .navbar__links { display: none !important; }
  .navbar__actions .btn-ghost { display: none !important; }
  .navbar__hamburger { display: flex !important; }
  .nav-mega { display: none !important; }
  .navbar__actions .btn-gold { font-size: 12px; padding: 8px 14px; }
}

/* ══════════════════════════════════════════════════════════
   768px – Tablet portrait & large phones
   ══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  :root { --nav-height: 60px !important; --section-pad-y: 56px; }

  .navbar { padding-inline: 4%; }
  .navbar__inner { height: 60px; }
  .navbar__logo svg { height: 26px; }

  /* Page heroes */
  .svc-hero  { padding-top: calc(60px + 28px) !important; padding-bottom: 48px !important; }
  .page-hero { padding-top: calc(60px + 32px) !important; }

  /* Grids */
  .content-with-sidebar { grid-template-columns: 1fr !important; }
  .sidebar-cta-card { position: static !important; }
  .grid-2 { grid-template-columns: 1fr !important; gap: 24px !important; }
  .grid-3 { grid-template-columns: 1fr 1fr !important; }
  .grid-4 { grid-template-columns: 1fr 1fr !important; }
  .why-grid { grid-template-columns: 1fr 1fr !important; }
  .docs-grid { grid-template-columns: 1fr !important; }
  .related-grid { grid-template-columns: repeat(3,1fr) !important; }
  .steps-row { grid-template-columns: 1fr 1fr !important; }
  .steps-row::before { display: none; }

  /* City service grids */
  #city-services-grid { grid-template-columns: repeat(3,1fr) !important; }
  .svc-grid { grid-template-columns: repeat(3,1fr) !important; }
  [style*="grid-template-columns:repeat(5,1fr)"] { grid-template-columns: repeat(3,1fr) !important; }
  [style*="grid-template-columns:repeat(4,1fr)"] { grid-template-columns: repeat(2,1fr) !important; }
  [style*="grid-template-columns:1fr 320px"] { grid-template-columns: 1fr !important; }
  [style*="grid-template-columns:1fr 360px"] { grid-template-columns: 1fr !important; }

  /* Hero CTAs */
  [style*="display:flex"][style*="gap:12px"] .btn { width: 100% !important; justify-content: center !important; }

  /* Footer */
  .site-footer__grid { grid-template-columns: 1fr !important; gap: 24px !important; }
  .site-footer__bottom { flex-direction: column; text-align: center; gap: 8px; }

  /* Stats */
  .stats-row { flex-wrap: wrap; }
  .stat-pill { flex: 0 0 50%; }
  .promise-strip { flex-direction: column; }
  .promise-item { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.07); }

  /* Forms */
  .form-grid { grid-template-columns: 1fr !important; }
  .lead-form-box .grid-2 { grid-template-columns: 1fr !important; }
  [style*="grid-template-columns:1fr 1fr"][style*="gap:14px"] { grid-template-columns: 1fr !important; }

  /* Tables */
  table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* Sticky bar */
  .sticky-cta-bar { flex-direction: column; padding: 10px 14px; gap: 8px; }
  .sticky-cta-bar .s-text { font-size: 12px; text-align: center; }
  .sticky-cta-bar .s-btns { width: 100%; justify-content: center; }
}

/* ══════════════════════════════════════════════════════════
   480px – Small phones (iPhone SE, older Android)
   ══════════════════════════════════════════════════════════ */
@media (max-width: 480px) {
  h1 { font-size: clamp(24px, 7.5vw, 38px) !important; line-height: 1.2 !important; }
  h2 { font-size: clamp(20px, 6vw, 30px) !important; }
  p  { font-size: 14px; }

  .why-grid { grid-template-columns: 1fr !important; }
  .related-grid { grid-template-columns: repeat(2,1fr) !important; }
  #city-services-grid { grid-template-columns: repeat(2,1fr) !important; }
  .svc-grid { grid-template-columns: repeat(2,1fr) !important; }
  [style*="grid-template-columns:repeat(5,1fr)"] { grid-template-columns: repeat(2,1fr) !important; }
  [style*="grid-template-columns:repeat(4,1fr)"] { grid-template-columns: 1fr 1fr !important; }

  .badge-row { gap: 5px; }
  .badge-row .badge { font-size: 10px; padding: 4px 8px; }
  .svc-icon { width: 52px; height: 52px; font-size: 22px; }
  .breadcrumb { font-size: 11px; }

  .grid-3 { grid-template-columns: 1fr !important; }
  .process-timeline { max-width: 100%; }

  /* How steps */
  .grid-4 { grid-template-columns: 1fr !important; }
  .how-step { padding: 14px; }
  .how-num { width: 34px; height: 34px; font-size: 14px; }

  /* Hero */
  .svc-hero { padding-left: 4% !important; padding-right: 4% !important; }
  .hero-inner { grid-template-columns: 1fr !important; }
  .hero-card { display: none !important; }

  /* Lead form */
  .lead-form-box { padding: 16px; }
  .ep-opt { padding: 8px 4px; font-size: 11px; }
  .ep-opt .ep-icon { font-size: 16px; }

  /* Float */
  .float-bar { right: 10px; bottom: 76px; gap: 6px; }
  .float-btn { width: 40px; height: 40px; font-size: 17px; }

  .pricing-row { font-size: 12px; padding: 11px 14px; }
  .faq-item summary { font-size: 13px; padding: 14px 16px; }
  .faq-item p { padding: 0 16px 14px; font-size: 13px; }
}

/* ══════════════════════════════════════════════════════════
   Global: prevent horizontal scroll + box model
   ══════════════════════════════════════════════════════════ */
html, body { overflow-x: hidden; -webkit-overflow-scrolling: touch; }
*, *::before, *::after { min-width: 0; box-sizing: border-box; }
img, svg, video { max-width: 100%; height: auto; }
[style*="min-width:600px"], [style*="min-width:580px"],
[style*="min-width:560px"], [style*="min-width:520px"] { min-width: unset !important; }
