/* Cerca — estilos compartidos del sitio MVP */
:root{
  --bg:#FFF9F4; --surface:#FFFFFF; --ink:#1E2430; --muted:#5C6575;
  --brand:#E4572E; --brand-dark:#C7431F; --teal:#0E7C7B; --teal-dark:#0A5F5E;
  --line:#F0E2D6; --chip:#FFF1E6; --ok:#177245; --radius:16px;
  --shadow:0 6px 24px rgba(30,36,48,.08);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; background:var(--bg); color:var(--ink); line-height:1.55;}
a{color:var(--teal-dark);}
.wrap{max-width:1080px; margin:0 auto; padding:0 20px;}

/* Header */
header{position:sticky; top:0; z-index:50; background:rgba(255,249,244,.95); backdrop-filter:blur(6px); border-bottom:1px solid var(--line);}
.nav{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 0;}
.logo{font-size:26px; font-weight:800; letter-spacing:-.5px; color:var(--ink); text-decoration:none;}
.logo span{color:var(--brand);}
.nav-links{display:flex; gap:18px; align-items:center; flex-wrap:wrap;}
.nav-links a{color:var(--ink); text-decoration:none; font-weight:600; font-size:15px;}
.nav-links a.active{color:var(--brand);}
.btn{display:inline-block; border:none; cursor:pointer; text-decoration:none; font-weight:700; border-radius:999px; padding:12px 22px; font-size:15px; transition:.15s;}
.btn-brand{background:var(--brand); color:#fff;}
.btn-brand:hover{background:var(--brand-dark);}
.btn-teal{background:var(--teal); color:#fff;}
.btn-teal:hover{background:var(--teal-dark);}
.btn-ghost{background:transparent; color:var(--ink); border:2px solid var(--ink);}
.btn-small{padding:8px 16px; font-size:14px;}

/* Hero e interiores */
.hero{padding:56px 0 40px; text-align:center;}
.hero h1{font-size:clamp(30px,5.5vw,46px); line-height:1.15; letter-spacing:-1px; max-width:760px; margin:0 auto 14px;}
.hero h1 em{font-style:normal; color:var(--brand);}
.hero p{color:var(--muted); font-size:18px; max-width:620px; margin:0 auto 26px;}
.page-head{padding:44px 0 4px;}
.crumbs{font-size:14px; color:var(--muted); margin-bottom:12px;}
.crumbs a{color:var(--muted);}
.searchbar{display:flex; gap:8px; max-width:640px; margin:0 auto 16px; background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:6px; box-shadow:var(--shadow);}
.searchbar.left{margin:0 0 20px;}
.searchbar input{flex:1; border:none; outline:none; font-size:16px; padding:10px 16px; background:transparent; min-width:0;}
.hero-ctas{display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:10px;}
.zone-note{margin-top:18px; font-size:14px; color:var(--muted);}
.zone-note strong{color:var(--ink);}

section{padding:44px 0;}
h2{font-size:clamp(24px,4vw,32px); letter-spacing:-.5px; margin-bottom:8px;}
.sub{color:var(--muted); margin-bottom:26px; max-width:640px;}

/* Cards */
.grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px;}
.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:22px; box-shadow:var(--shadow);}
a.card-link{text-decoration:none; color:inherit; display:block; transition:.15s;}
a.card-link:hover{transform:translateY(-2px);}
.card .emoji{font-size:34px; display:block; margin-bottom:10px;}
.card h3{font-size:18px; margin-bottom:6px;}
.card p{color:var(--muted); font-size:15px;}
.pill{display:inline-block; background:var(--chip); color:var(--brand-dark); font-size:12px; font-weight:700; border-radius:999px; padding:3px 10px; margin-top:12px;}
.pill.soon{background:#EDF3F3; color:var(--teal-dark);}

/* Negocios */
.filters{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:20px;}
.chip-btn{border:1px solid var(--line); background:var(--surface); border-radius:999px; padding:8px 16px; font-weight:600; font-size:14px; cursor:pointer; text-decoration:none; color:var(--ink); display:inline-block;}
.chip-btn.active{background:var(--ink); color:#fff; border-color:var(--ink);}
.biz-photo{height:110px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:44px; margin-bottom:14px;}
.badges{display:flex; gap:6px; flex-wrap:wrap; margin:10px 0;}
.badge{font-size:12px; font-weight:600; background:#F2F5F5; border-radius:999px; padding:3px 9px;}
.badge.sponsored{background:#FFF3D6; color:#7A5200;}
.biz-actions{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px;}
.biz-actions a{flex:1; text-align:center; text-decoration:none; font-weight:700; font-size:14px; border-radius:10px; padding:9px 6px; background:#25D366; color:#fff; white-space:nowrap;}
.biz-actions a.sms{background:var(--teal);}
.biz-actions a.call{background:var(--ink);}
.example-note{font-size:12px; color:var(--muted); margin-top:10px;}

/* Pasos y bandas CTA */
.steps{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px;}
.step-num{width:36px; height:36px; border-radius:50%; background:var(--brand); color:#fff; font-weight:800; display:flex; align-items:center; justify-content:center; margin-bottom:12px;}
.cta-band{background:#EAF4F3; border:1px solid #CBE6E3; border-radius:var(--radius); padding:26px; text-align:center; margin-top:26px;}
.cta-band h3{font-size:20px; margin-bottom:6px;}
.cta-band p{color:var(--muted); margin-bottom:16px;}

/* Formularios */
.form-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:28px; box-shadow:var(--shadow);}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.field{display:flex; flex-direction:column; gap:6px;}
.field.full{grid-column:1 / -1;}
label{font-weight:600; font-size:14px;}
label .req{color:var(--brand);}
input, select, textarea{font:inherit; font-size:15px; padding:11px 13px; border:1px solid #D8DEE6; border-radius:10px; background:#fff; width:100%;}
textarea{resize:vertical; min-height:84px;}
.checks{display:flex; flex-direction:column; gap:8px;}
.check{display:flex; gap:10px; align-items:flex-start; font-size:14px; font-weight:400;}
.check input{width:auto; margin-top:3px;}
.check-group{display:flex; gap:14px; flex-wrap:wrap;}
.check-group .check{align-items:center;}
.form-msg{display:none; border-radius:10px; padding:14px 16px; margin-top:16px; font-size:15px;}
.form-msg.ok{display:block; background:#E7F6EE; border:1px solid #B7E4CB; color:#0C4A2A;}
.form-msg.err{display:block; background:#FDECEA; border:1px solid #F5C6C0; color:#7A1F16;}
.form-msg details{margin-top:8px;}
.form-msg pre{background:#fff; border:1px solid var(--line); border-radius:8px; padding:10px; font-size:12px; overflow:auto; max-height:220px;}
.consent-note{font-size:13px; color:var(--muted);}

/* Planes */
.plans{display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:16px;}
.plan{text-align:left;}
.plan .price{font-size:30px; font-weight:800; margin:6px 0;}
.plan .price small{font-size:14px; color:var(--muted); font-weight:600;}
.plan ul{list-style:none; margin-top:10px;}
.plan li{padding:5px 0; font-size:14px; color:var(--muted);}
.plan li::before{content:"✓ "; color:var(--ok); font-weight:800;}
.plan.featured{border:2px solid var(--brand);}

footer{border-top:1px solid var(--line); padding:34px 0 46px; margin-top:20px; color:var(--muted); font-size:14px;}
footer .cols{display:flex; gap:28px; flex-wrap:wrap; justify-content:space-between;}

@media (max-width:640px){
  .form-grid{grid-template-columns:1fr;}
  .nav-links a:not(.btn){display:none;}
  .hero{padding:38px 0 28px;}
}

/* ===== BANNERS (2026-10-23) ===== */
.banner-slot{position:relative;display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:linear-gradient(100deg,#FFF1E6,#FFE9D6 55%,#EAF4F3);padding:0;margin:22px 0;box-shadow:var(--shadow);min-height:150px}
.banner-slot.banner-live{background:#111827;color:#fff;border-color:#111827}
.banner-media{position:relative;flex:0 0 240px;align-self:stretch;min-height:150px;background:linear-gradient(135deg,var(--brand),#FF8A5B)}
.banner-tag{position:absolute;top:10px;left:10px;background:#FFF3D6;color:#7A5200;font-size:10px;font-weight:800;letter-spacing:.6px;padding:3px 8px;border-radius:6px;z-index:2}
.banner-body{flex:1;min-width:220px;padding:18px 6px}
.banner-sponsor{font-size:12px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--brand-dark)}
.banner-live .banner-sponsor{color:#FFD166}
.banner-body h3{font-size:21px;margin:4px 0}
.banner-body p{color:var(--muted);font-size:15px}
.banner-live .banner-body p{color:#D1D5DB}
.banner-cta{margin-right:18px;white-space:nowrap}
.banner-county-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:18px 0}
.county-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);text-decoration:none;color:inherit;display:block}
.county-card strong{font-size:17px}
.county-card span{display:block;color:var(--muted);font-size:14px;margin-top:4px}
.county-card em{font-style:normal;display:inline-block;margin-top:10px;background:var(--chip);color:var(--brand-dark);font-size:12px;font-weight:800;padding:3px 10px;border-radius:999px}
/* ===== LIVE ===== */
.live-badge{display:inline-flex;align-items:center;gap:7px;background:#DC2626;color:#fff;font-weight:800;font-size:13px;letter-spacing:.6px;padding:6px 12px;border-radius:999px}
.live-dot{width:9px;height:9px;border-radius:50%;background:#fff;animation:pulse 1.2s infinite}
@keyframes pulse{0%{opacity:1}50%{opacity:.3}100%{opacity:1}}
.live-player{position:relative;background:#000;border-radius:18px;overflow:hidden;aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;color:#fff;text-align:center}
.live-player h3{font-size:clamp(22px,4vw,34px);max-width:640px}
.live-sponsor-bar{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:#FFFBEB;border:2px solid #F59E0B;border-radius:14px;padding:14px 18px;margin:16px 0}
@media(max-width:640px){.banner-media{flex-basis:100%;min-height:90px}.banner-cta{margin:0 18px 18px}}

/* ===== EN VIVO: SUB-MARCA INSIGNIA (2026-10-23) =====
   Dentro del marketplace, pero NO una sección más:
   identidad propia oscura + rojo vivo, anfitrión con cara,
   y jerarquía #2 en la home, solo debajo del buscador. */
.nav-live{background:#DC2626;color:#fff!important;padding:8px 14px;border-radius:999px}
.live-masthead{background:linear-gradient(120deg,#0B1220 55%,#3B0A0A);color:#fff;border-radius:0 0 22px 22px;padding:38px 0 30px;margin-bottom:8px}
.live-masthead .wrap{position:relative}
.live-brand{font-size:clamp(30px,6vw,48px);font-weight:900;letter-spacing:-1px;line-height:1}
.live-brand em{font-style:normal;color:#F87171}
.live-tagline{color:#D1D5DB;font-size:18px;max-width:680px;margin-top:10px}
.live-home{background:linear-gradient(120deg,#0B1220 60%,#450A0A);color:#fff;border-radius:20px;padding:28px;margin:26px 0;box-shadow:0 12px 32px rgba(11,18,32,.28)}
.live-home h2{color:#fff;margin:10px 0 6px}
.live-home p{color:#D1D5DB;max-width:640px}
.host-card{display:flex;gap:16px;align-items:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:16px;margin-top:18px;flex-wrap:wrap}
.host-avatar{width:64px;height:64px;border-radius:50%;background:#DC2626;display:flex;align-items:center;justify-content:center;font-size:30px;flex:0 0 auto}
