/* 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 clamp(260px,33%,380px);align-self:stretch;min-height:160px;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:230px;padding:18px 10px}
.banner-sponsor{font-size:clamp(12px,1.05vw,14px);font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--brand-dark)}
.banner-live .banner-sponsor{color:#FFD166}
.banner-body h3{font-size:clamp(21px,2.15vw,29px);line-height:1.15;letter-spacing:-.4px;margin:6px 0}
.banner-body p{color:var(--muted);font-size:clamp(15px,1.25vw,17px);line-height:1.45}
.banner-live .banner-body p{color:#D1D5DB}
.banner-cta{margin-right:18px;white-space:nowrap;font-size:clamp(14px,1.15vw,16px);padding:13px 24px}
.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}

.logo-img{height:36px;width:auto;display:block}
.logo-foot{height:28px;width:auto}

.ic{width:1.15em;height:1.15em;vertical-align:-0.18em}
.ic-h{width:34px;height:34px;vertical-align:-7px;margin-right:8px}
.ic-chip{width:20px;height:20px;vertical-align:-4px;margin-right:6px}
.emoji-ic{width:52px;height:52px}
.biz-photo img{width:52px;height:52px}

.live-brand-img{height:64px;width:auto;margin-top:14px}
.emoji-ic-sq{width:52px;height:52px;border-radius:12px}

/* Distintivo de ficha destacada (plan VIP). Siempre identificado:
   pagar da posicion, no convierte a nadie en «el mejor». */
