/* Commercial Pavement Group — mobile-first responsive overrides */

/* Large tablet and below: 1024px */
@media (max-width: 64rem) {
  :root { --space-8: 5rem; }
  .utility-bar { display: block; }
  .utility-bar__inner { justify-content: center; min-height: 2.25rem; }
  .utility-bar__inner > p, .utility-bar__links > a:not(.utility-bar__phone) { display: none; }
  .utility-bar__links { justify-content: center; width: 100%; }
  .utility-bar__phone { align-items: center; display: inline-flex; font-size: .8rem; gap: .4rem; text-decoration: none; }
  .utility-bar__call-label { font-size: .65rem; }
  .site-header__inner { min-height: 5.5rem; }
  .js .nav-toggle { display: block; position: relative; z-index: 2; }
  .nav-toggle[aria-expanded="true"] > span:nth-of-type(2) { transform: translateY(7px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] > span:nth-of-type(3) { opacity: 0; }
  .nav-toggle[aria-expanded="true"] > span:nth-of-type(4) { transform: translateY(-7px) rotate(-45deg); }
  .primary-nav { align-items: stretch; background: var(--color-white); border-top: 1px solid var(--color-light-gray); box-shadow: var(--shadow-lg); flex-direction: column; gap: 0; left: 0; max-height: calc(100vh - 5.5rem); overflow-y: auto; padding: var(--space-3) var(--gutter) var(--space-5); position: absolute; right: 0; top: 100%; }
  .js .primary-nav { display: none; }
  .primary-nav.is-open { display: flex; }
  .primary-nav__list { align-items: stretch; flex-direction: column; gap: 0; }
  .primary-nav__list > li { border-bottom: 1px solid var(--color-light-gray); }
  .primary-nav__list > li > a, .nav-dropdown__toggle { padding: 1rem 0; width: 100%; }
  .primary-nav__list > li > a::after, .nav-dropdown__toggle::after { bottom: .6rem; width: 2rem; }
  .nav-dropdown__toggle { text-align: left; }
  .nav-dropdown__toggle::before { right: .25rem; top: 1.25rem; }
  .nav-dropdown__menu { border: 0; box-shadow: none; gap: var(--space-4); grid-template-columns: 1fr 1fr; min-width: 0; opacity: 1; padding: 0 0 var(--space-4); pointer-events: auto; position: static; transform: none; transition: none; visibility: visible; }
  .js .nav-dropdown__menu { display: none; }
  .nav-dropdown.is-open .nav-dropdown__menu { display: grid; }
  .primary-nav__cta { margin-top: var(--space-4); }
  .site-footer__grid { grid-template-columns: 1.5fr repeat(2, 1fr); }
  .site-footer__grid > :last-child { grid-column: 2; }
  .site-footer__grid--links { grid-template-columns: 1fr 1fr; }
  .site-footer__grid--links > :last-child { grid-column: auto; }
}

/* Tablet and below: 768px */
@media (max-width: 48rem) {
  :root { --space-7: 3.5rem; --space-8: 4rem; }
  .section-heading, .two-column, .foundation-hero__grid, .component-row { grid-template-columns: 1fr; }
  .section-heading { align-items: start; }
  .card-grid--3 { grid-template-columns: 1fr 1fr; }
  .service-card:last-child { grid-column: 1 / -1; }
  .foundation-hero__panel { border-left: 0; border-top: 1px solid rgba(255,255,255,.28); grid-template-columns: 1fr 1fr; padding: var(--space-5) 0 0; }
  .foundation-hero__line { height: 3px; left: 0; top: -2px; width: 5rem; }
  .cta-band__inner { align-items: flex-start; flex-direction: column; }
  .site-footer__grid { grid-template-columns: 1fr 1fr; }
  .site-footer__brand { grid-column: 1 / -1; }
  .site-footer__grid > :last-child { grid-column: auto; }
  .site-footer__bottom { flex-direction: column; gap: .5rem; }
  .site-footer__brand-band { align-items: flex-start; flex-direction: column; }
  .site-footer__contact { align-items: flex-start; text-align: left; }
  .legal-layout { grid-template-columns: 1fr; }
  .legal-toc { position: static; }
}

/* Mobile: 640px */
@media (max-width: 40rem) {
  :root { --gutter: 1rem; }
  .brand { max-width: 12rem; }
  .brand--footer-image { max-width: 13.5rem; }
  .brand__mark { flex-basis: 2.65rem; height: 2.25rem; }
  .brand__name { font-size: .7rem; }
  .brand__name strong { font-size: .86rem; }
  .nav-dropdown__menu { grid-template-columns: 1fr; }
  .nav-dropdown__menu .nav-dropdown__all { grid-column: auto; }
  .card-grid--3 { grid-template-columns: 1fr; }
  .service-card:last-child { grid-column: auto; }
  .service-card { min-height: 0; }
  .foundation-hero { padding-block: 4.5rem; }
  .foundation-hero__panel { grid-template-columns: 1fr; }
  .button-group { align-items: stretch; flex-direction: column; }
  .button-group .button { width: 100%; }
  .form-grid { grid-template-columns: 1fr; }
  .form-field--full { grid-column: auto; }
  .site-footer__grid { grid-template-columns: 1fr; }
  .site-footer__brand, .site-footer__grid > :last-child { grid-column: auto; }
  .site-footer__grid > div:not(.site-footer__brand) { border-left: 0; border-top: 1px solid rgba(255,255,255,.12); padding-left: 0; padding-top: var(--space-4); }
  .site-footer address a { white-space: normal; }
  .footer-nap > div, .local-proof-card dl > div { grid-template-columns: 1fr; gap: .3rem; }
  .local-proof-card dd a { overflow-wrap: anywhere; white-space: normal; }
  .legal-hero { padding-block: 3.5rem; }
  .legal-content h2 { overflow-wrap: anywhere; }
  .sms-consent__control { grid-template-columns: 1.1rem 1fr; }
}

/* Services responsive composition */
@media (max-width: 64rem) {
  .service-nav-menu { min-width: 0; right: auto; }
  .service-nav-menu { grid-template-columns: 1fr; }
  .service-nav-menu > div { grid-template-columns: 1fr; }
  .service-hero { grid-template-columns: 1fr 1fr; }
  .service-hero__content { padding: var(--space-6) var(--gutter); }
  .benefit-grid { grid-template-columns: 1fr 1fr; }
  .benefit-card:nth-child(2) { border-right: 1px solid var(--color-light-gray); }
  .benefit-card:nth-child(n+3) { border-top: 0; }
  .overview-service-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 48rem) {
  .service-hero, .overview-hero__grid, .service-story__grid, .la-focus__grid, .safety-feature__grid, .service-proof, .service-area-overview { grid-template-columns: 1fr; }
  .service-hero__media { min-height: 24rem; order: -1; }
  .service-hero__media::after { background: linear-gradient(0deg, var(--color-navy), transparent 35%); }
  .service-hero__content { justify-content: flex-start; }
  .service-hero__content > div { max-width: none; }
  .asphalt-detail-page .service-hero { grid-template-columns: 1fr; min-height: 0; }
  .asphalt-detail-page .service-hero__content { padding: 2.75rem var(--gutter) 2.25rem; }
  .asphalt-detail-page .service-hero h1 { font-size: clamp(2.35rem, 10vw, 3.25rem); max-width: 13ch; }
  .asphalt-detail-page .service-hero__content > div > p:not(.eyebrow) { font-size: 1rem; line-height: 1.6; margin-bottom: var(--space-4); }
  .asphalt-detail-page .service-hero__media { min-height: 18rem; order: initial; }
  .benefit-card { min-height: 15rem; }
  .related-grid { grid-template-columns: 1fr; }
  .overview-hero__grid { padding-right: var(--gutter); }
  .overview-hero__grid > div:first-child { padding-right: 0; }
  .overview-hero__visual { min-height: 24rem; }
  .overview-hero__visual::after { background: linear-gradient(0deg, var(--color-navy), transparent 35%); }
  .asphalt-overview-page .overview-hero__grid { grid-template-columns: 1fr; min-height: 0; padding-inline: var(--gutter); }
  .asphalt-overview-page .overview-hero__grid > div:first-child { padding: 2.75rem 0 2.25rem; }
  .asphalt-overview-page .overview-hero h1 { font-size: clamp(2.35rem, 10vw, 3.25rem); max-width: 13ch; }
  .asphalt-overview-page .overview-hero__grid > div:first-child > p:not(.eyebrow) { font-size: 1rem; line-height: 1.6; margin-bottom: var(--space-4); }
  .asphalt-overview-page .overview-hero__visual { min-height: 18rem; }
  .service-area-overview img { max-height: 28rem; }
}

@media (max-width: 40rem) {
  .service-nav-menu, .service-nav-menu > div, .benefit-grid, .overview-service-grid { grid-template-columns: 1fr; }
  .service-hero__media, .overview-hero__visual { min-height: 19rem; }
  .service-hero h1 { font-size: clamp(2.25rem, 11vw, 3.2rem); }
  .service-detail-page :is(h1, h2, h3), .services-overview-page :is(h1, h2, h3) { overflow-wrap: anywhere; }
  .benefit-card, .benefit-card:nth-child(2), .benefit-card:last-child { border: 1px solid var(--color-light-gray); border-bottom: 0; }
  .benefit-card:last-child { border-bottom: 1px solid var(--color-light-gray); }
  .breadcrumb-bar ol { font-size: .72rem; }
}

/* Wide screens: 1440px+ */
@media (min-width: 90rem) {
  :root { --container: 82rem; }
}

/* Very wide screens: 1920px+ */
@media (min-width: 120rem) {
  :root { --container: 88rem; }
}

/* Homepage responsive composition */
@media (max-width: 64rem) {
  .home-page .site-header { top: 0; }
  .home-hero { min-height: 40rem; }
  .home-hero__content { min-height: 34rem; padding-block: 2.75rem; }
  .home-hero__rail { grid-template-columns: 1fr 1fr; }
  .home-hero__rail > div:nth-child(2) { border-right: 0; }
  .home-hero__rail > div:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,.16); }
  .value-grid, .property-grid { grid-template-columns: 1fr 1fr; }
  .value-item:nth-child(2), .property-card:nth-child(2) { border-right: 1px solid rgba(255,255,255,.15); }
  .value-item:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,.15); }
  .property-card { min-height: 20rem; }
  .property-card:nth-child(2) { border-right-color: var(--color-light-gray); }
  .property-card:nth-child(n+3) { border-top: 0; }
  .featured-project { grid-template-columns: 1.1fr .9fr; }
  .home-services-grid { grid-template-columns: 1fr 1fr; }
  .process-grid { grid-template-columns: 1fr 1fr; }
  .process-grid article:nth-child(2n) { border-right: 1px solid var(--color-light-gray); }
  .process-grid article:nth-child(n+3) { border-top: 0; }
  .home-service-card:nth-child(n) { border-bottom: 0; border-right: 0; }
  .home-service-card:nth-child(2n) { border-right: 1px solid var(--color-light-gray); }
  .home-service-card:nth-last-child(-n+2) { border-bottom: 1px solid var(--color-light-gray); }
  .home-service-card--wide { grid-column: span 2; }
}

