/* Tarjetas de producto compartidas por inicio, catálogo y recomendaciones. */
.product-card {
    display:flex;
    flex-direction:column;
    border:1px solid #e3eaf1;
    border-radius:20px;
    background:#fff;
    box-shadow:0 3px 12px #112a4504;
    transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.product-card .product-visual {
    flex-shrink:0;
    margin:0;
    border-radius:0;
    background:radial-gradient(ellipse at 50% 100%, #eff5fa 0, #fff 72%);
    isolation:isolate;
}
.product-card .product-card-topline {
    position:absolute;
    z-index:2;
    top:17px;
    left:18px;
    right:18px;
    pointer-events:none;
}
.product-card .product-brand {
    margin:0;
    color:#526b82;
    font-size:10px;
    line-height:24px;
    font-weight:750;
    letter-spacing:1.6px;
}
.product-card .product-label {
    top:17px;
    right:16px;
    left:auto;
    padding:5px 9px;
    border-radius:6px;
    background:#eaf4ff;
    color:#0862a5;
    font-size:10px;
    line-height:16px;
    font-weight:650;
}
.product-card .offer-label { background:#e9f8ed; color:#16623c; }
.product-card .product-image-link {
    display:flex;
    align-items:center;
    justify-content:center;
    height:228px;
    padding:34px 15px 10px;
}
.product-card .product-image-link img {
    width:100%;
    height:100%;
    object-fit:contain;
    mix-blend-mode:multiply;
    transition:transform .35s ease;
}
.product-card .product-info {
    display:flex;
    flex:1;
    flex-direction:column;
    padding:18px 19px 19px;
}
.product-card .product-name {
    min-height:44px;
    margin:0;
    color:#12263f;
    font-family:var(--heading);
    font-size:18px;
    line-height:22px;
    font-weight:700;
    letter-spacing:-.5px;
}
.product-card .product-spec {
    min-height:18px;
    margin:5px 0 10px;
    color:#5a6e83;
    font-size:12px;
    line-height:18px;
}
.product-card .product-colours { display:flex; align-items:center; gap:8px; min-height:20px; color:#607286; font-size:11px; line-height:18px; }
.product-colour-dots { display:inline-flex; gap:4px; flex-shrink:0; }
.product-colour-dot { display:block; width:12px; height:12px; border:2px solid #fff; border-radius:50%; background:var(--colour); box-shadow:0 0 0 1px #dce3eb; }
.product-card .product-purchase { margin-top:auto; padding-top:13px; }
.product-card .product-prices { gap:8px; min-height:34px; align-items:baseline; }
.product-card .product-prices strong { color:#10243e; font-size:26px; line-height:34px; font-weight:750; letter-spacing:-1px; white-space:nowrap; }
.product-card .product-prices del { color:#778697; font-size:12px; line-height:18px; white-space:nowrap; }
.product-card .product-price-prefix { width:auto; margin:0; color:#617286; font-size:11px; letter-spacing:0; }
.product-card .product-bottom { display:flex; flex-direction:column; align-items:stretch; gap:11px; margin-top:6px; }
.product-card .availability { display:flex; align-items:center; gap:5px; color:#6b7c8f; font-size:11px; line-height:16px; }
.product-card .availability > i { width:5px; height:5px; flex-shrink:0; background:#8c9cae; }
.product-card .availability.available-known { color:#23724b; }
.product-card .availability.available-known > i { background:#23724b; }
.product-card .availability.unavailable { color:#946256; }
.product-card .product-add {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:100%;
    height:44px;
    min-height:44px;
    padding:0 13px;
    border:1px solid #d9e9f6;
    border-radius:10px;
    background:#edf6ff;
    color:#0066ae;
    font-size:13px;
    font-weight:700;
    transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.product-card .product-add .icon { width:17px; height:17px; flex-shrink:0; }
.product-card .product-add .icon:last-child { margin-left:auto; width:16px; }
.product-card .product-add span { margin-right:auto; }
.product-card .product-add:focus-visible { outline-offset:3px; }
@media (hover:hover) and (pointer:fine) {
    .product-card:hover { border-color:#bdd8ee; box-shadow:0 12px 28px #163a5f10; transform:translateY(-3px); }
    .product-card:hover .product-image-link img { transform:scale(1.045); }
    .product-card:hover .product-add, .product-card .product-add:hover { background:#0069bc; border-color:#0069bc; color:#fff; }
    .product-card .product-name:hover { color:#0069bc; }
}
@media (min-width:1600px) {
    .product-card .product-image-link { height:258px; }
}
@media (max-width:1000px) and (min-width:701px) {
    .product-card .product-image-link { height:212px; padding-inline:10px; }
    .product-card .product-info { padding:15px; }
    .product-card .product-name { font-size:16px; }
    .product-card .product-prices strong { font-size:24px; }
}
@media (max-width:700px) {
    .product-grid { gap:12px; }
    .product-card { border-radius:14px; }
    .product-card .product-card-topline { top:10px; left:11px; right:11px; }
    .product-card .product-brand { font-size:10px; letter-spacing:.6px; line-height:22px; }
    .product-card .product-label { top:11px; right:9px; padding:3px 5px; font-size:9px; line-height:14px; border-radius:4px; }
    .product-card .product-image-link { height:165px; padding:35px 7px 7px; }
    .product-card .product-info { padding:12px; }
    .product-card .product-name { font-size:15px; line-height:20px; min-height:40px; letter-spacing:-.3px; }
    .product-card .product-spec { min-height:32px; margin:5px 0 7px; font-size:12px; line-height:16px; }
    .product-card .product-colours { gap:6px; font-size:11px; line-height:15px; }
    .product-colour-dot { width:10px; height:10px; border-width:1px; }
    .product-colour-dots { gap:3px; }
    .product-card .product-purchase { padding-top:9px; }
    .product-card .product-prices { gap:2px 5px; min-height:29px; }
    .product-card .product-prices strong { font-size:21px; line-height:29px; letter-spacing:-.8px; }
    .product-card .product-prices del, .product-card .product-price-prefix { font-size:10px; }
    .product-card .product-bottom { gap:9px; margin-top:4px; }
    .product-card .availability { font-size:11px; line-height:15px; }
    .product-card .product-add { font-size:12px; padding-inline:9px; gap:6px; border-radius:8px; }
    .product-card .product-add .icon { width:15px; height:15px; }
    .product-card .product-add .icon:last-child { width:14px; }
}
@media (max-width:370px) {
    .product-card .product-info { padding:10px; }
    .product-card .product-image-link { height:150px; }
    .product-card .product-label { font-size:9px; padding-inline:4px; }
    .product-card .product-brand { font-size:9px; }
    .product-card .product-add .icon:last-child { display:none; }
    .product-card .product-prices strong { font-size:19px; }
}
@media (prefers-reduced-motion:reduce) {
    .product-card, .product-card .product-image-link img, .product-card .product-add { transition:none; }
    .product-card:hover, .product-card:hover .product-image-link img { transform:none; }
}
