/* ═══════════════════════════════════════════════════════════
   style.css — KinesEconomicas.com
   Fuentes: Bebas Neue (títulos) + Outfit (cuerpo)
   Paleta: Fucsia #FF0066 · Verde limón #AAFF00 · Fondo #fff
═══════════════════════════════════════════════════════════ */

/* ── Reset & Variables ─────────────────────────────────── */
:root {
  --verde:        #AAFF00;
  --fucsia:       #FF0066;
  --negro:        #0A0A0A;
  --blanco:       #FFFFFF;
  --gris-claro:   #F5F5F5;
  --gris-medio:   #E8E8E8;
  --gris-texto:   #666666;
  --fucsia-claro: #FFF0F5;
  --verde-claro:  #F5FFDD;
  --shadow-sm:    0 1px 4px rgba(0,0,0,.08);
  --shadow-md:    0 4px 16px rgba(0,0,0,.1);
  --shadow-lg:    0 8px 32px rgba(0,0,0,.13);
  --radius-sm:    8px;
  --radius-md:    12px;
  --radius-lg:    16px;
  --radius-xl:    20px;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

html { scroll-behavior:smooth; }

body {
  font-family: 'Outfit', sans-serif;
  background: var(--blanco);
  color: var(--negro);
  overflow-x: hidden;
  line-height: 1.6;
}

img { max-width:100%; height:auto; display:block; }
a { color: inherit; }

/* ── Age Gate ──────────────────────────────────────────── */
#age-gate { position:fixed; inset:0; z-index:9999; }
.age-gate-overlay {
  position:fixed; inset:0;
  background:rgba(0,0,0,.92);
  display:flex; align-items:center; justify-content:center;
  padding:20px;
}
.age-gate-box {
  background:var(--negro); border:2px solid var(--fucsia);
  border-radius:var(--radius-xl); padding:36px 28px;
  max-width:460px; width:100%; text-align:center;
}
.age-gate-logo {
  font-family:'Bebas Neue',sans-serif;
  font-size:32px; letter-spacing:2px;
  color:var(--blanco); margin-bottom:16px;
}
.age-gate-logo span { color:var(--fucsia); }
.age-gate-icono { font-size:48px; margin-bottom:16px; }
.age-gate-box h2 { color:var(--blanco); font-size:20px; margin-bottom:10px; }
.age-gate-box p  { color:rgba(255,255,255,.6); font-size:14px; line-height:1.7; margin-bottom:24px; }
.age-gate-btns   { display:flex; flex-direction:column; gap:10px; }
.age-gate-btns button, .age-gate-btns a { display:block; padding:14px; border-radius:var(--radius-md); font-family:'Outfit',sans-serif; font-weight:700; font-size:15px; text-decoration:none; transition:all .2s; border:none; cursor:pointer; }
.btn-fucsia { background:var(--fucsia); color:var(--blanco); }
.btn-fucsia:hover { background:#cc0055; }
.btn-salir { background:transparent; border:2px solid rgba(255,255,255,.2) !important; color:rgba(255,255,255,.5); font-size:14px !important; }

/* ── Topbar ────────────────────────────────────────────── */
.topbar {
  background:var(--negro); padding:7px 16px;
  display:flex; justify-content:center; gap:20px;
  font-size:12px; color:var(--verde); font-weight:500;
  letter-spacing:.5px; flex-wrap:wrap;
}
.dot {
  width:6px; height:6px; background:var(--fucsia);
  border-radius:50%; display:inline-block;
  animation:pulse 1.5s infinite;
}
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.3} }

/* ── Navbar ────────────────────────────────────────────── */
.navbar {
  background:var(--blanco); border-bottom:3px solid var(--fucsia);
  padding:0 20px; height:64px;
  display:flex; align-items:center; justify-content:space-between;
  position:sticky; top:0; z-index:200;
  box-shadow:0 2px 20px rgba(255,0,102,.1);
}
.logo {
  font-family:'Bebas Neue',sans-serif; font-size:26px;
  letter-spacing:0px; color:var(--negro); text-decoration:none;
  display:flex; align-items:center; gap:6px; flex-shrink:0;
}
.logo-ke { color:var(--fucsia); }
.logo-tag {
  font-family:'Outfit',sans-serif; font-size:10px; font-weight:700;
  background:var(--verde); color:var(--negro);
  padding:2px 7px; border-radius:4px; letter-spacing:1px;
}
.nav-links { display:flex; gap:2px; align-items:center; }
.nav-links a, .nav-item > a {
  text-decoration:none; color:var(--negro); font-weight:500;
  font-size:14px; padding:8px 12px; border-radius:var(--radius-sm);
  transition:all .2s; white-space:nowrap; display:block;
}
.nav-links a:hover, .nav-item > a:hover,
.nav-links a.active, .nav-item.nav-active > a {
  background:var(--fucsia-claro); color:var(--fucsia);
}
.btn-anunciar {
  background:var(--fucsia) !important; color:var(--blanco) !important;
  padding:9px 16px !important; border-radius:10px !important;
  font-weight:700 !important; margin-left:4px;
}
.btn-anunciar:hover { background:#cc0055 !important; }
.nav-toggle {
  display:none; background:none; border:2px solid var(--gris-medio);
  border-radius:var(--radius-sm); cursor:pointer; padding:6px 10px;
  flex-direction:column; gap:4px;
}
.nav-toggle span { display:block; width:20px; height:2px; background:var(--negro); border-radius:2px; }

/* Dropdown */
.nav-item { position:relative; }
.nav-item > a::after { content:' ▾'; font-size:9px; opacity:.5; }
.nav-dropdown {
  display:none; position:absolute; top:calc(100% + 6px); left:-10px;
  background:var(--blanco); border:2px solid var(--gris-medio);
  border-radius:var(--radius-lg); padding:14px; min-width:560px;
  box-shadow:var(--shadow-lg); z-index:300;
}
.nav-item:hover .nav-dropdown { display:block; }
.dd-title {
  font-size:10px; font-weight:800; letter-spacing:2px;
  color:var(--gris-texto); padding-bottom:10px;
  border-bottom:1px solid var(--gris-medio); margin-bottom:10px;
}
.dd-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:3px; }
.dd-grid a {
  display:flex; align-items:center; justify-content:space-between;
  text-decoration:none; font-size:13px; font-weight:500;
  color:var(--negro); padding:6px 10px; border-radius:var(--radius-sm);
  transition:all .15s;
}
.dd-grid a:hover { background:var(--fucsia-claro); color:var(--fucsia); }
.dd-grid a.active { background:var(--fucsia); color:var(--blanco); font-weight:700; }
.dc {
  font-size:10px; font-weight:700; background:var(--gris-claro);
  color:var(--gris-texto); padding:1px 6px; border-radius:5px; flex-shrink:0;
}
.dd-grid a:hover .dc { background:rgba(255,0,102,.1); color:var(--fucsia); }
.dd-grid a.active .dc { background:rgba(255,255,255,.25); color:var(--blanco); }
.dd-footer {
  border-top:1px solid var(--gris-medio); margin-top:10px;
  padding-top:10px; display:flex; align-items:center; justify-content:space-between;
}
.dd-footer a { font-size:12px; font-weight:700; color:var(--fucsia); text-decoration:none; }
.dd-footer span { font-size:12px; color:var(--gris-texto); }

