/* ── OFFER CARD ── */
.offer-card {
    background: #fff;
    display: flex; flex-direction: column;
    transition: background .15s;
}
.offer-card:hover { background: #FAFAF8; }

.card-img {
    height: 210px; position: relative; overflow: hidden;
    background: #F5F4F0; flex-shrink: 0;
}
.card-img-photo {
    position: absolute; inset: 0;
    width: 100%; height: 100%; object-fit: contain; object-position: center;
    display: block; padding: 8px; background: #FAFAF8;
}
.card-img-placeholder { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.card-img-placeholder svg { opacity: .15; }

.card-moto-badge {
    position: absolute; top: 12px; left: 12px;
    display: flex; align-items: center; gap: 4px;
    font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
    padding: 4px 10px; color: #fff;
}
.moto-electric  { background: #0F7B6C; }
.moto-hybrid    { background: #6B3FA0; }
.moto-thermal   { background: #7A5018; }
.moto-hydrogen  { background: #1A6B3A; }

.card-body { padding: 22px 24px 24px; flex: 1; display: flex; flex-direction: column; }
.card-brand { font-size: 10px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: #9B9890; margin-bottom: 4px; }
.card-name { font-size: 20px; font-weight: 800; letter-spacing: -.03em; line-height: 1.1; margin-bottom: 3px; }
.card-motor { font-size: 12px; color: #5A5855; margin-bottom: 20px; }
.card-sep { height: 1px; background: #E6E5DF; margin-bottom: 18px; }

.card-pricing { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 10px; }
.card-monthly-lbl { font-size: 10px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: #9B9890; margin-bottom: 4px; }
.card-price-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.card-monthly-val { font-size: 32px; font-weight: 900; letter-spacing: -.04em; line-height: 1; color: #111110; }
.card-monthly-unit { font-size: 13px; font-weight: 400; color: #9B9890; margin-left: 2px; }
.card-ttc { text-align: right; }
.card-ttc-lbl { font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #9B9890; margin-bottom: 3px; }
.card-ttc-val { font-size: 14px; font-weight: 600; color: #5A5855; }
.card-duration { font-size: 12px; color: #9B9890; margin-bottom: 12px; }

.card-source-label {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 10px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
    padding: 4px 8px; border-radius: 4px; margin-bottom: 14px;
}
.card-source-national   { background: #F2F1ED; color: #7A7870; }
.card-source-mandataire { background: #F0EBFA; color: #6B3FA0; border: 1px solid #D9CCEF; }
.card-source-label .source-logo { height: 16px; width: auto; display: block; }

.card-cta {
    display: flex; align-items: center; justify-content: space-between;
    padding: 13px 16px; border: 1px solid #E6E5DF;
    font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
    color: #111110; text-decoration: none; margin-top: auto;
    transition: background .15s, border-color .15s, color .15s;
}
.card-cta:hover { background: #111110; border-color: #111110; color: #fff; }
.card-cta-arrow { transition: transform .2s; }
.card-cta:hover .card-cta-arrow { transform: translateX(4px); }

@media (max-width: 768px) {
    .card-monthly-val { font-size: 28px; }
}
