#top.hero {
    background-image: linear-gradient(180deg, rgba(15, 28, 46, 0.31), rgba(15, 28, 46, 0.51)),
        url("../assets/checkout/hero.webp");
    background-position: 40%;
    min-height: var(--hero-height-without-cta);
}
#top.hero .hero-grid {
    min-height: calc(var(--hero-height-without-cta) - 80px);
}
.checkout-card-not-possible {
    display: none;
    text-align: center;
    align-items: center;
    flex-direction: column;
    gap: var(--space-2);
}
.checkout-card-not-possible p {
    font-weight: 600;
    color: #a50000;
    margin-bottom: var(--space-2);
}
.checkout-card-not-possible button {
    width: min(70%, 320px);
    background: var(--color-accent);
    color: var(--color-navy);
    padding: 14px 18px;
    font-size: 16px;
    font-weight: 600;
    border: none;
    border-radius: var(--radius-2);
    cursor: pointer;
    transition: filter 0.2s ease;
}
.checkout-card-not-possible button:hover {
    filter: brightness(0.95);
}
.coupon-row {
    display: flex;
    gap: var(--space-2);
    align-items: stretch;
    margin-bottom: var(--space-3);
}
.coupon-row input {
    margin-bottom: 0;
}
@media (max-width: 720px) {
    #top.hero {
        background-position: 35% 40%;
        min-height: var(--hero-height-without-cta-mobile);
    }

    #top.hero .hero-grid {
        min-height: calc(var(--hero-height-without-cta-mobile) - 80px);
    }

    .form-card {
        padding: var(--space-4);
    }
}