/* /ofertas/ — estilos compartidos por la portada, las listas y las tarjetas */
.of{max-width:1500px;margin:0 auto;padding:clamp(28px,5vw,64px) var(--h2-gutter) 90px}
.of-hd h1{margin:0;font:800 clamp(3rem,9vw,7rem)/.88 var(--h2-display);letter-spacing:-.05em;text-transform:none}
.of-hd p{margin:18px 0 0;max-width:62ch;color:var(--h2-mute);font:500 clamp(1rem,1.6vw,1.25rem)/1.5 var(--h2-body)}
.of-stamp{margin-top:14px;color:var(--h2-mute);font:600 .9rem var(--h2-body)}
.of-chips{display:flex;gap:8px;flex-wrap:wrap;margin:28px 0 8px}
.of-chip{display:inline-flex;align-items:center;height:42px;padding:0 18px;border:0;border-radius:999px;background:color-mix(in srgb,var(--h2-bone) 8%,transparent);color:var(--h2-bone);font:700 .92rem var(--h2-body);cursor:pointer;transition:background .15s}
.of-chip:hover{background:color-mix(in srgb,var(--h2-bone) 14%,transparent)}
.of-chip[aria-pressed="true"]{background:var(--h2-bone);color:var(--h2-ink)}
.of-sec{margin-top:clamp(34px,5vw,58px)}
.of-sec>h2{margin:0;font:800 clamp(1.7rem,3.4vw,2.6rem)/1.05 var(--h2-display);letter-spacing:-.04em;text-transform:none}
.of-sec>p{margin:8px 0 0;max-width:64ch;color:var(--h2-mute);font:500 1rem/1.5 var(--h2-body)}
.of-sec>p a{color:var(--h2-bone)}
.of-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:16px;margin-top:20px}
.of-grid.big{grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr))}
.of-card{--tc:var(--h2-mag);position:relative;display:flex;flex-direction:column;overflow:hidden;border-radius:26px;background:color-mix(in srgb,var(--h2-bone) 6%,transparent);box-shadow:inset 0 0 0 1px var(--h2-line);transition:transform .18s,background .18s}
.of-card:hover{transform:translateY(-3px);background:color-mix(in srgb,var(--h2-bone) 10%,transparent)}
.of-pic{position:relative;display:block;aspect-ratio:460/215;background:#0a1c52}
.of-pic img{width:100%;height:100%;object-fit:cover;display:block}
.of-flag{position:absolute;left:12px;top:12px;display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:999px;background:var(--h2-ink);color:var(--tc);font:800 .78rem var(--h2-body);box-shadow:0 0 0 1px color-mix(in srgb,var(--tc) 50%,transparent)}
.of-low{position:absolute;right:12px;top:12px;height:28px;padding:0 12px;display:inline-flex;align-items:center;border-radius:999px;background:var(--h2-mag);color:var(--h2-ink);font:800 .74rem var(--h2-body)}
.of-body{display:grid;gap:10px;padding:16px 18px 18px;flex:1;align-content:start}
.of-body h3{margin:0;font:800 1.15rem/1.2 var(--h2-display);letter-spacing:-.02em;text-transform:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.4em}
.of-body h3 a{color:inherit;text-decoration:none}
.of-price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.of-price b{font:800 1.9rem/1 var(--h2-display);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.of-price s{color:var(--h2-mute);font:600 .95rem var(--h2-body)}
.of-price em{font-style:normal;padding:3px 9px;border-radius:9px;background:color-mix(in srgb,var(--h2-mag) 22%,transparent);color:var(--h2-mag);font:800 .85rem var(--h2-body)}
.of-meta{color:var(--h2-mute);font:600 .84rem var(--h2-body)}
.of-go{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 20px;border-radius:14px;background:var(--h2-bone);color:var(--h2-ink);text-decoration:none;font:800 .95rem var(--h2-body);transition:box-shadow .15s}
.of-go:hover{box-shadow:0 0 0 4px color-mix(in srgb,var(--h2-bone) 30%,transparent)}
.of-free{--tc:var(--crl-confirm,#35e0a1)}
.of-free .of-price b{color:var(--tc)}
.of-free .of-go{background:var(--tc)}
.of-cd{color:var(--h2-bone);font:800 .9rem var(--h2-body)}
.of-soon{display:flex;flex-direction:column;gap:8px;margin-top:18px}
.of-soon a{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:14px 18px;border-radius:16px;background:color-mix(in srgb,var(--h2-bone) 6%,transparent);color:inherit;text-decoration:none;font:700 1rem var(--h2-body)}
.of-soon a span{color:var(--h2-mute);font:600 .88rem var(--h2-body)}
.of-empty{padding:26px 22px;border-radius:20px;background:color-mix(in srgb,var(--h2-bone) 6%,transparent);color:var(--h2-mute);font:500 1rem/1.5 var(--h2-body)}
.of-note{margin-top:46px;padding:18px 22px;border-radius:18px;background:rgba(6,20,63,.6);color:var(--h2-mute);font:500 .92rem/1.6 var(--h2-body);max-width:80ch}
.of-note strong{color:var(--h2-bone)}.of-note a{color:var(--h2-bone)}
[data-hide]{display:none!important}
.of-tile{display:flex;flex-direction:column;gap:6px;padding:20px 22px;border-radius:22px;background:color-mix(in srgb,var(--h2-bone) 6%,transparent);box-shadow:inset 0 0 0 1px var(--h2-line);text-decoration:none;color:inherit;transition:transform .18s,background .18s}
.of-tile:hover{transform:translateY(-3px);background:color-mix(in srgb,var(--h2-bone) 10%,transparent)}
.of-tile b{font:800 1.2rem/1.15 var(--h2-display);letter-spacing:-.02em}
.of-tile span{color:var(--h2-mute);font:500 .92rem/1.45 var(--h2-body)}
.of-tile em{font-style:normal;color:var(--h2-mag);font:800 .85rem var(--h2-body)}
.of-crumb{color:var(--h2-mute);font:600 .9rem var(--h2-body)} .of-crumb a{color:var(--h2-mute)} .of-crumb a:hover{color:var(--h2-bone)}

.of-more{display:inline-flex;align-items:center;height:48px;padding:0 24px;margin-top:22px;border-radius:999px;background:var(--h2-bone);color:var(--h2-ink);text-decoration:none;font:800 .95rem var(--h2-body)}