@media (max-width: 48rem) {
  .brand--image { max-width: 13rem; }
  .home-hero { min-height: 0; }
  /* Mobile: the hero video sits above the hero copy instead of behind it. */
  .home-hero__video { aspect-ratio: 16 / 9; height: auto; inset: auto; position: relative; }
  .home-hero__overlay { display: none; }
  .home-hero__content { min-height: 0; padding-block: clamp(3rem, 10vw, 4rem); }
  .home-hero__content h1 { font-size: clamp(2.6rem, 8.5vw, 3.5rem); line-height: 1.04; max-width: 14ch; }
  .home-hero__content > p:not(.eyebrow) { font-size: clamp(1.05rem, 3.6vw, 1.25rem); line-height: 1.55; margin: .9rem 0 1.25rem; }
  .split-intro, .trust-layout, .faq-layout, .final-cta__inner { grid-template-columns: 1fr; }
  .faq-layout > div:first-child { position: static; }
  .featured-project, .service-area { grid-template-columns: 1fr; }
  .featured-project__media, .service-area__media { min-height: 24rem; }
  .featured-project__media::after { background: linear-gradient(0deg, var(--color-charcoal), transparent 35%); }
  .featured-project__content { max-width: none; padding: var(--space-6) var(--gutter); }
  .service-area__media { order: -1; }
  .service-area__content { justify-content: flex-start; padding: var(--space-6) var(--gutter); }
  .project-placeholder-grid { grid-template-columns: 1fr; }
  .final-cta__inner > .button-group { justify-content: flex-start; }
}