.badge-destacado{background:#FDECEA;color:#991B1B;font-weight:600;border:1px solid #F5B5AD;}

/* ===== ROTADOR DE BANNERS (2026-10-30) =====
   Varias piezas en el mismo espacio, sin GIF: pesa menos, cada patrocinador
   tiene su botón y se puede medir cuál funciona. */
.banner-slot.rotativo{display:block;padding:18px 18px 18px 0}
.banner-rot{display:grid}
.banner-pieza{grid-area:1/1;display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  opacity:0;transition:opacity .45s ease;pointer-events:none}
.banner-pieza.activa{opacity:1;pointer-events:auto}
.banner-pausa{position:absolute;right:8px;bottom:8px;z-index:3;width:26px;height:26px;border-radius:50%;
  border:1px solid var(--line);background:rgba(255,255,255,.86);color:var(--muted);font-size:9px;line-height:1;
  cursor:pointer;display:flex;align-items:center;justify-content:center}
.banner-pausa:hover{color:var(--ink,#1B2A41);border-color:var(--muted)}
@media (prefers-reduced-motion: reduce){.banner-pieza{transition:none}}

/* La caja de la imagen conserva la proporción de la pieza (4:1).
   Antes en móvil pedía 100% de ancho y 90px de alto: la imagen se salía del
   marco y el logo quedaba tapado por la etiqueta. */
@media(max-width:640px){
  .banner-slot.rotativo{padding:0}
  .banner-media{aspect-ratio:4/1;min-height:0}
  .banner-pausa{bottom:auto;top:8px;right:8px}
}

/* ===== MÓVIL (2026-10-30) =====
   El banner se apila: pieza arriba con su proporción 4:1, textos y botón
   debajo. Los márgenes del botón van dentro de la caja, sin padding extra en
   el contenedor: ese padding era lo que empujaba la página 18px a lo ancho. */
@media(max-width:640px){
  html,body{overflow-x:hidden;}
  .nav{flex-wrap:wrap;row-gap:8px;}
  .nav-links{gap:10px;justify-content:flex-end;}
  .nav-links .btn{font-size:13px;padding:9px 16px;white-space:nowrap;}
  .banner-slot.rotativo{padding:0;border-radius:calc(var(--radius) - 4px);}
  .banner-pieza{display:block;padding:0;}
  .banner-media{flex:none;width:100%;aspect-ratio:4/1;min-height:0;}
  .banner-body{padding:14px 18px 0;min-width:0;}
  .banner-cta{display:block;width:auto;margin:14px 18px 18px;text-align:center;}
}

/* ===== HUECO SIN PATROCINADOR, DIBUJADO CON CSS (2026-10-30) =====
   Donde no hay publicidad no se pone una imagen: se dibuja el hueco.
   Pesa cero, se adapta a cualquier pantalla, se traduce solo y lleva el logo.
   El marco punteado es lo que vende: se ve un espacio libre, no una pieza. */
.banner-media-casa{
  background:
    radial-gradient(circle at 82% 18%, rgba(228,87,46,.16) 0%, rgba(228,87,46,0) 58%),
    radial-gradient(circle at 12% 92%, rgba(14,124,123,.14) 0%, rgba(14,124,123,0) 55%),
    linear-gradient(160deg,#FFF9F4 0%,#FFF1E6 100%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  padding:16px 12px;
  box-shadow:inset 0 0 0 2px #F3D8C6, inset 0 0 0 6px #FFF9F4, inset 0 0 0 7px #F3D8C6;
}

.banner-media-casa .casa-logo{height:30px;width:auto;display:block;opacity:.95}
.banner-media-casa .casa-precio{font-size:12.5px;font-weight:700;color:#0A5F5E;background:#E6F2F1;border-radius:999px;padding:4px 11px;white-space:nowrap}
@media(max-width:640px){
  .banner-media-casa{aspect-ratio:auto;min-height:104px;gap:5px;padding:10px 8px}
  .banner-media-casa .casa-logo{height:17px}
  .banner-media-casa .casa-precio{font-size:10px}
}

/* ===== PIEZA DIBUJADA CON CSS, CON EL LOGO DEL PATROCINADOR (2026-10-30) =====
   Sustituye a la PNG de MKTANA: su logo es SVG (1,4 KB) y el resto es color.
   Pesa un 94 % menos que la imagen, se ve nítida en cualquier pantalla y no
   hace falta generar una versión móvil aparte. */
.banner-media-arte{background:radial-gradient(circle at 78% 22%, rgba(61,157,242,.22) 0%, rgba(61,157,242,0) 60%),radial-gradient(circle at 18% 88%, rgba(255,208,0,.30) 0%, rgba(255,208,0,0) 58%),linear-gradient(155deg,#F4F7FB 0%,#E8F0FA 100%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:20px 10px}
.banner-media-arte .arte-logo{width:100%;max-width:360px;height:auto;display:block}
.banner-media-arte .arte-lema{font-size:14px;font-weight:800;letter-spacing:-.2px;color:#0F2E57;background:#FFD000;border-radius:6px;padding:5px 13px;white-space:nowrap}
@media(max-width:640px){
  .banner-media-arte{aspect-ratio:auto;min-height:96px;gap:6px;padding:10px 8px}
  .banner-media-arte .arte-logo{width:70%;max-width:300px}
  .banner-media-arte .arte-lema{font-size:10px;padding:2px 6px}
}

/* ===== MÓVIL: aire para la etiqueta (2026-10-30) =====
   Sin este relleno arriba, «PATROCINADO» se dibujaba sobre el logo del
   patrocinador: en el hueco de la casa tapaba el símbolo de CercaYa y en la
   pieza de MKTANA se comía el icono azul. */
@media(max-width:640px){
  .banner-tag{font-size:9px;letter-spacing:.4px;padding:2px 6px;top:6px;left:6px}
  .banner-media-arte,
  .banner-media-casa{padding-top:30px;min-height:126px;justify-content:flex-start}
  .banner-media-arte .arte-logo{width:80%;max-width:260px}
  .banner-media-arte .arte-lema{font-size:11px;padding:3px 9px}
  .banner-media-casa .casa-logo{height:26px}
  .banner-media-casa .casa-precio{font-size:11px;padding:3px 9px}
}

/* ===== TEXTO DEL BANNER EN MÓVIL =====
   En pantalla estrecha el titular va debajo de la pieza, así que puede
   crecer más: es lo único que compite por la atención. */
@media(max-width:640px){
  .banner-body{padding:16px 18px 0}
  .banner-body h3{font-size:23px;letter-spacing:-.5px}
  .banner-body p{font-size:15.5px}
  .banner-cta{font-size:15.5px;padding:14px 20px}
}

/* La pieza ocupa su caja: en móvil el logo pasa de 260 a 320 px de ancho y el
   lema sube a 13 px, para que no quede aire muerto dentro del espacio. */
@media(max-width:640px){
  .banner-media-arte{padding:26px 10px 14px;min-height:132px;gap:8px}
  .banner-media-arte .arte-logo{width:100%;max-width:320px}
  .banner-media-arte .arte-lema{font-size:13px;padding:4px 12px}
}

/* ===== LA PIEZA SE AJUSTA SOLA A SU CAJA (2026-10-30) =====
   Regla única para cualquier tamaño: la caja tiene el margen y el contenido
   se encoge o crece hasta llenarla, conservando la proporción del logo.
   Se acabaron los tamaños fijos por punto de ruptura. */
.banner-media-arte,.banner-media-casa{display:block;position:relative;padding:0}
.caja-pieza{
  position:absolute;inset:18px 14px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:9px;min-height:0;
}
.caja-pieza .arte-logo{
  width:auto;height:auto;
  max-width:100%;max-height:100%;
  flex:0 1 auto;min-height:0;
  object-fit:contain;
}
.caja-pieza .casa-logo{
  width:auto;height:auto;
  max-width:92%;max-height:100%;
  flex:0 1 auto;min-height:0;
  object-fit:contain;
}
/* La etiqueta va por encima de la caja, así nunca pisa el logo */
.banner-media-arte .caja-pieza,.banner-media-casa .caja-pieza{inset:30px 14px 14px}

@media(max-width:640px){
  .caja-pieza{inset:26px 12px 14px;gap:8px}
  /* El alto manda: con 120 px el lema se comía la mitad y el logo quedaba en
     176 px de ancho. Con 168 px el logo llena la caja y el lema cabe debajo. */
  .banner-media-arte{min-height:168px}
  .banner-media-casa{min-height:150px}
}
/* ===== PIEZA DE TEXTO DEL PATROCINADOR + HUECO DE LA CASA (2026-10-30) =====
   El patrocinador va sin logo: su nombre en texto grande sobre el color de su
   marca, llenando la caja. El hueco de la casa prioriza el mensaje de venta y
   el precio; CercaYa queda como firma pequeña abajo. */

.banner-media-arte .arte-nombre{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:clamp(26px,3.4vw,44px);
  font-weight:800;letter-spacing:-1.5px;line-height:1;
  color:#0F2E57;text-transform:uppercase;
}

.banner-media-casa .casa-titulo{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:clamp(19px,2.4vw,30px);
  font-weight:800;letter-spacing:-.8px;line-height:1.05;
  color:#8A3A16;text-align:center;
  text-transform:uppercase;
}

.banner-media-casa .casa-precio{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:clamp(13px,1.5vw,17px);
  font-weight:700;color:#0A5F5E;background:#E6F2F1;
  border-radius:999px;padding:5px 14px;white-space:nowrap;
}

/* CercaYa abajo y pequeño: firma, no protagonista */
.banner-media-casa .casa-firma{margin-top:auto;padding-top:6px}
.banner-media-casa .casa-firma img{height:15px;width:auto;display:block;opacity:.75}

/* La caja se reparte: mensaje arriba, firma abajo */
.banner-media-casa .caja-pieza{justify-content:space-between;align-items:center}

@media(max-width:640px){
  .banner-media-arte .arte-nombre{font-size:clamp(30px,9vw,42px)}
  .banner-media-casa .casa-titulo{font-size:22px}
  .banner-media-casa .casa-precio{font-size:13px;padding:4px 12px}
  .banner-media-casa .casa-firma img{height:13px}
}
/* ===== TEXTO QUE SE AJUSTA SOLO AL ANCHO DE SU CAJA (2026-10-30) =====
   El nombre del patrocinador y el titular del hueco se dibujan en un SVG con
   textLength igual al ancho del viewBox. Al poner el svg a width:100 %, el
   texto ocupa SIEMPRE el ancho completo: no quedan franjas vacías a los lados
   y no hay tamaños que ajustar por pantalla. */

.arte-nombre-svg,
.casa-titulo-svg{display:block;width:100%;height:auto;overflow:visible}

.casa-titulo-wrap{width:100%;padding:0 2px}

/* el lema y el precio se quedan como estaban, pero centrados bajo el nombre */
.banner-media-arte .arte-lema,
.banner-media-casa .casa-precio{max-width:100%}