@media (max-width: 1120px) {
    .brand {
        width: 340px;
    }

    .primary-nav {
        gap: 20px;
    }

    .service-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }

    .service-card > img {
        height: 190px;
    }

    .service-icon {
        top: 166px;
    }

    .service-card-body {
        min-height: 225px;
    }

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

    .gallery-image img {
        height: 270px;
    }

    .steps {
        align-items: stretch;
    }

    .step {
        grid-template-columns: auto 1fr;
        grid-template-rows: auto 1fr;
    }

    .step-icon {
        grid-row: 1 / 3;
    }

    .step-number {
        position: absolute;
        transform: translate(-8px, -12px);
    }

    .step > div {
        grid-column: 2;
    }

    .step-arrow {
        align-self: center;
    }

    .footer-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 900px) {
    .shell {
        width: min(100% - 30px, 760px);
    }

    .header-inner {
        min-height: 78px;
    }

    .brand {
        width: min(360px, calc(100% - 70px));
    }

    .menu-toggle {
        display: block;
    }

    .primary-nav {
        position: absolute;
        top: calc(100% + 3px);
        left: 0;
        right: 0;
        display: none;
        padding: 10px 20px 20px;
        background: var(--deep-shop-black);
        box-shadow: 0 16px 24px rgba(0, 0, 0, .35);
    }

    .primary-nav.open {
        display: grid;
    }

    .primary-nav a {
        padding: 13px 5px;
        border-bottom: 1px solid rgba(217, 196, 163, .16);
    }

    .primary-nav a::after {
        bottom: 5px;
    }

    .hero-grid {
        width: 100%;
        min-height: auto;
        grid-template-columns: 1fr;
background: url("assets/images/backgrounds/services-hero.jpg") center center / cover no-repeat;
    }

    .hero-copy {
        width: min(100% - 30px, 760px);
        margin-inline: auto;
        padding: 55px 0 36px;
    }

    .hero-photo {
        min-height: 410px;
    }

    .hero-photo::before {
        background: linear-gradient(180deg, var(--deep-shop-black), transparent 30%);
    }

    .services-hero .hero-grid,
    .gallery-hero .hero-grid {
        min-height: auto;
    }

    .trust-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .trust-grid article:nth-child(4),
    .trust-grid article:nth-child(5) {
        grid-column: span 1;
    }

    .trust-grid article:nth-child(4) {
        grid-column: 1 / 2;
    }

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

    .local-grid {
        grid-template-columns: 1fr 1fr;
    }

    .local-sign {
        border-right: 0;
        border-bottom: 1px solid var(--oxide-red);
    }

    .map-card {
        grid-column: 1 / -1;
    }

    .final-cta .shell {
        grid-template-columns: auto 1fr;
        padding: 20px 0;
    }

    .final-cta .button {
        grid-column: 1 / -1;
    }

    .category-strip .shell,
    .gallery-filters .shell {
        width: 100%;
        grid-template-columns: repeat(3, 1fr);
    }

    .category-strip a:nth-child(3),
    .gallery-filters button:nth-child(3) {
        border-right: 0;
    }

    .solution-board {
        grid-template-columns: 1fr;
    }

    .solution-row:nth-child(odd) {
        border-right: 0;
    }

    .solution-row:nth-last-child(2) {
        border-bottom: 1px solid #c7af8c;
    }

    .value-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 26px 0;
    }

    .value-grid article:nth-child(4)::before {
        display: none;
    }

    .feature-case,
    .results-grid,
    .story-grid,
    .faq-layout,
    .contact-layout {
        grid-template-columns: 1fr;
    }

    .feature-photo {
        grid-row: 1;
    }

    .results-grid > div {
        padding: 40px 25px;
    }

    .results-grid > img {
        min-height: 300px;
    }

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

    .faq-aside {
        position: static;
    }

    .contact-aside {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 680px) {
    body {
        padding-bottom: 58px;
    }

    .shell {
        width: min(100% - 24px, 560px);
    }

    .site-header {
        position: relative;
    }

    .header-inner {
        min-height: 70px;
    }

    .brand {
        width: min(310px, calc(100% - 58px));
    }

    .hero-copy {
        width: min(100% - 24px, 560px);
        padding-top: 42px;
    }

    .hero-copy h1,
    .services-hero .hero-copy h1,
    .gallery-hero .hero-copy h1 {
        font-size: clamp(47px, 15vw, 68px);
    }

    .hero-copy p {
        font-size: 18px;
    }

    .hero-photo {
        min-height: 310px;
    }

    .button-row {
        display: grid;
        grid-template-columns: 1fr;
    }

    .button {
        width: 100%;
    }

    .trust-grid {
        grid-template-columns: 1fr 1fr;
    }

    .trust-grid article {
        min-height: 112px;
        border-bottom: 1px solid rgba(143, 22, 18, .22);
    }

    .trust-grid article:nth-child(5) {
        grid-column: 1 / -1;
    }

    .trust-grid article + article::before {
        display: none;
    }

    .section {
        padding: 38px 0;
    }

    .section-heading h2 {
        gap: 8px;
        font-size: 34px;
    }

    .section-heading h2 span {
        width: 25px;
        height: 8px;
    }

    .service-grid,
    .proof-grid,
    .gallery-grid {
        grid-template-columns: 1fr;
    }

    .service-card > img {
        height: 220px;
    }

    .service-icon {
        top: 196px;
    }

    .service-card-body {
        min-height: 215px;
    }

    .proof-image img,
    .gallery-image img {
        height: 265px;
    }

    .steps {
        display: grid;
        gap: 18px;
    }

    .step {
        position: relative;
        min-height: 100px;
        grid-template-columns: 72px 1fr;
        padding: 15px;
        border: 1px solid #ceb38d;
        border-radius: 5px;
    }

    .step-icon {
        grid-row: 1;
        grid-column: 1;
        text-align: center;
    }

    .step > div {
        grid-row: 1;
        grid-column: 2;
    }

    .step-number {
        top: 3px;
        left: 3px;
    }

    .step-arrow {
        display: none;
    }

    .local-grid,
    .footer-grid,
    .contact-aside {
        grid-template-columns: 1fr;
    }

    .local-sign {
        padding: 14px;
    }

    .local-details {
        text-align: center;
    }

    .final-cta .shell {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .cta-icon {
        display: none;
    }

    .site-footer {
        padding-top: 28px;
    }

    .footer-grid {
        gap: 30px;
    }

    .footer-brand img {
        width: min(100%, 330px);
    }

    .footer-bottom {
        flex-direction: column;
        text-align: center;
    }

    .mobile-quote-bar {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 300;
        height: 58px;
        display: grid;
        place-items: center;
        color: var(--clean-white);
        background: linear-gradient(#d6261d, #93110c);
        box-shadow: 0 -6px 18px rgba(0, 0, 0, .35);
        font-family: var(--display);
        font-size: 20px;
        letter-spacing: .6px;
        text-decoration: none;
        text-transform: uppercase;
    }

    .category-strip .shell,
    .gallery-filters .shell {
        grid-template-columns: repeat(2, 1fr);
    }

    .category-strip a,
    .gallery-filters button {
        min-height: 86px;
        border-bottom: 1px solid rgba(143, 22, 18, .35);
    }

    .category-strip a:nth-child(3),
    .gallery-filters button:nth-child(3) {
        border-right: 1px solid rgba(143, 22, 18, .4);
    }

    .category-strip a:nth-child(even),
    .gallery-filters button:nth-child(even) {
        border-right: 0;
    }

    .solution-row {
        grid-template-columns: 1fr;
    }

    .solution-row img {
        min-height: 205px;
        max-height: 250px;
    }

    .solution-row ul {
        columns: 1;
    }

    .value-grid,
    .results-grid .value-grid {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .value-grid article {
        padding: 22px;
    }

    .value-grid article + article::before {
        top: 0;
        left: 25%;
        right: 25%;
        bottom: auto;
        width: auto;
        height: 1px;
    }

    .value-grid article:nth-child(4)::before {
        display: block;
    }

    .feature-photo img {
        min-height: 240px;
    }

    .feature-photo-pair img {
        min-height: 240px;
    }

    .case-copy {
        padding: 24px 20px;
    }

    .belief-grid {
        grid-template-columns: 1fr;
    }

    .form-grid,
    .form-grid.three {
        grid-template-columns: 1fr;
    }

    .photo-preview {
        grid-template-columns: 1fr 1fr;
    }

    .quote-form-panel {
        padding: 23px 16px;
    }

    .faq-item button {
        padding: 17px;
        font-size: 20px;
    }
}

@media (max-width: 680px) {
    .repair-lightbox {
        padding: 10px;
    }

    .repair-lightbox-dialog {
        max-height: calc(100vh - 20px);
    }

    .lightbox-images {
        grid-template-columns: 1fr;
    }

    .lightbox-images figure {
        min-height: 210px;
    }

    .lightbox-images img {
        height: min(34vh, 300px);
    }

    .lightbox-copy {
        padding: 18px;
    }

    .lightbox-copy h2 {
        font-size: 30px;
    }

    .lightbox-copy dl {
        grid-template-columns: 1fr;
        gap: 2px;
    }

    .lightbox-copy dd {
        margin-bottom: 8px;
    }

    .lightbox-nav {
        top: 28%;
        width: 42px;
        height: 42px;
    }
}

@media (max-width: 420px) {
    .brand {
        width: 265px;
    }

    .hero-copy h1,
    .services-hero .hero-copy h1,
    .gallery-hero .hero-copy h1 {
        font-size: 46px;
    }

    .hero-photo {
        min-height: 260px;
    }

    .section-heading h2 span {
        display: none;
    }

    .trust-grid strong {
        font-size: 15px;
    }
}