/* Module 5.7.5: mobile homepage hero VRM plate correction */
@media (max-width: 600px) {
    .hero-vrm-card {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .hero-vrm-form,
    .hero-vrm-form .uk-plate-input {
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    /* Keep the GB strip and registration field on one horizontal row. */
    .hero-vrm-form .uk-plate-input {
        display: grid !important;
        grid-template-columns: 66px minmax(0, 1fr) !important;
        grid-template-rows: 1fr !important;
        align-items: stretch;
        min-height: 76px !important;
        height: 76px;
        overflow: hidden;
    }

    .hero-vrm-form .plate-gb {
        grid-column: 1;
        grid-row: 1;
        width: 66px;
        min-width: 66px;
        height: 100%;
        align-self: stretch;
    }

    .hero-vrm-form .plate-gb b {
        font-size: 1.25rem;
        line-height: 1;
    }

    .hero-vrm-form .plate-gb small {
        margin-top: 5px;
        font-size: .62rem;
        line-height: 1;
    }

    .hero-vrm-form .uk-plate-input input {
        grid-column: 2;
        grid-row: 1;
        display: block;
        width: 100% !important;
        min-width: 0 !important;
        height: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 8px 10px !important;
        border: 0 !important;
        font-size: clamp(1.55rem, 8.2vw, 2rem) !important;
        line-height: 1 !important;
        letter-spacing: .07em !important;
        text-align: center !important;
        align-self: stretch;
        appearance: none;
        -webkit-appearance: none;
    }

    .hero-vrm-form .uk-plate-input input::placeholder {
        font-size: inherit;
        letter-spacing: .07em;
    }
}

@media (max-width: 380px) {
    .hero-vrm-card {
        padding: 20px 16px !important;
    }

    .hero-vrm-form .uk-plate-input {
        grid-template-columns: 58px minmax(0, 1fr) !important;
        min-height: 70px !important;
        height: 70px;
    }

    .hero-vrm-form .plate-gb {
        width: 58px;
        min-width: 58px;
    }

    .hero-vrm-form .uk-plate-input input {
        font-size: clamp(1.38rem, 7.5vw, 1.7rem) !important;
        padding-inline: 7px !important;
        letter-spacing: .055em !important;
    }

    .hero-vrm-trust {
        justify-content: center;
        gap: 7px 11px;
        font-size: .68rem;
    }
}
