/* =========================
   LIVE PASSION — STYLES (clean)
   ========================= */

/* ---------- Paleta ---------- */
:root{
  --oro:#D4AF37; --oro-hover:#E1C766;
  --negro:#000; --blanco:#fff; --gris:#f5f5f5;
  --lp-gold:#D4AF37; /* alias usado en algunos bloques */
}

/* ---------- Base ---------- */
html,body{height:100%}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Arial,sans-serif;
  background:#ffffff; color:#111;
}

/* ==========================================
   HEADER / NAV — Black & Gold (PRO)
   ========================================== */
.header{
  background:var(--negro); color:var(--oro);
  padding:14px 24px; display:flex; justify-content:space-between; align-items:center;
  position:sticky; top:0; z-index:10000; overflow:visible !important;
  backdrop-filter:saturate(140%) blur(6px);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.logo{ color:var(--oro); font-weight:800; text-decoration:none; letter-spacing:.6px }
.logo:hover{ color:var(--oro-hover) }

.nav-links{ display:flex; gap:18px; align-items:center; position:relative; overflow:visible !important }
.nav-item{ position:relative; display:inline-flex }
.nav-link, .dropdown-toggle{
  color:var(--oro); text-decoration:none; font-weight:700; line-height:1;
  padding:10px 12px; border-radius:10px; display:inline-flex; align-items:center; gap:6px;
}
.nav-link:hover, .dropdown-toggle:hover{ color:var(--oro-hover) }
.caret{ margin-left:6px; font-size:.85em; transition:transform .18s ease, color .18s ease }

/* --- Mega-menú (1 sola versión) --- */
.nav-item.has-dropdown{ position:relative }
.nav-item.has-dropdown .dropdown{
  position:absolute !important;
  top:calc(100% + 10px); left:0;
  width:740px; max-width:min(92vw,860px); min-width:560px;

  background:#111; color:#eee; border:1px solid #242424;
  padding:18px 22px; border-radius:12px; box-shadow:0 18px 40px -22px rgba(0,0,0,.55);

  display:grid; grid-template-columns:1fr 1fr 1fr; column-gap:32px; row-gap:8px;

  opacity:0; visibility:hidden; pointer-events:none; transform:translateY(6px);
  transition:opacity .18s ease, transform .18s ease, visibility .18s ease;
  z-index:10001 !important;
}
.nav-item.has-dropdown .dropdown::before{
  content:""; position:absolute; top:-8px; left:28px;
  width:14px; height:14px; background:#111; transform:rotate(45deg);
  box-shadow:-2px -2px 4px rgba(0,0,0,.1);
}
/* puente anti-gap */
.nav-item.has-dropdown::after{ content:""; position:absolute; left:0; right:0; top:100%; height:10px; }

/* abrir por hover/teclado */
@media (hover:hover) and (pointer:fine){
  .nav-item.has-dropdown > .dropdown-toggle:hover + .dropdown,
  .nav-item.has-dropdown > .dropdown:hover{
    opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0);
  }
}
.nav-item.has-dropdown:focus-within > .dropdown,
.has-dropdown.open > .dropdown{ /* soporte touch vía JS .open */
  opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0);
}

