:root{--bg:#05080f;--bg2:#0d1117;--card:#111827;--card-h:#1a2535;--border:rgba(200,146,42,.18);--gold:#c8922a;--gold-l:#e8b84b;--grana:#8b2020;--text:#e8eaf0;--text2:#8892a4;--text3:#5a6578;--success:#22c55e;--danger:#ef4444;--info:#3b82f6;--radius:14px;--radius-sm:8px;--shadow:0 4px 32px rgba(0,0,0,.5);--transition:.22s ease}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;line-height:1.6}
a{color:var(--gold);text-decoration:none}a:hover{color:var(--gold-l)}
img{max-width:100%;display:block}

/* NAVBAR */
.navbar{position:sticky;top:0;z-index:100;background:rgba(5,8,15,.85);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);padding:.9rem 1.5rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.navbar-brand{display:flex;align-items:center;gap:.6rem;font-size:1.35rem;font-weight:700;color:var(--gold);text-decoration:none}
.navbar-brand span{color:var(--text)}
.navbar-nav{display:flex;align-items:center;gap:1rem}
.navbar-nav a{color:var(--text2);font-size:.9rem;font-weight:500;transition:color var(--transition);padding:.3rem .6rem;border-radius:var(--radius-sm)}
.navbar-nav a:hover,.navbar-nav a.active{color:var(--gold)}
.btn-admin{background:var(--gold);color:#000!important;padding:.4rem 1rem;border-radius:20px;font-weight:600;font-size:.85rem;transition:all var(--transition)!important}
.btn-admin:hover{background:var(--gold-l);transform:translateY(-1px)}
.nav-mobile-header { display: none; }
/* HERO */
.hero{position:relative;padding:5rem 1.5rem 4rem;text-align:center;overflow:hidden;background:linear-gradient(135deg,#05080f 0%,#0e0a18 40%,#12070a 100%)}
.hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(200,146,42,.12) 0%,transparent 70%);pointer-events:none}
.hero-lion{font-size:3.5rem;margin-bottom:1rem;animation:float 4s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.hero h1{font-size:clamp(1.8rem,4vw,3rem);font-weight:800;line-height:1.2;margin-bottom:.75rem}
.hero h1 .gold{color:var(--gold)}
.hero p{color:var(--text2);font-size:1.05rem;max-width:540px;margin:0 auto 2.5rem}
.hero-lion,.hero h1,.hero p,.search-bar,.hero-stats{position:relative;z-index:1}
.search-bar{display:flex;max-width:600px;margin:0 auto 2rem;gap:.5rem;background:rgba(255,255,255,.05);border:1px solid var(--border);border-radius:50px;padding:.4rem .4rem .4rem 1.2rem;transition:border-color var(--transition)}
.search-bar:focus-within{border-color:var(--gold)}
.search-bar input{flex:1;background:none;border:none;outline:none;color:var(--text);font-size:1rem;font-family:inherit}
.search-bar input::placeholder{color:var(--text3)}
.search-bar button{background:var(--gold);color:#000;border:none;border-radius:40px;padding:.6rem 1.5rem;font-weight:700;cursor:pointer;font-size:.95rem;transition:all var(--transition)}
.search-bar button:hover{background:var(--gold-l)}
.hero-stats{display:flex;gap:2rem;justify-content:center;flex-wrap:wrap}
.hero-stat{text-align:center}
.hero-stat strong{display:block;font-size:1.6rem;font-weight:800;color:var(--gold)}
.hero-stat span{font-size:.8rem;color:var(--text2);text-transform:uppercase;letter-spacing:.05em}

/* FILTERS */
.filters{background:var(--bg2);border-bottom:1px solid var(--border);padding:.8rem 1.5rem;display:flex;gap:.75rem;flex-wrap:wrap;align-items:center}
.filters label{font-size:.8rem;color:var(--text2);font-weight:500;white-space:nowrap}
.filters select{background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.4rem .8rem;font-size:.85rem;cursor:pointer;outline:none;transition:border-color var(--transition)}
.filters select:focus{border-color:var(--gold)}
.filter-group{display:flex;align-items:center;gap:.4rem}
.btn-clear{background:none;border:1px solid var(--border);color:var(--text2);border-radius:var(--radius-sm);padding:.35rem .8rem;font-size:.8rem;cursor:pointer;transition:all var(--transition)}
.btn-clear:hover{border-color:var(--gold);color:var(--gold)}
.results-count{margin-left:auto;color:var(--text2);font-size:.85rem}

/* MAIN GRID */
.main{padding:2rem 1.5rem 4rem;max-width:1300px;margin:0 auto}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}

/* CARDS */
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:all var(--transition);display:flex;flex-direction:column;animation:fadeIn .5s ease both}
.card:hover{border-color:var(--gold);transform:translateY(-4px);box-shadow:0 8px 40px rgba(200,146,42,.15)}
@keyframes fadeIn{to{opacity:1;transform:translateY(0)}}
.card-img{height:130px;background:linear-gradient(135deg,var(--bg2),var(--card-h));display:flex;align-items:center;justify-content:center;font-size:3.5rem;border-bottom:1px solid var(--border);position:relative;overflow:hidden}
.card-img img{width:100%;height:100%;object-fit:contain;padding:1rem}
.card-img .cat-badge{position:absolute;top:.6rem;right:.6rem}
.cat-badge{display:inline-flex;align-items:center;gap:.3rem;background:rgba(200,146,42,.15);border:1px solid rgba(200,146,42,.3);color:var(--gold);padding:.2rem .6rem;border-radius:20px;font-size:.72rem;font-weight:600}
.featured-badge{position:absolute;top:.6rem;left:.6rem;background:var(--gold);color:#000;font-size:.65rem;font-weight:700;padding:.15rem .5rem;border-radius:10px;text-transform:uppercase;letter-spacing:.05em}
.card-body{padding:1.1rem;flex:1;display:flex;flex-direction:column;gap:.6rem}
.card-title{font-size:1rem;font-weight:700;color:var(--text);line-height:1.3}
.card-desc{font-size:.82rem;color:var(--text2);line-height:1.5;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.card-meta{display:flex;flex-wrap:wrap;gap:.4rem}
.meta-item{display:flex;align-items:center;gap:.3rem;font-size:.78rem;color:var(--text3)}
.meta-item svg{width:12px;height:12px;flex-shrink:0}
.card-actions{padding:.9rem 1.1rem;border-top:1px solid var(--border);display:flex;gap:.5rem;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:.35rem;padding:.45rem 1rem;border-radius:var(--radius-sm);font-size:.82rem;font-weight:600;cursor:pointer;border:none;transition:all var(--transition);text-decoration:none;white-space:nowrap}
.btn-primary{background:var(--gold);color:#000}
.btn-primary:hover{background:var(--gold-l);color:#000;transform:translateY(-1px)}
.btn-ghost{background:rgba(255,255,255,.04);color:var(--text2);border:1px solid var(--border)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold)}
.btn-green{background:rgba(34,197,94,.1);color:var(--success);border:1px solid rgba(34,197,94,.2)}
.btn-green:hover{background:rgba(34,197,94,.2)}
.btn-sm{padding:.3rem .7rem;font-size:.75rem}

/* EMPTY */
.empty{text-align:center;padding:4rem 1rem;color:var(--text2)}
.empty-icon{font-size:4rem;margin-bottom:1rem}
.empty h3{font-size:1.2rem;color:var(--text);margin-bottom:.5rem}

/* FICHA TIENDA */
.tienda-header{background:linear-gradient(135deg,var(--bg2) 0%,var(--card) 100%);border-bottom:1px solid var(--border);padding:3rem 1.5rem 2rem;text-align:center}
.tienda-logo{width:100px;height:100px;background:var(--card);border:2px solid var(--border);border-radius:var(--radius);margin:0 auto 1.2rem;display:flex;align-items:center;justify-content:center;font-size:3rem;overflow:hidden}
.tienda-logo img{width:100%;height:100%;object-fit:contain}
.tienda-header h1{font-size:clamp(1.5rem,3vw,2.2rem);font-weight:800;margin-bottom:.4rem}
.tienda-body{max-width:900px;margin:2rem auto;padding:0 1.5rem}
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.2rem;margin-bottom:2rem}
.info-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:1.2rem;display:flex;gap:.9rem;align-items:flex-start}
.info-icon{font-size:1.4rem;flex-shrink:0;margin-top:.1rem}
.info-card h4{font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--text3);margin-bottom:.3rem}
.info-card p,.info-card a{font-size:.9rem;color:var(--text)}
.social-row{display:flex;gap:.75rem;flex-wrap:wrap;margin-bottom:2rem}
.btn-social{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem 1.1rem;border-radius:var(--radius-sm);font-size:.85rem;font-weight:600;text-decoration:none;transition:all var(--transition)}
.btn-fb{background:rgba(24,119,242,.12);color:#4892f0;border:1px solid rgba(24,119,242,.25)}.btn-fb:hover{background:rgba(24,119,242,.22)}
.btn-ig{background:rgba(229,62,62,.1);color:#e57373;border:1px solid rgba(229,62,62,.2)}.btn-ig:hover{background:rgba(229,62,62,.2)}
.btn-tw{background:rgba(29,161,242,.1);color:#40a9ff;border:1px solid rgba(29,161,242,.2)}.btn-tw:hover{background:rgba(29,161,242,.2)}
.btn-yt{background:rgba(255,0,0,.1);color:#ff4444;border:1px solid rgba(255,0,0,.2)}.btn-yt:hover{background:rgba(255,0,0,.2)}
.btn-wa{background:rgba(37,211,102,.1);color:#25d366;border:1px solid rgba(37,211,102,.2)}.btn-wa:hover{background:rgba(37,211,102,.2)}
.breadcrumb{display:flex;align-items:center;gap:.5rem;font-size:.82rem;color:var(--text3);padding:1rem 1.5rem;max-width:900px;margin:0 auto}
.breadcrumb a{color:var(--text2)}.breadcrumb a:hover{color:var(--gold)}
.breadcrumb span{color:var(--text3)}
.web-btn{display:inline-flex;align-items:center;gap:.6rem;background:var(--gold);color:#000;padding:.75rem 2rem;border-radius:50px;font-weight:700;font-size:1rem;margin-bottom:2rem;transition:all var(--transition)}
.web-btn:hover{background:var(--gold-l);transform:translateY(-2px);box-shadow:0 6px 24px rgba(200,146,42,.3)}

/* FOOTER */
footer{background:var(--bg2);border-top:1px solid var(--border);padding:2rem 1.5rem;text-align:center;color:var(--text3);font-size:.83rem}
footer a{color:var(--text2)}.footer-lion{font-size:1.5rem;margin-bottom:.5rem}

/* RESPONSIVE */
@media(max-width:640px){
  .hero{padding:3.5rem 1rem 2.5rem}
  .hero-stats{gap:1.5rem}
  .filters{gap:.5rem}
  .grid{grid-template-columns:1fr}
}

/* ===== MODO DÍA (light mode) — style.css ===== */
[data-theme='light'] {
  --bg:   #f2f4f8;
  --bg2:  #ffffff;
  --card: #ffffff;
  --card-hover: #f8f9ff;
  --border: rgba(80,70,120,.12);
  --text:  #1a1035;
  --text2: #4a3f6b;
  --text3: #8880a8;
  --shadow: 0 4px 24px rgba(80,70,120,.1);
}
[data-theme='light'] .navbar {
  background: rgba(255,255,255,.92) !important;
  border-bottom-color: rgba(80,70,120,.14) !important;
}
[data-theme='light'] .navbar-brand span,
[data-theme='light'] .navbar-brand { color: #1a1035 }
[data-theme='light'] .navbar-nav a { color: #4a3f6b }
[data-theme='light'] .navbar-nav a:hover { color: var(--gold) }
[data-theme='light'] .hero {
  background: linear-gradient(135deg,#f0ebff 0%,#faf7ff 100%) !important;
}
[data-theme='light'] .card { box-shadow: 0 2px 12px rgba(80,70,120,.07) }
[data-theme='light'] .card:hover { box-shadow: 0 8px 32px rgba(80,70,120,.14) }
[data-theme='light'] .filters { background:#ffffff;border-bottom-color:rgba(80,70,120,.12) }
[data-theme='light'] footer { background:#1a1035;color:#e8eaf0 }

/* ============================================
   HAMBURGER MENU & MOBILE NAV
   ============================================ */
.hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 40px; height: 40px;
  background: rgba(255,255,255,.04);
  border: 1px solid var(--border);
  border-radius: 8px;
  cursor: pointer;
  z-index: 1001;
  flex-shrink: 0;
}
.hamburger span {
  display: block;
  width: 20px; height: 2px;
  background: var(--text);
  border-radius: 2px;
  transition: all .3s ease;
}
.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.nav-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,0,0,.55);
  z-index: 999;
  backdrop-filter: blur(2px);
}
.nav-overlay.open { display: block; }

/* Precio badge en link de tarifas */
.nav-price-badge {
  display: inline-block;
  font-size: .6rem;
  font-weight: 800;
  background: linear-gradient(135deg,#911048,#6a0c35);
  color: #fff;
  border-radius: 10px;
  padding: .1rem .4rem;
  margin-left: .3rem;
  vertical-align: middle;
  line-height: 1.4;
}

@media (max-width: 900px) {
  .hamburger { display: flex; }

  .navbar-nav {
    position: fixed;
    top: 0; right: -320px;
    width: 290px;
    height: 100dvh;
    background: var(--bg2);
    border-left: 1px solid var(--border);
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 1.5rem;
    gap: .2rem;
    z-index: 1000;
    transition: right .3s cubic-bezier(.4,0,.2,1);
    overflow-y: auto;
    box-shadow: -8px 0 32px rgba(0,0,0,.4);
  }
  .navbar-nav.open { right: 0; }

  /* Logo en el menú móvil */
  .nav-mobile-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding-bottom: 1rem;
    margin-bottom: .5rem;
    border-bottom: 1px solid var(--border);
  }
  .nav-mobile-title { font-weight: 900; font-size: 1.1rem; }

  .nav-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px; height: 32px;
    background: rgba(128,128,128,.1);
    border: 1px solid var(--border);
    border-radius: 50%;
    cursor: pointer;
    color: var(--text2);
    font-size: .9rem;
    font-family: inherit;
    transition: all .2s;
  }
  .nav-close:hover { background: rgba(145,16,72,.15); color: #c01255; border-color: #c01255; }

  /* Ocultar header de desktop */
  .nav-mobile-header { display: flex !important; }

  /* Items en mobile */
  .navbar-nav a,
  .navbar-nav .theme-toggle,
  .navbar-nav .btn-admin {
    width: 100%;
    padding: .75rem .9rem;
    border-radius: 10px;
    font-size: .95rem;
    text-align: left;
    display: flex;
    align-items: center;
    gap: .6rem;
  }
  .navbar-nav a:hover,
  .navbar-nav a.active { background: rgba(145,16,72,.1); }
  .navbar-nav .btn-admin {
    background: rgba(145,16,72,.12);
    border: 1px solid rgba(145,16,72,.25);
    color: #c01255;
    margin-top: .5rem;
    justify-content: center;
  }
  .navbar-nav .theme-toggle {
    background: rgba(255,255,255,.04);
    border: 1px solid var(--border);
    color: var(--text2);
    cursor: pointer;
    font-family: inherit;
    justify-content: flex-start;
  }

  /* Separador en mobile */
  .nav-sep {
    width: 100%;
    height: 1px;
    background: var(--border);
    margin: .4rem 0;
  }

  /* Mi cuenta en mobile */
  .nav-mi-cuenta {
    background: rgba(5,150,105,.08) !important;
    border: 1px solid rgba(5,150,105,.2) !important;
    color: #34d399 !important;
  }
}

/* Light mode hamburger */
[data-theme='light'] .hamburger { background: rgba(0,0,0,.04); border-color: rgba(80,70,120,.14); }
[data-theme='light'] .hamburger span { background: #1a1035; }
[data-theme='light'] .navbar-nav { background: #ffffff; border-left-color: rgba(80,70,120,.14); }
[data-theme='light'] .nav-overlay { background: rgba(0,0,0,.4); }


/* ── OVERRIDE GRANATE DE LEÓN ── */

/* ══════════════════════════════════════════════════════
   GRANATE DE LEÓN — Overhaul Visual Completo
   Color León: #911048  |  León Light: #c01255
   ══════════════════════════════════════════════════════ */

/* ── ROOT OVERRIDES ─────────────────────────────────── */
:root {
  --leon:        #911048;
  --leon-light:  #c01255;
  --leon-dark:   #6a0c35;
  --leon-glow:   rgba(145,16,72,.42);
  --leon-soft:   rgba(145,16,72,.08);
  --leon-border: rgba(145,16,72,.3);
}

/* ══════════════════════════════════════════════════════
   NAVBAR — Premium con granate de León
   ══════════════════════════════════════════════════════ */
.navbar {
  background: rgba(5,4,9,.96) !important;
  border-bottom: 1px solid rgba(145,16,72,.2) !important;
  backdrop-filter: saturate(180%) blur(20px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px) !important;
}
.navbar-brand {
  background: linear-gradient(135deg,#c01255,#ff4d8d) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  font-size: 1.35rem !important;
  font-weight: 900 !important;
  letter-spacing: -.02em !important;
}
.navbar-nav a:hover,
.navbar-nav a.active {
  color: #c01255 !important;
}

/* Badge precio en navbar — más grande y brillante */
.nav-price-badge {
  background: linear-gradient(135deg, #911048, #c01255) !important;
  color: #fff !important;
  font-size: .72rem !important;
  font-weight: 800 !important;
  padding: .22rem .6rem !important;
  border-radius: 20px !important;
  letter-spacing: .02em !important;
  box-shadow: 0 2px 8px rgba(145,16,72,.5) !important;
}

/* btn-admin más visible */
.btn-admin {
  background: linear-gradient(135deg,#911048,#6a0c35) !important;
  border: none !important;
  box-shadow: 0 2px 12px rgba(145,16,72,.4) !important;
  color: #fff !important;
  font-weight: 700 !important;
  padding: .45rem 1rem !important;
  border-radius: 8px !important;
  transition: all .2s !important;
}
.btn-admin:hover { opacity: .9; transform: translateY(-1px) !important; }

/* Mi cuenta link */
.nav-mi-cuenta {
  color: #e8eaf0 !important;
  font-weight: 600 !important;
}
.nav-mi-cuenta:hover { color: #c01255 !important; }

/* ══════════════════════════════════════════════════════
   HERO — Más dramático, cinematográfico
   ══════════════════════════════════════════════════════ */
.hero-offers-section,
.hero-tiendas,
.hero-section,
.hero-ofertas {
  background: linear-gradient(160deg,#06010a 0%,#1a0311 35%,#0d0006 70%,#06010a 100%) !important;
  position: relative;
  overflow: hidden;
}
.hero-ofertas::before,
.hero-tiendas::before,
.hero-section::before {
  background: radial-gradient(ellipse 90% 70% at 50% -10%,
    rgba(145,16,72,.25) 0%,
    rgba(192,18,85,.08) 50%,
    transparent 75%) !important;
}
/* Línea de acento bajo el hero */
.hero-ofertas::after {
  content:'';
  position:absolute;bottom:0;left:10%;right:10%;height:1px;
  background: linear-gradient(90deg,transparent,rgba(145,16,72,.6),transparent);
}

/* Título hero — más grande y con gradiente */
.hero-ofertas h1,
.hero-tiendas h1,
.hero-section h1 {
  font-size: clamp(2.2rem,5vw,3.8rem) !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  letter-spacing: -.03em !important;
}
.hero-ofertas h1 .leon-color,
.red,
.hero-color {
  background: linear-gradient(135deg,#c01255,#ff4d8d) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* Tag "León Provincia" — más impactante */
.hero-tag-leon {
  background: rgba(145,16,72,.12) !important;
  border: 1px solid rgba(145,16,72,.4) !important;
  color: #f06090 !important;
  font-size: .82rem !important;
  font-weight: 800 !important;
  letter-spacing: .12em !important;
  padding: .4rem 1.1rem !important;
}

/* Buscador hero — borde más pronunciado */
.offers-search-wrap,
.search-wrap,
.hero-search {
  border: 1.5px solid rgba(145,16,72,.35) !important;
  background: rgba(255,255,255,.04) !important;
  border-radius: 50px !important;
}
.offers-search-wrap:focus-within,
.search-wrap:focus-within {
  border-color: #911048 !important;
  box-shadow: 0 0 0 3px rgba(145,16,72,.15) !important;
}
.offers-search-wrap button,
.hero-search-btn {
  background: linear-gradient(135deg,#911048,#c01255) !important;
  box-shadow: 0 3px 12px rgba(145,16,72,.4) !important;
}

/* ══════════════════════════════════════════════════════
   BADGES — GRANDES, IMPACTANTES, IRRESISTIBLES
   ══════════════════════════════════════════════════════ */

/* Base badge: mucho más grande */
.badge {
  padding: .32rem .8rem !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
  letter-spacing: .06em !important;
  border-radius: 8px !important;
  text-transform: uppercase !important;
}

/* Badge NUEVO — verde brillante con glow */
.badge-nuevo {
  background: #059669 !important;
  color: #fff !important;
  box-shadow: 0 3px 12px rgba(5,150,105,.5) !important;
  font-size: .82rem !important;
  padding: .32rem .9rem !important;
}

/* Badge SEGUNDA MANO */
.badge-used {
  background: linear-gradient(135deg,#7c3aed,#5b21b6) !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(124,58,237,.4) !important;
}

/* Badge RESERVADO — amarillo ámbar */
.badge-reservado {
  background: linear-gradient(135deg,#d97706,#b45309) !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(217,119,6,.5) !important;
  font-size: .82rem !important;
  padding: .32rem .9rem !important;
}

/* Badge VENDIDO */
.badge-vendido {
  background: linear-gradient(135deg,#374151,#1f2937) !important;
  color: #9ca3af !important;
}

/* Badge DISPONIBLE */
.badge-disponible {
  background: rgba(5,150,105,.12) !important;
  border: 1.5px solid rgba(5,150,105,.4) !important;
  color: #34d399 !important;
  font-weight: 800 !important;
}

/* Badge descuento circular — ENORME Y PULSANTE */
.discount-badge {
  width: 66px !important;
  height: 66px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg,#911048,#6a0c35) !important;
  color: #fff !important;
  box-shadow: 0 4px 24px rgba(145,16,72,.6), 0 0 0 3px rgba(255,255,255,.08) !important;
  font-weight: 900 !important;
  animation: discountPulse 2.5s ease-in-out infinite !important;
}
.discount-badge .pct {
  font-size: 1.2rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}
.discount-badge .off {
  font-size: .6rem !important;
  opacity: .85 !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
}
@keyframes discountPulse {
  0%,100% { box-shadow:0 4px 24px rgba(145,16,72,.55),0 0 0 3px rgba(255,255,255,.08); }
  50%     { box-shadow:0 6px 36px rgba(145,16,72,.75),0 0 0 6px rgba(145,16,72,.1); }
}

/* Badge precio navbar — ligeramente más grande */
.nav-price-badge {
  font-size: .72rem !important;
  padding: .22rem .65rem !important;
}

/* ══════════════════════════════════════════════════════
   CARDS DE PRODUCTO — Más impacto visual
   ══════════════════════════════════════════════════════ */
.pcard {
  border-radius: 18px !important;
  border: 1px solid rgba(145,16,72,.12) !important;
  transition: transform .3s cubic-bezier(.22,.68,0,1.2), box-shadow .3s ease, border-color .3s ease !important;
}
.pcard:hover {
  border-color: rgba(145,16,72,.5) !important;
  transform: translateY(-8px) scale(1.01) !important;
  box-shadow: 0 20px 60px rgba(145,16,72,.35), 0 0 0 1px rgba(145,16,72,.2) !important;
}

/* Foto más alta */
.pcard[data-tamano="normal"] .pcard-photo { height: 250px !important; }
.pcard[data-tamano="pequeno"] .pcard-photo { height: 200px !important; }

/* Precio ENORME en granate */
.price-offer {
  color: #c01255 !important;
  font-size: 2.1rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-shadow: 0 0 24px rgba(145,16,72,.3) !important;
}
.pcard[data-tamano="grande"] .price-offer { font-size: 2.8rem !important; }
.pcard[data-tamano="pequeno"] .price-offer { font-size: 1.6rem !important; }

/* Ahorro en verde brillante */
.price-savings {
  font-size: .8rem !important;
  color: #22c55e !important;
  font-weight: 800 !important;
  margin-top: .2rem !important;
}

/* Precio original tachado — más visible */
.price-original {
  color: var(--text3) !important;
  font-size: .9rem !important;
  text-decoration: line-through !important;
  text-decoration-thickness: 2px !important;
}

/* CTA button en granate */
.btn-ver {
  background: linear-gradient(135deg,#911048,#c01255) !important;
  border-radius: 10px !important;
  font-size: .88rem !important;
  font-weight: 800 !important;
  padding: .65rem 1rem !important;
  letter-spacing: .02em !important;
  box-shadow: 0 3px 12px rgba(145,16,72,.35) !important;
  transition: all .2s !important;
}
.btn-ver:hover {
  background: linear-gradient(135deg,#c01255,#911048) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(145,16,72,.5) !important;
}

/* Título en hover */
.pcard:hover .pcard-title { color: #f06090 !important; }

/* ══════════════════════════════════════════════════════
   CARDS DE TIENDAS — Más visual
   ══════════════════════════════════════════════════════ */
.store-card {
  border-radius: 18px !important;
  border: 1px solid rgba(145,16,72,.1) !important;
  transition: transform .3s cubic-bezier(.22,.68,0,1.2), box-shadow .3s ease !important;
}
.store-card:hover {
  transform: translateY(-8px) !important;
  border-color: rgba(145,16,72,.4) !important;
  box-shadow: 0 18px 50px rgba(145,16,72,.25) !important;
}

/* Badge destacado en tiendas */
.badge-destacado,
.store-featured {
  background: linear-gradient(135deg,#911048,#c01255) !important;
  color: #fff !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
  padding: .28rem .8rem !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 10px rgba(145,16,72,.45) !important;
}

/* ══════════════════════════════════════════════════════
   FICHA DE OFERTA INDIVIDUAL (opanel + detalle)
   ══════════════════════════════════════════════════════ */
.opanel-inner {
  border-top: 2.5px solid #911048 !important;
  border-bottom: 2.5px solid #911048 !important;
}
.opanel-now,
.price-section .now-amount {
  color: #c01255 !important;
  text-shadow: 0 0 30px rgba(145,16,72,.3) !important;
}
.price-section .discount-pill {
  background: linear-gradient(135deg,#911048,#6a0c35) !important;
  font-size: 1.05rem !important;
  padding: .35rem .9rem !important;
}
.btn-oferta-main {
  background: linear-gradient(135deg,#911048,#c01255) !important;
  box-shadow: 0 4px 20px rgba(145,16,72,.4) !important;
  font-size: 1.05rem !important;
  padding: 1.1rem !important;
  border-radius: 12px !important;
}
.btn-oferta-main:hover {
  box-shadow: 0 8px 32px rgba(145,16,72,.6) !important;
}

/* ══════════════════════════════════════════════════════
   FILTROS — Más visual
   ══════════════════════════════════════════════════════ */
.offers-nav a.active,
.offers-nav a:hover {
  background: rgba(145,16,72,.1) !important;
  color: #c01255 !important;
  border-color: rgba(145,16,72,.3) !important;
}

/* ══════════════════════════════════════════════════════
   PANEL OFERTA INLINE — borde granate
   ══════════════════════════════════════════════════════ */
.pcard.selected {
  border-color: #911048 !important;
  box-shadow: 0 0 0 3px rgba(145,16,72,.25) !important;
}

/* ══════════════════════════════════════════════════════
   ADMIN — Sidebar granate
   ══════════════════════════════════════════════════════ */
.sidebar-nav a:hover,
.sidebar-nav a.active {
  background: rgba(145,16,72,.15) !important;
  color: #f06090 !important;
  border-left: 3px solid #911048 !important;
}
.sidebar-brand {
  border-bottom: 1px solid rgba(145,16,72,.2) !important;
}
.sidebar-brand h2 {
  background: linear-gradient(135deg,#c01255,#ff4d8d) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* Stat cards admin en granate */
.stat-card .number { color: #c01255 !important; }
.stat-card { border-top: 3px solid rgba(145,16,72,.3) !important; }
.stat-card:hover { border-top-color: #911048 !important; }

/* Toggle switches en granate */
.switch input:checked + .slider { background: #911048 !important; }
.toggle-on { background: #911048 !important; }

/* Botones del admin */
.btn-primary,
.btn-save,
[type=submit].btn {
  background: linear-gradient(135deg,#911048,#6a0c35) !important;
  border: none !important;
  box-shadow: 0 3px 12px rgba(145,16,72,.35) !important;
}
.btn-primary:hover { opacity:.9 !important; }

/* ══════════════════════════════════════════════════════
   MODO CLARO — adaptado al granate
   ══════════════════════════════════════════════════════ */
[data-theme="light"] {
  --leon-soft: rgba(145,16,72,.05) !important;
  --leon-border: rgba(145,16,72,.2) !important;
}
[data-theme="light"] .pcard:hover { box-shadow: 0 12px 40px rgba(145,16,72,.18) !important; }
[data-theme="light"] .hero-ofertas {
  background: linear-gradient(160deg,#fff5f7 0%,#fff0f5 50%,#fff5f7 100%) !important;
}
[data-theme="light"] .hero-ofertas::before {
  background: radial-gradient(ellipse 80% 60% at 50% 0%,rgba(145,16,72,.08) 0%,transparent 70%) !important;
}
[data-theme="light"] .navbar {
  background: rgba(255,255,255,.95) !important;
  border-bottom-color: rgba(145,16,72,.12) !important;
}

/* ══════════════════════════════════════════════════════
   HAMBURGER — en granate
   ══════════════════════════════════════════════════════ */
.hamburger.open span:nth-child(1) { background: #c01255 !important; }
.hamburger.open span:nth-child(2) { background: #c01255 !important; }
.hamburger.open span:nth-child(3) { background: #c01255 !important; }

/* ══════════════════════════════════════════════════════
   PRECIOS PAGE — Cards de plan en granate
   ══════════════════════════════════════════════════════ */
.plan-card.featured,
.plan-card:hover {
  border-color: rgba(145,16,72,.5) !important;
  box-shadow: 0 12px 40px rgba(145,16,72,.25) !important;
}
.plan-badge-popular {
  background: linear-gradient(135deg,#911048,#c01255) !important;
}

/* ══════════════════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════════════════ */
footer .footer-lion { 
  filter: drop-shadow(0 0 12px rgba(145,16,72,.6)) !important;
}
footer a:hover { color: #c01255 !important; }

/* ══════════════════════════════════════════════════════
   ANIMACIÓN DE ENTRADA CARDS — más expresiva
   ══════════════════════════════════════════════════════ */
@keyframes pcardIn {
  from { opacity:0; transform:translateY(28px) scale(.97); }
  to   { opacity:1; transform:translateY(0)   scale(1); }
}