@media (max-width: 40rem) {
  .site-header__inner { min-height: 5rem; }
  .brand--image { max-width: 11.5rem; }
  .home-hero__content { min-height: 0; padding-block: 2.75rem; }
  .home-hero__content h1 { font-size: clamp(2.35rem, 10.5vw, 3rem); line-height: 1.04; max-width: 14ch; }
  .home-hero__content .eyebrow { font-size: .68rem; margin-bottom: .8rem; }
  .home-hero__rail { grid-template-columns: 1fr 1fr; }
  .home-hero__rail > div, .home-hero__rail > div:first-child { border-left: 0; border-top: 1px solid rgba(255,255,255,.16); padding: 1rem var(--gutter); }
  .home-hero__rail > div:nth-child(odd) { border-right: 1px solid rgba(255,255,255,.16); }
  .value-grid, .property-grid, .home-services-grid { grid-template-columns: 1fr; }
  .value-item, .value-item:first-child { border-left: 1px solid rgba(255,255,255,.15); border-right: 1px solid rgba(255,255,255,.15); }
  .value-item + .value-item { border-top: 1px solid rgba(255,255,255,.15); }
  .property-card, .property-card:nth-child(2), .property-card:last-child { border: 1px solid var(--color-light-gray); border-bottom: 0; min-height: 17rem; }
  .property-card:last-child { border-bottom: 1px solid var(--color-light-gray); }
  .process-grid { grid-template-columns: 1fr; }
  .process-grid article, .process-grid article:first-child, .process-grid article:nth-child(2n) { border: 1px solid var(--color-light-gray); border-bottom: 0; min-height: 0; }
  .process-grid article:last-child { border-bottom: 1px solid var(--color-light-gray); }
  .home-service-card:nth-child(n), .home-service-card:nth-child(2n) { border: 1px solid var(--color-light-gray); border-bottom: 0; min-height: 19rem; }
  .home-service-card:last-child { border-bottom: 1px solid var(--color-light-gray); }
  .home-service-card--wide { grid-column: auto; }
  .featured-project__media, .service-area__media { min-height: 20rem; }
  .testimonial-placeholder { padding: var(--space-5); }
}

