/* e2.css — estilos del rediseño (index.php, anuncios.php) */
/* Paleta del logo de ECOS: AZUL para fondos (encabezado, bloques), ROJO #c1272d para botones de acción, AMARILLO para destacados.
   REGLA: rojo (--e2-verde, nombre heredado) SOLO en botones de acción; azul (--e2-enlace) en íconos, enlaces, etiquetas y paginación. */
:root { --e2-verde:#c1272d; --e2-verde-osc:#9e1c22; --e2-oscuro:#0b2a4a; --e2-azul:#1f6fb5; --e2-azul-osc:#0b2a4a; --e2-enlace:#1f5aa6; --e2-enlace-osc:#17457f; --e2-texto:#2b2b2b; --e2-gris:#6e6e6e; --e2-borde:#e6e6e6; --e2-fondo:#f6f7f8; --e2-wa:#25d366; }
body.e2 { background:#fff; color:var(--e2-texto); }
.e2 section { padding:32px 0; }
.e2-sec-head { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:16px; gap:12px; }
.e2-sec-head h2 { font-size:1.4rem; font-weight:700; margin:0; }
.e2-sec-head a { color:var(--e2-enlace); font-weight:600; white-space:nowrap; }

/* Hero */
/* Encabezado azul (azul del logo de ECOS), fijo. */
.e2-hero { background:linear-gradient(135deg,#0b2a4a 0%,#1f6fb5 60%,#3f93d6 100%); color:#fff; position:relative; overflow:hidden; padding:40px 0 28px !important; }
.e2-hero > .container { position:relative; z-index:1; }
/* Torres de Satélite dibujadas a lápiz blanco */
.e2-torres { position:absolute; right:0; bottom:0; height:100%; min-height:150px; width:min(62vw, 720px); opacity:.34; pointer-events:none; }
.e2-torres path { fill:none; stroke:#fff; stroke-linecap:round; stroke-linejoin:round; }
.e2-t-trazo path { stroke-width:1.6; stroke-dasharray:900; stroke-dashoffset:900; animation:e2-dibujar 2.8s ease-out .2s forwards; }
.e2-t-trazo--2 path { stroke-width:.8; stroke-opacity:.6; animation-delay:.6s; }
.e2-t-sombra path { stroke:none; opacity:0; animation:e2-aparecer 1.2s ease-out 2.2s forwards; }
.e2-t-rayasD { fill:url(#e2-cimbra) !important; }
.e2-t-rayasI { fill:url(#e2-cimbra-suave) !important; }
.e2-t-suelo { stroke-width:1.3; stroke-dasharray:500; stroke-dashoffset:500; animation:e2-dibujar 2s ease-out forwards; }
.e2-t-via { stroke-width:1.2; stroke-opacity:.85; }
.e2-t-via--2 { stroke-opacity:.6; }
.e2-t-carril { stroke-width:.8; stroke-opacity:.5; stroke-dasharray:10 9; }
.e2-auto { stroke-width:2; stroke-opacity:.9; stroke-dasharray:26 620; animation:e2-pasar 4.5s linear infinite; }
.e2-auto--2 { animation-duration:6s; animation-delay:-2s; stroke-dasharray:18 640; }
.e2-auto--3 { animation-duration:5.2s; animation-delay:-3.5s; animation-direction:reverse; }
@keyframes e2-dibujar { to { stroke-dashoffset:0; } }
@keyframes e2-aparecer { to { opacity:.7; } }
@keyframes e2-pasar { from { stroke-dashoffset:646; } to { stroke-dashoffset:0; } }
@media (max-width: 767px) { .e2-torres { width:100%; opacity:.14; } }
@media (prefers-reduced-motion: reduce) {
  .e2-torres * { animation:none !important; }
  .e2-t-trazo path, .e2-t-suelo { stroke-dashoffset:0; }
  .e2-t-sombra path { opacity:.7; }
  .e2-t-autos { display:none; }
}
.e2-hero h1 { font-size:1.9rem; font-weight:800; line-height:1.2; margin:0 0 6px; color:#fff; }
.e2-hero p.lead { font-size:1rem; color:#dbe9f7; margin-bottom:18px; }
.e2-search { display:flex; flex-wrap:wrap; gap:8px; background:#fff; padding:8px; border-radius:12px; box-shadow:0 6px 24px rgba(0,0,0,.18); }
.e2-search input, .e2-search select { border:0; font-size:1rem; padding:10px 12px; border-radius:8px; background:#f3f4f5; color:#222; }
.e2-search input { flex:1 1 220px; min-width:0; }
.e2-search select { flex:0 1 200px; }
.e2-search button { flex:0 0 auto; border:0; background:var(--e2-verde); color:#fff; font-weight:700; padding:10px 22px; border-radius:8px; }
.e2-search button:hover { background:var(--e2-verde-osc); }
.e2-activos { margin-top:12px; font-size:.95rem; color:#dbe9f7; }
.e2-activos strong { font-size:1.1rem; }

/* Chips de categorías */
.e2-chips { display:flex; gap:10px; overflow-x:auto; padding:4px 2px 10px; scrollbar-width:thin; -webkit-overflow-scrolling:touch; }
.e2-chip { flex:0 0 auto; display:flex; align-items:center; gap:8px; min-height:44px; padding:10px 14px; border:1px solid var(--e2-borde); border-radius:999px; background:#fff; color:var(--e2-texto); font-weight:600; font-size:.95rem; }
.e2-chip i { color:var(--e2-enlace); }
.e2-chip small { color:var(--e2-gris); font-weight:500; }
.e2-chip:hover { border-color:var(--e2-enlace); text-decoration:none; color:var(--e2-texto); }

/* Grid y tarjetas */
.e2-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:18px; }
.e2-rail { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(250px,300px); /* tope: un solo destacado no se estira a todo el ancho */ gap:16px; overflow-x:auto; padding-bottom:10px; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; }
.e2-rail .e2-card { scroll-snap-align:start; }
.e2-card { display:flex; flex-direction:column; background:#fff; border:1px solid var(--e2-borde); border-radius:12px; overflow:hidden; transition:box-shadow .15s; }
.e2-card:hover { box-shadow:0 6px 20px rgba(0,0,0,.08); }
.e2-card--dest { border-color:#f5b400; }
.e2-card__img { position:relative; display:block; aspect-ratio:16/9; min-height:0; overflow:hidden; background:#eee; }
.e2-card__img img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; display:block; } /* absoluta: la foto nunca agranda la tarjeta */
/* Imagen del anuncio impreso (tira con texto): se muestra completa, sin recortar los lados */
.e2-card__img--impreso { background:#fff; border-bottom:1px solid var(--e2-borde); }
.e2-card__img--impreso img { object-fit:contain; }
.e2-badge { position:absolute; top:10px; left:10px; background:#f5b400; color:#222; font-size:.75rem; font-weight:700; padding:3px 8px; border-radius:6px; }
/* Anuncio sin foto: etiqueta delgada con ícono de la categoría (sustituye al "Sin imagen disponible").
   Discreta a propósito: la mayoría de los anuncios no tiene foto y una franja gruesa saturaba la página. */
.e2-ph { --ph:#1f5aa6; display:flex; align-items:center; gap:8px; padding:12px 16px 0; color:var(--ph); font-weight:800; font-size:.74rem; text-transform:uppercase; letter-spacing:.05em; border-top:3px solid var(--ph); background:#fff; }
.e2-ph:hover { text-decoration:none; color:var(--ph); }
.e2-ph i { width:26px; height:26px; border-radius:50%; background:var(--ph); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:.8rem; }
.e2-ph .e2-badge { white-space:nowrap; text-transform:none; letter-spacing:0; }
.e2-ph .e2-badge i { width:auto; height:auto; background:none; color:inherit; font-size:.75rem; }
.e2-card__body { display:flex; flex-direction:column; gap:6px; padding:12px 14px 14px; flex:1; }
.e2-card__cat { font-size:.75rem; text-transform:uppercase; letter-spacing:.04em; color:var(--e2-enlace); font-weight:700; }
.e2-card__title { font-size:1.05rem; font-weight:700; line-height:1.3; margin:0; }
.e2-card__title a { color:var(--e2-texto); }
.e2-card__price { font-size:1.1rem; font-weight:800; color:var(--e2-texto); }
.e2-card__text { font-size:.9rem; color:var(--e2-gris); margin:0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.e2-card__actions { display:flex; gap:8px; margin-top:auto; padding-top:8px; }
.e2-btn { flex:1; display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:44px; text-align:center; padding:8px 10px; border-radius:8px; font-weight:700; font-size:.9rem; }
.e2-btn--wa { background:var(--e2-wa); color:#fff !important; }
.e2-btn--tel { background:#f0f2f3; color:var(--e2-texto) !important; }
.e2-btn:hover { text-decoration:none; filter:brightness(.95); }
.e2-vacio { padding:24px; text-align:center; color:var(--e2-gris); background:var(--e2-fondo); border-radius:12px; }

/* Edición impresa + noticias */
.e2-gris { background:var(--e2-fondo); }
.e2-edicion { display:flex; gap:18px; align-items:center; background:#fff; border:1px solid var(--e2-borde); border-radius:12px; padding:16px; }
.e2-edicion img { width:120px; height:auto; border-radius:6px; box-shadow:0 2px 10px rgba(0,0,0,.15); }
.e2-edicion h3 { font-size:1.15rem; font-weight:700; margin:0 0 4px; }
.e2-noticia { display:flex; gap:12px; align-items:center; padding:10px 0; border-bottom:1px solid var(--e2-borde); color:var(--e2-texto); }
.e2-noticia:last-child { border-bottom:0; }
.e2-noticia img { width:88px; height:64px; object-fit:cover; border-radius:8px; flex:0 0 auto; background:#eee; }
.e2-noticia span { font-weight:600; line-height:1.3; }
.e2-noticia:hover { text-decoration:none; color:var(--e2-enlace); }

/* Anunciantes */
.e2-cta { background:var(--e2-oscuro); color:#fff; border-radius:16px; padding:28px; }
.e2-cta h2 { color:#fff; font-weight:800; font-size:1.5rem; }
.e2-cta p, .e2-paso { color:#e6e6e6; }
.e2-pasos { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; margin:18px 0; }
.e2-paso { background:rgba(255,255,255,.08); border-radius:12px; padding:14px; }
.e2-paso b { display:inline-flex; width:28px; height:28px; border-radius:50%; background:#f2b61b; color:#2b2b2b; align-items:center; justify-content:center; margin-right:6px; }
.e2-btn-lg { display:inline-block; padding:12px 22px; border-radius:10px; font-weight:800; margin:4px 8px 4px 0; }
.e2-btn-lg--verde { background:var(--e2-verde); color:#fff !important; }
.e2-btn-lg--borde { border:2px solid #fff; color:#fff !important; }
.e2-btn-lg--wa { background:var(--e2-wa); color:#fff !important; }
.e2-paso i { color:#f2c230; margin-right:4px; }
.e2-paso b, .e2-paso strong { color:#fff !important; font-weight:800; font-size:1rem; }
.e2-paso .e2-paso__titulo { display:inline; width:auto; height:auto; background:none; margin:0; border-radius:0; }   /* título de cada opción: blanco y en negritas sobre el azul */
.e2-btn-lg:hover { text-decoration:none; filter:brightness(1.05); }

/* Contacto */
.e2-contacto { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
.e2-contacto div { background:var(--e2-fondo); border-radius:12px; padding:16px; }
.e2-contacto h3 { font-size:1rem; font-weight:700; margin:0 0 6px; }
.e2-contacto i { color:var(--e2-enlace); margin-right:6px; }
.e2-contacto a { color:var(--e2-enlace); }

/* Preguntas frecuentes */
.e2-faq details { border:1px solid var(--e2-borde); border-radius:12px; margin-bottom:10px; background:#fff; }
.e2-faq summary { list-style:none; cursor:pointer; padding:14px 44px 14px 16px; position:relative; min-height:48px; }
.e2-faq summary::-webkit-details-marker { display:none; }
.e2-faq summary::after { content:"+"; position:absolute; right:16px; top:50%; transform:translateY(-50%); font-size:1.4rem; color:var(--e2-enlace); font-weight:700; }
.e2-faq details[open] summary::after { content:"−"; }
.e2-faq summary h3 { display:inline; font-size:1rem; font-weight:700; margin:0; }
.e2-faq details p { padding:0 16px 14px; margin:0; color:#444; }

/* Botón fijo en móvil */
.e2-fab { display:none; }
@media (max-width: 767px) {
  .e2 section { padding:24px 0; }
  .e2-hero h1 { font-size:1.5rem; }
  .e2-search select, .e2-search button { flex:1 1 100%; }
  .e2-edicion img { width:90px; }
  .e2-fab { display:block; position:fixed; left:16px; right:16px; bottom:12px; z-index:1050; text-align:center; background:var(--e2-verde); color:#fff !important; font-weight:800; padding:14px; border-radius:12px; box-shadow:0 6px 20px rgba(0,0,0,.25); }
  .e2-fab:hover { text-decoration:none; }
  /* Espacio para el botón flotante, del mismo color que la barra inferior del footer (no blanco) */
  .e2 .bottom-bar { padding-bottom:70px; }
}
/* actualizado 2026-09-30 (forzar subida) */