/* Clean Green Cars customer garage */
.cgc-garage {
    --cgc-garage-purple: #5a3a6d;
    --cgc-garage-purple-dark: #432b52;
    --cgc-garage-lime: #91c830;
    --cgc-garage-lime-soft: #f2fbdd;
    --cgc-garage-green: #24544c;
    --cgc-garage-ink: #27232b;
    --cgc-garage-muted: #615b63;
    --cgc-garage-border: #e4dedb;
    --cgc-garage-border-strong: #d7d0cc;
    --cgc-garage-surface: #fffefa;
    --cgc-garage-error: #a10828;
    --cgc-garage-radius: 8px;
    width: 100%;
    max-width: var(--global-content-width, 1290px);
    margin: 0 auto;
    padding: 56px var(--global-content-edge-padding, 20px) 72px;
    color: var(--cgc-garage-ink);
    font-family: "Nunito", "Open Sans", Arial, sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
}

/* This custom route has no backing WordPress page for the site breadcrumb. */
.cgc-customer-garage .manual-breadcrumbs {
    display: none;
}

.cgc-garage *,
.cgc-garage *::before,
.cgc-garage *::after {
    box-sizing: border-box;
}

.cgc-garage :is(h1, h2, h3, p) {
    margin-top: 0;
}

.cgc-garage h1,
.cgc-garage h2,
.cgc-garage h3 {
    color: var(--cgc-garage-purple);
    font-family: "Nunito", "Open Sans", Arial, sans-serif;
    font-weight: 700;
    letter-spacing: 0;
}

.cgc-garage h1 {
    margin-bottom: 10px;
    font-size: 2.5rem;
    line-height: 1.08;
}

.cgc-garage h2 {
    margin-bottom: 0;
    font-size: 1.75rem;
    line-height: 1.16;
}

.cgc-garage h3 {
    margin-bottom: 4px;
    font-size: 1.65rem;
    line-height: 1.1;
}

.cgc-garage a {
    color: var(--cgc-garage-purple);
    font-weight: 700;
    text-decoration-color: rgba(90, 58, 109, .45);
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.cgc-garage a:hover {
    color: var(--cgc-garage-purple-dark);
    text-decoration-color: currentColor;
}

.cgc-garage :is(a, button, input, summary):focus-visible {
    outline: 3px solid rgba(90, 58, 109, .38);
    outline-offset: 3px;
}

.cgc-garage button,
.cgc-garage input,
.cgc-garage summary {
    font: inherit;
}

.cgc-garage button {
    border: 1px solid var(--cgc-garage-purple);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-purple);
    color: #fffefa;
    font-weight: 700;
    cursor: pointer;
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.cgc-garage button:hover {
    border-color: var(--cgc-garage-purple-dark);
    background: var(--cgc-garage-purple-dark);
    transform: translateY(-1px);
}

.cgc-garage button:disabled {
    cursor: not-allowed;
    opacity: .6;
    transform: none;
}

.cgc-garage-eyebrow,
.cgc-garage-vehicle__head p {
    margin-bottom: 6px;
    color: var(--cgc-garage-green);
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .02em;
    line-height: 1.2;
    text-transform: none;
}

.cgc-garage--access {
    display: grid;
    min-height: 600px;
    max-width: 760px;
    align-items: center;
}

.cgc-garage-access {
    width: 100%;
    padding: 42px 46px 38px;
    border: 1px solid var(--cgc-garage-border-strong);
    border-top: 4px solid var(--cgc-garage-lime);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    box-shadow: 0 16px 34px -28px rgba(32, 22, 38, .42);
}

.cgc-garage-access__intro {
    max-width: 40rem;
}

.cgc-garage-access__intro > .cgc-garage-eyebrow {
    margin-bottom: 10px;
}

.cgc-garage-lead {
    max-width: 38rem;
    margin-bottom: 30px;
    color: var(--cgc-garage-muted);
    font-size: 1.05rem;
    line-height: 1.55;
}

.cgc-garage-access__benefits {
    display: grid;
    gap: 12px;
    max-width: 39rem;
    margin: 0 0 30px;
    padding: 22px 0;
    border-top: 1px solid var(--cgc-garage-border);
    border-bottom: 1px solid var(--cgc-garage-border);
    list-style: none;
}

.cgc-garage-access__benefits li {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    color: var(--cgc-garage-ink);
    font-size: .96rem;
    font-weight: 700;
    line-height: 1.4;
}

.cgc-garage-access__benefits li::before {
    display: grid;
    width: 22px;
    height: 22px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--cgc-garage-lime-soft);
    color: #4a7b00;
    content: "\2713";
    font-size: .82rem;
    font-weight: 800;
    line-height: 1;
}

.cgc-garage-message {
    margin: 0 0 24px;
    padding: 12px 16px;
    border: 1px solid #dbe9bd;
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-lime-soft);
    color: var(--cgc-garage-green);
    font-size: .95rem;
    font-weight: 700;
}

.cgc-garage-message--error {
    border-color: #efc0ca;
    background: #fff7f8;
    color: var(--cgc-garage-error);
}

.cgc-garage-access__sent {
    margin: 0 0 26px;
    padding: 0;
}

.cgc-garage-access__sent h2 {
    margin-bottom: 6px;
    font-size: 1.3rem;
}

.cgc-garage-access__sent p {
    margin-bottom: 0;
    color: var(--cgc-garage-muted);
}

.cgc-garage-form,
.cgc-garage-settings form {
    display: grid;
    gap: 18px;
}

.cgc-garage-form__help {
    margin: -8px 0 0;
    color: var(--cgc-garage-muted);
    font-size: .88rem;
    font-weight: 600;
    line-height: 1.45;
}

.cgc-garage-form label,
.cgc-garage-settings form > label:not(.cgc-garage-toggle) {
    display: grid;
    gap: 7px;
    color: var(--cgc-garage-ink);
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.3;
}

.cgc-garage-form input:not([type="hidden"]),
.cgc-garage-settings input[type="date"] {
    width: 100%;
    min-height: 52px;
    margin: 0;
    padding: 10px 14px;
    border: 1px solid var(--cgc-garage-border-strong);
    border-radius: var(--cgc-garage-radius);
    background: #fffefa;
    color: var(--cgc-garage-ink);
    box-shadow: none;
    font-size: 1rem;
    font-weight: 700;
}

.cgc-garage-form input:not([type="hidden"]):hover,
.cgc-garage-settings input[type="date"]:hover {
    border-color: rgba(90, 58, 109, .55);
}

.cgc-garage-form input:not([type="hidden"]):focus,
.cgc-garage-settings input[type="date"]:focus {
    border-color: var(--cgc-garage-purple);
    outline: 3px solid rgba(90, 58, 109, .15);
    outline-offset: 1px;
}

.cgc-garage-code {
    letter-spacing: .14em;
    text-align: center;
}

.cgc-garage-form > button,
.cgc-garage-settings form > button {
    display: inline-flex;
    min-height: 50px;
    align-items: center;
    justify-content: center;
    padding: 11px 20px;
}

.cgc-garage-resend {
    margin: 16px 0 0;
}

.cgc-garage-text-button,
.cgc-garage-text-link {
    -webkit-appearance: none;
    appearance: none;
    display: inline;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--cgc-garage-purple);
    font: inherit;
    font-weight: 600;
    line-height: inherit;
    text-decoration: underline;
    text-decoration-color: rgba(90, 58, 109, .45);
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.cgc-garage-text-button:hover,
.cgc-garage-text-link:hover {
    border: 0;
    background: transparent;
    color: var(--cgc-garage-purple-dark);
    text-decoration-color: currentColor;
    transform: none;
}

.cgc-garage-text-button:focus,
.cgc-garage-text-link:focus {
    outline: none;
}

.cgc-garage-text-button:focus-visible,
.cgc-garage-text-link:focus-visible {
    color: var(--cgc-garage-purple-dark);
    text-decoration-color: currentColor;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}

.cgc-garage-access .cgc-garage-access__fine-print {
    max-width: 39rem;
    margin: 16px 0 0;
    padding-top: 4px;
    color: var(--cgc-garage-muted);
    font-size: .88rem;
    line-height: 1.45;
}

.cgc-garage-access .cgc-garage-access__return {
    margin: 12px 0 0;
    padding-top: 8px;
    border-top: 0;
    font-size: .9rem;
}

.cgc-garage-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    padding: 0 0 30px;
    border-bottom: 1px solid #dbe9bd;
}

.cgc-garage-hero > div > p:not(.cgc-garage-eyebrow) {
    max-width: 43rem;
    margin-bottom: 0;
    color: var(--cgc-garage-muted);
    font-size: 1.05rem;
    line-height: 1.55;
}

.cgc-garage-logout {
    flex: 0 0 auto;
    margin: 0;
}

.cgc-garage-mobile-logout {
    display: none;
}

.cgc-garage-logout button {
    min-height: 44px;
    padding: 9px 16px;
    border-color: var(--cgc-garage-purple);
    background: transparent;
    color: var(--cgc-garage-purple);
}

.cgc-garage-logout button:hover {
    background: var(--cgc-garage-purple);
    color: #fffefa;
}

.cgc-garage-overview,
.cgc-garage-review,
.cgc-garage-vehicles {
    margin-top: 48px;
}

.cgc-garage-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 20px;
}

.cgc-garage-section-heading .cgc-garage-eyebrow {
    font-size: 1rem;
}

.cgc-garage-section-heading h2 {
    font-size: 2.05rem;
    line-height: 1.12;
}

.cgc-garage-section-heading > a {
    flex: 0 0 auto;
    margin-bottom: 2px;
    font-size: .93rem;
}

.cgc-garage-upcoming-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.cgc-garage-upcoming-item {
    display: flex;
    min-width: 0;
    min-height: 144px;
    flex-direction: column;
    justify-content: space-between;
    padding: 18px;
    border: 1px solid var(--cgc-garage-border);
    border-top: 4px solid var(--cgc-garage-lime);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    box-shadow: 0 12px 24px -24px rgba(32, 22, 38, .5);
    color: inherit;
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.cgc-garage-upcoming-item:hover {
    box-shadow: 0 16px 28px -24px rgba(32, 22, 38, .62);
    transform: translateY(-2px);
}

.cgc-garage-upcoming-item:focus-visible {
    outline: 3px solid var(--cgc-garage-purple);
    outline-offset: 3px;
}

.cgc-garage-upcoming-item > span,
.cgc-garage-date > span {
    color: var(--cgc-garage-muted);
    font-size: .85rem;
    font-weight: 700;
    line-height: 1.25;
    text-transform: none;
}

.cgc-garage-upcoming-item strong {
    display: block;
    margin: 14px 0 6px;
    color: var(--cgc-garage-green);
    font-size: 1.14rem;
    font-weight: 700;
    line-height: 1.22;
    overflow-wrap: anywhere;
}

.cgc-garage-upcoming-item__relative {
    display: block;
    color: var(--cgc-garage-muted);
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.25;
}

.cgc-garage-upcoming-item small {
    color: var(--cgc-garage-purple);
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .04em;
    line-height: 1.2;
}

.cgc-garage-upcoming-item.is-soon {
    border-top-color: #d99b18;
}

.cgc-garage-upcoming-item.is-soon strong {
    color: #8a5600;
}

.cgc-garage-upcoming-item.is-overdue {
    border-top-color: var(--cgc-garage-error);
}

.cgc-garage-upcoming-item.is-overdue strong {
    color: var(--cgc-garage-error);
}

.cgc-garage-upcoming-item.is-empty {
    border-top-color: var(--cgc-garage-border-strong);
}

.cgc-garage-upcoming-item.is-empty strong {
    color: var(--cgc-garage-muted);
}

.cgc-garage-empty {
    padding: 26px 0;
    border-top: 1px solid var(--cgc-garage-border);
    border-bottom: 1px solid var(--cgc-garage-border);
}

.cgc-garage-empty p {
    margin: 0;
    color: var(--cgc-garage-muted);
}

.cgc-garage-vehicle-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.cgc-garage-review__intro {
    max-width: 46rem;
    margin: -8px 0 20px;
    color: var(--cgc-garage-muted);
}

.cgc-garage-review-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.cgc-garage-review-card {
    overflow: hidden;
    border: 1px solid #dbe9bd;
    border-top: 4px solid var(--cgc-garage-lime);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-lime-soft);
    box-shadow: 0 16px 30px -28px rgba(32, 22, 38, .52);
}