/* About responsive composition */
@media (max-width: 64rem) {
  .about-value-grid { grid-template-columns: repeat(2, 1fr); }
  .about-value-grid article:nth-child(2n) { border-right: 1px solid rgba(255,255,255,.15); }
  .about-value-grid article:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,.15); }
  .about-value-grid article:last-child { grid-column: 1 / -1; }
}

@media (max-width: 48rem) {
  .about-hero { min-height: 34rem; }
  .about-hero__image { object-position: 62% center; }
  .about-hero__overlay { background: linear-gradient(90deg, rgba(7,20,30,.95), rgba(7,20,30,.55)), linear-gradient(0deg, rgba(7,20,30,.86), transparent); }
  .about-hero__content { min-height: 34rem; }
  .about-intro, .commercial-focus__grid, .about-story, .trust-credentials { grid-template-columns: 1fr; }
  .commercial-focus__points article { grid-template-columns: 2rem 1fr; }
  .commercial-focus__points article p { grid-column: 2; }
  .about-capability-grid { grid-template-columns: 1fr 1fr; }
  .about-capability-grid a:not(:nth-child(3n)) { border-right: 0; }
  .about-capability-grid a:nth-child(odd) { border-right: 1px solid var(--color-light-gray); }
  .about-story__media { min-height: 27rem; }
  .about-story__media::after { background: linear-gradient(0deg, var(--color-navy), transparent 35%); }
  .about-story__content { padding: var(--space-6) var(--gutter); }
}

@media (max-width: 40rem) {
  .about-page :is(h1, h2, h3), .about-capability-grid a { overflow-wrap: anywhere; }
  .about-value-grid, .about-capability-grid { grid-template-columns: 1fr; }
  .about-value-grid article, .about-value-grid article:first-child, .about-value-grid article:nth-child(2n), .about-value-grid article:last-child { border: 1px solid rgba(255,255,255,.15); border-bottom: 0; grid-column: auto; }
  .about-value-grid article:last-child { border-bottom: 1px solid rgba(255,255,255,.15); }
  .about-capability-grid a:nth-child(odd) { border-right: 0; }
  .about-story__media { min-height: 22rem; }
}

/* Blog responsive composition */
@media (max-width: 64rem) {
  .blog-card-grid { grid-template-columns: 1fr 1fr; }
  .blog-category-list { grid-template-columns: repeat(3,1fr); }
  .article-layout { grid-template-columns: minmax(0,1fr) 15rem; }
}

@media (max-width: 48rem) {
  .blog-tools, .featured-article, .article-layout { grid-template-columns: 1fr; }
  .featured-article__media { min-height: 25rem; }
  .featured-article__media::after { background: linear-gradient(0deg,var(--color-charcoal),transparent 35%); }
  .featured-article__content { padding: var(--space-6) var(--gutter); }
  .blog-category-list { grid-template-columns: 1fr 1fr; }
  .recent-list a { grid-template-columns: 5rem 1fr; }
  .recent-list i { grid-column: 2; }
  .article-figure img { aspect-ratio: 16/10; }
  .article-sidebar { position: static; }
  .article-page .related-services, .related-posts { grid-template-columns: 1fr; }
}

