/* Responsive layouts and touch controls for the two sister-company pages.
   Load after each brand theme so the established colors stay intact. */
body.sister-company-page:is(.paving-page, .remodeling-page) .nav-phone-short { display: none; }

@media (max-width: 1050px) {
  body.sister-company-page:is(.paving-page, .remodeling-page) .nav-row { gap: 12px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .menu-toggle { order: 3; width: 48px; height: 48px; flex-shrink: 0; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .header .nav-phone {
    display: inline-flex;
    order: 2;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 48px;
    margin-left: auto;
    padding: 10px 14px;
  }
  body.sister-company-page:is(.paving-page, .remodeling-page) .header .nav-phone-full { display: none; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .header .nav-phone-short { display: inline; font-size: 14px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .header .nav-row nav {
    max-height: calc(100vh - var(--company-menu-top, 80px));
    max-height: calc(100dvh - var(--company-menu-top, 80px));
    padding-bottom: max(20px, env(safe-area-inset-bottom));
    overscroll-behavior-y: contain;
  }
  body.sister-company-page:is(.paving-page, .remodeling-page) .nav-row nav a { min-height: 48px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) :is(.submenu-toggle, .nav-nested-toggle) { width: 48px; height: 48px; flex: 0 0 48px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .nav-location-group:is(:hover, :focus-within) > .nav-location-links { display: none; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .nav-location-group.open > .nav-location-links { display: grid; }
}

/* Stack editorial sections before tablet columns become too cramped. */
@media (max-width: 900px) {
  body.sister-company-page.paving-page { --company-planning-photo: url('assets/responsive/asphalt-driveway-supporting-v1-1280w.webp'); }
  body.sister-company-page:is(.paving-page, .remodeling-page) .wrap { width: calc(100% - 40px); }
  body.sister-company-page:is(.paving-page, .remodeling-page) main :is(.company-overview, .paving-transformation, .company-planning, .paving-work, .sub-faq) { padding-block: 52px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) :is(.paving-intro-grid, .paving-transformation-grid, .company-section-heading, .company-planning-steps, .paving-work-grid, .faq-layout) { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-transformation-intro { grid-column: 1; grid-row: 1; padding-bottom: 0; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-transformation-media { grid-column: 1; grid-row: 2; margin-bottom: 0; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-transformation-details { grid-column: 1; grid-row: 3; }
  body.sister-company-page:is(.paving-page, .remodeling-page) main .sub-faq .faq-layout { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-section-heading { align-items: start; margin-bottom: 28px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) main :is(.paving-intro-copy, .paving-transformation-intro, .company-section-heading, .faq-intro) h2 { font-size: clamp(30px, 4.6vw, 42px); line-height: 1.15; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-planning .company-planning-steps li { padding: 18px 0 0; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-planning .company-planning-steps h3 { font-size: 23px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-planning .company-planning-steps p { font-size: 16px; line-height: 1.7; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-planning { background-attachment: scroll; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-work-grid { grid-template-rows: auto; gap: 20px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-work-feature { grid-row: auto; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-work-grid figure { width: 100%; min-width: 0; aspect-ratio: 3 / 2; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-hero .company-text-link { display: flex; align-items: center; min-height: 44px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-footer :is(.footer-list a, .footer-area-groups h3 a, .footer-phone, .footer-legal-links a, .footer-bottom > a:last-child) { display: inline-flex; align-items: center; min-height: 44px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-footer .footer-list a { width: 100%; }
  body.sister-company-page:is(.paving-page, .remodeling-page) :is(.company-family-bar > .wrap > a, .company-breadcrumb a) { display: inline-flex; align-items: center; min-height: 44px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-breadcrumb a { min-width: 44px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .footer-parent-site a { display: inline-flex; align-items: center; min-height: 44px; }
}

@media (max-width: 600px) {
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-hero { min-height: 0; padding: 36px 0 48px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-hero h1 { font-size: clamp(32px, 8.6vw, 43px); line-height: 1.12; letter-spacing: -.025em; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-breadcrumb ol { margin-bottom: 24px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-hero-copy > p:not(.eyebrow) { font-size: 16px; line-height: 1.75; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-actions { flex-direction: column; align-items: stretch; gap: 12px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-actions .company-text-link { justify-content: center; font-size: 14px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-button { width: 100%; min-height: 52px; padding-inline: 16px; text-align: center; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-intro-copy .intro-detail-item { padding: 14px; gap: 12px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-comparison-label { top: 10px; left: 10px; padding: 6px 8px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-comparison-label--after { left: auto; right: 10px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-comparison-help { font-size: 13px; line-height: 1.65; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-work-grid figure { aspect-ratio: 4 / 3; min-height: 230px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-work-grid figcaption { inset: auto 18px 18px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) main .paving-work-grid h3 { font-size: clamp(22px, 5.8vw, 28px); line-height: 1.2; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-work-grid figcaption p { font-size: 11px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-work-grid figure::after { inset: auto 0 0; height: 170px; background: linear-gradient(transparent, #000d 30%, #000f); }
  body.sister-company-page.remodeling-page .paving-work-grid figure::after { background: linear-gradient(transparent, #1c252be0 30%, #1c252bf2); }
  body.sister-company-page:is(.paving-page, .remodeling-page) main .sub-faq .questions summary { padding: 16px; gap: 12px; font-size: 16px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .faq .questions summary span { flex-basis: 32px; width: 32px; height: 32px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) main .sub-faq .questions details p { margin-inline: 16px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) main .faq-contact { padding: 20px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .faq-contact > a:not(.button) { min-height: 44px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .paving-contact h2 { font-size: clamp(32px, 8vw, 43px); line-height: 1.12; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .closing-actions { gap: 12px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .closing-actions .button { min-height: 52px; padding: 14px 16px; gap: 10px; font-size: 15px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .closing-description { font-size: 16px; line-height: 1.75; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .footer-area-groups p { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .footer-area-groups p a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 10px; border: 1px solid #ffffff30; border-radius: 6px; font-size: 13px; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .footer-city-separator { display: none; }
  body.sister-company-page:is(.paving-page, .remodeling-page) .footer-legal-links { flex-wrap: wrap; gap: 10px 18px; }
}

@media (max-width: 359px) {
  body.sister-company-page:is(.paving-page, .remodeling-page) .company-footer .footer-list { grid-template-columns: minmax(0, 1fr); }
}