/* Volaterra — CSS de fidelidad (réplica exacta del Divi original)
   Spec medida en DOM del vivo el 2026-07-15 (1440px viewport):
   header 78px, hero 100vh, título Perpetua→serif 120px caja 780px,
   footer 89px + barra créditos #222 54px. */

/* Enlaces de chrome (menú, idioma, legales): clase .ex1 igual que en Divi */
.ex1 { color: #979797 !important; text-decoration: none; }
.ex1:hover { color: #ffffff !important; }

/* Header / nav charcoal — row 1080, padding 21/15, sin padding lateral */
.vlt-header { background-color: #282928; }
.vlt-header .wp-block-columns { margin-top: 0; margin-bottom: 0; align-items: center; }
/* Menú: Calibri 16px w500, arranca 27px antes del límite de columna (como el módulo Divi) */
.vlt-menu {
	margin: 0 0 0 -27px;
	font-family: calibri, Georgia, "Times New Roman", serif;
	font-weight: 500;
	line-height: 1.5;
	transform: translateY(-5px); /* baseline del texto a y=27 como en el vivo */
}
.vlt-menu a.ex1 { margin-right: 21px; }
/* ESP/ENG: sans (el vivo declara Roboto sin cargarla → cae en Helvetica/Arial), w400 */
.vlt-lang {
	margin: 0 8px 0 0;
	font-family: Roboto, Helvetica, Arial, sans-serif;
	font-weight: 400;
	line-height: 1.5;
	transform: translateY(-5px);
}
.vlt-lang a.ex1 { margin-left: 8px; }
.vlt-logo { margin: 0; }
.vlt-logo img { display: block; height: auto; width: 189px; }

/* ===== Header móvil (≤980px = breakpoint tablet del Divi) =====
   Réplica del módulo header_mobile 30937: logo centrado 80% (max 240px)
   + toggle "Menú" 80% con borde #979797, icono +/− en círculo, links Calibri 14 apilados. */
.vlt-header-mobile { display: none; }
@media (max-width: 980px) {
	.vlt-header .wp-block-columns { display: none !important; }
	.vlt-header-mobile { display: block; width: 80%; margin: 0 auto; padding: 30px 0; }
	.vlt-mob-logo { text-align: center; margin: 0 0 15px; }
	.vlt-mob-logo img { width: 80%; max-width: 240px; height: auto; }
	.vlt-mob-menu { border: 1px solid #979797; background: #282928; padding: 20px; }
	.vlt-mob-menu summary {
		list-style: none; cursor: pointer;
		display: flex; align-items: center; justify-content: space-between;
		font-family: calibri, Georgia, "Times New Roman", serif;
		font-size: 16px; font-weight: 500; line-height: 1; color: #979797;
	}
	.vlt-mob-menu summary::-webkit-details-marker { display: none; }
	.vlt-mob-menu-icon {
		display: inline-flex; align-items: center; justify-content: center;
		width: 16px; height: 16px; border-radius: 50%;
		background: #979797; color: #282928;
		font-size: 13px; font-weight: 700; line-height: 1;
		font-family: Arial, sans-serif;
	}
	.vlt-mob-menu-icon::before { content: "+"; }
	.vlt-mob-menu[open] .vlt-mob-menu-icon::before { content: "\2212"; }
	.vlt-mob-menu-links { padding-top: 20px; }
	.vlt-mob-menu-links p {
		margin: 0; padding: 0 0 7px;
		font-family: calibri, Georgia, "Times New Roman", serif;
		font-size: 14px; line-height: 1.7;
	}
	.vlt-mob-menu-links p:last-child { padding-bottom: 0; }
	.vlt-mob-menu-links a.ex1 { margin-right: 10px; }
}

/* Footer charcoal (módulo 31499) — columnas arriba, NAP Open Sans 14.
   Sin blockGap: pegado al hero y barra de créditos pegada a las columnas (como el vivo). */
.vlt-footer { background-color: #282928; margin-top: 0 !important; }
footer.wp-block-template-part, header.wp-block-template-part { margin-top: 0 !important; }
.vlt-footer > * { margin-top: 0 !important; }
.vlt-footer .wp-block-columns { margin-top: 0; margin-bottom: 0; align-items: flex-start; }
.vlt-footer p {
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.4;
}
.vlt-footer .has-blanco-color { color: #ffffff !important; }
/* Legales: el módulo Divi vive en la mitad derecha de su columna (margin-left 50%) */
.vlt-legal p { margin-left: 50%; white-space: nowrap; }

/* Barra de créditos (#main-footer del Divi): bg #222, texto 13px #666 a la IZQUIERDA */
.vlt-footer-bottom { background-color: #222222; }
.vlt-footer .vlt-footer-bottom p.vlt-credit {
	color: #666666;
	font-size: 13px;
	line-height: 1.85;
	text-align: left;
}

/* Hero portada: imagen tal cual (ya es B/N), SIN overlay; caja semitransparente tras el título.
   El vivo declara font-family "Perpetua" sin webfont → replica el MISMO fallback (serif del
   navegador, Times New Roman en Windows). NO usar EB Garamond aquí: cambia los glifos. */
.vlt-hero { min-height: 100vh; }
.vlt-hero .wp-block-cover__inner-container { width: 100%; text-align: center; }
.vlt-hero-title {
	display: inline-block;
	max-width: 780px;
	box-sizing: border-box;
	background-color: rgba(0, 0, 0, 0.5);
	padding: 20px 40px;
	border-radius: 8px;
	color: #dd3333 !important;
	font-family: Perpetua, serif;
	font-weight: 500;
	line-height: 1;
	text-align: center;
	margin: 0;
}

/* ============ Páginas interiores (spec DOM del vivo 2026-07-15) ============ */

/* Mata el blockGap del tema dentro de los wrappers de página (el Divi no tiene gaps implícitos) */
.vlt-interior > * { margin-top: 0 !important; }
.vlt-services > * { margin-top: 0 !important; }

/* Acerca de — grid de servicios: H2 calibri 30 #333, cuerpo calibri 18/1.5 #666, img mb 30.
   OJO: solo margin-block — el margin-inline:auto lo pone el layout constrained (centra Ferias). */
.vlt-services h2 {
	font-family: calibri, Georgia, "Times New Roman", serif;
	font-size: 30px; font-weight: 500; line-height: 1;
	color: #333333; margin-block: 0 !important; padding: 0 0 10px;
}
.vlt-services p {
	font-family: calibri, Georgia, "Times New Roman", serif;
	font-size: 18px; font-weight: 500; line-height: 1.5;
	color: #666666; margin-block: 0 25px !important; /* aire bajo cada servicio (margen CTA del Divi) */
}
.vlt-services .wp-block-image { margin: 0 0 30px; }
.vlt-services .wp-block-columns { margin: 0; }

/* Título de página estilo Divi CTA (Open Sans 36 bold #454545, centrado) — Galería */
.vlt-title-os {
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 36px; font-weight: 700; line-height: 1.4;
	color: #454545; text-align: center; margin: 0 !important;
}
/* Título calibri bold 36 (Tienda/Subastas) */
.vlt-title-cal {
	font-family: calibri, Georgia, "Times New Roman", serif;
	font-size: 36px; font-weight: 700; line-height: 1.2;
	color: #454545; text-align: center; margin: 0 !important;
}
/* Intro centrada calibri 18 #888 (Galería) */
.vlt-intro { margin-top: 10px !important; }
.vlt-intro p {
	font-family: calibri, Georgia, "Times New Roman", serif;
	font-size: 18px; font-weight: 500; line-height: 1.4;
	color: #888888; text-align: center; margin: 0 0 25px !important;
}
.vlt-intro p:last-child { margin-bottom: 0 !important; }
/* Subtítulo Tienda (max 620 centrado) */
p.vlt-sub {
	font-family: calibri, Georgia, "Times New Roman", serif;
	font-size: 18px; font-weight: 500; line-height: 1.4;
	color: #888888; text-align: center; max-width: 620px;
	margin: 10px auto 0 !important;
}

/* Galería 2x2 (gutter 33px horizontal / 17px vertical) */
.vlt-gallery { margin-top: 40px !important; }
.vlt-gallery .wp-block-image { margin: 0 0 17px; }
.vlt-gallery .wp-block-column > .wp-block-image:last-child { margin-bottom: 0; }
/* Galería tienda (gutter 60 / 30 vertical) */
.vlt-shop-gallery .wp-block-image { margin: 0 0 30px; }
.vlt-shop-gallery .wp-block-column > .wp-block-image:last-child { margin-bottom: 0; }

/* Mapa Google (Galería): 1080x467 como el módulo Divi */
.vlt-map { margin-top: 30px !important; }
.vlt-map iframe { width: 100%; height: 467px; border: 0; display: block; }

/* Documentos legales (boilerplate) — legible: jerarquía clara y aire entre bloques */
.vlt-doc { font-family: "Open Sans", Arial, Helvetica, sans-serif; font-size: 14px; color: #666666; line-height: 1.7; }
.vlt-doc h1 { font-family: "Open Sans", Arial, Helvetica, sans-serif; font-size: 30px; font-weight: 600; color: #333333; line-height: 1.3; margin: 10px 0 30px; }
.vlt-doc h2 { font-family: "Open Sans", Arial, Helvetica, sans-serif; font-size: 21px; font-weight: 600; color: #333333; line-height: 1.35; margin: 35px 0 12px; }
.vlt-doc p { margin: 0 0 15px; }
.vlt-doc ul { margin: 0 0 20px; padding: 0 0 0 22px; list-style: disc; }
.vlt-doc ol { margin: 0 0 20px; padding: 0 0 0 22px; list-style: decimal; }
.vlt-doc li { margin-bottom: 10px; }
.vlt-doc a { color: #c02828; text-decoration: none; }
.vlt-doc a:hover { color: #dd3333; }

/* Imágenes responsivas */
.entry-content img, .wp-block-image img { max-width: 100%; height: auto; }

/* ===== Móvil ≤781px (breakpoint de apilado de columnas WP; el Divi apila igual) =====
   Réplica del layout móvil del Divi: contenido al 80% centrado (rows móviles),
   footer del módulo footer_mobile 31500. Al FINAL del archivo para ganar en cascada. */
@media (max-width: 781px) {
	/* Contenido: columna 80% centrada (el tema tiene root padding 0 → sin esto va de borde a borde) */
	.vlt-services, .vlt-interior, .vlt-doc { padding-left: 10%; padding-right: 10%; }

	/* Acerca: servicios apilados con ritmo uniforme (~75px entre servicios, como el vivo) */
	.vlt-services .wp-block-columns { padding-top: 0 !important; padding-bottom: 0 !important; }
	.vlt-services .wp-block-column { margin-bottom: 50px; }
	.vlt-services > .wp-block-group { padding-top: 0 !important; }

	/* Tienda: la fila de galería pierde el padding grande de escritorio (el Divi lo quita en móvil) */
	.vlt-shop-gallery { padding-top: 20px !important; padding-bottom: 30px !important; }

	/* Footer móvil (módulo 31500): logo 250 centrado, NAP y legales centrados, legales en calibri */
	.vlt-footer .wp-block-columns { padding: 25px 10% 10px !important; }
	.vlt-footer .vlt-logo { padding: 0 !important; margin: 0 0 15px; text-align: center; }
	.vlt-footer .vlt-logo img { width: 250px; max-width: 100%; display: inline-block; }
	.vlt-footer .wp-block-column { padding-top: 0 !important; padding-bottom: 8px !important; }
	.vlt-legal p {
		margin-left: 0; white-space: normal;
		font-family: calibri, Georgia, "Times New Roman", serif;
	}
	/* Barra de créditos: centrada en móvil (en escritorio va a la izquierda) */
	.vlt-footer .vlt-footer-bottom p.vlt-credit { text-align: center; padding: 0 10%; }
}