@media (max-width: 40rem) {
  .blog-page :is(h1,h2,h3), .article-page :is(h1,h2,h3) { overflow-wrap: anywhere; }
  .blog-card-grid, .blog-category-list { grid-template-columns: 1fr; }
  .category-nav { align-items: stretch; display: grid; grid-template-columns: 1fr 1fr; }
  .category-nav button { border-radius: var(--radius-sm); }
  .featured-article__media { min-height: 20rem; }
  .article-figure img { aspect-ratio: 4/3; }
  .article-figure figcaption { left: var(--gutter); }
  .key-takeaways { padding: var(--space-5); }
}

/* Contact responsive composition */
@media (max-width: 64rem) {
  .contact-market-grid { grid-template-columns: repeat(3,1fr); }
  .contact-form-layout { grid-template-columns: minmax(0,1fr); }
}

@media (max-width: 48rem) {
  .contact-hero { min-height: 34rem; }
  .contact-hero__image { object-position: 62% center; }
  .contact-hero__overlay { background: linear-gradient(90deg,rgba(7,20,30,.95),rgba(7,20,30,.55)),linear-gradient(0deg,rgba(7,20,30,.82),transparent); }
  .contact-hero__content { min-height: 34rem; }
  .contact-intro, .contact-form-layout, .contact-area { grid-template-columns: 1fr; }
  .project-request-guide { position: static; }
  .contact-services-grid { grid-template-columns: 1fr 1fr; }
  .contact-services-grid a:not(:nth-child(3n)) { border-right: 0; }
  .contact-services-grid a:nth-child(odd) { border-right: 1px solid var(--color-light-gray); }
  .contact-market-grid { grid-template-columns: 1fr 1fr; }
  .contact-area img { max-height: 26rem; }
}

@media (max-width: 40rem) {
  .contact-page :is(h1,h2,h3), .contact-services-grid a { overflow-wrap: anywhere; }
  .contact-details div { grid-template-columns: 1fr; }
  .contact-intro--aside { padding: var(--space-4); }
  .contact-services-grid, .contact-market-grid { grid-template-columns: 1fr; }
  .contact-services-grid a:nth-child(odd) { border-right: 0; }
  .commercial-inquiry-form { padding: var(--space-4); }
}

/* Site-wide responsive hardening */
html, body { max-width: 100%; overflow-x: clip; }

@media (min-width: 64.0625rem) {
  .site-header__inner { gap: var(--space-5); }
  .primary-nav { min-width: 0; }
  .site-footer__brand-band { align-items: flex-start; }
  .site-footer__contact { flex: 0 1 29rem; }
}

@media (max-width: 64rem) {
  .primary-nav { max-height: calc(100svh - 9rem); }
  .nav-toggle { align-items: center; justify-content: center; min-height: 2.75rem; min-width: 2.75rem; }
  .site-footer__brand-band { gap: var(--space-5); }
  .footer-nap dd, .footer-nap a { overflow-wrap: anywhere; }
}

@media (max-width: 48rem) {
  .section { padding-block: 3.75rem; }
  .section-heading { gap: var(--space-3); margin-bottom: var(--space-5); }
  .section-heading > *, .two-column > *, .article-layout > *, .contact-form-layout > * { min-width: 0; }
  h1 { font-size: clamp(2.35rem, 8vw, 3.5rem); }
  h2 { font-size: clamp(1.85rem, 6vw, 2.75rem); }
  .button, .primary-nav__list > li > a, .nav-dropdown__toggle { min-height: 2.75rem; }
  .service-hero { min-height: 0; }
  .service-hero__content { padding: 2.75rem var(--gutter) 2.5rem; }
  .service-hero__media { min-height: 18rem; order: initial; }
  .service-hero h1 { font-size: clamp(2.35rem, 8.5vw, 3.35rem); line-height: 1.04; }
  .overview-hero__grid > div:first-child { padding-block: 2.75rem; }
  .overview-hero__visual { min-height: 18rem; }
  .benefit-card { min-height: 0; }
  .about-hero, .contact-hero { min-height: 0; }
  .about-hero__content, .contact-hero__content { min-height: 0; padding-block: 3.5rem; }
  .about-hero h1, .contact-hero h1 { font-size: clamp(2.4rem, 8.5vw, 3.5rem); line-height: 1.04; }
  .about-hero__content > p:not(.eyebrow), .contact-hero__content > p:not(.eyebrow) { font-size: clamp(1.05rem, 3.6vw, 1.25rem); margin: var(--space-3) 0 var(--space-4); }
  .blog-hero, .article-hero, .legal-hero { padding-block: 3.5rem; }
  .article-hero h1 { font-size: clamp(2.25rem, 8vw, 3.5rem); line-height: 1.06; }
  .article-content, .legal-content { max-width: 100%; }
  .site-footer { padding-top: var(--space-7); }
  .site-footer__contact { width: 100%; }
  .footer-nap { width: 100%; }
}

