.asher-quote-review,
.asher-quote-review * {
    box-sizing: border-box;
}

.asher-quote-review [hidden] {
    display: none !important;
}

.asher-quote-review {
    background:
        radial-gradient(circle at 50% 18%, rgba(52, 52, 55, .18), transparent 42%),
        #0b0b0c;
    color: #fff;
    margin: 0 auto;
    max-width: 1320px;
    padding: 10px 26px 28px;
}

.asher-quote-preview-notice {
    border: 1px solid #caa457;
    background: rgba(202, 164, 87, 0.1);
    color: #fff;
    margin: 0 auto 24px;
    max-width: 950px;
    padding: 18px 22px;
    text-align: center;
}

.asher-quote-preview-notice strong,
.asher-quote-preview-notice span {
    display: block;
}

.asher-quote-preview-notice strong {
    color: #e7b93f;
    font-family: Oswald, sans-serif;
    font-size: 19px;
    letter-spacing: 0.08em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.asher-quote-header {
    margin: 0 auto 20px;
    text-align: center;
}

.asher-quote-header p {
    color: #d9ad45;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .28em;
    margin: 0 0 10px;
    text-transform: uppercase;
}

.asher-quote-header h1 {
    color: #fff;
    font-family: Oswald, "Arial Narrow", Arial, sans-serif;
    font-size: clamp(42px, 4vw, 58px);
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1;
    margin: 0 0 12px;
    text-transform: uppercase;
}

.asher-quote-header > span {
    color: #e1e1e3;
    display: block;
    font-size: 16px;
    line-height: 1.45;
}

.asher-quote-waiting {
    border: 1px solid #424246;
    margin: 34px auto 10px;
    max-width: 760px;
    padding: 30px;
    text-align: center;
}

.asher-quote-waiting strong,
.asher-quote-waiting span {
    display: block;
}

.asher-quote-waiting strong {
    color: #d9ad45;
    font-size: 20px;
    margin-bottom: 8px;
}

.asher-quote-layout {
    display: grid;
    gap: 18px;
    grid-template-columns: 1.38fr 1fr;
}

.asher-quote-left-column,
.asher-quote-right-column {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.asher-quote-card {
    background: rgba(20, 20, 22, .72);
    border: 1px solid #3c3c40;
    border-radius: 5px;
    overflow: hidden;
}

.asher-quote-card h2 {
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 17px;
    font-weight: 900;
    letter-spacing: .06em;
    line-height: 1.15;
    margin: 0;
    text-transform: uppercase;
}

.asher-quote-selected-roof {
    padding: 17px 18px 0;
}

.asher-quote-selected-roof > h2 {
    margin-bottom: 12px;
}

.asher-quote-house-image {
    aspect-ratio: 3.28 / 1;
    display: block;
    height: auto;
    object-fit: cover;
    object-position: center 48%;
    width: 100%;
}

.asher-quote-roof-strip {
    align-items: center;
    display: grid;
    gap: 14px;
    grid-template-columns: 52px minmax(220px, 1fr) 100px 180px;
    min-height: 74px;
}

.asher-quote-gaf-logo {
    align-items: center;
    align-self: center;
    background: #e31c2b;
    color: #fff;
    display: flex;
    font-size: 20px;
    font-style: italic;
    font-weight: 900;
    height: 52px;
    justify-content: center;
    margin-left: 0;
}

.asher-quote-roof-copy {
    display: block;
    min-width: 0;
}

.asher-quote-roof-copy strong,
.asher-quote-roof-copy small {
    display: block;
    text-transform: uppercase;
}

.asher-quote-roof-copy strong {
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.3;
}

.asher-quote-roof-copy small {
    color: #d7d7d9;
    font-size: 12px;
    margin-top: 3px;
}

.asher-quote-roof-swatch {
    align-self: center;
    background:
        linear-gradient(135deg, #41474b 25%, #283033 25% 50%, #4e5557 50% 75%, #30383a 75%);
    display: block;
    height: 52px;
    overflow: hidden;
}

.asher-quote-roof-swatch img {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.asher-quote-outline-action,
.asher-quote-primary-action,
.asher-quote-download {
    align-items: center;
    border-radius: 0;
    cursor: pointer;
    display: inline-flex;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 900;
    justify-content: center;
    line-height: 1.2;
    min-height: 48px;
    padding: 13px 18px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
}

.asher-quote-outline-action {
    background: transparent;
    border: 1px solid #fff;
    color: #fff;
}

.asher-quote-outline-action:hover,
.asher-quote-outline-action:focus-visible {
    background: #fff;
    color: #0b0b0c;
}

.asher-quote-included {
    padding: 18px;
}

.asher-quote-included h2,
.asher-quote-confidence h2 {
    margin-bottom: 16px;
}

.asher-quote-included ul,
.asher-quote-confidence ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.asher-quote-included ul {
    display: grid;
    gap: 13px 42px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.asher-quote-included li,
.asher-quote-confidence li {
    align-items: center;
    color: #efeff0;
    display: flex;
    font-size: 14px;
    line-height: 1.3;
}

.asher-quote-included li::before,
.asher-quote-confidence li::before,
.asher-quote-verified::before {
    align-items: center;
    background: #e0b34f;
    border-radius: 50%;
    color: #111;
    content: "\2713";
    display: inline-flex;
    flex: 0 0 24px;
    font-size: 15px;
    font-weight: 900;
    height: 24px;
    justify-content: center;
    margin-right: 14px;
}

.asher-quote-investment {
    padding: 18px;
}

.asher-quote-card-heading {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 8px;
}

.asher-quote-verified {
    align-items: center;
    background: rgba(175, 128, 28, .13);
    border: 1px solid #775d25;
    border-radius: 5px;
    color: #f1f1f2;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 10px;
    font-weight: 900;
    padding: 7px 10px;
    text-transform: uppercase;
}

.asher-quote-verified::before {
    flex-basis: 17px;
    font-size: 11px;
    height: 17px;
    margin-right: 7px;
}

.asher-quote-price-label {
    color: #f0f0f1;
    display: block;
    font-size: 14px;
    margin-top: 8px;
}

.asher-quote-price {
    border-bottom: 1px solid #4a4a4e;
    color: #fff;
    display: block;
    font-family: Oswald, "Arial Narrow", Arial, sans-serif;
    font-size: clamp(44px, 4vw, 58px);
    font-weight: 800;
    letter-spacing: .02em;
    line-height: 1;
    margin: 6px 0 10px;
    padding-bottom: 12px;
}

.asher-quote-financial-row {
    align-items: center;
    color: #e7e7e8;
    display: flex;
    font-size: 14px;
    justify-content: space-between;
    padding: 5px 0;
}

.asher-quote-financial-row strong {
    color: #fff;
    font-size: 15px;
}

.asher-quote-price-note {
    border-top: 1px solid #4a4a4e;
    color: #d6d6d8;
    font-size: 13px;
    line-height: 1.35;
    margin: 8px 0 12px;
    padding-top: 13px;
}

.asher-quote-primary-action {
    background: linear-gradient(90deg, #d7aa45, #e6bc5d);
    border: 1px solid #e6bc5d;
    color: #fff;
    width: 100%;
}

.asher-quote-primary-action:hover,
.asher-quote-primary-action:focus-visible {
    background: #f0c96d;
    color: #111;
}

.asher-quote-primary-action:disabled {
    cursor: not-allowed;
    opacity: .48;
}

.asher-quote-download {
    background: transparent;
    border: 0;
    color: #eee;
    margin: 4px auto -4px;
    min-height: 38px;
    padding: 8px;
    text-decoration: underline;
    text-transform: none;
    width: 100%;
}

.asher-quote-download span {
    font-size: 22px;
    margin-right: 8px;
    text-decoration: none;
}

.asher-quote-confidence {
    flex: 1;
    padding: 18px;
}

.asher-quote-confidence ul {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.asher-quote-confidence li {
    align-items: flex-start;
    font-size: 12px;
}

.asher-quote-confidence li::before {
    flex-basis: 22px;
    height: 22px;
    margin-right: 10px;
}

.asher-quote-footer {
    align-items: center;
    border-top: 1px solid #777;
    display: grid;
    gap: 24px;
    grid-template-columns: 270px 1fr 300px;
    margin-top: 13px;
    padding-top: 14px;
}

.asher-quote-footer p {
    border-left: 1px solid #454549;
    border-right: 1px solid #454549;
    color: #dedee0;
    font-size: 12px;
    line-height: 1.4;
    margin: 0;
    padding: 0 20px;
    text-align: center;
}

.asher-quote-expiry {
    color: #aaa;
    font-size: 11px;
    margin: 12px 0 0;
    text-align: center;
}

.asher-quote-message {
    border: 1px solid #d2a63d;
    color: #fff;
    font-size: 13px;
    margin: 14px 0 0;
    padding: 12px;
    text-align: center;
}

.asher-quote-message[data-error="true"] {
    border-color: #d97474;
    color: #ffd3d3;
}

.asher-residential-progress {
    margin-bottom: 18px;
    max-width: 1280px;
}

.asher-residential-progress ol {
    align-items: center;
    display: flex;
    gap: 0;
    justify-content: space-between;
}

.asher-residential-progress li {
    background: transparent;
    border: 0;
    border-radius: 0;
    color: #e0e0e2;
    flex: 0 1 auto;
    font-size: 12px;
    gap: 9px;
    min-height: 46px;
    padding: 0;
    position: relative;
    white-space: nowrap;
}

.asher-residential-progress li:not(:last-child)::after {
    background: #666;
    content: "";
    height: 1px;
    margin-left: 20px;
    width: clamp(18px, 2.5vw, 42px);
}

.asher-residential-progress li > span {
    background: #343438;
    flex-basis: 31px;
    font-size: 12px;
    height: 31px;
}

.asher-residential-progress li.is-active {
    border: 0;
    color: #e1b343;
}

.asher-residential-progress li.is-active > span {
    background: #e1b343;
    color: #101011;
}

@media (max-width: 1050px) {
    .asher-quote-roof-strip {
        grid-template-columns: 50px 1fr 82px;
    }

    .asher-quote-roof-strip .asher-quote-outline-action {
        grid-column: 1 / -1;
        margin-bottom: 14px;
    }

    .asher-residential-progress li {
        font-size: 0;
    }

    .asher-residential-progress li:not(:last-child)::after {
        margin-left: 10px;
        width: clamp(16px, 5vw, 60px);
    }
}

@media (max-width: 820px) {
    .asher-quote-review {
        padding: 8px 16px 24px;
    }

    .asher-quote-layout {
        grid-template-columns: 1fr;
    }

    .asher-quote-house-image {
        aspect-ratio: 16 / 7;
    }

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

    .asher-quote-footer p {
        border: 0;
        order: -1;
    }
}

@media (max-width: 540px) {
    .asher-quote-header h1 {
        font-size: 38px;
    }

    .asher-quote-header > span {
        font-size: 14px;
    }

    .asher-quote-selected-roof {
        padding-left: 12px;
        padding-right: 12px;
    }

    .asher-quote-house-image {
        aspect-ratio: 4 / 3;
    }

    .asher-quote-roof-strip {
        gap: 10px;
        grid-template-columns: 48px 1fr 72px;
    }

    .asher-quote-roof-copy strong {
        font-size: 11px;
    }

    .asher-quote-included ul,
    .asher-quote-confidence ul {
        grid-template-columns: 1fr;
    }

    .asher-quote-card-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .asher-residential-progress ol {
        display: grid;
        grid-template-columns: repeat(6, 1fr);
    }

    .asher-residential-progress li {
        justify-content: center;
    }

    .asher-residential-progress li:not(:last-child)::after {
        display: none;
    }
}

@media print {
    .asher-quote-outline-action,
    .asher-quote-primary-action,
    .asher-quote-download,
    .asher-residential-progress {
        display: none !important;
    }

    .asher-quote-review {
        background: #fff;
        color: #111;
        max-width: none;
    }
}