/* =========================================================
   sc-ofertas.css — Tarjetas de oferta (sc_oferta_tarjeta, inc/shortcodes.php): portada,
   listado /ofertas-surfcamp/ y Surf Camp adultos y menores. Antes en sc-home.css (06/10/2026).
   ========================================================= */
/* ── OFERTAS ──────────────────────────────────────────────── */
.sc-ofertas{background:var(--cream)}
.offer-scroll{display:flex;gap:1px;background:var(--line);border:1px solid var(--line);overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.offer-scroll::-webkit-scrollbar{display:none}
.offer{flex:0 0 82%;max-width:340px;scroll-snap-align:start;background:var(--white);display:flex;flex-direction:column}
.offer-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--sea)}
.offer-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;max-width:none}
.offer-media .badge{position:absolute;top:12px;left:12px;background:var(--orange-deep);color:#fff;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:6px 11px}
.offer-body{padding:20px;display:flex;flex-direction:column;gap:11px;flex:1}
.offer-body h3{font-size:17px;text-transform:uppercase;font-weight:600;letter-spacing:.02em;color:var(--green-ink)}
.offer-meta{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--slate)}
.offer-meta .ic{width:14px;height:14px;color:var(--green)}
.stock-bar{height:4px;background:var(--line);overflow:hidden;border-radius:999px}
.stock-bar i{display:block;height:100%;border-radius:999px;background:var(--sunset)}
.stock-note{font-size:12px;font-weight:600;color:var(--orange-deep)}
.price-row{display:flex;align-items:baseline;gap:10px}
.price-old{font-size:14px;color:var(--slate);text-decoration:line-through}
.price-now{font-size:22px;font-weight:700;color:var(--green-ink)}
.price-now small{font-size:13px;font-weight:400;color:var(--slate)}
.sc-empty{color:var(--slate);padding:24px}
/* Listado /ofertas-surfcamp/: las mismas tarjetas, en rejilla */
.offer-scroll--todas{display:grid;grid-template-columns:1fr;gap:24px;background:none;border:0;overflow:visible;scroll-snap-type:none}
.offer-scroll--todas .offer{max-width:none;border:1px solid var(--line)}
@media(min-width:860px){.offer-scroll--todas{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1100px){.offer-scroll--todas{grid-template-columns:repeat(4,1fr)}}

@media(min-width:1180px){
  .offer { flex: 0 0 25%; }
}