/* contenidos del dropdown */
.dropdown-col h4{ margin:6px 0 8px; font-size:.9rem; color:#cfcfcf; font-weight:800 }
.dropdown a{
  display:block; color:#eaeaea; padding:8px 10px; border-radius:8px; text-decoration:none; font-weight:600;
}
.dropdown a:hover{ background:#1a1a1a; color:var(--oro-hover) }

/* caret gira al abrir */
.nav-item.has-dropdown:hover .caret, .nav-item.has-dropdown:focus-within .caret{
  transform:rotate(180deg); color:var(--oro-hover);
}

/* ==========================================
   HEADER / NAV — Versión mobile (hamburguesa)
   ========================================== */
.nav-toggle{
  display:none; background:none; border:0; cursor:pointer; padding:8px;
  flex-direction:column; justify-content:center; gap:5px; z-index:10002;
}
.nav-toggle span{ display:block; width:24px; height:2px; background:var(--oro); border-radius:2px; transition:.2s }

@media (max-width:860px){
  .header{ flex-wrap:wrap; padding:12px 16px }
  .nav-toggle{ display:flex }
  .header nav{ order:3; width:100%; flex-basis:100% }

  .nav-links{
    display:none; flex-direction:column; align-items:stretch; gap:0;
    width:100%; background:var(--negro); border-top:1px solid rgba(255,255,255,.08);
    margin-top:12px; padding:6px 0 10px;
  }
  .nav-links.open{ display:flex }

  .nav-item{ display:block; width:100% }
  .nav-link, .dropdown-toggle{
    width:100%; padding:14px 6px; justify-content:space-between; border-radius:0;
    border-bottom:1px solid rgba(255,255,255,.06);
  }

  /* En mobile el dropdown se abre apilado abajo del link, no flotando */
  .nav-item.has-dropdown .dropdown{
    position:static !important; width:100%; max-width:none; min-width:0;
    display:none; grid-template-columns:1fr; column-gap:0; row-gap:2px;
    background:#0d0d0d; border:0; border-radius:0; box-shadow:none;
    padding:4px 10px 12px 22px; opacity:1; visibility:visible; pointer-events:auto; transform:none;
  }
  .nav-item.has-dropdown .dropdown::before{ display:none }
  .nav-item.has-dropdown::after{ content:none }
  .nav-item.has-dropdown.open .dropdown{ display:grid }
  .nav-item.has-dropdown:hover .dropdown{ display:none } /* anular hover de escritorio en touch */
  .nav-item.has-dropdown.open:hover .dropdown{ display:grid }
}

/* Asegurar que el hero no tape */
.hero{ position:relative; z-index:1 }

/* ==========================================
   HERO
   ========================================== */
.hero{position:relative; min-height:420px; background:#000; display:grid; place-items:center; overflow:hidden; padding:70px 20px}
.hero-bg{position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity .8s ease}
.hero-bg.visible{opacity:1}
.hero::after{content:""; position:absolute; inset:0; background:linear-gradient(to bottom,rgba(0,0,0,.55),rgba(0,0,0,.65))}
.hero-content{position:relative; z-index:2; text-align:center; color:var(--blanco)}
.hero-content h1{font-size:2.6rem; line-height:1.2; margin:0 0 24px}
.buscador{max-width:760px; margin-inline:auto; display:flex}
.buscador input{flex:1; padding:16px 14px; font-size:1.05rem; border:none; border-radius:12px 0 0 12px}
.buscador button{padding:16px 22px; font-weight:800; background:var(--oro); color:var(--negro); border:none; border-radius:0 12px 12px 0; cursor:pointer}
.buscador button:hover{background:var(--oro-hover)}

/* ==========================================
   CARDS HOME
   ========================================== */
.destacados{padding:40px 20px; background:var(--gris)}
.destacados h2{text-align:center; margin:0 0 18px}
.cards-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; max-width:1200px; margin:0 auto}
.card{
  background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 8px 20px rgba(0,0,0,.07);
  display:flex; flex-direction:column; transition:transform .2s ease
}
.card:hover{transform:translateY(-2px)}
.card img{width:100%; height:150px; object-fit:cover}
.card .card-body{padding:12px 14px; display:flex; flex-direction:column; gap:6px}
.badge{display:inline-block; font-size:.75rem; background:#111; color:var(--oro); padding:4px 8px; border-radius:999px}
.title{font-weight:800}
.meta{font-size:.9rem; color:#555}
.price{font-weight:900}
.card .btn{margin-top:auto; text-align:center; padding:10px 12px; border-radius:10px; background:var(--oro); color:#000; font-weight:800; text-decoration:none}
.card .btn:hover{background:var(--oro-hover)}

/* ==========================================
   FOOTER simple (.footer) — (se usa en algunas vistas)
   ========================================== */
.footer{background:var(--negro); color:var(--oro); padding:26px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:20px}
.footer a{color:var(--oro); font-weight:700}
.footer a:hover{color:var(--oro-hover)}
.footer-bottom{width:100%; text-align:center; margin-top:10px}

/* ==========================================
   RESULTADOS
   ========================================== */
.resultados-header{
  background:#0a0a0a; color:#fff;
  padding:26px 20px;
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.resultados-header h1{ margin:0; font-size:1.6rem }
.resultados-controls{ display:flex; gap:10px; align-items:center }
.resultados-controls input{
  padding:10px 12px; border-radius:10px; border:1px solid #2a2a2a; background:#111; color:#fff; min-width:260px;
}
.resultados-controls select{
  padding:10px 12px; border-radius:10px; border:1px solid #2a2a2a; background:#111; color:#fff;
}

.resultados-main{ padding:24px 20px; background:#f5f5f5 }
.resultados-grid{
  max-width:1200px; margin:0 auto;
  display:grid; grid-template-columns:repeat(auto-fill, minmax(260px,1fr)); gap:16px;
}
.resultado-card{
  background:#fff; border-radius:14px; overflow:hidden;
  box-shadow:0 8px 22px rgba(0,0,0,.08); display:flex; flex-direction:column;
  transition:transform .2s ease;
}
.resultado-card:hover{ transform:translateY(-2px) }
.resultado-img{ width:100%; height:160px; object-fit:cover }
.resultado-body{ padding:14px; display:flex; flex-direction:column; gap:6px }
.resultado-title{ font-size:1.05rem; font-weight:800; margin:0 }
.resultado-meta{ color:#666; font-size:.92rem }
.resultado-price{ font-weight:900; margin-top:4px }
.resultado-actions{ margin-top:auto }
.btn-primary{
  display:inline-block; text-align:center; text-decoration:none;
  background:var(--oro); color:#000; padding:10px 12px; border-radius:10px; font-weight:800;
}
.btn-primary:hover{ background:#e1c766 }
.no-results{ text-align:center; padding:30px 0; color:#333 }

/* segundo grid (otra vista de resultados) */
.resultados { max-width: 1100px; margin: 0 auto; padding: 30px 20px; }
.resultados-head { display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:space-between; margin-bottom: 16px; }
.resultados-head h1 { margin:0; color:#ffd166; }
.resultados-tools { display:flex; gap:10px; flex:1; justify-content:flex-end; }
.resultados-tools input, .resultados-tools select {
  background:#111; color:#ffd166; border:1px solid #333; border-radius:10px; padding:10px 12px;
}
.results-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:18px; }
@media (max-width:1100px){ .results-grid{ grid-template-columns: repeat(3, 1fr) } }
@media (max-width:800px){ .results-grid{ grid-template-columns: repeat(2, 1fr) } }
@media (max-width:520px){ .results-grid{ grid-template-columns: 1fr } }

.event-card{ background:#fff; border-radius:14px; overflow:hidden; box-shadow:0 6px 20px rgba(0,0,0,.06); display:flex; flex-direction:column }
.event-thumb img{ width:100%; height:160px; object-fit:cover; display:block }
.event-body{ padding:14px }
.event-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px }
.pill{ background:#000; color:#ffd166; border-radius:999px; font-size:.75rem; padding:4px 10px; }
.date{ font-weight:700; font-size:.85rem; color:#111 }
.event-title{ margin:6px 0 4px; font-size:1.05rem }
.event-meta{ color:#666; font-size:.9rem }
.event-bottom{ margin-top:10px; display:flex; align-items:center; justify-content:space-between }
.event-bottom .price{ font-weight:800 }
.event-card .btn{ background:#ffd166; color:#111; padding:10px 14px; border-radius:10px; text-decoration:none; font-weight:800; display:inline-block }

/* ==========================================
   EVENTO (detalle)
   ========================================== */
.evento-hero{ position:relative; height:260px; background:#000; display:flex; align-items:center; justify-content:center; }
.evento-hero__bg{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:.35; filter:grayscale(.2) blur(1px) }
.evento-hero__content{ position:relative; z-index:1; text-align:center; color:#ffd166 }
.evento-meta{ color:#fff; opacity:.9; margin-top:6px }

/* (dejamos una sola definición de .evento-content: la más amplia) */
.evento-content{ max-width:1200px; margin:0 auto; padding:30px 20px; display:grid; grid-template-columns: 1.4fr 1fr; gap:24px }
@media (max-width:1020px){ .evento-content{ grid-template-columns:1fr } }

.evento-info, .evento-compra{ background:#fff; border-radius:16px; padding:20px; box-shadow:0 6px 20px rgba(0,0,0,.06) }
.evento-info h2, .evento-compra h2{ margin:0 0 12px }
.evento-info ul{ margin:0; padding-left:18px }
.lbl{ display:block; font-weight:700; margin:12px 0 6px }
.evento-compra select{ width:100%; padding:12px; border-radius:10px; border:1px solid #ddd; }
.evento-precio{ display:flex; align-items:center; justify-content:space-between; margin:14px 0 }
.evento-compra .btn{ width:100%; background:#ffd166; color:#111; border:none; padding:12px; border-radius:12px; font-weight:800; cursor:pointer }
.evento-compra .btn:hover{ filter:brightness(.95) }
.evento-compra .btn:disabled{ opacity:.5; cursor:not-allowed }

/* ====== MAPA / ESTADIO (mantener UNA versión SVG) ====== */
.mapa{ margin-top:12px; background:#fff; border-radius:14px; padding:14px; box-shadow:0 6px 18px rgba(0,0,0,.06) }
.mapa-stage{
  background:#111; color:#ffd166; text-align:center; font-weight:800;
  border-radius:10px; padding:8px 10px; margin-bottom:12px;
}

/* SVG responsive + tooltip (una sola versión) */
.svgmap{
  width:100%; max-width:620px; margin:10px auto 16px; aspect-ratio:1000/700;
  position:relative; overflow:hidden; border-radius:16px; background:#0e0e0e; font-family:inherit;
}
.svgmap svg{ width:100%; height:100%; display:block }

/* Tooltip pegado al cursor */
.map-tooltip{
  position:absolute !important; z-index:2; left:0; top:0;
  background:#111; color:#ffd166; font-weight:800; font-size:.85rem;
  padding:8px 12px; border-radius:10px; box-shadow:0 8px 18px rgba(0,0,0,.35);
  pointer-events:none; white-space:nowrap; transform:translate(12px, -16px) !important;
}

/* Sectores (colores y selección) */
.sector rect{ fill:#cfcfcf; transition:filter .15s ease, stroke .15s ease }
.sector.ok rect{   fill:#22c55e }   /* disponible */
.sector.low rect{  fill:#fde047 }   /* pocas */
.sector.sold rect{ fill:#9ca3af }   /* agotado */
.sector.selected rect{ stroke:#ffd166; stroke-width:4; filter:brightness(1.02) }
.sector:hover rect{ filter:brightness(1.05) }

.sector-label{ fill:#0f0f0f !important; font-weight:700; font-size:22px; font-family:inherit; paint-order:stroke; stroke:rgba(255,255,255,.35); stroke-width:1px }
.label-invert{ fill:#fff }

/* Leyenda (una sola) */
.mapa-legend{ margin:16px 0 12px; display:flex; gap:22px; align-items:center; color:#555; font-size:.9rem }
.mapa-legend .dot{ width:12px; height:12px; border-radius:50%; display:inline-block; margin-right:8px }
.mapa-legend .dot.disp{ background:#16a34a }
.mapa-legend .dot.low{  background:#f59e0b }
.mapa-legend .dot.sold{ background:#6b7280 }

/* Lista accesible móvil (una sola) */
.mapa-list{ display:none; margin-top:12px }
@media (max-width:680px){ .mapa-list{ display:block } }
.mapa-list .sector-tile{
  background:#0f0f0f; color:#eee; border:1px solid #262626; border-radius:12px; padding:12px; margin-bottom:10px; cursor:pointer;
}
.mapa-list .sector-tile .s-name{ font-weight:800; color:#ffd166 }
.mapa-list .sector-tile .s-price{ font-weight:800 }
.mapa-list .sector-tile .s-stock{ font-size:.85rem; color:#bbb }
.mapa-list .sector-tile.agotado{ opacity:.45; pointer-events:none }
.mapa-list .sector-tile.low .s-stock{ color:#ffcc66 }

/* Resumen de sector en panel compra */
.ev-sector{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px }
.ev-sector-label{ font-weight:800 }
.ev-stock{ color:#666 }

/* ==========================================
   SITE FOOTER (pro)
   ========================================== */
.site-footer{
  background: var(--negro);
  color: #eaeaea;
  margin-top: 40px;
  border-top: 1px solid #151515;
}
.site-footer a{ color:#eaeaea; text-decoration:none }
.site-footer a:hover{ color: var(--oro-hover) }

.sf-wrap{
  max-width: 1200px; margin: 0 auto;
  padding: 36px 20px 8px;
  display: grid; gap: 28px;
  grid-template-columns: 2fr repeat(3, 1fr);
}
}
@media (max-width:980px){ .sf-wrap{ grid-template-columns: 1.5fr 1fr 1fr } }
@media (max-width:680px){ .sf-wrap{ grid-template-columns: 1fr } }

.sf-logo{
  display:inline-block; color: var(--oro);
  font-weight: 900; letter-spacing: .6px; font-size: 1.2rem; margin-bottom: 8px;
}
.sf-tagline{ margin:0 0 14px; opacity:.9 }

.sf-social{ display:flex; gap:10px; margin-bottom:14px }
.sf-ic{
  width:36px; height:36px; display:grid; place-items:center;
  background:#141414; border:1px solid #242424; border-radius:12px; color:#eaeaea;
}
.sf-ic:hover{ border-color:#2d2d2d; color:var(--oro-hover) }

/* Newsletter */
.sf-newsletter label{ display:block; font-size:.95rem; margin:6px 0 8px; color:#d9d9d9 }
.sf-nl-control{ display:flex; gap:8px }
.sf-nl-control input{
  flex:1; background:#101010; color:#fff;
  border:1px solid #2a2a2a; border-radius:12px; padding:12px 12px;
}
.sf-nl-control button{
  background: var(--oro); color:#111; border:none; font-weight:800;
  padding:12px 16px; border-radius:12px; cursor:pointer;
}
.sf-nl-control button:hover{ background: var(--oro-hover) }
.sf-nl-hint{ display:block; margin-top:6px; font-size:.85rem; opacity:.8 }

/* Columnas de links */
.sf-col h4{ margin:4px 0 10px; color: var(--oro); font-weight:800; font-size:1rem }
.sf-col ul{ list-style:none; padding:0; margin:0; display:grid; gap:8px }
.sf-col li a{ opacity:.95 }
.sf-col li a:hover{ opacity:1 }

/* Barra inferior */
.sf-footbar{
  border-top:1px solid #161616; padding:14px 20px 22px;
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  max-width:1200px; margin:0 auto; color:#cfcfcf;
}
.sf-footbar .sf-legal a{ color:#cfcfcf }
.sf-footbar .sf-legal a:hover{ color: var(--oro-hover) }

.site-footer .sf-brand, .site-footer .sf-col{ min-width: 220px }

/* ==========================================
   FAQ
   ========================================== */
.faq{ max-width: 1100px; margin: 0 auto; padding: 28px 20px 48px; }
.faq-hero{ text-align:left; margin-bottom: 18px; }
.faq-hero h1{ margin:0 0 6px; color: var(--oro); }
.faq-hero p{ margin:0 0 14px; color:#444 }

.faq-search input{
  width:100%; border-radius:12px; border:1px solid #ddd; padding:12px 14px; font-size:1rem;
  background:#fff; color:#111;
}
.faq-quick{ display:flex; gap:10px; flex-wrap:wrap; margin-top:12px }
.faq-quick a{
  background:#111; color: var(--oro); border:1px solid #222;
  padding:8px 10px; border-radius:999px; font-weight:700; text-decoration:none; font-size:.9rem;
}
.faq-quick a:hover{ color: var(--oro-hover); border-color:#2b2b2b }

.faq-section{ margin-top:26px }
.faq-section h2{ margin:0 0 12px; color:#111 }

.faq-item{
  background:#fff; border:1px solid #eee; border-radius:14px; margin-bottom:10px;
  box-shadow:0 6px 16px rgba(0,0,0,.05); overflow:hidden;
}
.faq-item > summary{
  list-style:none; cursor:pointer; padding:14px 16px; position:relative;
  font-weight:800; color:#111;
}
.faq-item > summary::-webkit-details-marker{ display:none }
.faq-item[open] > summary{ background:#fafafa; border-bottom:1px solid #eee }
.faq-body{ padding:14px 16px; color:#333 }
.faq-body a{ color:#111; text-decoration:underline }
.faq-body ol, .faq-body ul{ padding-left:18px; margin:8px 0 }
.faq-body li{ margin:4px 0 }

.faq-legend{ display:flex; gap:16px; align-items:center; list-style:none; padding:0; margin:8px 0 0 }
.faq-legend .dot{ width:10px; height:10px; border-radius:50%; display:inline-block; margin-right:6px; vertical-align:middle }
.faq-legend .disp{ background:#29c36a } .faq-legend .low{ background:#f5c542 } .faq-legend .sold{ background:#c0c0c0 }

.faq-cta{
  margin-top:28px; background:#111; color:#fff; padding:20px; border-radius:16px;
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
}
.faq-cta .btn-primary{
  background: var(--oro); color:#111; padding:12px 16px; border-radius:12px; text-decoration:none; font-weight:800;
}
.faq-cta .btn-primary:hover{ background: var(--oro-hover) }

/* ==========================================
   LEGAL
   ========================================== */
.legal{ max-width:1100px; margin:0 auto; padding:28px 20px 56px; }
.legal-hero h1{ margin:0 0 4px; color:var(--oro); }
.legal-hero p{ margin:0 0 18px; color:#555; }

.legal-toc{
  background:#0b0b0b; color:#eaeaea; border:1px solid #1a1a1a;
  border-radius:14px; padding:16px; margin-bottom:18px;
}
.legal-toc h2{ margin:0 0 10px; font-size:1.05rem; color:var(--oro); }
.legal-toc ol{ margin:0; padding-left:18px; display:grid; gap:6px; }
.legal-toc a{ color:#eaeaea; text-decoration:none }
.legal-toc a:hover{ color:var(--oro-hover) }

.legal-doc{
  background:#fff; border:1px solid #eee; border-radius:16px;
  box-shadow:0 6px 18px rgba(0,0,0,.06); padding:22px;
}
.legal-doc h2{ margin:18px 0 10px; color:#111 }
.legal-doc h3{ margin:16px 0 8px; color:#111; font-size:1.05rem }
.legal-doc p, .legal-doc li{ color:#333; line-height:1.6 }
.legal-doc ul{ padding-left:18px; margin:8px 0 }
.legal-doc a{ color:#111; text-decoration:underline }
.legal-doc a:hover{ color:#000 }

/* ==========================================
   CARRITO — Modo claro pro
   ========================================== */
.carrito { padding:32px 20px 80px; }
.carrito h1, .carrito h2, .carrito h3 { color:#111; }
.carrito .grid{
  max-width:1180px; margin:0 auto;
  display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:28px; align-items:start;
}
@media (max-width:980px){ .carrito .grid{ grid-template-columns:1fr } }

.card{
  background:#fff; border:1px solid #eee; border-radius:16px; box-shadow:0 12px 30px rgba(0,0,0,.06);
}
.card .card-header{ padding:18px 20px; border-bottom:1px solid #f0f0f0; font-weight:800; color:#111 }
.card .card-body{ padding:20px }

/* Estado vacío */
.card .empty{
  min-height:230px; margin:18px; border:1px dashed #e9e9e9; border-radius:14px;
  display:grid; place-items:center; text-align:center; color:#666; padding:26px;
}
.card .empty p{ margin:10px 0 18px }
.card .empty .btn-primary{
  background:#D4AF37; color:#111; border:none; border-radius:12px;
  padding:12px 18px; font-weight:800; box-shadow:0 4px 12px rgba(212,175,55,.25);
}
.card .empty .btn-primary:hover{ filter:brightness(.97) }

.items{ padding:8px 14px 16px }
.item{
  display:grid; grid-template-columns:64px 1fr auto; gap:12px; align-items:center;
  padding:12px 8px; border-bottom:1px solid #f4f4f4;
}
.item:last-child{ border-bottom:none }
.item img{ width:64px; height:64px; object-fit:cover; border-radius:10px; background:#f7f7f7 }
.item .it-title{ font-weight:800; color:#111 }
.item .it-meta{ color:#666; font-size:.92rem; margin-top:2px }
.item .unit{ font-weight:700; color:#111 }

/* Cantidad */
.qty{ display:inline-flex; align-items:center; border:1px solid #e3e3e3; border-radius:10px; overflow:hidden }
.qty button{ width:36px; height:36px; border:0; background:#f7f7f7; cursor:pointer }
.qty input{ width:44px; height:36px; border:0; text-align:center; background:#fff; color:#111; border-left:1px solid #eee; border-right:1px solid #eee }

/* Resumen */
.summary{ padding:18px 18px 20px }
.summary .sum-row{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:8px 2px; color:#333 }
.summary .sum-row + .sum-row{ border-top:1px solid #f6f6f6 }
.summary .sum-row.total{ margin-top:10px; padding-top:12px; border-top:1px dashed #e5e5e5; font-size:1.12rem; font-weight:800; color:#111 }

/* Cupón */
.coupon{ display:flex; gap:10px; margin:14px 2px 12px }
.coupon input{ flex:1; height:44px; padding:10px 12px; border:1px solid #ddd; border-radius:10px; background:#fff; color:#111 }
.coupon .apply{ height:44px; padding:0 14px; border-radius:10px; border:1px solid #ddd; background:#f7f7f7; color:#111; font-weight:700 }

/* Botones */
.btn-primary, .summary .btn-primary{
  background:#D4AF37; color:#111; border:none; border-radius:12px; padding:12px 16px; font-weight:800;
  box-shadow:0 6px 16px rgba(212,175,55,.25);
}
.btn-primary:hover{ filter:brightness(.97) }
.btn-ghost{ background:#fff; color:#111; border:1px solid #ddd; border-radius:12px; padding:12px 16px; font-weight:800 }

/* Badges/estados */
.badge{
  display:inline-flex; align-items:center; gap:8px;
  background:#f6f6f6; color:#333; padding:6px 10px; border-radius:999px; font-weight:700; font-size:.9rem;
}
.badge .dot{ width:8px; height:8px; border-radius:999px; background:#2ecc71 }

/* Footer separación cuando se usa .footer */
.carrito + .footer{ margin-top:50px }

/* Forzar contraste dentro de la vista carrito */
.carrito, .carrito * { color:#111 !important; }
.carrito a { color:#111 !important; text-decoration:none; }
.carrito .muted, .carrito .hint, .carrito small { color:#333 !important; }
.carrito p, .carrito label { color:#111 !important; }
.carrito input, .carrito select, .carrito textarea{ color:#111 !important; background:#fff !important; border-color:#ddd !important; }
.carrito input::placeholder, .carrito textarea::placeholder{ color:#888 !important; }
.carrito .summary .sum-row{ color:#111 !important; }
.carrito .summary .sum-row > :last-child{ color:#111 !important; font-weight:800 !important; }
.carrito .summary .sum-row.total > :last-child{ color:#111 !important; font-weight:900 !important; }

/* ==========================================
   PAQUETES
   ========================================== */
.paquetes-hero{ background:#000; color:#fff; padding:44px 20px 34px; text-align:center }
.paquetes-hero h1{ margin:0 0 8px; color:var(--oro); font-size:2rem }
.paquetes-hero p{ margin:0; opacity:.85; max-width:640px; margin-inline:auto }

.paquetes-main{ max-width:1100px; margin:0 auto; padding:34px 20px 60px }
.paquetes-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:24px }

.paquete-card{
  background:#fff; border-radius:16px; overflow:hidden;
  box-shadow:0 10px 26px rgba(0,0,0,.08); display:flex; flex-direction:column;
  transition:transform .2s ease;
}
.paquete-card:hover{ transform:translateY(-3px) }
.paquete-img{ width:100%; height:220px; object-fit:cover; display:block; background:#111 }
.paquete-body{ padding:20px; display:flex; flex-direction:column; gap:8px }

.paquete-badge{
  align-self:flex-start; background:#111; color:var(--oro); font-weight:700;
  font-size:.8rem; padding:5px 10px; border-radius:999px;
}
.paquete-title{ margin:4px 0 0; font-size:1.35rem; color:#111 }
.paquete-subtitle{ margin:0; color:#555; font-size:.92rem; line-height:1.5 }

.paquete-incluye-title{ margin-top:10px; font-weight:800; color:#111; font-size:.92rem }
.paquete-incluye{ margin:6px 0 0; padding-left:18px; color:#333; font-size:.9rem; line-height:1.6 }
.paquete-incluye li{ margin:2px 0 }

.paquete-vuelos{
  margin-top:12px; background:#faf8f2; border:1px solid #f0e6c8; border-radius:12px; padding:12px 14px;
}
.paquete-vuelos-title{ font-weight:800; color:#111; font-size:.9rem; margin-bottom:6px }
.paquete-vuelo{ padding:6px 0; border-top:1px dashed #eadfb8 }
.paquete-vuelo:first-of-type{ border-top:none }
.paquete-vuelo-ruta{ font-size:.9rem; color:#111 }
.paquete-vuelo-meta{ font-size:.8rem; color:#8a7a3d; margin-top:2px }

.paquete-price-row{
  margin-top:16px; padding-top:14px; border-top:1px solid #f0f0f0;
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
}
.paquete-price{ font-size:1.4rem; font-weight:900; color:#111 }
.paquete-price-note{ font-size:.78rem; color:#888 }
.paquete-cta{
  background:var(--oro); color:#111; font-weight:800; padding:12px 18px; border-radius:12px;
  text-decoration:none; white-space:nowrap;
}
.paquete-cta:hover{ background:var(--oro-hover) }

/* ==========================================
   Responsive tweaks (dropdown ancho)
   ========================================== */
@media (max-width:980px){ .nav-item.has-dropdown .dropdown{ width:600px } }
@media (max-width:760px){ .nav-item.has-dropdown .dropdown{ width:520px; grid-template-columns:1fr 1fr } }
@media (max-width:720px){ .legal-doc{ padding:16px } .legal-toc{ padding:12px } }
/* === PATCH: columnas del dropdown MUY juntas === */
/* === PATCH: mega-menú centrado y súper compacto (evita corte) === */
.nav-item.has-dropdown .dropdown{
  /* centrado bajo el botón, así no desborda a derecha o izquierda */
  left: 50% !important;
  transform: translate(-50%, 6px);
  width: 560px;                 /* más angosto */
  max-width: min(96vw, 560px);
  min-width: 460px;

  padding: 10px 12px;           /* menos aire */
  column-gap: 6px;              /* columnas casi pegadas */
  row-gap: 6px;
  grid-template-columns: 1fr 1fr 1fr;
}

/* al abrir por hover/focus, mantener el centrado */
@media (hover:hover) and (pointer:fine){
  .nav-item.has-dropdown > .dropdown-toggle:hover + .dropdown,
  .nav-item.has-dropdown > .dropdown:hover{
    opacity:1; visibility:visible; pointer-events:auto;
    transform: translate(-50%, 0);   /* <-- importante */
  }
}
.nav-item.has-dropdown:focus-within > .dropdown,
.has-dropdown.open > .dropdown{
  opacity:1; visibility:visible; pointer-events:auto;
  transform: translate(-50%, 0);
}

/* flechita centrada */
.nav-item.has-dropdown .dropdown::before{
  left: calc(50% - 7px) !important;
}

/* títulos y links, todavía más ceñidos */
.dropdown-col h4{
  margin: 0 0 4px;
  font-size: .85rem;
}
.dropdown a{
  padding: 6px 6px;
  line-height: 1.22;
  font-size: .95rem;
}