@media (max-width: 1024px) {
      /* Tablet: brand spans full width on row 1, 3 link columns on row 2 */
      .site-footer .container {
        grid-template-columns: 1fr 1fr 1fr;
        gap: 36px;
      }
      .footer-brand {
        grid-column: 1 / -1 !important;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
      }
      .footer-brand p {
        max-width: 480px;
      }
    }

@media (max-width: 480px) {
      .site-footer .container {
        grid-template-columns: 1fr;
        gap: 28px;
      }
    }

@media (max-width: 1024px) {
      /* why-grid: 3 on top row, 2 centred on bottom row */
      .why-grid {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 24px;
      }
      .why-card {
        flex: 0 0 calc(33.333% - 16px);
        max-width: calc(33.333% - 16px);
      }
      .why-card:nth-child(4),
      .why-card:nth-child(5) {
        flex: 0 0 calc(33.333% - 16px);
        max-width: calc(33.333% - 16px);
      }
      .services-grid { grid-template-columns: repeat(2, 1fr); }

      /* Hero: stack columns on tablet */
      .hero-grid {
        grid-template-columns: 1fr;
        gap: 40px;
      }
      /* Centre hero text content on tablet */
      .hero-left {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
      }
      .hero-left .eyebrow { align-self: center; }
      .hero-left h1 { text-align: center; }
      .hero-left p { text-align: center; }
      .hero-phone { justify-content: center; }
      .hero-badges { justify-content: center; }
      .hero-left .btn { align-self: center; }
      .hero-left p { width: 100%; max-width: 100%; }
      /* Centre form heading and description on tablet */
      .hero-form-wrap h3 { text-align: center; }
      .hero-form-wrap .form-sub { text-align: center; }
    }

@media (max-width: 900px) {
      /* Problem section stacks: image on top, text below */
      .problem-grid {
        grid-template-columns: 1fr;
        min-height: unset; /* let content drive height when stacked */
      }
      .problem-image {
        height: 320px; /* fixed height for image row when stacked */
        min-height: unset;
      }
      .problem-image-overlay {
        background: linear-gradient(to bottom, transparent 60%, var(--grey) 100%);
      }
      .problem-text {
        padding: 72px 32px;
        justify-content: flex-start; /* stacked: no need to centre vertically */
      }
      /* FAQ section stacks: text on top, image below */
      .faq-grid {
        grid-template-columns: 1fr;
      }
      .faq-content {
        padding: 72px 32px;
      }
      .faq-image {
        min-height: 280px;
        order: -1; /* image above on mobile */
      }
      .faq-image-overlay {
        background: linear-gradient(to bottom, transparent 60%, var(--white) 100%);
      }
    }

@media (max-width: 768px) {
      .hero-grid { grid-template-columns: 1fr; gap: 36px; }
      .hero-form-wrap { padding: 28px 20px; }
      .services-grid { grid-template-columns: 1fr; }
      .why-grid { display: flex; flex-direction: column; align-items: stretch; gap: 16px; }
      .why-grid .why-card { width: 100%; max-width: 100%; flex: none; }
      .testimonials-grid { grid-template-columns: 1fr; }
      .sticky-cta { display: none; }
      body { padding-bottom: 0; }
      /* Hide top info bar on mobile */
      .topbar { display: none; }
      /* Reduce container side padding on mobile */
      .container { padding: 0 20px; }
      /* Fix section paddings that were too wide */
      .problem-text { padding: 56px 20px; }
      .faq-content { padding: 56px 20px; }
      /* Centre hero content on mobile */
      .hero-left { text-align: center; align-items: center; display: flex; flex-direction: column; }
      .hero-left .eyebrow { align-self: center; }
      .hero-phone { justify-content: center; }
      .hero-left p { text-align: center; }
      .hero-badges { justify-content: center; }
      .hero-left .btn { align-self: center; }
      /* Centre form heading and description on mobile */
      .hero-form-wrap h3 { text-align: center; }
      .hero-form-wrap .form-sub { text-align: center; }
      /* Footer logo larger on mobile */
      .footer-brand img { height: auto; width: 85%; max-width: 320px; object-fit: contain; }
    }

@media (max-width: 480px) {
      .why-grid { grid-template-columns: 1fr; }
      .hero-left h1 { font-size: 28px; }
      .hero-phone { font-size: 20px; }
      .section-heading { font-size: 24px; }
      .problem-text { padding: 48px 16px; }
      .faq-content { padding: 48px 16px; }
      .container { padding: 0 16px; }
    }

@media (max-width: 1024px) {
      /* Simple 3-col grid: logo | spacer | CTA
         Hamburger is absolutely centred so it never disrupts the grid row */
      .navbar .container {
        position: relative;
        display: grid;
        grid-template-columns: auto 1fr auto;
        align-items: center;
        padding-top: 8px;
        padding-bottom: 8px;
        gap: 0;
      }
      /* Collapse full menu into dropdown */
      .nav-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--dark);
        border-top: 1px solid rgba(255,255,255,0.1);
        border-bottom: 2px solid rgba(255,255,255,0.08);
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: 8px 0;
        box-shadow: 0 8px 24px rgba(0,0,0,0.4);
        z-index: 99;
      }
      .nav-menu.open { display: flex; }
      .nav-menu li a {
        padding: 12px 20px;
        border-radius: 0;
        font-size: 15px;
        color: rgba(255,255,255,0.85);
      }
      /* Logo stays in col 1, CTA in col 3 */
      .nav-logo { grid-column: 1; }
      .nav-cta  { grid-column: 3; }
      /* Hamburger: absolutely positioned, centred horizontally and vertically */
      .nav-hamburger {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
      }
    }

@media (max-width: 768px) {
      .navbar .container {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 8px 16px;
        position: relative;
      }
      .nav-cta { display: none; }
      /* Override tablet absolute positioning — must re-assert display:flex */
      .nav-hamburger {
        display: flex !important;
        position: static !important;
        transform: none !important;
        left: auto;
        top: auto;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        flex-direction: column;
        gap: 5px;
      }
      .nav-logo {
        flex-shrink: 0;
      }
    }


@media (max-width: 768px) {
      .legal-hero {
        min-height: 300px;
      }
      .legal-hero-inner {
        padding-top: 24px;
        padding-bottom: 24px;
      }
      .legal-card {
        padding: 24px 20px;
      }
      .legal-card h2 {
        font-size: 28px;
      }
      .legal-card h3 {
        font-size: 20px;
      }
    }