.cgc-garage-review-card__copy {
    margin: 0;
    padding: 18px 22px 0;
    color: var(--cgc-garage-muted);
    font-size: .92rem;
    line-height: 1.5;
}

.cgc-garage-review-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding: 18px 22px 22px;
}

.cgc-garage-review-card__actions form {
    margin: 0;
}

.cgc-garage-review-card__actions button {
    min-height: 44px;
    padding: 9px 15px;
}

.cgc-garage-review-dismiss {
    border-color: var(--cgc-garage-purple);
    background: transparent;
    color: var(--cgc-garage-purple);
}

.cgc-garage-review-dismiss:hover {
    border-color: var(--cgc-garage-purple-dark);
    background: #fffefa;
    color: var(--cgc-garage-purple-dark);
}

.cgc-garage-vehicle {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--cgc-garage-border-strong);
    border-top: 4px solid var(--cgc-garage-lime);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    box-shadow: 0 16px 30px -28px rgba(32, 22, 38, .52);
}

.cgc-garage-vehicle.is-paused {
    border-top-color: #a69ea8;
}

.cgc-garage-vehicle__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 22px 20px;
}

.cgc-garage-vehicle__head > div {
    min-width: 0;
}

.cgc-garage-vehicle__head p {
    margin-top: 0;
}

.cgc-garage-vehicle__head h3 {
    overflow-wrap: anywhere;
}

.cgc-garage-vehicle__head > div > span {
    display: block;
    color: var(--cgc-garage-muted);
    font-size: .93rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.cgc-garage-vehicle__head .cgc-garage-vehicle-brand {
    align-items: center;
}

.cgc-garage-vehicle__head .cgc-garage-vehicle-brand__copy > span {
    display: block;
    color: var(--cgc-garage-muted);
    font-size: .93rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.cgc-garage-status {
    flex: 0 0 auto;
    margin-top: 2px;
    padding-left: 10px;
    color: var(--cgc-garage-green);
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.25;
    text-align: right;
    text-transform: none;
}

.cgc-garage-status.is-paused {
    color: var(--cgc-garage-muted);
}

.cgc-garage-status::before {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 6px;
    border-radius: 50%;
    background: var(--cgc-garage-lime);
    content: "";
    vertical-align: 1px;
}

.cgc-garage-status.is-paused::before {
    background: #a69ea8;
}

.cgc-garage-date-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid var(--cgc-garage-border);
    border-bottom: 1px solid var(--cgc-garage-border);
}

.cgc-garage-date {
    min-width: 0;
    padding: 15px 16px 16px;
}

.cgc-garage-date + .cgc-garage-date {
    border-left: 1px solid var(--cgc-garage-border);
}

.cgc-garage-date strong {
    display: block;
    margin-top: 5px;
    color: var(--cgc-garage-green);
    font-size: .96rem;
    font-weight: 700;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.cgc-garage-date.is-soon strong {
    color: #8a5600;
}

.cgc-garage-date.is-overdue strong {
    color: var(--cgc-garage-error);
}

.cgc-garage-date.is-empty strong {
    color: var(--cgc-garage-muted);
}

.cgc-garage-vehicle__links {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
    padding: 18px 22px;
    font-size: .9rem;
}

.cgc-garage-refresh {
    display: flex;
    margin: 0;
    padding: 0 22px 20px;
}

.cgc-garage-refresh button {
    min-height: 40px;
    padding: 8px 13px;
    border-color: var(--cgc-garage-border-strong);
    background: #fffefa;
    color: var(--cgc-garage-purple);
    font-size: .84rem;
}

.cgc-garage-refresh button:hover {
    border-color: var(--cgc-garage-purple);
    background: var(--cgc-garage-lime-soft);
    color: var(--cgc-garage-purple-dark);
}

.cgc-garage-refresh-note {
    margin: 0;
    padding: 0 22px 20px;
    color: var(--cgc-garage-muted);
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.4;
}

.cgc-garage-settings {
    border-top: 1px solid var(--cgc-garage-border);
}

.cgc-garage-settings > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 58px;
    padding: 14px 22px;
    color: var(--cgc-garage-purple);
    font-size: .95rem;
    font-weight: 700;
    cursor: pointer;
    list-style: none;
}

.cgc-garage-settings > summary::-webkit-details-marker {
    display: none;
}

.cgc-garage-settings > summary::after {
    width: 9px;
    height: 9px;
    flex: 0 0 auto;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    content: "";
    transform: rotate(45deg) translateY(-2px);
    transition: transform 160ms ease;
}

.cgc-garage-settings[open] > summary {
    color: var(--cgc-garage-purple-dark);
}

.cgc-garage-settings[open] > summary::after {
    transform: rotate(225deg) translate(-2px, -2px);
}

.cgc-garage-settings form {
    padding: 4px 22px 24px;
}

.cgc-garage-toggle {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 11px;
    align-items: center;
    color: var(--cgc-garage-ink);
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.4;
    cursor: pointer;
}

.cgc-garage-toggle input[type="checkbox"] {
    width: 20px;
    height: 20px;
    margin: 0;
    accent-color: var(--cgc-garage-purple);
}

@media (max-width: 980px) {
    .cgc-garage-upcoming-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cgc-garage-vehicle-grid {
        grid-template-columns: 1fr;
    }

    .cgc-garage-review-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .cgc-garage {
        padding-top: 36px;
        padding-bottom: 52px;
    }

    .cgc-garage h1 {
        font-size: 2.1rem;
    }

    .cgc-garage h2 {
        font-size: 1.5rem;
    }

    .cgc-garage--access {
        min-height: 0;
    }

    .cgc-garage-access {
        padding: 28px 22px 24px;
    }

    .cgc-garage-hero,
    .cgc-garage-section-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .cgc-garage-hero {
        gap: 22px;
        padding-bottom: 24px;
    }

    .cgc-garage-section-heading {
        gap: 10px;
    }

    .cgc-garage-section-heading > a {
        margin-bottom: 0;
    }

    .cgc-garage-logout,
    .cgc-garage-logout button,
    .cgc-garage-form > button,
    .cgc-garage-settings form > button {
        width: 100%;
    }

    .cgc-garage-overview,
    .cgc-garage-review,
    .cgc-garage-vehicles {
        margin-top: 38px;
    }

    .cgc-garage-vehicle__head {
        gap: 16px;
        padding: 20px 18px 18px;
    }

    .cgc-garage-vehicle__links {
        padding: 16px 18px;
    }

    .cgc-garage-settings > summary {
        padding-right: 18px;
        padding-left: 18px;
    }

    .cgc-garage-settings form {
        padding-right: 18px;
        padding-bottom: 20px;
        padding-left: 18px;
    }
}

@media (max-width: 520px) {
    .cgc-garage {
        padding-right: 14px;
        padding-left: 14px;
    }

    .cgc-garage h1 {
        font-size: 1.95rem;
    }

    .cgc-garage-upcoming-grid {
        /* Keep date cards legible without making the overview unnecessarily long. */
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .cgc-garage-upcoming-item {
        min-height: 126px;
        padding: 14px;
    }

    .cgc-garage-vehicle__head {
        flex-direction: column;
    }

    .cgc-garage-status {
        margin-top: 0;
        text-align: left;
    }

    .cgc-garage-date-grid {
        grid-template-columns: 1fr;
    }

    .cgc-garage-date + .cgc-garage-date {
        border-top: 1px solid var(--cgc-garage-border);
        border-left: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cgc-garage *,
    .cgc-garage *::before,
    .cgc-garage *::after {
        scroll-behavior: auto;
        transition-duration: .01ms !important;
    }
}

/* My Garage app shell. The utility areas intentionally use the same CGC
 * purple, lime and rounded-panel language as the public vehicle tools. */
.cgc-garage-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    margin: 0;
    padding: 30px 34px;
    border: 1px solid var(--cgc-garage-purple-dark);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-purple);
    color: #fffefa;
}

.cgc-garage-hero :is(h1, p) {
    color: #fffefa;
}

.cgc-garage-hero h1 {
    margin-bottom: 6px;
    font-size: 2.2rem;
}

.cgc-garage-hero > div > p:last-child {
    max-width: 44rem;
    margin-bottom: 0;
    color: rgba(255, 254, 250, .86);
}

.cgc-garage-hero .cgc-garage-eyebrow {
    color: #d8f39a;
}

.cgc-garage-logout button {
    border-color: rgba(255, 254, 250, .72);
    background: #fffefa;
    color: var(--cgc-garage-purple-dark);
}

.cgc-garage-logout button:hover {
    border-color: #fffefa;
    background: var(--cgc-garage-lime-soft);
    color: var(--cgc-garage-purple-dark);
}

.cgc-garage-shell {
    display: grid;
    grid-template-columns: 236px minmax(0, 1fr);
    gap: 32px;
    align-items: start;
    margin-top: 30px;
}

/* Keep the signed-in Garage title band connected to the public site header.
 * The workspace remains constrained below, while this page-level heading
 * deliberately reaches both viewport edges on larger screens as it does on
 * mobile. */
@media (min-width: 701px) {
    .cgc-garage:not(.cgc-garage--access) {
        padding-top: 0;
    }

    .cgc-garage:not(.cgc-garage--access) .cgc-garage-hero {
        width: 100vw;
        margin-right: calc(50% - 50vw);
        margin-left: calc(50% - 50vw);
        padding-right: max(54px, calc((100vw - var(--global-content-width, 1290px)) / 2 + var(--global-content-edge-padding, 20px) + 34px));
        padding-left: max(54px, calc((100vw - var(--global-content-width, 1290px)) / 2 + var(--global-content-edge-padding, 20px) + 34px));
        border-width: 0 0 1px;
        border-radius: 0;
    }
}

.cgc-garage-nav-panel {
    position: sticky;
    top: 24px;
    padding: 18px 14px;
    border: 1px solid var(--cgc-garage-border);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    box-shadow: 0 16px 28px -26px rgba(32, 22, 38, .45);
}

.cgc-garage-nav {
    display: grid;
    gap: 3px;
}

.cgc-garage-nav-hint {
    display: none;
}

.cgc-garage-nav > :is(a, span) {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 6px;
    color: var(--cgc-garage-purple);
    font-size: .92rem;
    font-weight: 700;
    line-height: 1.25;
    text-decoration: none;
}

.cgc-garage-nav a:hover,
.cgc-garage-nav a.is-current {
    background: var(--cgc-garage-lime-soft);
    color: var(--cgc-garage-purple-dark);
}

.cgc-garage-nav .is-coming-soon {
    color: #837b84;
    cursor: not-allowed;
}

.cgc-garage-nav small {
    flex: 0 0 auto;
    padding: 3px 6px;
    border-radius: 999px;
    background: #f0ecee;
    color: #756d76;
    font-size: .66rem;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.cgc-garage-workspace {
    min-width: 0;
}

.cgc-garage-workspace > :first-child {
    margin-top: 0;
}

.cgc-garage-workspace > :not(:first-child) {
    margin-top: 42px;
}

.cgc-garage-workspace > .cgc-garage-message + * {
    margin-top: 0;
}

.cgc-garage-overview,
.cgc-garage-review,
.cgc-garage-vehicles {
    margin-top: 0;
}

.cgc-garage-upcoming-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.cgc-garage-upcoming-item {
    min-height: 132px;
    border-top-width: 1px;
}

.cgc-garage-overview-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.cgc-garage-overview-links a {
    display: grid;
    gap: 4px;
    min-height: 142px;
    align-content: start;
    padding: 22px;
    border: 1px solid var(--cgc-garage-border);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    color: var(--cgc-garage-purple);
    text-decoration: none;
    transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.cgc-garage-overview-links a:hover {
    border-color: #c6da96;
    background: var(--cgc-garage-lime-soft);
    transform: translateY(-1px);
}

.cgc-garage-overview-links strong {
    font-size: 1.45rem;
    line-height: 1.15;
}

.cgc-garage-overview-links span {
    color: var(--cgc-garage-ink);
    font-size: .98rem;
    font-weight: 700;
    line-height: 1.3;
}

.cgc-garage-overview-links small {
    margin-top: auto;
    color: var(--cgc-garage-muted);
    font-size: .84rem;
    font-weight: 600;
    line-height: 1.4;
}

.cgc-garage-vehicle-grid {
    grid-template-columns: 1fr;
    gap: 24px;
}

.cgc-garage-nav-count {
    display: inline-grid;
    width: 1.55rem;
    height: 1.55rem;
    margin-left: auto;
    border-radius: 50%;
    place-items: center;
    vertical-align: .14em;
    background: var(--cgc-garage-purple);
    color: #fffefa;
    font-size: .8rem;
    font-weight: 700;
    line-height: 1;
}

.cgc-garage-vehicle {
    border-top-width: 1px;
}

/* Registrations are identifiers, not title-case names. */
.cgc-garage-vehicle__head h3 {
    text-transform: uppercase;
}

.cgc-garage-date.is-disabled {
    background: #f8f6f5;
}

.cgc-garage-date.is-disabled :is(span, strong) {
    color: #8a828a;
}

.cgc-garage-settings {
    display: grid;
    gap: 18px;
    margin: 0;
    padding: 22px;
    border-top: 1px solid var(--cgc-garage-border);
}

.cgc-garage-settings__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.cgc-garage-settings__heading h4 {
    margin: 0 0 4px;
    color: var(--cgc-garage-purple);
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.25;
}

.cgc-garage-settings__heading p {
    margin: 0;
    color: var(--cgc-garage-muted);
    font-size: .88rem;
    line-height: 1.45;
}

.cgc-garage .cgc-garage-reminder-row input[type="checkbox"] {
    width: 20px;
    height: 20px;
    margin: 0;
    accent-color: var(--cgc-garage-lime);
}

.cgc-garage-reminder-rows {
    border-top: 1px solid var(--cgc-garage-border);
}

.cgc-garage-reminder-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 20px;
    align-items: center;
    gap: 16px;
    min-height: 64px;
    border-bottom: 1px solid var(--cgc-garage-border);
    color: var(--cgc-garage-purple);
    font-size: .9rem;
    font-weight: 700;
    cursor: pointer;
}

.cgc-garage-reminder-row__date {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.cgc-garage-reminder-row__date strong {
    color: var(--cgc-garage-ink);
    font-size: .96rem;
    line-height: 1.2;
}

.cgc-garage-reminder-row__date small {
    color: var(--cgc-garage-muted);
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.25;
}

.cgc-garage-insurance-date {
    display: grid;
    max-width: 360px;
    gap: 7px;
    color: var(--cgc-garage-ink);
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.3;
}

.cgc-garage-insurance-date input[type="date"] {
    width: 100%;
    min-height: 48px;
    margin: 0;
    padding: 9px 12px;
    border: 1px solid var(--cgc-garage-border-strong);
    border-radius: 6px;
    background: #fffefa;
    color: var(--cgc-garage-ink);
    font-weight: 700;
}

.cgc-garage-insurance-date small {
    color: var(--cgc-garage-muted);
    font-size: .78rem;
    font-weight: 600;
}

.cgc-garage-settings > button {
    width: fit-content;
    min-height: 46px;
    padding: 10px 16px;
}

.cgc-garage-add-vehicle {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, .9fr);
    gap: 28px;
    align-items: end;
    padding: 28px;
    border: 1px solid #dbe9bd;
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-lime-soft);
}

.cgc-garage-add-vehicle h2 {
    margin-bottom: 7px;
}

.cgc-garage-add-vehicle > div > p:last-child {
    max-width: 42rem;
    margin-bottom: 0;
    color: var(--cgc-garage-muted);
}

.cgc-garage-add-vehicle__form {
    display: grid;
    gap: 7px;
}

.cgc-garage-add-vehicle__form > label {
    color: var(--cgc-garage-ink);
    font-size: .88rem;
    font-weight: 700;
}

.cgc-garage-add-vehicle__form > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
}