@media (max-width: 40rem) {
  :root { --space-6: 2.5rem; --space-7: 3rem; --space-8: 3.5rem; }
  body { line-height: 1.6; }
  .section { padding-block: 3rem; }
  .section-heading { margin-bottom: 1.75rem; }
  h1 { font-size: clamp(2.15rem, 10vw, 3rem); }
  h2 { font-size: clamp(1.75rem, 7.5vw, 2.35rem); }
  h3 { overflow-wrap: anywhere; }
  .button-group { gap: .75rem; }
  .button { min-height: 3rem; padding: .75rem 1rem; }
  .service-hero__content, .asphalt-detail-page .service-hero__content { padding: 2.4rem var(--gutter) 2.25rem; }
  .service-hero__media, .asphalt-detail-page .service-hero__media, .overview-hero__visual, .asphalt-overview-page .overview-hero__visual { min-height: 16rem; }
  .service-hero h1, .asphalt-detail-page .service-hero h1, .overview-hero h1, .asphalt-overview-page .overview-hero h1 { font-size: clamp(2.2rem, 10vw, 2.9rem); line-height: 1.04; }
  .benefit-card, .related-card > div, .overview-service-card > div, .blog-card__body { padding: 1.25rem; }
  .related-card h3 { margin-bottom: var(--space-3); }
  .about-hero__content, .contact-hero__content { padding-block: 3rem; }
  .about-story__content, .featured-article__content, .service-area__content { padding: 2.5rem var(--gutter); }
  .blog-hero, .article-hero, .legal-hero { padding-block: 3rem; }
  .article-content :is(img, video, iframe), .legal-content :is(img, video, iframe) { max-width: 100%; }
  .article-content table, .legal-content table { display: block; max-width: 100%; overflow-x: auto; }
  .category-nav { grid-template-columns: 1fr; }
  .site-footer__brand-band { padding-bottom: var(--space-5); }
  .site-footer__grid--links { margin-top: var(--space-5); }
  .site-footer__bottom { align-items: flex-start; }
  .footer-nap > div { padding-block: .2rem; }
}