/* ── Wave divider ──────────────────────────────────────── */
.wave-divider {
  height:4px;
  background:linear-gradient(90deg, var(--fucsia) 0%, var(--verde) 50%, var(--fucsia) 100%);
}

/* ── Secciones ─────────────────────────────────────────── */
.section-inner { max-width:1100px; margin:0 auto; padding:48px 20px; }
.section-header {
  display:flex; align-items:flex-end; justify-content:space-between;
  margin-bottom:28px; padding-bottom:16px;
  border-bottom:2px solid var(--gris-medio);
  flex-wrap:wrap; gap:12px;
}
.section-title {
  font-family:'Bebas Neue',sans-serif; font-size:36px;
  letter-spacing:2px; color:var(--negro); line-height:1;
}
.section-title span { color:var(--fucsia); }
.section-sub { font-size:13px; color:var(--gris-texto); margin-top:4px; }
.ver-todo { font-size:13px; font-weight:700; color:var(--fucsia); text-decoration:none; white-space:nowrap; }

/* ── Hero ──────────────────────────────────────────────── */
.hero {
  background:var(--negro); min-height:440px;
  display:flex; align-items:center; padding:52px 20px;
  position:relative; overflow:hidden;
}
.hero::before {
  content:''; position:absolute; top:-80px; right:-80px;
  width:400px; height:400px;
  background:radial-gradient(circle,rgba(170,255,0,.1) 0%,transparent 70%);
  pointer-events:none;
}
.hero::after {
  content:''; position:absolute; bottom:-60px; left:-60px;
  width:320px; height:320px;
  background:radial-gradient(circle,rgba(255,0,102,.13) 0%,transparent 70%);
  pointer-events:none;
}
.hero-content {
  max-width:1100px; margin:0 auto; width:100%;
  display:grid; grid-template-columns:1fr 1fr; gap:52px;
  align-items:center; position:relative; z-index:1;
}
.hero-badge {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(170,255,0,.12); border:1px solid var(--verde);
  border-radius:30px; padding:6px 16px;
  font-size:12px; font-weight:700; color:var(--verde);
  letter-spacing:1px; margin-bottom:18px;
}
.hero h1 {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(46px,6vw,68px); line-height:1;
  color:var(--blanco); letter-spacing:2px; margin-bottom:14px;
}
.hero h1 .h { color:var(--fucsia); }
.hero h1 .v { color:var(--verde); }
.hero-desc { font-size:15px; color:rgba(255,255,255,.65); line-height:1.7; margin-bottom:26px; }
.hero-ctas { display:flex; gap:12px; flex-wrap:wrap; }
.btn-primario {
  background:var(--fucsia); color:var(--blanco);
  padding:13px 26px; border-radius:var(--radius-md);
  font-weight:700; font-size:15px; text-decoration:none;
  transition:all .2s; box-shadow:0 4px 18px rgba(255,0,102,.4);
  display:inline-block;
}
.btn-primario:hover { background:#cc0055; transform:translateY(-2px); }
.btn-secundario {
  background:transparent; border:2px solid var(--verde);
  color:var(--verde); padding:13px 26px; border-radius:var(--radius-md);
  font-weight:600; font-size:15px; text-decoration:none;
  transition:all .2s; display:inline-block;
}
.btn-secundario:hover { background:var(--verde); color:var(--negro); }
.hero-stats { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.stat-card {
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1);
  border-radius:var(--radius-lg); padding:22px; text-align:center;
}
.stat-card.fucsia { background:rgba(255,0,102,.1); border-color:rgba(255,0,102,.25); }
.stat-num { font-family:'Bebas Neue',sans-serif; font-size:44px; color:var(--verde); letter-spacing:1px; line-height:1; }
.stat-card.fucsia .stat-num { color:var(--fucsia); }
.stat-label { font-size:12px; color:rgba(255,255,255,.5); margin-top:6px; }

/* ── Page header (zona/filtro/perfil) ──────────────────── */
.page-header {
  background:var(--negro); padding:36px 20px;
  position:relative; overflow:hidden;
}
.page-header::before {
  content:''; position:absolute; top:-60px; right:-60px;
  width:300px; height:300px;
  background:radial-gradient(circle,rgba(170,255,0,.09) 0%,transparent 70%);
  pointer-events:none;
}
.page-header-inner { max-width:1100px; margin:0 auto; position:relative; z-index:1; }
.breadcrumb {
  display:flex; align-items:center; gap:7px; font-size:13px;
  color:rgba(255,255,255,.4); margin-bottom:14px; flex-wrap:wrap;
}
.breadcrumb a { color:rgba(255,255,255,.4); text-decoration:none; transition:color .2s; }
.breadcrumb a:hover { color:var(--verde); }
.breadcrumb .sep { color:rgba(255,255,255,.2); }
.breadcrumb .current { color:var(--fucsia); font-weight:600; }
.page-header h1 {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(32px,5vw,54px); letter-spacing:3px;
  color:var(--blanco); line-height:1.05; margin-bottom:10px;
}
.page-header h1 .h { color:var(--fucsia); }
.page-intro { font-size:15px; color:rgba(255,255,255,.6); max-width:560px; line-height:1.6; }
.page-stats { display:flex; gap:24px; margin-top:20px; flex-wrap:wrap; }
.ph-stat .n { font-family:'Bebas Neue',sans-serif; font-size:30px; color:var(--verde); line-height:1; }
.ph-stat .l { font-size:12px; color:rgba(255,255,255,.4); margin-top:2px; }

/* ── Filtros bar ───────────────────────────────────────── */
.filtros-bar {
  background:var(--gris-claro); border-bottom:1px solid var(--gris-medio);
  padding:10px 20px; position:sticky; top:64px; z-index:90;
  overflow-x:auto; -webkit-overflow-scrolling:touch;
  scrollbar-width:thin; scrollbar-color:var(--fucsia) transparent;
}
.filtros-bar::-webkit-scrollbar { height:3px; }
.filtros-bar::-webkit-scrollbar-thumb { background:var(--fucsia); border-radius:3px; }
.filtros-inner {
  max-width:1100px; margin:0 auto;
  display:flex; gap:7px; align-items:center; min-width:max-content;
}
.filtros-label { font-size:11px; font-weight:800; color:var(--gris-texto); letter-spacing:1px; white-space:nowrap; }
.filtro-chip {
  background:var(--blanco); border:2px solid var(--gris-medio);
  border-radius:30px; padding:6px 14px; font-size:13px; font-weight:600;
  color:var(--negro); cursor:pointer; transition:all .2s; white-space:nowrap;
  text-decoration:none; display:inline-block;
}
.filtro-chip:hover { background:var(--fucsia-claro); border-color:var(--fucsia); color:var(--fucsia); }
.filtro-chip.active { background:var(--fucsia); border-color:var(--fucsia); color:var(--blanco); }
.sep-filtro { width:1px; height:20px; background:var(--gris-medio); flex-shrink:0; }

/* ── Main layout ───────────────────────────────────────── */
.main-layout { max-width:1100px; margin:0 auto; padding:28px 20px; }

/* ── Content header ────────────────────────────────────── */
.content-header {
  display:flex; justify-content:space-between; align-items:flex-start;
  margin-bottom:18px; gap:10px; flex-wrap:wrap;
}
.content-title { font-family:'Bebas Neue',sans-serif; font-size:28px; letter-spacing:1px; color:var(--negro); line-height:1; }
.content-title span { color:var(--fucsia); }
.content-count { font-size:13px; color:var(--gris-texto); margin-top:4px; }
.content-count strong { color:var(--negro); }
.ordenar-bar { display:flex; gap:6px; align-items:center; flex-shrink:0; }
.ordenar-bar span { font-size:12px; color:var(--gris-texto); font-weight:600; white-space:nowrap; }
.ordenar-btn {
  background:var(--gris-claro); border:1px solid var(--gris-medio);
  border-radius:var(--radius-sm); padding:6px 12px;
  font-family:'Outfit',sans-serif; font-size:12px; font-weight:600;
  cursor:pointer; color:var(--negro); transition:all .2s;
}
.ordenar-btn.active { background:var(--fucsia); border-color:var(--fucsia); color:var(--blanco); }

/* ── Grid de anuncios ──────────────────────────────────── */
.anuncios-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  align-items: stretch; /* ESTO ES CLAVE */
}