.cgc-garage-add-vehicle__form input {
    min-width: 0;
    min-height: 50px;
    margin: 0;
    padding: 10px 14px;
    border: 1px solid var(--cgc-garage-border-strong);
    border-radius: 6px;
    background: #fffefa;
    color: var(--cgc-garage-ink);
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.cgc-garage-add-vehicle__form button {
    min-height: 50px;
    padding: 10px 17px;
    white-space: nowrap;
}

.cgc-garage-account-page {
    display: grid;
    gap: 24px;
}

.cgc-garage-account-page__heading {
    align-items: flex-start;
    margin: 0;
}

.cgc-garage-account-page__heading p:last-child {
    max-width: 42rem;
    margin: 8px 0 0;
    color: var(--cgc-garage-muted);
}

.cgc-garage-account-page__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.cgc-garage-account-card,
.cgc-garage-account-access,
.cgc-garage-account-change {
    border: 1px solid var(--cgc-garage-border);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    box-shadow: 0 16px 28px -28px rgba(32, 22, 38, .45);
}

.cgc-garage-account-card {
    display: grid;
    align-content: start;
    min-height: 244px;
    padding: 24px;
    border-top: 3px solid var(--cgc-garage-lime);
}

.cgc-garage-account-card h3,
.cgc-garage-account-access h3,
.cgc-garage-account-change h3 {
    margin-bottom: 16px;
    font-size: 1.38rem;
}

.cgc-garage-account-list {
    display: grid;
    gap: 14px;
    margin: 0;
}

.cgc-garage-account-list > div {
    display: grid;
    gap: 3px;
}

.cgc-garage-account-list dt {
    color: var(--cgc-garage-muted);
    font-size: .8rem;
    font-weight: 700;
    line-height: 1.25;
}

.cgc-garage-account-list dd {
    margin: 0;
    color: var(--cgc-garage-ink);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.cgc-garage-account-list--summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.cgc-garage-account-list--summary dd {
    color: var(--cgc-garage-purple);
    font-size: 1.62rem;
    line-height: 1.1;
}

.cgc-garage-account-card > a {
    align-self: end;
    margin-top: 18px;
    font-size: .9rem;
}

.cgc-garage-account-access,
.cgc-garage-account-change {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 24px;
}

.cgc-garage-account-access {
    border-color: #dbe9bd;
    background: var(--cgc-garage-lime-soft);
}

.cgc-garage-account-change {
    background: #fdfcfb;
}

.cgc-garage-account-access h3,
.cgc-garage-account-change h3 {
    margin-bottom: 6px;
}

.cgc-garage-account-access p:last-child,
.cgc-garage-account-change p:last-child {
    max-width: 46rem;
    margin: 0;
    color: var(--cgc-garage-muted);
}

.cgc-garage-account-access > a,
.cgc-garage-account-change > a {
    flex: 0 0 auto;
    white-space: nowrap;
}

.cgc-garage-insurance-intro,
.cgc-garage-page-note {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    padding: 28px;
    border: 1px solid var(--cgc-garage-border);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
}

.cgc-garage-insurance-intro {
    border-color: #dbe9bd;
    background: var(--cgc-garage-lime-soft);
}

.cgc-garage-page-note {
    align-items: flex-start;
    display: grid;
    gap: 7px;
    max-width: 760px;
}

.cgc-garage-insurance-intro h2,
.cgc-garage-page-note h2 {
    margin-bottom: 7px;
}

.cgc-garage-insurance-intro p,
.cgc-garage-page-note p {
    max-width: 45rem;
    margin-bottom: 0;
    color: var(--cgc-garage-muted);
}

.cgc-garage-insurance-quotes {
    display: grid;
    gap: 0;
}

.cgc-garage-insurance-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.cgc-garage-insurance-quote {
    display: flex;
    min-height: 246px;
    flex-direction: column;
    align-items: flex-start;
    padding: 24px;
    border: 1px solid var(--cgc-garage-border);
    border-top: 3px solid var(--cgc-garage-lime);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    box-shadow: 0 14px 26px -25px rgba(32, 22, 38, .46);
}

.cgc-garage-insurance-quote h3 {
    margin-bottom: 8px;
    font-size: 1.25rem;
    line-height: 1.2;
}

.cgc-garage-insurance-quote .cgc-garage-registration {
    display: inline-block;
    text-transform: uppercase;
}

.cgc-garage-insurance-quote > p:not(.cgc-garage-eyebrow) {
    margin-bottom: 12px;
    color: var(--cgc-garage-muted);
    font-size: .92rem;
    font-weight: 600;
    line-height: 1.45;
}

.cgc-garage-insurance-quote .cgc-garage-insurance-quote__vehicle {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 12px;
    color: var(--cgc-garage-ink);
    font-size: .96rem;
    font-weight: 700;
}

.cgc-garage-insurance-quote .cgc-garage-insurance-quote__vehicle p {
    margin: 0;
    color: inherit;
    font: inherit;
}

.cgc-garage-insurance-quote .cgc-garage-primary-link {
    margin-top: auto;
}

.cgc-garage-insurance-products {
    display: grid;
    gap: 18px;
}

.cgc-garage-insurance-products .cgc-garage-section-heading {
    display: block;
}

.cgc-garage-insurance-products .cgc-garage-section-heading p:last-child {
    max-width: 45rem;
    margin: 7px 0 0;
    color: var(--cgc-garage-muted);
}

.cgc-garage-insurance-product-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.cgc-garage-insurance-product-grid a {
    display: flex;
    min-height: 164px;
    flex-direction: column;
    align-items: flex-start;
    padding: 20px;
    border: 1px solid var(--cgc-garage-border-strong);
    border-top: 3px solid var(--cgc-garage-lime);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    color: var(--cgc-garage-purple);
    text-decoration: none;
    transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.cgc-garage-insurance-product-grid a:hover {
    border-color: #c6da96;
    background: var(--cgc-garage-lime-soft);
    transform: translateY(-1px);
}

.cgc-garage-insurance-product-grid strong {
    font-size: 1.1rem;
    line-height: 1.25;
}

.cgc-garage-insurance-product-grid span {
    margin-top: 8px;
    color: var(--cgc-garage-muted);
    font-size: .9rem;
    font-weight: 600;
    line-height: 1.45;
}

.cgc-garage-insurance-product-grid small {
    margin-top: auto;
    color: var(--cgc-garage-purple);
    font-size: .88rem;
    font-weight: 700;
}

.cgc-garage .cgc-garage-primary-link,
.cgc-garage .cgc-garage-primary-link:visited {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border: 1px solid var(--cgc-garage-purple);
    border-radius: 6px;
    background: var(--cgc-garage-purple);
    color: #fffefa;
    font-size: .94rem;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
}

.cgc-garage .cgc-garage-primary-link:hover {
    background: var(--cgc-garage-purple-dark);
    color: #fffefa;
}

.cgc-garage-tools__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.cgc-garage-tools__grid a {
    display: grid;
    gap: 7px;
    min-height: 126px;
    align-content: start;
    padding: 20px;
    border: 1px solid var(--cgc-garage-border-strong);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    color: var(--cgc-garage-purple);
    text-decoration: none;
    transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.cgc-garage-tools__grid a:hover {
    border-color: #c6da96;
    background: var(--cgc-garage-lime-soft);
    transform: translateY(-1px);
}

.cgc-garage-tools__grid strong {
    font-size: 1.05rem;
    line-height: 1.25;
}

.cgc-garage-tools__grid span {
    color: var(--cgc-garage-muted);
    font-size: .9rem;
    font-weight: 600;
    line-height: 1.45;
}

@media (max-width: 980px) {
    .cgc-garage-shell {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .cgc-garage-nav-panel {
        position: static;
        padding: 12px;
    }

    .cgc-garage-nav {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .cgc-garage-nav > :is(a, span) {
        min-height: 38px;
    }

    .cgc-garage-add-vehicle {
        grid-template-columns: 1fr;
    }

    .cgc-garage-insurance-intro,
    .cgc-garage-page-note {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 700px) {
    /* The signed-in Garage begins directly below the site header. Keep the
     * purple page heading full-bleed, while the working area retains a
     * comfortable reading gutter. */
    .cgc-garage:not(.cgc-garage--access) {
        padding: 0 0 52px;
    }

    .cgc-garage-hero {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
        width: 100vw;
        margin-right: calc(50% - 50vw);
        margin-left: calc(50% - 50vw);
        padding: 20px var(--global-content-edge-padding, 20px);
        border-width: 0 0 1px;
        border-radius: 0;
    }

    .cgc-garage-hero h1 {
        margin-bottom: 2px;
        font-size: 1.55rem;
    }

    .cgc-garage-hero > div > p:last-child {
        font-size: .92rem;
        line-height: 1.45;
    }

    .cgc-garage-logout {
        display: none;
    }

    .cgc-garage-mobile-logout {
        display: flex;
        justify-content: center;
        margin: 28px 0 0;
        padding: 4px 0 8px;
        font-size: .88rem;
    }

    .cgc-garage-shell {
        margin-top: 24px;
        padding-right: var(--global-content-edge-padding, 20px);
        padding-left: var(--global-content-edge-padding, 20px);
    }

    .cgc-garage-nav-panel {
        padding: 8px;
        overflow: hidden;
    }

    .cgc-garage-nav {
        display: flex;
        gap: 8px;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
        cursor: auto;
        touch-action: pan-x pan-y;
    }

    .cgc-garage-nav > :is(a, span) {
        flex: 0 0 auto;
        min-height: 44px;
        padding: 0 14px;
        scroll-snap-align: start;
        white-space: nowrap;
        overflow-wrap: normal;
        font-size: .84rem;
        line-height: 1;
    }

    .cgc-garage-nav::-webkit-scrollbar {
        display: none;
    }

    .cgc-garage-nav-hint {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        margin: 8px 4px 0;
        color: var(--cgc-garage-muted);
        font-size: .78rem;
        font-weight: 700;
        line-height: 1.2;
    }

    .cgc-garage-nav-hint span {
        color: var(--cgc-garage-purple);
        font-size: 1rem;
        line-height: 1;
    }

    .cgc-garage-nav > a.is-current {
        order: -1;
    }

    .cgc-garage-nav-count {
        position: static;
        width: 1.3rem;
        height: 1.3rem;
        margin-left: 2px;
        font-size: .7rem;
    }

    .cgc-garage-workspace > :not(:first-child) {
        margin-top: 36px;
    }

    .cgc-garage-settings,
    .cgc-garage-add-vehicle {
        padding: 20px 18px;
    }

    .cgc-garage-settings__heading,
    .cgc-garage-account-access,
    .cgc-garage-account-change {
        align-items: flex-start;
        flex-direction: column;
    }

    .cgc-garage-settings > button,
    .cgc-garage-add-vehicle__form button {
        width: 100%;
    }

    .cgc-garage-tools__grid {
        grid-template-columns: 1fr;
    }

    .cgc-garage-insurance-grid {
        grid-template-columns: 1fr;
    }

    .cgc-garage-insurance-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cgc-garage-account-page__grid {
        grid-template-columns: 1fr;
    }

    .cgc-garage-section-heading h2 {
        font-size: 1.75rem;
    }

    .cgc-garage-overview-links {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 520px) {
    .cgc-garage-insurance-product-grid {
        grid-template-columns: 1fr;
    }

    .cgc-garage-reminder-row {
        grid-template-columns: minmax(0, 1fr) 20px;
        gap: 12px;
        padding: 11px 0;
    }

    .cgc-garage-reminder-row > span:nth-child(2) {
        display: none;
    }

    .cgc-garage-add-vehicle__form > div {
        grid-template-columns: 1fr;
    }

    .cgc-garage-account-card,
    .cgc-garage-account-access,
    .cgc-garage-account-change {
        padding: 20px 18px;
    }

    .cgc-garage-account-access > a,
    .cgc-garage-account-change > a {
        width: 100%;
    }

    .cgc-garage-section-heading h2 {
        font-size: 1.62rem;
    }
}

/* Vehicle-first reminder management. Each record is a responsive row rather
 * than a stack of cards, so dates and choices are easy to compare. */
.cgc-garage-reminder-intro {
    max-width: 48rem;
    margin: 8px 0 0;
    color: var(--cgc-garage-muted);
    font-size: .94rem;
    line-height: 1.45;
}

.cgc-garage-reminder-list {
    overflow: hidden;
    border: 1px solid var(--cgc-garage-border);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    box-shadow: 0 16px 28px -28px rgba(32, 22, 38, .45);
}

.cgc-garage-reminder-list__labels,
.cgc-garage-reminder-vehicle {
    display: grid;
    grid-template-columns: minmax(210px, 1.5fr) repeat(3, minmax(135px, 1fr)) minmax(112px, .58fr);
}

.cgc-garage-reminder-list__labels {
    padding: 11px 18px;
    border-bottom: 1px solid var(--cgc-garage-border);
    background: #f8f6f5;
    color: var(--cgc-garage-muted);
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .02em;
    line-height: 1.2;
}

.cgc-garage-reminder-record + .cgc-garage-reminder-record {
    border-top: 1px solid var(--cgc-garage-border);
}

.cgc-garage-reminder-vehicle > * {
    min-width: 0;
    padding: 20px 18px;
}

.cgc-garage-reminder-vehicle > * + * {
    border-left: 1px solid var(--cgc-garage-border);
}

.cgc-garage-reminder-vehicle__identity {
    display: grid;
    align-content: start;
    gap: 4px;
}

.cgc-garage-reminder-vehicle__identity > p {
    margin: 0;
    color: var(--cgc-garage-teal);
    font-size: .76rem;
    font-weight: 700;
    line-height: 1.2;
}

.cgc-garage-reminder-vehicle__identity h3 {
    margin: 0;
    color: var(--cgc-garage-purple);
    font-size: 1.42rem;
    font-weight: 700;
    line-height: 1.15;
    text-transform: uppercase;
}

.cgc-garage-reminder-vehicle__identity > span:not(.cgc-garage-status) {
    color: var(--cgc-garage-muted);
    font-size: .84rem;
    font-weight: 600;
    line-height: 1.35;
}

.cgc-garage-reminder-vehicle__identity .cgc-garage-status {
    justify-self: start;
    margin-top: 8px;
}

.cgc-garage-reminder-choice {
    display: grid;
    align-content: start;
    gap: 10px;
    color: var(--cgc-garage-ink);
    cursor: pointer;
}

.cgc-garage-reminder-choice__label {
    display: none;
    color: var(--cgc-garage-purple);
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.2;
}

.cgc-garage-reminder-choice__date {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.cgc-garage-reminder-choice__date strong {
    color: var(--cgc-garage-ink);
    font-size: .98rem;
    font-weight: 700;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.cgc-garage-reminder-choice__date small {
    color: var(--cgc-garage-muted);
    font-size: .76rem;
    font-weight: 600;
    line-height: 1.25;
}

.cgc-garage-reminder-choice__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: var(--cgc-garage-purple);
    font-size: .84rem;
    font-weight: 700;
    line-height: 1.2;
}

.cgc-garage-reminder-choice input[type="checkbox"] {
    width: 20px;
    height: 20px;
    margin: 0;
    accent-color: var(--cgc-garage-lime);
}

.cgc-garage-reminder-choice--insurance {
    cursor: default;
}

.cgc-garage-reminder-choice--insurance .cgc-garage-reminder-choice__date input {
    width: 100%;
    min-height: 38px;
    padding: 7px 9px;
    border: 1px solid var(--cgc-garage-border-strong);
    border-radius: 6px;
    background: #fffefa;
    color: var(--cgc-garage-ink);
    font: inherit;
    font-size: .84rem;
    font-weight: 600;
}

.cgc-garage-reminder-choice--insurance .cgc-garage-reminder-choice__date input:focus-visible {
    outline: 3px solid rgba(112, 72, 142, .2);
    outline-offset: 1px;
    border-color: var(--cgc-garage-purple);
}

.cgc-garage-reminder-choice--insurance .cgc-garage-reminder-choice__toggle {
    cursor: pointer;
}

.cgc-garage-reminder-vehicle__actions {
    display: flex;
    align-items: center;
}

.cgc-garage-reminder-vehicle__actions button {
    width: 100%;
    min-height: 42px;
    padding: 9px 12px;
    white-space: nowrap;
}

.cgc-garage-reminder-record__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px 22px;
    padding: 14px 18px;
    border-top: 1px solid var(--cgc-garage-border);
    background: #fdfcfb;
}

.cgc-garage-reminder-record__links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
    font-size: .86rem;
    font-weight: 700;
}

.cgc-garage-reminder-record__footer .cgc-garage-refresh {
    flex: 0 0 auto;
    margin: 0;
    padding: 0;
}

.cgc-garage-reminder-record__footer .cgc-garage-refresh-note {
    max-width: 39rem;
    margin: 0;
    padding: 0;
    color: var(--cgc-garage-muted);
    font-size: .79rem;
    font-weight: 600;
    line-height: 1.4;
}

.cgc-garage-reminder-add {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 18px;
    padding: 18px 20px;
    border: 1px solid #d8e9b8;
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-lime-soft);
}

.cgc-garage-reminder-add > div {
    display: grid;
    gap: 3px;
}

.cgc-garage-reminder-add strong {
    color: var(--cgc-garage-purple);
    font-size: 1rem;
    line-height: 1.25;
}

.cgc-garage-reminder-add span {
    color: var(--cgc-garage-muted);
    font-size: .85rem;
    font-weight: 600;
    line-height: 1.4;
}

.cgc-garage-reminder-add a {
    flex: 0 0 auto;
    min-height: 42px;
    padding: 10px 14px;
    border: 1px solid var(--cgc-garage-purple);
    border-radius: 6px;
    background: var(--cgc-garage-purple);
    color: #fffefa;
    font-size: .88rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
}

.cgc-garage-reminder-add a:hover {
    background: var(--cgc-garage-purple-dark);
    color: #fffefa;
}

@media (max-width: 900px) {
    .cgc-garage-reminder-list__labels {
        display: none;
    }

    .cgc-garage-reminder-vehicle {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .cgc-garage-reminder-vehicle__identity,
    .cgc-garage-reminder-vehicle__actions {
        grid-column: 1 / -1;
    }

    .cgc-garage-reminder-vehicle__identity {
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
    }

    .cgc-garage-reminder-vehicle__identity > p {
        grid-column: 1 / -1;
    }

    .cgc-garage-reminder-vehicle__identity h3 {
        grid-column: 1;
    }

    .cgc-garage-reminder-vehicle__identity > span:not(.cgc-garage-status) {
        grid-column: 2;
    }

    .cgc-garage-reminder-vehicle__identity .cgc-garage-status {
        grid-column: 3;
        margin-top: 0;
    }

    .cgc-garage-reminder-choice__label {
        display: block;
    }

    .cgc-garage-reminder-vehicle__actions {
        justify-content: flex-end;
    }

    .cgc-garage-reminder-vehicle__actions button {
        width: auto;
    }
}

@media (max-width: 620px) {
    .cgc-garage-reminder-vehicle {
        grid-template-columns: 1fr;
    }

    .cgc-garage-reminder-vehicle > * + * {
        border-top: 1px solid var(--cgc-garage-border);
        border-left: 0;
    }

    .cgc-garage-reminder-vehicle__identity,
    .cgc-garage-reminder-vehicle__actions {
        grid-column: auto;
    }

    .cgc-garage-reminder-vehicle__identity {
        grid-template-columns: 1fr auto;
    }

    .cgc-garage-reminder-vehicle__identity > p {
        grid-column: 1 / -1;
    }

    .cgc-garage-reminder-vehicle__identity h3 {
        grid-column: 1;
    }

    .cgc-garage-reminder-vehicle__identity > span:not(.cgc-garage-status) {
        grid-column: 1 / -1;
    }

    .cgc-garage-reminder-vehicle__identity .cgc-garage-status {
        grid-column: 2;
        grid-row: 2;
    }

    .cgc-garage-reminder-choice {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
    }

    .cgc-garage-reminder-choice__date {
        grid-column: 1 / -1;
    }

    .cgc-garage-reminder-choice__toggle {
        grid-column: 2;
        grid-row: 1;
    }

    .cgc-garage-reminder-vehicle__actions button {
        width: 100%;
    }

    .cgc-garage-reminder-record__footer,
    .cgc-garage-reminder-add {
        align-items: stretch;
        flex-direction: column;
    }

    .cgc-garage-reminder-record__footer .cgc-garage-refresh,
    .cgc-garage-reminder-record__footer .cgc-garage-refresh button,
    .cgc-garage-reminder-add a {
        width: 100%;
    }

    .cgc-garage-reminder-add {
        gap: 14px;
    }
}

/* Vehicle-centred reminder management. Each saved vehicle owns its dates,
 * choices and record actions so the customer can scan one vehicle at a time. */
.cgc-garage-reminder-cards {
    display: grid;
    gap: 18px;
}

.cgc-garage-reminder-card {
    overflow: visible;
    border: 1px solid var(--cgc-garage-border);
    border-top: 3px solid var(--cgc-garage-lime);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    box-shadow: 0 16px 28px -28px rgba(32, 22, 38, .45);
}

.cgc-garage-reminder-card.is-paused {
    border-top-color: #a69ea8;
}

.cgc-garage-reminder-card.is-highlighted {
    border-color: var(--cgc-garage-purple);
    box-shadow: 0 0 0 3px rgba(95, 56, 127, .14), 0 16px 28px -28px rgba(32, 22, 38, .55);
    scroll-margin-top: 24px;
}

.cgc-garage-reminder-card__head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 18px;
    padding: 20px 22px 17px;
}

.cgc-garage-reminder-card__identity {
    display: grid;
    gap: 6px;
    min-width: 0;
    flex: 1 1 auto;
}

.cgc-garage-vehicle-brand {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
    min-width: 0;
}

.cgc-garage-vehicle-brand__copy {
    display: grid;
    gap: 6px;
    flex: 1 1 auto;
    min-width: 0;
}

.cgc-garage-make-emblem {
    --cgc-garage-make-emblem-size: contain;
    display: block;
    width: 76px;
    height: 56px;
    flex: 0 0 76px;
    color: var(--cgc-garage-green);
}

.cgc-garage-make-emblem:not(.cgc-garage-make-emblem--fallback)::before {
    display: block;
    width: 100%;
    height: 100%;
    background: currentColor;
    content: "";
    -webkit-mask: var(--cgc-garage-make-emblem) center / var(--cgc-garage-make-emblem-size) no-repeat;
    mask: var(--cgc-garage-make-emblem) center / var(--cgc-garage-make-emblem-size) no-repeat;
}

.cgc-garage-make-emblem--fallback {
    display: grid;
    width: 52px;
    height: 52px;
    flex-basis: 52px;
    place-items: center;
    border: 1px solid rgba(106, 159, 23, .18);
    border-radius: 50%;
    background: #f0f9d8;
    font-size: 1.1rem;
    font-weight: 800;
    line-height: 1;
}

.cgc-garage-make-emblem--alfaromeo { --cgc-garage-make-emblem: url("vehicle-makes/alfa-romeo.svg"); }
.cgc-garage-make-emblem--astonmartin { --cgc-garage-make-emblem: url("vehicle-makes/aston-martin.svg"); }
.cgc-garage-make-emblem--audi { --cgc-garage-make-emblem: url("vehicle-makes/audi.svg"); }
.cgc-garage-make-emblem--bentley { --cgc-garage-make-emblem: url("vehicle-makes/bentley.svg"); }
.cgc-garage-make-emblem--bmw { --cgc-garage-make-emblem: url("vehicle-makes/bmw.svg"); }
.cgc-garage-make-emblem--byd { --cgc-garage-make-emblem: url("vehicle-makes/byd.svg"); }
.cgc-garage-make-emblem--cadillac { --cgc-garage-make-emblem: url("vehicle-makes/cadillac.svg"); }
.cgc-garage-make-emblem--chevrolet { --cgc-garage-make-emblem: url("vehicle-makes/chevrolet.svg"); }
.cgc-garage-make-emblem--citroen { --cgc-garage-make-emblem: url("vehicle-makes/citroen.svg"); }
.cgc-garage-make-emblem--dacia { --cgc-garage-make-emblem: url("vehicle-makes/dacia.svg"); }
.cgc-garage-make-emblem--dsautomobiles { --cgc-garage-make-emblem: url("vehicle-makes/dsautomobiles.svg"); }
.cgc-garage-make-emblem--ferrari { --cgc-garage-make-emblem: url("vehicle-makes/ferrari.svg"); }
.cgc-garage-make-emblem--fiat { --cgc-garage-make-emblem: url("vehicle-makes/fiat.svg"); }
.cgc-garage-make-emblem--ford { --cgc-garage-make-emblem: url("vehicle-makes/ford.svg"); }
.cgc-garage-make-emblem--honda { --cgc-garage-make-emblem: url("vehicle-makes/honda.svg"); }
.cgc-garage-make-emblem--hyundai { --cgc-garage-make-emblem: url("vehicle-makes/hyundai.svg"); }
.cgc-garage-make-emblem--infiniti { --cgc-garage-make-emblem: url("vehicle-makes/infiniti.svg"); }
.cgc-garage-make-emblem--jaguar { --cgc-garage-make-emblem: url("vehicle-makes/jaguar.svg"); }
.cgc-garage-make-emblem--jeep { --cgc-garage-make-emblem: url("vehicle-makes/jeep.svg"); }
.cgc-garage-make-emblem--kia { --cgc-garage-make-emblem: url("vehicle-makes/kia.svg"); }
.cgc-garage-make-emblem--lamborghini { --cgc-garage-make-emblem: url("vehicle-makes/lamborghini.svg"); }
.cgc-garage-make-emblem--lucid { --cgc-garage-make-emblem: url("vehicle-makes/lucid.svg"); }
.cgc-garage-make-emblem--maserati { --cgc-garage-make-emblem: url("vehicle-makes/maserati.svg"); }
.cgc-garage-make-emblem--mazda { --cgc-garage-make-emblem: url("vehicle-makes/mazda.svg"); }
.cgc-garage-make-emblem--mclaren { --cgc-garage-make-emblem: url("vehicle-makes/mclaren.svg"); }
.cgc-garage-make-emblem--mg { --cgc-garage-make-emblem: url("vehicle-makes/mg.svg"); }
.cgc-garage-make-emblem--mini { --cgc-garage-make-emblem: url("vehicle-makes/mini.svg"); }
.cgc-garage-make-emblem--mitsubishi { --cgc-garage-make-emblem: url("vehicle-makes/mitsubishi.svg"); }
.cgc-garage-make-emblem--nissan { --cgc-garage-make-emblem: url("vehicle-makes/nissan.svg"); }
.cgc-garage-make-emblem--opel { --cgc-garage-make-emblem: url("vehicle-makes/opel.svg"); }
.cgc-garage-make-emblem--peugeot { --cgc-garage-make-emblem: url("vehicle-makes/peugeot.svg"); }
.cgc-garage-make-emblem--polestar { --cgc-garage-make-emblem: url("vehicle-makes/polestar.svg"); }
.cgc-garage-make-emblem--porsche { --cgc-garage-make-emblem: url("vehicle-makes/porsche.svg"); }
.cgc-garage-make-emblem--renault { --cgc-garage-make-emblem: url("vehicle-makes/renault.svg"); }
.cgc-garage-make-emblem--rollsroyce { --cgc-garage-make-emblem: url("vehicle-makes/rolls-royce.svg"); }
.cgc-garage-make-emblem--seat { --cgc-garage-make-emblem: url("vehicle-makes/seat.svg"); }
.cgc-garage-make-emblem--skoda { --cgc-garage-make-emblem: url("vehicle-makes/skoda.svg"); }
.cgc-garage-make-emblem--smart { --cgc-garage-make-emblem: url("vehicle-makes/smart.svg"); }
.cgc-garage-make-emblem--subaru { --cgc-garage-make-emblem: url("vehicle-makes/subaru.svg"); }
.cgc-garage-make-emblem--suzuki { --cgc-garage-make-emblem: url("vehicle-makes/suzuki.svg"); }
.cgc-garage-make-emblem--tesla { --cgc-garage-make-emblem: url("vehicle-makes/tesla.svg"); }
.cgc-garage-make-emblem--toyota { --cgc-garage-make-emblem: url("vehicle-makes/toyota.svg"); }
.cgc-garage-make-emblem--vauxhall { --cgc-garage-make-emblem: url("vehicle-makes/vauxhall.svg"); }
.cgc-garage-make-emblem--volkswagen { --cgc-garage-make-emblem: url("vehicle-makes/volkswagen.svg"); }
.cgc-garage-make-emblem--volvo { --cgc-garage-make-emblem: url("vehicle-makes/volvo.svg"); }

/* Ford uses its supplied full-colour oval badge rather than the shared
 * single-colour SVG mask so the script and chrome edge remain legible. */
.cgc-garage-make-emblem.cgc-garage-make-emblem--ford-colour {
    width: 96px;
    height: 56px;
    flex: 0 0 96px;
}

.cgc-garage-make-emblem.cgc-garage-make-emblem--ford-colour::before {
    display: none;
}

.cgc-garage-make-emblem--ford-colour img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Low, wide marks need a little more horizontal canvas. Round marks retain the
 * shared size so they do not compete with a vehicle's model name. */
.cgc-garage-make-emblem--astonmartin,
.cgc-garage-make-emblem--audi,
.cgc-garage-make-emblem--bentley,
.cgc-garage-make-emblem--byd,
.cgc-garage-make-emblem--chevrolet,
.cgc-garage-make-emblem--citroen,
.cgc-garage-make-emblem--dacia,
.cgc-garage-make-emblem--ford,
.cgc-garage-make-emblem--infiniti,
.cgc-garage-make-emblem--jaguar,
.cgc-garage-make-emblem--jeep,
.cgc-garage-make-emblem--kia,
.cgc-garage-make-emblem--lucid,
.cgc-garage-make-emblem--mclaren,
.cgc-garage-make-emblem--opel,
.cgc-garage-make-emblem--polestar,
.cgc-garage-make-emblem--renault,
.cgc-garage-make-emblem--rollsroyce,
.cgc-garage-make-emblem--seat,
.cgc-garage-make-emblem--skoda,
.cgc-garage-make-emblem--subaru,
.cgc-garage-make-emblem--suzuki,
.cgc-garage-make-emblem--toyota {
    width: 88px;
    flex-basis: 88px;
    --cgc-garage-make-emblem-size: 100% auto;
}

.cgc-garage-make-emblem--ford {
    width: 96px;
    flex-basis: 96px;
}

/* Direct artwork retains each manufacturer's own identifying detail. The
 * previous mask-based rule remains for legacy assets, while the current
 * Garage renderer opts into this contained image treatment. */
.cgc-garage-make-emblem.cgc-garage-make-emblem--image {
    --cgc-garage-make-image-height: 64px;
    display: grid;
    width: 112px;
    height: 64px;
    flex: 0 0 112px;
    place-items: center;
    color: inherit;
}

.cgc-garage-make-emblem.cgc-garage-make-emblem--image::before {
    display: none;
}

.cgc-garage-make-emblem.cgc-garage-make-emblem--image img {
    display: block;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: var(--cgc-garage-make-image-height) !important;
    object-fit: contain;
    object-position: center;
}

@media (max-width: 680px) {
    .cgc-garage-make-emblem.cgc-garage-make-emblem--image {
        --cgc-garage-make-image-height: 60px;
        width: 96px;
        height: 60px;
        flex-basis: 96px;
    }
}

.cgc-garage-reminder-card__identity .cgc-garage-eyebrow {
    margin: 0;
}

.cgc-garage-reminder-card__identity h3 {
    margin: 0;
    color: var(--cgc-garage-purple);
    font-size: 1.22rem;
    font-weight: 700;
    line-height: 1.18;
    overflow-wrap: anywhere;
    text-transform: uppercase;
}

.cgc-garage-reminder-card__identity .cgc-garage-registration {
    justify-self: start;
    padding: 4px 9px;
    border-radius: 4px;
    background: var(--cgc-garage-purple);
    color: #fffefa;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .02em;
    line-height: 1.1;
    text-transform: uppercase;
}

.cgc-garage-reminder-card__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    flex: 0 0 auto;
}

.cgc-garage-card-action-form {
    margin: 0;
}

.cgc-garage-card-action,
.cgc-garage-remove > summary {
    -webkit-appearance: none;
    appearance: none;
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--cgc-garage-teal);
    font: inherit;
    font-size: .84rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
}

.cgc-garage-card-action:focus,
.cgc-garage-remove > summary:focus {
    outline: none;
}

.cgc-garage-card-action:focus-visible,
.cgc-garage-remove > summary:focus-visible {
    color: var(--cgc-garage-purple-dark);
    text-decoration-color: currentColor;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}

.cgc-garage-card-action:hover,
.cgc-garage-remove > summary:hover {
    color: var(--cgc-garage-purple-dark);
}

.cgc-garage-card-action.is-disabled {
    color: var(--cgc-garage-muted);
    cursor: help;
    text-decoration: none;
}

/* Kadence applies a broad button surface to active controls. Refresh is an
 * inline action, so force it to retain the same text-link treatment as Remove. */
button.cgc-garage-card-action {
    -webkit-appearance: none !important;
    appearance: none !important;
    display: inline !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    color: var(--cgc-garage-teal) !important;
    font: inherit !important;
    font-size: .84rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-decoration: underline !important;
    text-underline-offset: 2px;
}

button.cgc-garage-card-action:hover,
button.cgc-garage-card-action:focus-visible {
    color: var(--cgc-garage-purple-dark) !important;
}

.cgc-garage-remove {
    position: relative;
}

.cgc-garage-remove > summary {
    color: #a63c50;
    list-style: none;
}

.cgc-garage-remove > summary::-webkit-details-marker {
    display: none;
}

.cgc-garage-remove__confirm {
    position: absolute;
    z-index: 3;
    top: calc(100% + 7px);
    right: 0;
    width: min(250px, calc(100vw - 56px));
    padding: 14px;
    border: 1px solid #efc8cf;
    border-radius: 6px;
    background: #fffafa;
    box-shadow: 0 16px 28px -20px rgba(48, 24, 31, .35);
}

.cgc-garage-remove__confirm p {
    margin: 0 0 12px;
    color: var(--cgc-garage-ink);
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.4;
}

.cgc-garage-remove__confirm form {
    margin: 0;
}

.cgc-garage-remove__confirm button {
    min-height: 36px;
    padding: 8px 11px;
    border-color: #a63c50;
    background: #a63c50;
    color: #fff;
    font-size: .8rem;
}

.cgc-garage-remove__confirm button:hover {
    border-color: #843142;
    background: #843142;
}

.cgc-garage-reminder-card__form {
    margin: 0;
    border-top: 1px solid var(--cgc-garage-border);
}

.cgc-garage-reminder-card__rows {
    display: grid;
}

.cgc-garage-reminder-card__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding: 15px 22px;
}

.cgc-garage-reminder-card__row + .cgc-garage-reminder-card__row,
.cgc-garage-reminder-disclosure + .cgc-garage-reminder-card__row {
    border-top: 1px solid var(--cgc-garage-border);
}

.cgc-garage-reminder-card__row > div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.cgc-garage-reminder-card__row :is(strong, label) {
    color: var(--cgc-garage-ink);
    font-size: .92rem;
    font-weight: 700;
    line-height: 1.2;
}

.cgc-garage-reminder-card__row > div > span {
    color: var(--cgc-garage-purple);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.2;
}

.cgc-garage-reminder-card__row small {
    color: var(--cgc-garage-muted);
    font-size: .78rem;
    font-weight: 600;
    line-height: 1.25;
}

.cgc-garage-reminder-card__toggle {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    color: var(--cgc-garage-purple) !important;
    font-size: .84rem !important;
    cursor: pointer;
}

.cgc-garage-reminder-card__toggle input[type="checkbox"] {
    width: 20px;
    height: 20px;
    margin: 0;
    accent-color: var(--cgc-garage-lime);
}

.cgc-garage-reminder-card__row--insurance input[type="date"] {
    width: min(100%, 235px);
    min-height: 38px;
    padding: 7px 9px;
    border: 1px solid var(--cgc-garage-border-strong);
    border-radius: 6px;
    background: #fffefa;
    color: var(--cgc-garage-ink);
    font: inherit;
    font-size: .88rem;
    font-weight: 600;
}

.cgc-garage-reminder-card__row--insurance input[type="date"]:focus-visible {
    outline: 3px solid rgba(112, 72, 142, .2);
    outline-offset: 1px;
    border-color: var(--cgc-garage-purple);
}

/* Consent note for insurance reminders. These carry a promotional call to
 * action, so the customer is told what switching them on means. */
.cgc-garage-reminder-card__consent {
    flex-basis: 100%;
    width: 100%;
    margin: 6px 0 0;
    color: var(--cgc-garage-muted);
    font-size: .78rem;
    line-height: 1.45;
}

.cgc-garage-reminder-disclosure {
    border-top: 1px solid var(--cgc-garage-border);
    background: #fdfcfb;
}

.cgc-garage-reminder-disclosure > summary {
    display: flex;
    align-items: center;
    min-height: 42px;
    padding: 11px 22px;
    color: var(--cgc-garage-purple);
    font-size: .84rem;
    font-weight: 700;
    line-height: 1.25;
    cursor: pointer;
}

.cgc-garage-reminder-disclosure > div {
    display: grid;
    gap: 12px;
    padding: 0 22px 16px;
}

.cgc-garage-reminder-disclosure dl {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 18px;
    margin: 0;
}

.cgc-garage-reminder-disclosure dl > div {
    display: grid;
    gap: 2px;
}

.cgc-garage-reminder-disclosure dt {
    color: var(--cgc-garage-muted);
    font-size: .74rem;
    font-weight: 700;
    line-height: 1.2;
}

.cgc-garage-reminder-disclosure dd {
    margin: 0;
    color: var(--cgc-garage-ink);
    font-size: .86rem;
    font-weight: 700;
    line-height: 1.3;
}

.cgc-garage-reminder-disclosure p {
    max-width: 50rem;
    margin: 0;
    color: var(--cgc-garage-muted);
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.45;
}

.cgc-garage-reminder-disclosure a {
    justify-self: start;
    color: var(--cgc-garage-purple);
    font-size: .84rem;
    font-weight: 700;
}

.cgc-garage-reminder-disclosure[aria-busy="true"] > summary {
    cursor: wait;
}

.cgc-garage-reminder-disclosure > .cgc-garage-vehicle-report {
    gap: 16px;
    padding-top: 4px;
}

.cgc-garage-report-loading {
    display: grid;
    grid-template-columns: 1.2fr .8fr .65fr;
    gap: 8px;
    min-height: 92px;
    align-content: center;
}

.cgc-garage-report-loading span {
    height: 34px;
    border: 1px solid #ebe7e2;
    border-radius: 4px;
    background: #f4f1ed;
}

.cgc-garage-report-loading p {
    grid-column: 1 / -1;
}

.cgc-garage-report-summary {
    display: grid;
    grid-template-columns: minmax(175px, .72fr) minmax(0, 2fr);
    gap: 14px;
    align-items: stretch;
}

.cgc-garage-report-status {
    display: grid;
    align-content: center;
    gap: 4px;
    min-height: 116px;
    padding: 16px;
    border: 1px solid #eadfe8;
    border-radius: 6px;
    background: #f8f3f7;
}

.cgc-garage-report-status.is-positive {
    border-color: #cfe6ad;
    background: #f2fadd;
}

.cgc-garage-report-status.is-alert {
    border-color: #ead5c5;
    background: #fff7ef;
}

.cgc-garage-report-status > span,
.cgc-garage-report-status > small {
    color: var(--cgc-garage-muted);
    font-size: .75rem;
    font-weight: 700;
    line-height: 1.3;
}

.cgc-garage-report-status > strong {
    color: var(--cgc-garage-purple);
    font-size: 1.12rem;
    line-height: 1.2;
}

.cgc-garage-reminder-disclosure .cgc-garage-report-facts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.cgc-garage-reminder-disclosure .cgc-garage-report-facts--tax {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cgc-garage-reminder-disclosure .cgc-garage-report-facts > div {
    min-width: 0;
    padding: 11px 12px;
    border: 1px solid #ebe7e2;
    border-radius: 5px;
    background: #fff;
}

.cgc-garage-mot-history {
    display: grid;
    gap: 10px;
}

.cgc-garage-mot-history h4 {
    margin: 2px 0 0;
    color: var(--cgc-garage-ink);
    font-size: .95rem;
    line-height: 1.3;
}

.cgc-garage-mot-history__list {
    border-top: 1px solid var(--cgc-garage-border);
}

.cgc-garage-mot-test {
    border-bottom: 1px solid var(--cgc-garage-border);
    background: #fff;
}

.cgc-garage-mot-test > summary {
    display: grid;
    grid-template-columns: minmax(145px, 1fr) minmax(75px, auto) minmax(70px, auto);
    gap: 14px;
    align-items: center;
    min-height: 60px;
    padding: 10px 12px;
    cursor: pointer;
}

.cgc-garage-mot-test > summary > span:first-child {
    display: grid;
    gap: 2px;
}

.cgc-garage-mot-test > summary small {
    color: var(--cgc-garage-muted);
    font-size: .74rem;
}

.cgc-garage-mot-test__result {
    color: #863134;
    font-size: .8rem;
    font-weight: 800;
}

.cgc-garage-mot-test.is-pass .cgc-garage-mot-test__result {
    color: #2d6a45;
}

.cgc-garage-mot-test__action {
    color: var(--cgc-garage-purple);
    font-size: .76rem;
    font-weight: 700;
    text-align: right;
}

.cgc-garage-mot-test__details {
    display: grid;
    gap: 8px;
    padding: 2px 12px 14px;
}

.cgc-garage-mot-test__details h5 {
    margin: 4px 0 0;
    color: var(--cgc-garage-ink);
    font-size: .8rem;
}

.cgc-garage-mot-test__details ul {
    display: grid;
    gap: 6px;
    margin: 0;
    padding-left: 20px;
    color: var(--cgc-garage-ink);
    font-size: .8rem;
    line-height: 1.45;
}

.cgc-garage-mot-test__details ul.is-fail li::marker {
    color: #a43f42;
}

.cgc-garage-mot-test__details ul.is-advisory li::marker {
    color: #9a681a;
}

.cgc-garage-report-note {
    display: grid;
    gap: 7px;
    padding-top: 2px;
}

.cgc-garage-report-error {
    color: #8d3035 !important;
}

.cgc-garage-report-retry {
    justify-self: start;
    min-height: 36px;
    padding: 7px 11px;
    border: 1px solid var(--cgc-garage-purple);
    border-radius: 4px;
    background: #fff;
    color: var(--cgc-garage-purple);
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
}

.cgc-garage-report-retry:hover,
.cgc-garage-report-retry:focus-visible {
    background: #f8f3f7;
}

.cgc-garage-reminder-card__save {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 15px 22px 18px;
    border-top: 1px solid var(--cgc-garage-border);
}

.cgc-garage-reminder-card__save .cgc-garage-status {
    margin: 0;
}

.cgc-garage-reminder-card__save button {
    min-height: 40px;
    padding: 9px 13px;
}

.cgc-garage-reminder-add {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, .92fr);
    align-items: end;
    gap: 20px;
    margin-top: 20px;
    padding: 20px 22px;
    border: 1px solid #d8e9b8;
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-lime-soft);
}

.cgc-garage-reminder-add > div {
    display: grid;
    gap: 5px;
}

.cgc-garage-reminder-add .cgc-garage-eyebrow {
    margin: 0;
}

.cgc-garage-reminder-add h3 {
    margin: 0;
    color: var(--cgc-garage-purple);
    font-size: 1.16rem;
    line-height: 1.2;
}

.cgc-garage-reminder-add p:not(.cgc-garage-eyebrow) {
    margin: 0;
    color: var(--cgc-garage-muted);
    font-size: .86rem;
    font-weight: 600;
    line-height: 1.45;
}

.cgc-garage-reminder-add form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    margin: 0;
}

.cgc-garage-reminder-add input {
    min-width: 0;
    min-height: 42px;
    padding: 9px 12px;
    border: 1px solid var(--cgc-garage-border-strong);
    border-radius: 6px;
    background: #fffefa;
    color: var(--cgc-garage-ink);
    font: inherit;
    font-size: .98rem;
    font-weight: 700;
    text-transform: uppercase;
}

.cgc-garage-reminder-add input::placeholder {
    color: #81798a;
}

.cgc-garage-reminder-add input:focus-visible {
    outline: 3px solid rgba(112, 72, 142, .2);
    outline-offset: 1px;
    border-color: var(--cgc-garage-purple);
}

.cgc-garage-reminder-add button {
    min-height: 42px;
    padding: 9px 13px;
    white-space: nowrap;
}

@media (max-width: 720px) {
    .cgc-garage-reminder-card__head {
        align-items: stretch;
        flex-direction: column;
    }

    .cgc-garage-reminder-card__actions {
        justify-content: flex-start;
    }

    .cgc-garage-reminder-add {
        grid-template-columns: 1fr;
        align-items: stretch;
    }
}

@media (max-width: 520px) {
    .cgc-garage-reminder-card__head,
    .cgc-garage-reminder-card__row,
    .cgc-garage-reminder-card__save,
    .cgc-garage-reminder-add {
        padding-right: 16px;
        padding-left: 16px;
    }

    .cgc-garage-reminder-card__row {
        align-items: start;
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .cgc-garage-reminder-card__toggle {
        justify-content: space-between;
        width: 100%;
    }

    .cgc-garage-reminder-disclosure > summary {
        padding-right: 16px;
        padding-left: 16px;
    }

    .cgc-garage-reminder-disclosure > div {
        padding-right: 16px;
        padding-left: 16px;
    }

    .cgc-garage-reminder-disclosure dl {
        grid-template-columns: 1fr;
    }

    .cgc-garage-report-summary {
        grid-template-columns: 1fr;
    }

    .cgc-garage-reminder-disclosure .cgc-garage-report-facts--tax {
        grid-template-columns: 1fr;
    }

    .cgc-garage-mot-test > summary {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .cgc-garage-mot-test__action {
        display: none;
    }

    .cgc-garage-reminder-card__save {
        align-items: stretch;
        flex-direction: column;
    }

    .cgc-garage-reminder-card__save button,
    .cgc-garage-reminder-add form,
    .cgc-garage-reminder-add form button {
        width: 100%;
    }

    .cgc-garage-reminder-add form {
        grid-template-columns: 1fr;
    }

    .cgc-garage-remove__confirm {
        position: static;
        width: 100%;
        margin-top: 8px;
    }
}

.cgc-garage-is-busy {
    opacity: .62;
    pointer-events: none;
}

.cgc-garage-inline-feedback {
    display: none;
    position: fixed;
    z-index: 100000;
    top: 24px;
    right: 24px;
    width: min(420px, calc(100vw - 32px));
    margin: 0;
    padding: 12px 14px;
    border: 1px solid #d7e8b8;
    border-radius: 6px;
    background: var(--cgc-garage-lime-soft);
    box-shadow: 0 12px 28px rgba(37, 29, 45, .18);
    color: var(--cgc-garage-green);
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.4;
}

.cgc-garage-inline-feedback.is-visible {
    display: block;
    animation: cgc-garage-toast-in 180ms ease-out;
}

.cgc-garage-inline-feedback.is-error {
    border-color: #f2c4c4;
    background: #fff4f4;
    color: #9e2626;
}

@keyframes cgc-garage-toast-in {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 600px) {
    .cgc-garage-inline-feedback {
        top: 16px;
        right: 16px;
    }
}

.cgc-garage-profile-form {
    display: grid;
    gap: 14px;
    margin: 0;
}

.cgc-garage-profile-form__fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.cgc-garage-profile-form label {
    display: grid;
    gap: 6px;
    color: var(--cgc-garage-ink);
    font-size: .8rem;
    font-weight: 700;
    line-height: 1.25;
}

.cgc-garage-profile-form label small {
    color: var(--cgc-garage-muted);
    font-size: .74rem;
    font-weight: 600;
}

.cgc-garage-profile-form__field--wide {
    grid-column: 1 / -1;
}

.cgc-garage-profile-form input {
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border: 1px solid var(--cgc-garage-border-strong);
    border-radius: 6px;
    background: #fffefa;
    color: var(--cgc-garage-ink);
    font: inherit;
    font-size: .9rem;
    font-weight: 600;
}

.cgc-garage-profile-form input:focus-visible {
    outline: 3px solid rgba(112, 72, 142, .2);
    outline-offset: 1px;
    border-color: var(--cgc-garage-purple);
}

.cgc-garage-profile-form__email {
    display: grid;
    gap: 3px;
    padding-top: 2px;
    color: var(--cgc-garage-ink);
}

.cgc-garage-profile-form__email > span,
.cgc-garage-profile-form__email small,
.cgc-garage-profile-form__status {
    color: var(--cgc-garage-muted);
    font-size: .78rem;
    font-weight: 600;
    line-height: 1.35;
}

.cgc-garage-profile-form__email strong {
    font-size: .92rem;
    overflow-wrap: anywhere;
}

.cgc-garage-profile-form__status {
    margin: 0;
}

.cgc-garage-profile-form__status strong {
    color: var(--cgc-garage-green);
}

.cgc-garage-profile-form button {
    justify-self: start;
    min-height: 40px;
    padding: 9px 14px;
}

@media (max-width: 520px) {
    .cgc-garage-profile-form__fields {
        grid-template-columns: 1fr;
    }

    .cgc-garage-profile-form__field--wide {
        grid-column: auto;
    }

    .cgc-garage-profile-form button {
        width: 100%;
    }
}

.cgc-garage-support {
    display: grid;
    max-width: 920px;
    gap: 24px;
}

.cgc-garage-support__heading {
    align-items: flex-start;
    margin: 0;
}

.cgc-garage-support__heading p:last-child {
    max-width: 44rem;
    margin: 8px 0 0;
    color: var(--cgc-garage-muted);
}

.cgc-garage-support-form {
    display: grid;
    gap: 20px;
    margin: 0;
    padding: 24px;
    border: 1px solid var(--cgc-garage-border);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    box-shadow: 0 16px 28px -28px rgba(32, 22, 38, .45);
}

.cgc-garage-support-form__fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.cgc-garage-support-form label {
    display: grid;
    gap: 7px;
    color: var(--cgc-garage-ink);
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.3;
}

.cgc-garage-support-form label small {
    color: var(--cgc-garage-muted);
    font-size: .75rem;
    font-weight: 600;
}

.cgc-garage-support-form__wide {
    grid-column: 1 / -1;
}

.cgc-garage-support-form :is(input, select, textarea) {
    width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 9px 11px;
    border: 1px solid var(--cgc-garage-border-strong);
    border-radius: 6px;
    background: #fffefa;
    color: var(--cgc-garage-ink);
    font: inherit;
    font-size: .92rem;
    font-weight: 600;
}

.cgc-garage-support-form textarea {
    min-height: 156px;
    resize: vertical;
    line-height: 1.5;
}

.cgc-garage-support-form :is(input, select, textarea):focus-visible {
    outline: 3px solid rgba(112, 72, 142, .2);
    outline-offset: 1px;
    border-color: var(--cgc-garage-purple);
}

.cgc-garage-support-form__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--cgc-garage-border);
}

.cgc-garage-support-form__footer p {
    max-width: 38rem;
    margin: 0;
    color: var(--cgc-garage-muted);
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.45;
}

.cgc-garage-support-form__footer strong {
    color: var(--cgc-garage-ink);
    overflow-wrap: anywhere;
}

.cgc-garage-support-form__footer button {
    flex: 0 0 auto;
    min-height: 44px;
    padding: 10px 16px;
    white-space: nowrap;
}

.cgc-garage-support-history {
    display: grid;
    gap: 14px;
    padding-top: 4px;
}

.cgc-garage-support-history > div:first-child {
    display: grid;
    gap: 4px;
}

.cgc-garage-support-history h2 {
    margin: 0;
    font-size: 1.55rem;
}

.cgc-garage-support-history__list {
    border-top: 1px solid var(--cgc-garage-border);
}

.cgc-garage-support-history__empty {
    margin: 0;
    padding: 20px 0;
    color: var(--cgc-garage-muted);
    font-weight: 600;
}

.cgc-garage-support-record {
    display: grid;
    gap: 9px;
    padding: 20px 0;
    border-bottom: 1px solid var(--cgc-garage-border);
}

.cgc-garage-support-record__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.cgc-garage-support-record__head > div {
    min-width: 0;
}

.cgc-garage-support-record__reference {
    color: var(--cgc-garage-green);
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .04em;
}

.cgc-garage-support-record h3 {
    margin: 3px 0 0;
    color: var(--cgc-garage-purple);
    font-size: 1.08rem;
    line-height: 1.3;
}

.cgc-garage-support-status {
    display: inline-flex;
    min-height: 28px;
    flex: 0 0 auto;
    align-items: center;
    padding: 5px 10px;
    border-radius: 999px;
    background: #f3efe9;
    color: var(--cgc-garage-muted);
    font-size: .76rem;
    font-weight: 800;
    line-height: 1;
}

.cgc-garage-support-status--new {
    background: #fbf3d4;
    color: #725613;
}

.cgc-garage-support-status--in_progress {
    background: #e8f1f8;
    color: #245b83;
}

.cgc-garage-support-status--resolved {
    background: var(--cgc-garage-lime-soft);
    color: var(--cgc-garage-green);
}

.cgc-garage-support-record__meta {
    margin: 0;
    color: var(--cgc-garage-muted);
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.45;
}

.cgc-garage-support-record details {
    margin-top: 2px;
}

.cgc-garage-support-record summary {
    color: var(--cgc-garage-purple);
    font-size: .82rem;
    font-weight: 700;
    cursor: pointer;
}

.cgc-garage-support-record details p {
    max-width: 70ch;
    margin: 10px 0 0;
    color: var(--cgc-garage-ink);
    font-size: .88rem;
    line-height: 1.55;
}

.cgc-garage-support-thread__content {
    display: grid;
    gap: 18px;
    margin-top: 14px;
    padding: 18px;
    border: 1px solid var(--cgc-garage-border);
    border-radius: 10px;
    background: #fbfaf7;
}

.cgc-garage-support-thread__messages {
    display: grid;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cgc-garage-support-thread__message {
    width: min(88%, 680px);
    padding: 13px 15px;
    border: 1px solid var(--cgc-garage-border);
    border-radius: 10px;
    background: #fff;
}

.cgc-garage-support-thread__message.is-outbound {
    margin-left: auto;
    border-color: #cdddaa;
    background: var(--cgc-garage-lime-soft);
}

.cgc-garage-support-thread__message > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.cgc-garage-support-thread__message strong {
    color: var(--cgc-garage-purple);
    font-size: .8rem;
}

.cgc-garage-support-thread__message time,
.cgc-garage-support-thread__message small {
    color: var(--cgc-garage-muted);
    font-size: .72rem;
    font-weight: 650;
}

.cgc-garage-support-record .cgc-garage-support-thread__message p {
    max-width: none;
    margin: 8px 0 6px;
    overflow-wrap: anywhere;
}

.cgc-garage-support-reply {
    display: grid;
    gap: 10px;
    padding-top: 16px;
    border-top: 1px solid var(--cgc-garage-border);
}

.cgc-garage-support-reply label {
    display: grid;
    gap: 7px;
    color: var(--cgc-garage-ink);
    font-size: .82rem;
    font-weight: 750;
}

.cgc-garage-support-reply textarea {
    width: 100%;
    min-height: 108px;
    padding: 10px 12px;
    border: 1px solid var(--cgc-garage-border-strong);
    border-radius: 7px;
    background: #fff;
    color: var(--cgc-garage-ink);
    font: inherit;
    resize: vertical;
}

.cgc-garage-support-reply textarea:focus-visible {
    outline: 3px solid rgba(112, 72, 142, .2);
    outline-offset: 1px;
    border-color: var(--cgc-garage-purple);
}

.cgc-garage-support-record .cgc-garage-support-reply p {
    margin: 0;
    color: var(--cgc-garage-muted);
    font-size: .76rem;
}

.cgc-garage-support-reply button {
    justify-self: start;
    min-height: 42px;
    padding: 9px 15px;
}

@media (max-width: 700px) {
    .cgc-garage-support-form {
        padding: 20px;
    }

    .cgc-garage-support-form__fields {
        grid-template-columns: 1fr;
    }

    .cgc-garage-support-form__wide {
        grid-column: auto;
    }

    .cgc-garage-support-form__footer {
        align-items: stretch;
        flex-direction: column;
    }

    .cgc-garage-support-form__footer button {
        width: 100%;
    }

    .cgc-garage-support-thread__content {
        padding: 14px;
    }

    .cgc-garage-support-thread__message {
        width: 100%;
    }

    .cgc-garage-support-thread__message > div {
        align-items: flex-start;
        flex-direction: column;
        gap: 2px;
    }
}

/* The compact overview still needs readable date cards on narrow screens. */
@media (max-width: 980px) {
    .cgc-garage-upcoming-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Member Offers are content-managed by the Garage team. The repeated offer
 * cards use the same compact, high-contrast language as saved vehicles. */
.cgc-garage-offers-overview,
.cgc-garage-offers-page {
    display: grid;
    gap: 20px;
}

.cgc-garage-offers-overview__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.cgc-garage-offers-overview__item {
    display: flex;
    min-height: 184px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding: 20px;
    border: 1px solid var(--cgc-garage-border-strong);
    border-top: 3px solid var(--cgc-garage-lime);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    box-shadow: 0 14px 26px -25px rgba(32, 22, 38, .46);
    color: var(--cgc-garage-purple);
    text-decoration: none;
    transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.cgc-garage-offers-overview__item:hover {
    border-color: #c6da96;
    background: var(--cgc-garage-lime-soft);
    transform: translateY(-1px);
}

.cgc-garage-offers-overview__item strong {
    color: var(--cgc-garage-purple);
    font-size: 1.12rem;
    line-height: 1.25;
}

.cgc-garage-offers-overview__item p {
    margin: 0;
    color: var(--cgc-garage-muted);
    font-size: .9rem;
    font-weight: 600;
    line-height: 1.45;
}

.cgc-garage-offers-overview__item small {
    margin-top: auto;
    color: var(--cgc-garage-purple);
    font-size: .88rem;
    font-weight: 700;
}

.cgc-garage-offer__badge {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--cgc-garage-lime-soft);
    color: var(--cgc-garage-green);
    font-size: .78rem;
    font-weight: 700;
    line-height: 1;
}

.cgc-garage-offers-list {
    display: grid;
    max-width: 980px;
    gap: 20px;
}

.cgc-garage-offer {
    display: grid;
    grid-template-columns: minmax(150px, 180px) minmax(0, 1fr);
    gap: 24px;
    padding: 24px;
    border: 1px solid var(--cgc-garage-border);
    border-top: 3px solid var(--cgc-garage-lime);
    border-radius: var(--cgc-garage-radius);
    background: var(--cgc-garage-surface);
    box-shadow: 0 16px 28px -28px rgba(32, 22, 38, .5);
}

.cgc-garage-offer__media {
    display: grid;
    min-height: 156px;
    align-items: center;
    justify-items: center;
    overflow: hidden;
    border: 1px solid #dbe9bd;
    border-radius: 6px;
    background: var(--cgc-garage-lime-soft);
}

.cgc-garage-offer__media img {
    display: block;
    width: 100%;
    height: 156px;
    object-fit: contain;
}

.cgc-garage-offer__placeholder {
    color: var(--cgc-garage-green);
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.cgc-garage-offer__content {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

.cgc-garage-offer__content h3 {
    margin: 0;
    font-size: 1.45rem;
    line-height: 1.18;
}

.cgc-garage-offer__content > p {
    max-width: 52rem;
    margin: 0;
    color: var(--cgc-garage-muted);
    font-size: .95rem;
    font-weight: 600;
    line-height: 1.5;
}

.cgc-garage-offer__terms {
    width: 100%;
    margin-top: 2px;
    padding-top: 12px;
    border-top: 1px solid var(--cgc-garage-border);
}

.cgc-garage-offer__terms summary {
    color: var(--cgc-garage-purple);
    font-size: .9rem;
    font-weight: 700;
    cursor: pointer;
}

.cgc-garage-offer__terms div {
    padding-top: 10px;
    color: var(--cgc-garage-muted);
    font-size: .88rem;
    font-weight: 600;
    line-height: 1.45;
}

.cgc-garage-offer__terms div :last-child {
    margin-bottom: 0;
}

.cgc-garage-offer__content .cgc-garage-primary-link {
    margin-top: 4px;
}

@media (max-width: 700px) {
    .cgc-garage-offers-overview__grid {
        grid-template-columns: 1fr;
    }

    .cgc-garage-offer {
        grid-template-columns: 1fr;
        gap: 18px;
        padding: 20px;
    }

    .cgc-garage-offer__media,
    .cgc-garage-offer__media img {
        min-height: 132px;
        height: 132px;
    }

    .cgc-garage-offer__content .cgc-garage-primary-link {
        width: 100%;
    }
}
