/*
Theme Name: Limpiezas Especiales (Astra child)
Template: astra
Version: 1.0.0
Description: Tema hijo de Astra para limpiezasindromediogenes.com. Cabecera, pie y estilos propios; el contenido (WPBakery) no cambia. Vive en el repositorio zipwp-mcp-webs.
*/

:root {
	--lsd-oscuro: #13293d;
	--lsd-oscuro-2: #1d3b55;
	--lsd-rojo: #c62828;
	--lsd-rojo-2: #a51f1f;
	--lsd-fondo: #f5f7f9;
	--lsd-texto: #1f2933;
	--lsd-suave: #5b6b7a;
	--lsd-borde: #e3e8ee;
	--lsd-radio: 10px;
	--lsd-ancho: 1180px;
	--lsd-lectura: 820px;
}

/* ---------- Base ---------- */
body { background: #fff; color: var(--lsd-texto); font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 17px; line-height: 1.7; overflow-x: hidden; }
h1, h2, h3, h4 { color: var(--lsd-oscuro); font-family: "Inter", system-ui, sans-serif; font-weight: 700; line-height: 1.25; letter-spacing: -0.01em; overflow-wrap: anywhere; }
.entry-content h1 { font-size: clamp(28px, 4.2vw, 42px); margin: 0 0 .6em; }
.entry-content h2 { font-size: clamp(22px, 2.8vw, 30px); margin: 1.6em 0 .6em; padding-top: .2em; }
.entry-content h3 { font-size: clamp(18px, 2vw, 21px); margin: 1.3em 0 .4em; }
a { color: var(--lsd-rojo); }
a:hover { color: var(--lsd-rojo-2); }
img { max-width: 100%; height: auto; }
.entry-content * { max-width: 100%; }
.entry-content table { display: block; overflow-x: auto; }
.entry-content ul li::marker { color: var(--lsd-rojo); }

/* Una sola columna de lectura, sin lateral */
.ast-container { max-width: var(--lsd-ancho); }
.single .site-content .ast-container, .page .site-content .ast-container { max-width: var(--lsd-lectura); }
#secondary { display: none; }
#primary { width: 100% !important; margin: 0 !important; }
.site-content { padding-top: 32px; }

/* Por si algun ajuste de Astra vuelve a poner la caja o el autor y la fecha */
.single .entry-meta, .single .ast-single-post-meta { display: none !important; }
.ast-separate-container .ast-article-single { background: transparent; padding: 0; }
.ast-separate-container, .ast-separate-container #primary { background: #fff; }

/* WPBakery: sin margenes raros dentro de la columna */
.entry-content .vc_row { margin-left: 0 !important; margin-right: 0 !important; }
.entry-content .wpb_column { padding-left: 0 !important; padding-right: 0 !important; }
.entry-content .vc_btn3, .entry-content .vc_cta3 { border-radius: var(--lsd-radio) !important; }

/* Indice (Easy TOC) */
#ez-toc-container { background: var(--lsd-fondo) !important; border: 1px solid var(--lsd-borde) !important; border-radius: var(--lsd-radio); padding: 14px 18px !important; width: 100% !important; box-shadow: none !important; }
#ez-toc-container .ez-toc-title { font-weight: 700; color: var(--lsd-oscuro); font-size: 16px; }
#ez-toc-container a { color: var(--lsd-oscuro-2); }

/* ---------- Cabecera ---------- */
.lsd-top { background: var(--lsd-oscuro); color: #dfe7ee; font-size: 14px; }
.lsd-top .lsd-in { display: flex; justify-content: space-between; gap: 12px; padding: 7px 20px; }
.lsd-top a { color: #fff; font-weight: 600; text-decoration: none; }
/* NO fija: Google Auto Ads mete un anuncio de 280 px DENTRO de la cabecera (tras .lsd-in), y con
   position:sticky se quedaba pegado arriba tapando la pagina, que AdSense no permite. En la copia de
   pruebas no se vio porque AdSense no sirve en ese subdominio. El movil conserva la barra fija de abajo. */
.lsd-cab { background: #fff; border-bottom: 1px solid var(--lsd-borde); position: relative; z-index: 999; }
.lsd-in { max-width: var(--lsd-ancho); margin: 0 auto; }
.lsd-cab .lsd-in { display: flex; align-items: center; gap: 24px; padding: 10px 20px; }
.lsd-logo img { height: 54px; width: auto; display: block; }
.lsd-nav { margin-left: auto; }
.lsd-nav ul { list-style: none; margin: 0; padding: 0; }
.lsd-menu { display: flex; gap: 2px; align-items: center; }
.lsd-menu > li { position: relative; }
.lsd-nav a, .lsd-desp-btn { display: block; padding: 8px 12px; color: var(--lsd-oscuro); font-weight: 600; font-size: 15px; text-decoration: none; border-radius: 8px; background: none; border: 0; cursor: pointer; font-family: inherit; line-height: 1.4; }
.lsd-nav a:hover, .lsd-desp-btn:hover, .lsd-nav .current-menu-item > a { background: var(--lsd-fondo); color: var(--lsd-rojo); }
.lsd-desp-btn span { font-size: 11px; opacity: .7; }
/* Astra pinta TODOS los botones (fondo azul, letra grande): se anula solo en los del menu */
.lsd-cab .lsd-desp-btn, .lsd-cab .lsd-burger { background: none !important; color: var(--lsd-oscuro) !important; box-shadow: none !important; text-transform: none !important; letter-spacing: 0 !important; min-height: 0 !important; }
.lsd-cab .lsd-desp-btn { font-size: 15px !important; font-weight: 600 !important; padding: 8px 12px !important; border: 0 !important; border-radius: 8px !important; line-height: 1.4 !important; }
.lsd-cab .lsd-desp-btn:hover, .lsd-cab .lsd-desp.abierto > .lsd-desp-btn { background: var(--lsd-fondo) !important; color: var(--lsd-rojo) !important; }
.lsd-cab .lsd-burger { font-size: 15px !important; padding: 8px 12px !important; border: 1px solid var(--lsd-borde) !important; border-radius: 8px !important; }
.lsd-logo { flex-shrink: 0; }
.lsd-logo img { max-width: none; }
/* Desplegables: se abren al pasar el raton en escritorio y al pulsar en movil */
.lsd-submenu { display: none; position: absolute; top: 100%; left: 0; min-width: 270px; background: #fff; border: 1px solid var(--lsd-borde); border-radius: var(--lsd-radio); box-shadow: 0 12px 30px rgba(19,41,61,.14); padding: 8px; z-index: 1000; }
.lsd-desp:hover > .lsd-submenu, .lsd-desp:focus-within > .lsd-submenu, .lsd-desp.abierto > .lsd-submenu { display: block; }
.lsd-submenu a { font-weight: 500; font-size: 15px; padding: 7px 12px; }
.lsd-submenu .lsd-grupo { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--lsd-suave); padding: 10px 12px 4px; }
.lsd-dos > .lsd-submenu { min-width: 420px; columns: 2; column-gap: 8px; }
.lsd-dos > .lsd-submenu li { break-inside: avoid; }
.lsd-dos > .lsd-submenu .lsd-grupo:not(:first-child) { break-before: column; }
.lsd-btn { display: inline-flex; align-items: center; gap: 8px; background: var(--lsd-rojo); color: #fff !important; font-weight: 700; padding: 11px 18px; border-radius: 999px; text-decoration: none; white-space: nowrap; line-height: 1; border: 0; }
.lsd-btn:hover { background: var(--lsd-rojo-2); }
.lsd-btn.lsd-claro { background: #fff; color: var(--lsd-oscuro) !important; }
.lsd-btn.lsd-claro:hover { background: var(--lsd-fondo); }
.lsd-burger { display: none; margin-left: auto; background: none; border: 1px solid var(--lsd-borde); border-radius: 8px; padding: 8px 10px; font-size: 15px; color: var(--lsd-oscuro); }

/* ---------- Portada: franja de entrada ---------- */
.lsd-hero { background: linear-gradient(120deg, rgba(19,41,61,.93), rgba(29,59,85,.84)), var(--lsd-hero-img, none) center/cover no-repeat; color: #fff; }
.lsd-hero .lsd-in { padding: 54px 20px 50px; }
.lsd-hero .lsd-eti { display: inline-block; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); border-radius: 999px; padding: 4px 12px; font-size: 13px; letter-spacing: .03em; margin-bottom: 14px; }
.lsd-hero .lsd-gran { font-size: clamp(26px, 4vw, 44px); font-weight: 800; line-height: 1.15; max-width: 760px; margin: 0 0 14px; color: #fff; }
.lsd-hero .lsd-sub { font-size: 18px; max-width: 640px; color: #dfe7ee; margin: 0 0 22px; }
.lsd-hero .lsd-acc { display: flex; gap: 12px; flex-wrap: wrap; }
.lsd-hero ul { list-style: none; padding: 0; margin: 24px 0 0; display: flex; gap: 22px; flex-wrap: wrap; font-size: 15px; color: #dfe7ee; }
.lsd-hero li::before { content: "✓ "; color: #7fd1a8; font-weight: 700; }
/* Franja de las paginas de zona: el H1 de la pagina va aqui */
.lsd-hero-zona .lsd-in { padding: 46px 20px 44px; }
.lsd-hero h1.lsd-gran { color: #fff; font-size: clamp(26px, 3.6vw, 40px); margin: 0 0 12px; }
.lsd-hero-zona + .site-content, .lsd-hero-zona ~ #content { padding-top: 24px; }

/* ---------- Quienes somos: equipo, cuatro tarjetas iguales ---------- */
.lsd-equipo { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin: 24px 0 36px; }
.lsd-persona { margin: 0; background: #fff; border: 1px solid var(--lsd-borde); border-radius: var(--lsd-radio); overflow: hidden; box-shadow: 0 6px 18px rgba(19,41,61,.06); text-align: center; }
.lsd-persona img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; display: block; }
.lsd-persona figcaption { padding: 14px 12px 16px; display: flex; flex-direction: column; gap: 3px; }
.lsd-persona strong { color: var(--lsd-oscuro); font-size: 17px; }
.lsd-persona span { color: var(--lsd-rojo); font-weight: 600; font-size: 14px; }
.lsd-persona small { color: var(--lsd-suave); font-size: 13px; line-height: 1.4; }
@media (max-width: 921px) { .lsd-equipo { grid-template-columns: repeat(2, 1fr); } }

/* ---------- Pie ---------- */
.lsd-pie { background: var(--lsd-oscuro); color: #c9d4de; font-size: 15px; margin-top: 56px; }
.lsd-pie .lsd-in { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 32px; padding: 44px 20px 28px; }
.lsd-pie h3 { color: #fff; font-size: 16px; margin: 0 0 12px; }
.lsd-pie ul { list-style: none; margin: 0; padding: 0; }
.lsd-pie li { margin: 0 0 7px; }
.lsd-pie a { color: #c9d4de; text-decoration: none; }
.lsd-pie a:hover { color: #fff; }
.lsd-pie .lsd-tel { color: #fff; font-weight: 700; font-size: 18px; }
.lsd-pie img { height: 46px; width: auto; background: #fff; border-radius: 6px; padding: 4px; margin-bottom: 12px; }
.lsd-legal { border-top: 1px solid rgba(255,255,255,.12); }
.lsd-legal .lsd-in { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 16px 20px 22px; font-size: 13px; color: #9fb0bf; }
.lsd-legal a { color: #9fb0bf; }

/* ---------- Barra fija de llamada (movil) ---------- */
.lsd-barra { display: none; }

/* Con siete opciones y el boton de llamar, el menu de escritorio no cabe por debajo de ~1200 px */
@media (max-width: 1199px) {
	.lsd-burger { display: block; }
	.lsd-cab .lsd-btn { display: none; }
	.lsd-nav { display: none; width: 100%; margin: 0; max-height: 75vh; overflow-y: auto; }
	.lsd-cab.abierto .lsd-nav { display: block; }
	.lsd-cab .lsd-in { flex-wrap: wrap; gap: 10px; }
	.lsd-menu { flex-direction: column; align-items: stretch; padding: 6px 0 10px; }
	.lsd-desp-btn { width: 100%; text-align: left; }
	.lsd-submenu, .lsd-dos > .lsd-submenu { position: static; box-shadow: none; border: 0; min-width: 0; columns: 1; padding: 0 0 6px 12px; }
	.lsd-desp:hover > .lsd-submenu { display: none; }
	.lsd-desp.abierto > .lsd-submenu { display: block; }
	.lsd-dos > .lsd-submenu .lsd-grupo:not(:first-child) { break-before: auto; }
}
@media (max-width: 921px) {
	body { font-size: 16px; }
	.lsd-logo img { height: 44px; }
	.lsd-top .lsd-in span:first-child { display: none; }
	.lsd-hero .lsd-in { padding: 36px 18px; }
	.lsd-pie .lsd-in { grid-template-columns: 1fr 1fr; }
	.site-content { padding-top: 18px; }
	.ast-container { padding-left: 18px !important; padding-right: 18px !important; }
	.lsd-barra { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999; background: #fff; border-top: 1px solid var(--lsd-borde); padding: 8px 10px; gap: 8px; box-shadow: 0 -4px 16px rgba(0,0,0,.08); }
	.lsd-barra .lsd-btn { flex: 1; justify-content: center; padding: 13px 10px; }
	body { padding-bottom: 66px; }
}
@media (max-width: 560px) {
	.lsd-pie .lsd-in { grid-template-columns: 1fr; }
}

/* =====================================================================================
   FRANJA DE ENTRADA CON LA MISMA ALTURA EN TODAS LAS PAGINAS (pedido del usuario).
   El contenido va centrado en vertical; la altura no depende de lo largo que sea el H1.
   ===================================================================================== */
.lsd-hero .lsd-in, .lsd-hero-zona .lsd-in { min-height: 460px; display: flex; flex-direction: column; justify-content: center; padding-top: 40px; padding-bottom: 40px; }
@media (max-width: 921px) { .lsd-hero .lsd-in, .lsd-hero-zona .lsd-in { min-height: 560px; } }

/* =====================================================================================
   MAS DISEÑO DENTRO DEL CONTENIDO: tarjetas, bandas de llamada, zonas, listas y FAQ.
   ===================================================================================== */
.single .site-content .ast-container, .page .site-content .ast-container { max-width: 900px; }
.entry-content h2 { position: relative; padding-left: 16px; }
.entry-content h2::before { content: ""; position: absolute; left: 0; top: .25em; bottom: .25em; width: 5px; border-radius: 3px; background: var(--lsd-rojo); }
.entry-content > ul, .entry-content .wpb_wrapper > ul { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; margin: 18px 0 26px; }
.entry-content > ul > li, .entry-content .wpb_wrapper > ul > li { background: var(--lsd-fondo); border: 1px solid var(--lsd-borde); border-radius: var(--lsd-radio); padding: 12px 14px 12px 40px; position: relative; margin: 0; line-height: 1.5; }
.entry-content > ul > li::before, .entry-content .wpb_wrapper > ul > li::before { content: "✓"; position: absolute; left: 14px; top: 11px; color: #fff; background: var(--lsd-rojo); width: 18px; height: 18px; border-radius: 50%; font-size: 11px; line-height: 18px; text-align: center; font-weight: 700; }
.entry-content h3 { margin-top: 1.4em; }
.entry-content h3 + p { background: #fff; border-left: 3px solid var(--lsd-borde); padding: 2px 0 2px 14px; }
.lsd-figura { margin: 26px 0 30px; }
.lsd-figura img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 14px; box-shadow: 0 14px 34px rgba(19,41,61,.16); display: block; }

.lsd-bloque { margin: 34px 0; }
.lsd-bloque-tit { font-size: 22px; font-weight: 800; color: var(--lsd-oscuro); margin: 0 0 14px; letter-spacing: -.01em; }
.lsd-rejilla { display: grid; gap: 14px; }
.lsd-r4 { grid-template-columns: repeat(4, 1fr); }
.lsd-r3 { grid-template-columns: repeat(3, 1fr); }
.lsd-tarjeta { background: #fff; border: 1px solid var(--lsd-borde); border-radius: 14px; padding: 18px 16px; box-shadow: 0 6px 18px rgba(19,41,61,.06); display: flex; flex-direction: column; gap: 6px; }
.lsd-tarjeta strong { color: var(--lsd-oscuro); font-size: 16px; line-height: 1.3; }
.lsd-tarjeta p { margin: 0; font-size: 14.5px; line-height: 1.55; color: var(--lsd-suave); }
.lsd-ico { width: 46px; height: 46px; border-radius: 12px; background: rgba(198,40,40,.1); color: var(--lsd-rojo); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 4px; }
.lsd-tarjeta-enlace { text-decoration: none !important; transition: transform .15s, box-shadow .15s; }
.lsd-tarjeta-enlace:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(19,41,61,.12); }
.lsd-mas { margin-top: auto; color: var(--lsd-rojo); font-weight: 700; font-size: 14px; }
.lsd-cta { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; background: linear-gradient(120deg, #fff4f4, #ffffff); border: 1px solid #f3d4d4; border-radius: 16px; padding: 22px 24px; }
.lsd-cta-tit { font-size: 21px; font-weight: 800; color: var(--lsd-oscuro); margin: 0 0 4px; }
.lsd-cta-sub { margin: 0; color: var(--lsd-suave); }
.lsd-cta-acc { display: flex; gap: 10px; flex-wrap: wrap; }
.lsd-cta .lsd-btn.lsd-claro { border: 1px solid var(--lsd-borde); }
.lsd-cta-oscuro { background: linear-gradient(120deg, var(--lsd-oscuro), var(--lsd-oscuro-2)); border: 0; }
.lsd-cta-oscuro .lsd-cta-tit { color: #fff; font-size: 24px; }
.lsd-cta-oscuro .lsd-cta-sub { color: #c9d4de; }
.lsd-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.lsd-chip { display: inline-block; padding: 8px 14px; border-radius: 999px; background: var(--lsd-fondo); border: 1px solid var(--lsd-borde); color: var(--lsd-oscuro) !important; font-weight: 600; font-size: 14.5px; text-decoration: none !important; }
.lsd-chip:hover { background: var(--lsd-rojo); border-color: var(--lsd-rojo); color: #fff !important; }
@media (max-width: 921px) { .lsd-r4 { grid-template-columns: repeat(2, 1fr); } .lsd-r3 { grid-template-columns: 1fr 1fr; } .lsd-cta { padding: 18px; } }
@media (max-width: 560px) { .lsd-r4, .lsd-r3 { grid-template-columns: 1fr; } }
/* La etiqueta de la franja se ajusta a su texto (con el centrado vertical en columna se estiraba a todo el ancho) */
.lsd-hero .lsd-eti { align-self: flex-start; }
.lsd-hero .lsd-acc, .lsd-hero ul { align-self: flex-start; }
/* Un bloque nunca se sube al lado de una foto flotada del contenido (en Sangre, el titulo "Por que" salia junto a la foto) */
.lsd-bloque, .lsd-figura { clear: both; }
/* En movil el texto justificado del contenido viejo abre rios de espacios */
@media (max-width: 767px) { .entry-content p, .entry-content li { text-align: left !important; } }