.anuncio-card {
  background: var(--blanco);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: transform .2s, box-shadow .2s, border-color .2s;
  border: 2px solid var(--gris-medio);
  position: relative;
  cursor: pointer;
  min-width: 0;
  display: block;
}

.anuncio-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
  border-color: var(--fucsia);
}

/* Asegurar que el body de la tarjeta ocupe el espacio restante */
.card-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 16px;
}

/* Footer debe estar al final */
.card-footer {
  margin-top: auto;
}

.anuncio-card.vip-card { border-color: rgb(255 189 0 / 68%); }
.anuncio-card.destacado-card { border-color: rgb(255 0 102 / 48%); }
.badge-tl {
  position:absolute; top:8px; left:8px;
  font-size:9px; font-weight:800; padding:3px 9px;
  border-radius:5px; z-index:2; letter-spacing:1px;
}
.badge-vip { background: #ffc300;  color:var(--negro);  }
.badge-destacado { background:var(--fucsia); color: var(--blanco); }
.badge-nueva { background:var(--verde); color:var(--negro); }
.badge-disp {
  position:absolute; top:8px; right:8px;
  background:rgba(170,255,0,.95); color:var(--negro);
  font-size:9px; font-weight:800; padding:3px 9px; border-radius:5px; z-index:2;
}



.badge-salidas-top {
    position: absolute;
    bottom: 16px;
    right: 100px;
    background: #0f1c10;
    color: white;
    font-size: 11px;
    font-weight: 700;
    padding: 6px 10px;
    border-radius: 7px;
    z-index: 2;
    letter-spacing: 0.5px;
}

.foto-wrap {
  width:100%; aspect-ratio:1/1;
  background:linear-gradient(160deg,#1a1a2e 0%,#2d1b3d 55%,#0f3460 100%);
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
}
.foto-wrap img { width:100%; height:100%; object-fit:cover; }
.foto-inicial {
  font-family:'Bebas Neue',sans-serif; font-size:52px;
  color:rgba(255,255,255,.08); letter-spacing:4px;
}

.card-nombre {
  font-weight:700; font-size:14px; color:var(--negro);
  display:flex; align-items:center; gap:5px; margin-bottom:3px;
}
.card-nombre-text { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:calc(100% - 22px); }
.check {
  background:var(--verde); width:14px; height:14px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:8px; font-weight:900; color:var(--negro); flex-shrink:0;
}
.card-zona { font-size:12px; color:var(--gris-texto); margin-bottom:6px; }
.card-tags { display:flex; flex-wrap:wrap; gap:4px; margin-bottom:8px; }
.tag { font-size:10px; font-weight:600; background:var(--gris-claro); color:var(--gris-texto); padding:3px 7px; border-radius:5px; white-space:nowrap; }
.tag.tp { background:var(--fucsia-claro); color:var(--fucsia); }
.tag.tv { background:var(--verde-claro); color:#3a7000; }
.card-footer {
  display:flex; align-items:center; justify-content:space-between;
  padding-top:8px; border-top:1px solid var(--gris-medio); gap:6px;
}
.card-precio { font-family:'Bebas Neue',sans-serif; font-size:20px; color:var(--fucsia); letter-spacing:1px; line-height:1; }
.card-precio small { font-family:'Outfit',sans-serif; font-size:10px; color:var(--gris-texto); font-weight:400; display:block; }
.btn-ver-perfil {
  background: var(--fucsia);
  color: var(--blanco);
  border-radius: 7px;
  padding: 6px 10px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
  flex-shrink: 0;
  display: inline-block;
  cursor: pointer;
}

/* ── Sin resultados ────────────────────────────────────── */
.sin-resultados {
  grid-column:1/-1; text-align:center; padding:40px 20px;
  color:var(--gris-texto);
}
.btn-fucsia-sm {
  display:inline-block; background:var(--fucsia); color:var(--blanco);
  padding:10px 20px; border-radius:var(--radius-sm); font-weight:700;
  font-size:13px; text-decoration:none; margin-top:12px;
}
.btn-verde-sm {
  display:inline-block; background:var(--verde); color:var(--negro)!important;
  padding:10px 20px; border-radius:var(--radius-sm); font-weight:700;
  font-size:13px; text-decoration:none;
}

/* ── Paginación ────────────────────────────────────────── */
.paginacion { display:flex; justify-content:center; gap:6px; margin-top:28px; flex-wrap:wrap; }
.pag-btn {
  width:38px; height:38px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:600; text-decoration:none;
  color:var(--negro); background:var(--gris-claro); border:2px solid var(--gris-medio);
  transition:all .2s;
}
.pag-btn:hover { border-color:var(--fucsia); color:var(--fucsia); }
.pag-btn.active { background:var(--fucsia); border-color:var(--fucsia); color:var(--blanco); }

/* ── Sección distritos ─────────────────────────────────── */
.distritos-section { background:var(--gris-claro); border-top:3px solid var(--gris-medio); padding:40px 20px; }
.distritos-inner { max-width:1100px; margin:0 auto; }
.sec-titulo { font-family:'Bebas Neue',sans-serif; font-size:28px; letter-spacing:2px; color:var(--negro); margin-bottom:4px; }
.sec-titulo span { color:var(--fucsia); }
.sec-sub { font-size:13px; color:var(--gris-texto); margin-bottom:18px; }
.distritos-chips { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:28px; }
.dist-chip {
  display:inline-flex; align-items:center; gap:7px;
  text-decoration:none; background:var(--blanco);
  border:2px solid var(--gris-medio); border-radius:10px;
  padding:7px 13px; font-size:13px; font-weight:600; color:var(--negro);
  transition:all .18s;
}
.dist-chip:hover { border-color:var(--fucsia); color:var(--fucsia); background:var(--fucsia-claro); transform:translateY(-2px); }
.dist-chip.active { background:var(--fucsia); border-color:var(--fucsia); color:var(--blanco); }
.dist-chip .cnt { font-size:11px; font-weight:700; background:var(--gris-claro); color:var(--gris-texto); padding:2px 7px; border-radius:6px; display: none;}
.dist-chip:hover .cnt { background:rgba(255,0,102,.12); color:var(--fucsia); }
.dist-chip.active .cnt { background:rgba(255,255,255,.25); color:var(--blanco); }

/* ── Banner kine ───────────────────────────────────────── */
.banner-kine {
  background:var(--negro); border-radius:var(--radius-lg);
  padding:24px 28px; display:flex; align-items:center;
  justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.bk-title { font-family:'Bebas Neue',sans-serif; font-size:26px; color:var(--blanco); letter-spacing:1px; line-height:1; margin-bottom:6px; }
.bk-title span { color:var(--fucsia); }
.bk-desc { font-size:14px; color:rgba(255,255,255,.55); max-width:480px; line-height:1.6; }
.bk-actions { display:flex; flex-direction:column; gap:8px; flex-shrink:0; }
.bk-btn {
  background:var(--verde); color:var(--negro); font-weight:800;
  font-size:14px; padding:12px 24px; border-radius:var(--radius-md);
  text-decoration:none; white-space:nowrap; transition:all .2s; display:inline-block; text-align:center;
}
.bk-btn:hover { background:#88cc00; transform:translateY(-2px); }
.bk-wa {
  background:transparent; border:2px solid rgba(255,255,255,.2);
  color:rgba(255,255,255,.7); font-weight:600; font-size:13px;
  padding:10px 24px; border-radius:var(--radius-md);
  text-decoration:none; text-align:center; transition:all .2s; display:inline-block;
}
.bk-wa:hover { border-color:var(--verde); color:var(--verde); }

/* ── Ciudades grid (index) ─────────────────────────────── */
.ciudades-section { padding:0; }
.ciudades-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:12px;
}
.ciudad-card {
  background:var(--gris-claro); border:2px solid var(--gris-medio);
  border-radius:var(--radius-lg); padding:20px 14px; text-align:center;
  text-decoration:none; color:var(--negro); transition:all .2s; position:relative;
}
.ciudad-card:hover { border-color:var(--fucsia); background:var(--fucsia-claro); transform:translateY(-3px); }
.ciudad-card.ciudad-destacada { border-color:var(--fucsia); background:var(--fucsia-claro); }
.ciudad-nombre { font-weight:700; font-size:15px; }
.ciudad-cnt { font-size:12px; color:var(--gris-texto); margin-top:4px; }
.ciudad-badge {
  position:absolute; top:-10px; right:8px;
  background:var(--fucsia); color:var(--blanco);

  font-size:10px; font-weight:800; padding:2px 8px; border-radius:20px;
}

/* ── Precios ───────────────────────────────────────────── */
.precios-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:24px; }
.precio-card { border:2px solid var(--gris-medio); border-radius:var(--radius-xl); padding:26px 20px; text-align:center; position:relative; transition:all .2s; }
.precio-card:hover { border-color:var(--fucsia); transform:translateY(-3px); }
.precio-card.precio-destacado { border-color:var(--fucsia); background:var(--fucsia-claro); }
.precio-etiqueta {
  position:absolute; top:-12px; left:50%; transform:translateX(-50%);
  background:var(--fucsia); color:var(--blanco);
  font-size:10px; font-weight:800; padding:3px 14px; border-radius:20px; white-space:nowrap;
}
.precio-tipo { font-size:12px; font-weight:700; color:var(--gris-texto); letter-spacing:1px; margin-bottom:8px; }
.precio-rango { font-family:'Bebas Neue',sans-serif; font-size:36px; color:var(--negro); letter-spacing:1px; line-height:1; margin-bottom:8px; }
.precio-desc { font-size:13px; color:var(--gris-texto); line-height:1.6; }
.precio-tag { display:inline-block; margin-top:12px; background:var(--gris-claro); border-radius:8px; padding:5px 12px; font-size:12px; font-weight:600; }

/* ── FAQ ───────────────────────────────────────────────── */
.faq-section { background:var(--negro); padding:0; }
.faq-list { margin-top:24px; display:flex; flex-direction:column; gap:12px; }
.faq-item { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); border-radius:var(--radius-md); padding:20px 22px; }
.faq-q { font-weight:700; font-size:15px; color:var(--blanco); margin-bottom:8px; display:flex; align-items:center; gap:10px; }
.faq-q::before { content:'Q'; width:26px; height:26px; background:var(--fucsia); color:var(--blanco); border-radius:7px; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:800; flex-shrink:0; }
.faq-a { font-size:14px; color:rgba(255,255,255,.6); line-height:1.7; padding-left:36px; }

/* ── Breadcrumb bar (perfil) ───────────────────────────── */
.breadcrumb-bar { padding:11px 20px; background:var(--gris-claro); border-bottom:1px solid var(--gris-medio); }
.breadcrumb-bar .breadcrumb { max-width:1100px; margin:0 auto; color:var(--gris-texto); }
.breadcrumb-bar .breadcrumb a { color:var(--gris-texto); }

/* ── Perfil ────────────────────────────────────────────── */
.perfil-main {
  max-width:1100px; margin:0 auto; padding:28px 20px;
  display:grid; grid-template-columns:1fr 340px; gap:28px; align-items:start;
}
.foto-principal {
  width: 100%;
  max-width: 100%; /* CLAVE: no salir del contenedor */
  height: 550px;
  border-radius: var(--radius-xl);
  background: linear-gradient(160deg,#1a1a2e 0%,#2d1b3d 55%,#0f3460 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  margin-bottom: 12px;
}

.foto-principal img {
  max-width: 100%; /* CLAVE: no salir del contenedor */
  max-height: 100%;
  width: auto; /* Mantener proporción */
  height: auto; /* Mantener proporción */
  object-fit: contain; /* Contener sin deformar */
  object-position: center;
}
.foto-inicial-grande { font-family:'Bebas Neue',sans-serif; font-size:100px; color:rgba(255,255,255,.08); }
.ov-disp { position:absolute; top:16px; left:16px; background:rgba(170,255,0,.95); color:var(--negro); font-size:12px; font-weight:800; padding:6px 14px; border-radius:8px; letter-spacing:1px; display:flex; align-items:center; gap:6px; }
.ov-vip  { position:absolute; top:16px; right:16px; background:#ffc300; color:var(--negro); font-size:10px; font-weight:800; padding:6px 14px; border-radius:8px; letter-spacing:2px; }
.fotos-mini { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-bottom:20px; }
.foto-mini { aspect-ratio:1; border-radius:10px; overflow:hidden; cursor:pointer; border:2px solid transparent; transition:all .2s; }
.foto-mini img { width:100%; height:100%; object-fit:cover; }
.foto-mini.active { border-color:var(--verde); }
.foto-mini:hover { border-color:var(--fucsia); }

.datos-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:24px; }
.dato-card { background:var(--gris-claro); border-radius:var(--radius-md); padding:14px 10px; text-align:center; border:2px solid var(--gris-medio); }
.dato-card .di { font-size:20px; margin-bottom:4px; }
.dato-card .dv { font-weight:700; font-size:13px; color:var(--negro); }
.dato-card .dl { font-size:11px; color:var(--gris-texto); }

.detalle-seccion { margin-bottom:28px; }
.detalle-titulo { font-family:'Bebas Neue',sans-serif; font-size:22px; letter-spacing:1px; color:var(--negro); margin-bottom:14px; padding-bottom:10px; border-bottom:2px solid var(--gris-medio); }
.detalle-titulo span { color:var(--fucsia); }
.desc-texto { font-size:15px; color:var(--gris-texto); line-height:1.8; }
.servicios-grid { display:flex; flex-wrap:wrap; gap:8px; }
.srv { border-radius:30px; padding:8px 16px; font-size:13px; font-weight:600; }
.srv.dark { background:var(--negro); color:var(--blanco); }
.srv.verde { background:var(--verde-claro); color:#3a6600; border:1px solid var(--verde); }
.srv.fucsia { background:var(--fucsia-claro); color:var(--fucsia); border:1px solid rgba(255,0,102,.25); }
.tarifas-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:12px; }
.tarifa-card { background:var(--gris-claro); border:2px solid var(--gris-medio); border-radius:var(--radius-md); padding:16px; text-align:center; }
.tarifa-tipo { font-size:12px; font-weight:700; color:var(--gris-texto); letter-spacing:.5px; margin-bottom:6px; }
.tarifa-precio { font-family:'Bebas Neue',sans-serif; font-size:32px; color:var(--fucsia); letter-spacing:1px; }
.tarifa-nota { font-size:12px; color:var(--gris-texto); line-height:1.6; }
.horario-table { width:100%; border-radius:var(--radius-md); overflow:hidden; border:1px solid var(--gris-medio); font-size:14px; }
.horario-table tr { border-bottom:1px solid var(--gris-medio); }
.horario-table tr:last-child { border-bottom:none; }
.horario-table tr.disp { background:var(--verde-claro); }
.horario-table td { padding:10px 14px; }
.horario-table .dia { color:var(--gris-texto); font-weight:600; }
.horario-table tr.disp .dia, .horario-table tr.disp .hora { color:#3a6600; }
.horario-table .hora { font-weight:700; color:var(--negro); }
.ubicacion-card { background:var(--gris-claro); border:2px solid var(--gris-medio); border-radius:var(--radius-md); padding:18px; display:flex; gap:14px; align-items:center; }
.ub-pin { width:48px; height:48px; background:var(--fucsia); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:22px; flex-shrink:0; }
.ub-info .ut { font-weight:700; font-size:15px; color:var(--negro); margin-bottom:4px; }
.ub-info .us { font-size:13px; color:var(--gris-texto); line-height:1.6; }
.enlace-contextual { background:var(--gris-claro); border-radius:var(--radius-md); padding:14px 16px; margin-bottom:16px; font-size:14px; color:var(--gris-texto); }
.enlace-contextual a { color:var(--fucsia); font-weight:600; text-decoration:none; }
.enlace-contextual a:hover { text-decoration:underline; }
.advertencia { background:#FFFBEB; border:1px solid #F59E0B; border-radius:var(--radius-md); padding:12px 16px; font-size:13px; color:#92400E; line-height:1.6; margin-top:4px; }
.volver-section { margin-top:20px; padding:14px 0; font-size:14px; color:var(--gris-texto); }
.volver-section a { color:var(--fucsia); font-weight:600; text-decoration:none; }

/* CTA sticky desktop */
.cta-card { background:var(--negro); border-radius:var(--radius-xl); padding:24px; position:sticky; top:80px; }
.cta-disp { display:flex; align-items:center; gap:8px; font-size:13px; font-weight:700; color:var(--verde); margin-bottom:12px; }
.cta-nombre { font-family:'Bebas Neue',sans-serif; font-size:42px; color:var(--blanco); letter-spacing:2px; line-height:1; margin-bottom:4px; display:flex; align-items:center; gap:10px; }
.cta-check { background:var(--verde); width:20px; height:20px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:11px; font-weight:900; color:var(--negro); flex-shrink:0; }
.cta-sub { font-size:13px; color:rgba(255,255,255,.5); margin-bottom:16px; }
.cta-precio-box { background:rgba(255,0,102,.13); border:1px solid rgba(255,0,102,.35); border-radius:var(--radius-md); padding:14px 16px; margin-bottom:16px; display:flex; align-items:center; justify-content:space-between; }
.cpb-desde { font-size:11px; color:rgba(255,255,255,.45); margin-bottom:3px; }
.cpb-num { font-family:'Bebas Neue',sans-serif; font-size:38px; color:var(--fucsia); letter-spacing:2px; line-height:1; }
.cpb-nota { font-size:11px; color:rgba(255,255,255,.35); margin-top:4px; }
.cpb-right { text-align:right; }
.h-l { font-size:11px; color:rgba(255,255,255,.4); margin-bottom:4px; }
.h-v { font-size:20px; font-weight:700; color:var(--verde); }
.btn-cta { display:block; text-align:center; padding:13px; border-radius:var(--radius-md); font-weight:800; font-size:14px; text-decoration:none; transition:all .2s; margin-bottom:8px; }
.btn-cta.llamar { background:var(--fucsia); color:var(--blanco); box-shadow:0 4px 16px rgba(255,0,102,.4); }
.btn-cta.llamar:hover { background:#cc0055; transform:translateY(-2px); }
.btn-cta.whatsapp { background:#25D366; color:var(--blanco); }
.btn-cta.whatsapp:hover { background:#1ebe5a; }
.btn-cta.telegram { background:transparent; border:2px solid rgba(255,255,255,.2); color:rgba(255,255,255,.7); font-size:13px; }
.btn-cta.telegram:hover { border-color:var(--verde); color:var(--verde); }
.cta-aviso { font-size:11px; color:rgba(255,255,255,.28); text-align:center; line-height:1.5; margin-top:12px; }
.cta-visitas { font-size:11px; color:rgba(255,255,255,.3); text-align:center; margin-top:8px; }

/* ── Barra fija móvil ──────────────────────────────────── */
.mobile-cta-bar {
  display:none; position:fixed; bottom:0; left:0; right:0; z-index:999;
  background:var(--negro); border-top:3px solid var(--fucsia);
  padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  box-shadow:0 -4px 24px rgba(0,0,0,.3);
}
.price-row { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.m-nombre { font-weight:700; font-size:15px; color:var(--blanco); display:flex; align-items:center; gap:6px; }
.m-check { background:var(--verde); width:14px; height:14px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:7px; font-weight:900; color:var(--negro); }
.m-precio { font-family:'Bebas Neue',sans-serif; font-size:24px; color:var(--fucsia); }
.m-precio small { font-family:'Outfit',sans-serif; font-size:11px; color:rgba(255,255,255,.4); font-weight:400; }
.btns-row { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.mb {
  display:flex; align-items:center; justify-content:center; gap:5px;
  padding:12px 8px; border-radius:var(--radius-md); font-weight:800;
  font-size:13px; text-decoration:none; transition:all .15s;
}
.mb.llamar   { background:var(--fucsia); color:var(--blanco); }
.mb.whatsapp { background:#25D366; color:var(--blanco); }
.mb.telegram { background:#2AABEE; color:var(--blanco); }
.mb:active   { transform:scale(.97); }
.mobile-pad  { display:none; height:130px; }

/* ── Similares ─────────────────────────────────────────── */
.similares-section { background:var(--gris-claro); padding:40px 20px; border-top:3px solid var(--gris-medio); }
.sim-inner  { max-width:1100px; margin:0 auto; }
.sim-titulo { font-family:'Bebas Neue',sans-serif; font-size:30px; letter-spacing:1px; color:var(--negro); margin-bottom:18px; }
.sim-titulo span { color:var(--fucsia); }
.sim-grid   { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }

/* ── Publicar ──────────────────────────────────────────── */
.publicar-page { background:var(--gris-claro); min-height:60vh; }
.publicar-inner { max-width:800px; margin:0 auto; padding:40px 20px; }
.publicar-header { text-align:center; margin-bottom:32px; }
.publicar-header h1 { font-family:'Bebas Neue',sans-serif; font-size:44px; letter-spacing:2px; color:var(--negro); }
.publicar-header h1 span { color:var(--fucsia); }
.publicar-header p { font-size:15px; color:var(--gris-texto); margin-top:8px; }
.planes-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:20px; }
.plan-card { border:2px solid var(--gris-medio); border-radius:var(--radius-lg); padding:22px; text-align:center; position:relative; }
.plan-card.plan-destacado { border-color:var(--fucsia); background:var(--fucsia-claro); }
.plan-badge { position:absolute; top:-10px; left:50%; transform:translateX(-50%); background:var(--fucsia); color:var(--blanco); font-size:10px; font-weight:800; padding:3px 14px; border-radius:20px; white-space:nowrap; }
.plan-nombre { font-weight:800; font-size:16px; color:var(--negro); margin-bottom:6px; }
.plan-precio { font-family:'Bebas Neue',sans-serif; font-size:36px; color:var(--fucsia); }
.plan-desc { font-size:13px; color:var(--gris-texto); margin-top:8px; line-height:1.5; }
.pago-info { background:var(--negro); border-radius:var(--radius-md); padding:14px 18px; margin-bottom:24px; font-size:14px; color:rgba(255,255,255,.7); }
.wa-link { color:var(--verde); font-weight:700; text-decoration:none; }
.alerta-exito { background:#d4edda; border:1px solid #c3e6cb; border-radius:var(--radius-md); padding:16px 18px; margin-bottom:20px; color:#155724; font-size:14px; line-height:1.6; }
.alerta-exito a { color:#155724; font-weight:700; }
.alerta-error { background:#f8d7da; border:1px solid #f5c6cb; border-radius:var(--radius-md); padding:14px 18px; margin-bottom:20px; color:#721c24; font-size:14px; }
.alerta-error ul { margin-top:8px; padding-left:20px; }
.publicar-form { background:var(--blanco); border-radius:var(--radius-xl); padding:28px; box-shadow:var(--shadow-sm); }
.form-section { margin-bottom:28px; padding-bottom:24px; border-bottom:2px solid var(--gris-medio); }
.form-section:last-of-type { border-bottom:none; }
.form-section h2 { font-size:18px; font-weight:700; color:var(--negro); margin-bottom:18px; }
.form-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.form-group { display:flex; flex-direction:column; gap:6px; }
.form-group label { font-size:13px; font-weight:600; color:var(--negro); }
.form-group input, .form-group select, .form-group textarea {
  padding:11px 14px; border:2px solid var(--gris-medio); border-radius:var(--radius-sm);
  font-family:'Outfit',sans-serif; font-size:14px; color:var(--negro);
  transition:border-color .2s; background:var(--blanco); width:100%;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  outline:none; border-color:var(--fucsia);
}
.form-check { margin-bottom:20px; }
.form-check label { display:flex; gap:10px; align-items:flex-start; font-size:14px; cursor:pointer; }
.form-check input[type=checkbox] { width:18px; height:18px; flex-shrink:0; margin-top:2px; }
.form-actions { text-align:center; }
.btn-enviar {
  background:var(--fucsia); color:var(--blanco); border:none;
  padding:16px 36px; border-radius:var(--radius-md);
  font-family:'Outfit',sans-serif; font-weight:800; font-size:16px;
  cursor:pointer; transition:all .2s; box-shadow:0 4px 18px rgba(255,0,102,.4);
}
.btn-enviar:hover { background:#cc0055; transform:translateY(-2px); }
.form-nota { font-size:13px; color:var(--gris-texto); margin-top:12px; line-height:1.6; }
.form-nota a { color:var(--fucsia); font-weight:600; }

/* ── Páginas estáticas ─────────────────────────────────── */
.static-page { background:var(--gris-claro); min-height:60vh; padding:40px 20px; }
.static-inner { max-width:800px; margin:0 auto; }
.static-inner h1 { font-family:'Bebas Neue',sans-serif; font-size:40px; letter-spacing:2px; color:var(--negro); margin-bottom:24px; }
.static-inner h1 span { color:var(--fucsia); }
.static-fecha { font-size:13px; color:var(--gris-texto); margin-bottom:24px; }
.static-content h2 { font-size:18px; font-weight:700; color:var(--negro); margin:24px 0 10px; }
.static-content p { font-size:15px; color:var(--gris-texto); line-height:1.8; margin-bottom:12px; }
.static-content a { color:var(--fucsia); }
.contacto-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:32px; }
.contacto-card { background:var(--blanco); border:2px solid var(--gris-medio); border-radius:var(--radius-lg); padding:24px; text-align:center; }
.cc-icon { font-size:36px; margin-bottom:12px; }
.contacto-card h2 { font-size:18px; font-weight:700; margin-bottom:10px; }
.contacto-card p { font-size:14px; color:var(--gris-texto); line-height:1.6; margin-bottom:16px; }
.contacto-info { background:var(--blanco); border-radius:var(--radius-lg); padding:24px; }
.contacto-info h2 { font-size:18px; font-weight:700; margin-bottom:12px; }
.contacto-info p { font-size:14px; color:var(--gris-texto); line-height:1.7; }

/* ── Error 404 ─────────────────────────────────────────── */
.error-page { text-align:center; padding:60px 20px; background:var(--gris-claro); min-height:60vh; }
.error-inner { max-width:560px; margin:0 auto; }
.error-num { font-family:'Bebas Neue',sans-serif; font-size:120px; color:var(--fucsia); letter-spacing:4px; line-height:1; }
.error-page h1 { font-size:28px; font-weight:700; color:var(--negro); margin-bottom:10px; }
.error-page p { font-size:15px; color:var(--gris-texto); margin-bottom:24px; }
.error-links { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:32px; }
.error-ciudades p { font-size:14px; color:var(--gris-texto); margin-bottom:12px; }

/* ── Footer ────────────────────────────────────────────── */
.footer { background:#060606; border-top:3px solid var(--fucsia); padding:48px 20px 24px; }
.footer-inner { max-width:1100px; margin:0 auto; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:36px; margin-bottom:36px; }
.footer-logo { font-family:'Bebas Neue',sans-serif; font-size:30px; letter-spacing:2px; color:var(--blanco); margin-bottom:10px; }
.footer-logo span { color:var(--fucsia); }
.footer-desc { font-size:13px; color:rgba(255,255,255,.4); line-height:1.7; max-width:240px; margin-bottom:16px; }
.footer-badge { display:inline-flex; align-items:center; gap:6px; background:rgba(170,255,0,.1); border:1px solid rgba(170,255,0,.3); border-radius:8px; padding:7px 12px; font-size:12px; color:var(--verde); font-weight:600; }
.footer-col h4 { font-size:11px; font-weight:800; letter-spacing:2px; color:rgba(255,255,255,.35); margin-bottom:14px; }
.footer-col ul { list-style:none; }
.footer-col li { margin-bottom:9px; }
.footer-col a { text-decoration:none; font-size:13px; color:rgba(255,255,255,.55); transition:color .2s; display:block; }
.footer-col a:hover { color:var(--verde); }
.footer-anunciate p { font-size:12px; color:rgba(255,255,255,.45); line-height:1.6; margin-bottom:10px; }
.btn-verde-sm { display:block; background:var(--verde); color:var(--negro); font-weight:800; font-size:13px; padding:10px; border-radius:var(--radius-sm); text-decoration:none; text-align:center; margin-bottom:8px; }
.btn-wa-sm { display:block; background:transparent; border:1px solid rgba(255,255,255,.2); color:rgba(255,255,255,.6); font-size:13px; padding:10px; border-radius:var(--radius-sm); text-decoration:none; text-align:center; transition:all .2s; }
.btn-wa-sm:hover { border-color:var(--verde); color:var(--verde); }
.footer-divider { height:1px; background:rgba(255,255,255,.08); margin-bottom:20px; }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; font-size:12px; color:rgba(255,255,255,.3); flex-wrap:wrap; gap:8px; }
.footer-bottom a { color:var(--fucsia); text-decoration:none; }







/* ── Contenido SEO ───────────────────────────────────────────── */
.seo-content {
  background: #fff;
  padding: 50px 0;
  border-top: 1px solid #eee;
}

.seo-inner {
  max-width: 800px;
  margin: 0 auto;
  padding: 0 20px;
}

.seo-inner h2 {
  font-size: 24px;
  font-weight: 800;
  margin: 30px 0 16px;
  color: #111;
  line-height: 1.3;
}

.seo-inner h2:first-child {
  margin-top: 0;
}

.seo-inner h3 {
  font-size: 18px;
  font-weight: 700;
  margin: 24px 0 12px;
  color: #333;
}

.seo-inner p {
  font-size: 15px;
  line-height: 1.7;
  color: #555;
  margin-bottom: 16px;
}

.seo-inner strong {
  font-weight: 700;
  color: #111;
}





/* Badge de edad en perfil */
.edad-badge {
  display: inline-block;
  background: rgba(0, 0, 0, 0.1);
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 600;
  margin-left: 8px;
  color: #666;
}

/* Versión móvil */
.mobile-cta-bar .edad-badge {
  font-size: 12px;
  padding: 2px 8px;
  margin-left: 6px;
  vertical-align: middle;
}

/* Versión desktop */
.cta-nombre .edad-badge {
  font-size: 14px;
  padding: 4px 12px;
  margin-left: 10px;
  background: rgba(255, 0, 102, 0.1);
  color: var(--fucsia);
  font-weight: 700;
}






/* ── Botón Ver Más Index ───────────────────────────────── */
.btn-ver-mas-index {
  display: inline-block;
  background: var(--fucsia);
  color: var(--blanco);
  padding: 18px 48px;
  border-radius: var(--radius-lg);
  font-weight: 800;
  font-size: 18px;
  text-decoration: none;
  transition: all .3s;
  box-shadow: 0 6px 24px rgba(255, 0, 102, 0.4);
  letter-spacing: 0.5px;
}

.btn-ver-mas-index:hover {
  background: #cc0055;
  transform: translateY(-3px);
  box-shadow: 0 8px 32px rgba(255, 0, 102, 0.5);
}

@media (max-width: 600px) {
  .btn-ver-mas-index {
    padding: 16px 36px;
    font-size: 16px;
    width: 90%;
  }
}




/* ═══════════════════════════════════════════════════════════════
   VIDEO EN PERFIL
   ═══════════════════════════════════════════════════════════════ */

.video-section {
  margin: 25px 0;
}

.video-container {
  position: relative;
  width: 100%;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
  background: #000;
}

.video-container video {
  width: 100%;
  height: auto;
  display: block;
  background: #000;
}

.video-overlay-badge {
  position: absolute;
  top: 15px;
  left: 15px;
  background: linear-gradient(135deg, var(--fucsia) 0%, #e60073 100%);
  color: white;
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.5px;
  box-shadow: 0 4px 12px rgba(255, 0, 102, 0.4);
  z-index: 2;
  pointer-events: none;
}

/* Responsive */
@media (max-width: 768px) {
  .video-section {
    margin: 20px 0;
  }
  
  .video-container {
    border-radius: 12px;
  }
  
  .video-overlay-badge {
    top: 10px;
    left: 10px;
    padding: 6px 12px;
    font-size: 11px;
  }
}



/* Badge de video en tarjeta (debajo de disponible) */
.badge-video {
  position: absolute;
  top: 40px;  /* Debajo del badge disponible */
  right: 8px;
  background: rgba(0, 0, 0, 0.85);
  color: white;
  font-size: 16px;
  padding: 5px 9px;
  border-radius: 6px;
  z-index: 2;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
  line-height: 1;
}

@media (max-width: 768px) {
  .badge-video {
    font-size: 14px;
    padding: 4px 8px;
    top: 35px;
  }
}


/* ═══════════════════════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════════════════════ */



@media (max-width:900px) {
  /* Nav → hamburguesa */
  .nav-links a:not(.btn-anunciar) { display:none; }
  .nav-item { display:none; }
  .nav-toggle { display:flex; }
  .nav-links.open {
    display:flex; flex-direction:column;
    position:absolute; top:64px; left:0; right:0;
    background:var(--blanco); border-bottom:3px solid var(--fucsia);
    padding:12px 20px; gap:4px;
    box-shadow:0 6px 20px rgba(0,0,0,.1); z-index:199;


    .foto-principal {
    height: 350px;
    max-width: 100%;
  }

  }
  .nav-links.open a, .nav-links.open .nav-item { display:block; }
  .nav-links.open .nav-dropdown { display:none !important; }
  .nav-links.open .nav-item > a::after { display:none; }

  /* Hero 1 columna */
  .hero-content { grid-template-columns:1fr; gap:28px; }
  .hero-stats { grid-template-columns:repeat(2,1fr); }

  /* Anuncios 2 cols */
  .anuncios-grid { grid-template-columns:repeat(2,1fr); }

  /* Perfil 1 columna */
  .perfil-main { grid-template-columns:1fr; }
  .perfil-right .cta-card { display:none; }
  .mobile-cta-bar { display:block; }
  .mobile-pad { display:block; }

  /* Datos grid 2x2 */
  .datos-grid { grid-template-columns:repeat(2,1fr); }

  /* Similares 2 cols */
  .sim-grid { grid-template-columns:repeat(2,1fr); }

  /* Precios 1 col */
  .precios-grid { grid-template-columns:1fr; }

  /* Planes 1 col */
  .planes-grid { grid-template-columns:1fr; }

  /* Footer 2 cols */
  .footer-grid { grid-template-columns:1fr 1fr; }

  /* Contacto 1 col */
  .contacto-grid { grid-template-columns:1fr; }

  /* Form grid 1 col */
  .form-grid { grid-template-columns:1fr; }
}

@media (max-width:600px) {
  .topbar span:nth-child(3) { display:none; }
  .logo-tag { display:none; }
  .page-header { padding:24px 16px; }
  .section-inner { padding:32px 16px; }
  .main-layout { padding:16px; }
  .perfil-main { padding:16px; }

  /* 2 cols compactas en mobile */
  .anuncios-grid { grid-template-columns: 1fr; gap: 10px;}
  
  .card-body { padding:9px; }
  .card-nombre { font-size:13px; }
  .card-zona { font-size:11px; }
  .card-tags { display:none; }
  .card-precio { font-size:18px; }
  .btn-ver-perfil { padding:5px 8px; font-size:10px; }


.badge-salidas-top { padding:5px 8px; font-size:10px; bottom: 9px; right: 90px; }


  .tarifas-grid { grid-template-columns:repeat(2,1fr); }
  .fotos-mini { grid-template-columns:repeat(5,1fr); gap:6px; }
  .sim-grid { grid-template-columns:repeat(2,1fr); gap:10px; }
  .banner-kine { flex-direction:column; gap:16px; padding:20px 16px; }
  .bk-actions { width:100%; }
  .bk-btn, .bk-wa { width:100%; }
  .footer-grid { grid-template-columns:1fr; gap:28px; }
  .footer-bottom { flex-direction:column; align-items:flex-start; }
  .distritos-section { padding:28px 16px; }
  .dist-chip { padding:6px 11px; font-size:12px; }
  .mb { font-size:12px; padding:10px 6px; }

  /* Dropdown en móvil más angosto */
  .nav-dropdown { min-width:94vw; left:-20px; }
  .dd-grid { grid-template-columns:repeat(2,1fr); }


    .foto-principal {
    height: 300px; /* Reducido para móvil */
    max-width: 100%;
  }

}

@media (max-width:380px) {
  .anuncios-grid { grid-template-columns:1fr; }
  .hero-stats { grid-template-columns:1fr 1fr; }
}