/* Desktop composition: balanced density from compact laptops to wide monitors */
@media (min-width: 64.0625rem) {
  :root {
    --gutter: clamp(1.5rem, 2.5vw, 2rem);
  }

  .section {
    padding-block: clamp(4.75rem, 6vw, 6.5rem);
  }

  :is(
    .section-heading,
    .two-column,
    .split-intro,
    .trust-layout,
    .faq-layout,
    .final-cta__inner,
    .service-story__grid,
    .la-focus__grid,
    .safety-feature__grid,
    .service-proof,
    .about-intro,
    .commercial-focus__grid,
    .trust-credentials,
    .article-layout,
    .contact-intro,
    .contact-form-layout
  ) > * {
    min-width: 0;
  }

  .site-header__inner {
    min-height: 6.5rem;
  }

  .primary-nav,
  .primary-nav__list {
    min-width: 0;
  }

  .primary-nav__list > li > a,
  .nav-dropdown__toggle {
    padding-block: 1.55rem;
  }

  .primary-nav__list > li > a::after,
  .nav-dropdown__toggle::after {
    bottom: 1rem;
  }

  .nav-dropdown__toggle::before {
    top: 1.85rem;
  }

  .home-hero__content {
    padding-block: clamp(3rem, 4vw, 4rem);
  }

  .about-hero {
    min-height: clamp(32rem, calc(100svh - 9rem), 37rem);
  }

  .about-hero__content {
    min-height: clamp(32rem, calc(100svh - 9rem), 37rem);
    padding-block: clamp(3.25rem, 5vw, 4.75rem);
  }

  .about-hero h1 {
    font-size: clamp(3.35rem, 4.6vw, 4.25rem);
    line-height: 1;
    max-width: 16ch;
  }

  .about-hero__content > p:not(.eyebrow) {
    font-size: clamp(1.1rem, 1.6vw, 1.35rem);
    line-height: 1.55;
    margin-block: 1rem 1.35rem;
    max-width: 39rem;
  }

  .service-hero {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    min-height: clamp(31rem, 42vw, 36rem);
  }

  .service-hero__content {
    padding: clamp(2.75rem, 4vw, 3.75rem) clamp(2rem, 4.5vw, 5rem);
  }

  .service-hero h1,
  .asphalt-detail-page .service-hero h1 {
    font-size: clamp(3rem, 3.7vw, 3.55rem);
    line-height: 1.02;
    max-width: 15ch;
  }

  .service-hero__content > div > p:not(.eyebrow),
  .asphalt-detail-page .service-hero__content > div > p:not(.eyebrow) {
    font-size: clamp(1rem, 1.2vw, 1.1rem);
    line-height: 1.55;
    margin-bottom: 1.25rem;
    max-width: 37rem;
  }

  .service-hero__media {
    min-height: 31rem;
  }

  .service-hero__media img,
  .overview-hero__visual img {
    height: 100%;
    object-fit: cover;
    width: 100%;
  }

  .service-story__grid {
    gap: clamp(3rem, 5vw, 5rem);
    grid-template-columns: minmax(18rem, .85fr) minmax(0, 1.15fr);
  }

  .service-story__grid > div:last-child,
  .la-focus__grid > div,
  .safety-feature__grid > div,
  .service-proof > div {
    min-width: 0;
  }

  .service-story__grid > div:last-child p,
  .la-focus__grid p,
  .safety-feature__grid p,
  .service-proof p {
    max-width: 65ch;
  }

  .benefit-grid,
  .related-grid,
  .overview-service-grid {
    align-items: stretch;
  }

  .benefit-card,
  .related-card,
  .overview-service-card {
    height: 100%;
  }

  .related-card img,
  .overview-service-card img {
    aspect-ratio: 16 / 10;
    object-fit: cover;
    width: 100%;
  }

  .related-card > div,
  .overview-service-card > div {
    min-width: 0;
  }

  .service-area-overview,
  .contact-area {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    min-height: clamp(29rem, 35vw, 32rem);
  }

  .service-area-overview img,
  .contact-area img {
    height: 100%;
    object-fit: cover;
    width: 100%;
  }

  .service-detail-page .final-cta__inner,
  .services-overview-page .final-cta__inner,
  .audience-page .final-cta__inner {
    grid-template-columns: minmax(0, 1.25fr) minmax(16rem, .75fr);
  }

  .service-detail-page .final-cta__inner > .button,
  .services-overview-page .final-cta__inner > .button,
  .audience-page .final-cta__inner > .button {
    justify-self: end;
  }

  .overview-hero__grid {
    min-height: clamp(31rem, 42vw, 36rem);
  }

  .overview-hero__grid > div:first-child {
    padding-block: clamp(3rem, 5vw, 4.5rem);
    padding-right: clamp(2rem, 4.5vw, 5rem);
  }

  .overview-hero h1,
  .asphalt-overview-page .overview-hero h1 {
    font-size: clamp(3rem, 3.8vw, 3.75rem);
    line-height: 1.02;
    max-width: 15ch;
  }

  .overview-hero__grid > div:first-child > p:not(.eyebrow),
  .asphalt-overview-page .overview-hero__grid > div:first-child > p:not(.eyebrow) {
    font-size: clamp(1rem, 1.2vw, 1.1rem);
    line-height: 1.55;
    margin-bottom: 1.25rem;
    max-width: 37rem;
  }

  .featured-project,
  .service-area,
  .about-story {
    min-height: clamp(31rem, 42vw, 36rem);
  }

  .featured-project__media,
  .service-area__media,
  .about-story__media {
    min-height: 31rem;
  }

  .featured-project__content,
  .about-story__content {
    padding-block: clamp(3rem, 5vw, 5rem);
    padding-right: clamp(2rem, 5vw, 5rem);
  }

  .service-area__content,
  .service-area-overview > div,
  .contact-area__content {
    padding: clamp(3rem, 5vw, 5rem);
  }

  .property-card,
  .home-service-card,
  .process-grid article,
  .benefit-card {
    min-width: 0;
  }

  .local-proof-card dd a[href^="mailto:"],
  .footer-nap a[href^="mailto:"] {
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .site-footer__brand-band {
    align-items: start;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(24rem, .75fr);
  }

  .site-footer__contact {
    justify-self: end;
    max-width: 31rem;
    width: 100%;
  }

  .site-footer__grid--links > div,
  .site-footer__links,
  .site-footer__links a {
    min-width: 0;
  }
}

/* Compact desktop and landscape laptop widths */
@media (min-width: 64.0625rem) and (max-width: 79.9375rem) {
  :root {
    --space-8: 5.5rem;
  }

  .brand--image {
    max-width: 14rem;
  }

  .primary-nav {
    gap: .9rem;
  }

  .primary-nav__list {
    gap: clamp(.75rem, 1.25vw, 1rem);
  }

  .primary-nav__list > li > a,
  .nav-dropdown__toggle {
    font-size: .74rem;
  }

  .primary-nav__cta {
    font-size: .7rem;
    padding-inline: .9rem;
  }

  .service-nav-menu {
    min-width: min(40rem, calc(100vw - 2rem));
    right: -3rem;
  }

  .section-heading,
  .split-intro,
  .trust-layout,
  .faq-layout,
  .service-story__grid,
  .la-focus__grid,
  .about-intro,
  .commercial-focus__grid,
  .contact-intro {
    gap: clamp(2.5rem, 5vw, 4rem);
  }

  .home-hero__content h1 {
    font-size: clamp(3.25rem, 5vw, 4rem);
  }

  .about-hero h1 {
    font-size: clamp(3.25rem, 5vw, 3.9rem);
    max-width: 15ch;
  }

  .service-hero h1,
  .asphalt-detail-page .service-hero h1,
  .asphalt-overview-page .overview-hero h1 {
    font-size: clamp(2.75rem, 4.4vw, 3.75rem);
  }

  .property-card,
  .home-service-card {
    min-height: 21rem;
  }

  .property-card,
  .process-grid article,
  .benefit-card {
    padding: 1.5rem;
  }

  .benefit-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .benefit-card,
  .benefit-card:nth-child(2),
  .benefit-card:nth-child(n+3),
  .benefit-card:last-child {
    border: 1px solid var(--color-light-gray);
  }

  .service-story__grid,
  .la-focus__grid,
  .safety-feature__grid,
  .service-proof {
    gap: 3rem;
  }

  .related-grid,
  .overview-service-grid {
    gap: 1rem;
  }

  .service-area-overview > div,
  .contact-area__content {
    padding: 3.5rem;
  }

  .site-footer__grid--links {
    gap: 2rem;
  }

  .site-footer__grid--links > div:not(:first-child) {
    padding-left: 1.25rem;
  }
}

/* Large desktops retain generous scale without letting lines become too wide */
@media (min-width: 90rem) {
  .home-hero__content > p:not(.eyebrow),
  .service-hero__content > div > p:not(.eyebrow),
  .about-hero__content > p:not(.eyebrow),
  .contact-hero__content > p:not(.eyebrow) {
    max-width: 42rem;
  }

  .article-layout {
    gap: clamp(4rem, 6vw, 6rem);
  }
}

/* Mobile/tablet: once the navigation collapses, the logo stays first at the
   top and the phone appears as a high-contrast "Call Or Text" strip directly
   below the logo. */
@media (max-width: 64rem) {
  .site-header {
    display: flex;
    flex-direction: column;
  }

  .site-header__inner {
    order: 1;
    width: 100%;
  }

  .utility-bar {
    order: 2;
    background: var(--color-orange);
    border-top: 1px solid rgba(255, 255, 255, .2);
    width: 100%;
  }

  .utility-bar__inner {
    justify-content: center;
    min-height: 3.5rem;
    padding-inline: var(--gutter);
  }

  .utility-bar__links {
    justify-content: center;
    width: 100%;
  }

  .utility-bar .utility-bar__phone {
    align-items: center;
    color: #1d252b;
    display: flex;
    flex: 1 1 auto;
    font-size: clamp(1.02rem, 4.6vw, 1.2rem);
    font-weight: 850;
    gap: .4rem;
    justify-content: center;
    letter-spacing: .01em;
    line-height: 1.15;
    min-height: 3.5rem;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    width: 100%;
  }

  .utility-bar .utility-bar__phone:hover,
  .utility-bar .utility-bar__phone:focus-visible {
    color: #000;
    text-decoration: underline;
    text-decoration-color: currentColor;
    text-underline-offset: .18em;
  }

  .utility-bar .utility-bar__call-label {
    color: #1d252b;
    font-size: .82rem;
    font-weight: 850;
    letter-spacing: .04em;
  }
}