/*
Theme Name: Divi Child
Theme URI: https://example.com
Description: Child theme para personalizar Divi en el sitio de Maria Molina.
Author: Maria Molina
Template: Divi
Version: 1.0.0
Text Domain: divi-child
*/

/* =========================================================
   BASE & TYPOGRAPHY
   ========================================================= */

html {
	box-sizing: border-box;
	scroll-behavior: smooth;
}
/* Desactiva scroll suave cuando se añade esta clase (anclas deben aparecer sin animación) */
html.no-smooth { scroll-behavior: auto; }

/* Evita scroll del fondo cuando el menú móvil está abierto */
body.nav-open { overflow: hidden; }

:root {
  --home-gallery-width: 960px; /* ancho visual base, alineado con iconos sociales */
  --jg-gap: 20px;               /* separación lateral común */
  --obra-card-width: 540px;     /* tamaño consistente de las fichas de obra */
  /* Tipografías globales */
  --font-title: 'Roboto', sans-serif;
  --font-secondary: 'Roboto', sans-serif;
  --font-body: 'Roboto', sans-serif;
  /* Tipografía del footer (permite sobrescribir sin afectar el resto) */
  --font-footer: var(--font-body);
  --font-title-weight: 500; /* Roboto Medium para títulos */
}

/* Override de variables globales de Divi para asegurar las fuentes en todo el sitio */
:root { 
  --et_global_heading_font: 'Roboto' !important; 
  --et_global_body_font: 'Roboto' !important; 
  --et_global_heading_font_weight: 500 !important; 
  --et_global_body_font_weight: 300 !important; 
}

*, *::before, *::after {
	box-sizing: inherit;
}

body {
	margin: 0;
	font-family: var(--font-body) !important;
	font-weight: 300; /* Roboto Light por defecto */
	color: #1a1a1a;
	background-color: #ffffff;
	line-height: 1.6;
}

a {
	color: inherit;
	text-decoration: none;
}

a:hover,
a:focus {
	text-decoration: underline;
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.container-narrow {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 24px;
}

/* =========================================================
   PAGE TITLES (simple, like "DIBUJO")
   ========================================================= */

/* Utility class you can add anywhere */
.page-title--simple {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: var(--font-title-weight);
  font-size: 1.5rem; /* algo más grande */
  line-height: 1.3;
  color: #1a1a1a;
  margin: 0 0 18px;
  text-align: center;
  font-family: var(--font-title);
  display: block;
}

.page-header-simple {
  box-sizing: border-box;
  width: min(var(--home-gallery-width), 100%);
  max-width: var(--home-gallery-width);
  margin: 0 auto 32px;
  padding: 0 var(--jg-gap, 20px);
  text-align: center;
}

/* Alineación específica para la página de Dibujos:
   - El título simple se alinea como el texto del "cuadrado negro" de obras
   - Sin fondo negro, solo texto, pero con el mismo ancho útil y márgenes */
.page-dibujos .page-header-simple { padding: 0; }
.page-dibujos .page-title--simple {
  box-sizing: border-box;
  width: calc(100% - (var(--jg-gap) * 2) + 2.3px);
  margin: 0 calc(var(--jg-gap) - 2.3px) 18px var(--jg-gap);
  text-align: center;
}

/* Alineación específica para la página de Pinturas (usa body class page-slug-pintura): */
.page-slug-pintura .page-title--simple,
.page-slug-pinturas .page-title--simple {
  box-sizing: border-box;
  width: calc(100% - (var(--jg-gap) * 2) + 2.3px);
  margin: 0 calc(var(--jg-gap) - 2.3px) 18px var(--jg-gap);
  text-align: center;
}

/* Alineación base para otros títulos simples (misma rejilla que la barra negra) */
.page-slug-obra .page-title--simple,
.page-slug-obras .page-title--simple,
.page-slug-dibujo .page-title--simple,
.page-slug-dibujos .page-title--simple,
.page-slug-proyecto .page-title--simple,
.page-slug-proyectos .page-title--simple {
  box-sizing: border-box;
  width: calc(100% - (var(--jg-gap) * 2) + 2.3px);
  margin: 0 calc(var(--jg-gap) - 2.3px) 18px var(--jg-gap);
  text-align: center;
}

/* Apply to common Divi/WordPress page title locations */
.page .entry-title,
.page .page-title,
.et_pb_title_container .entry-title,
.et_pb_title_container h1,
.et_pb_post_title .entry-title {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: var(--font-title-weight);
  font-size: 1.5rem; /* algo más grande */
  line-height: 1.3;
  color: #1a1a1a;
  margin: 0 0 18px;
  text-align: center;
  font-family: var(--font-title);
}

/* Encabezados generales */
h1, h2, h3, h4, h5, h6 { font-family: var(--font-title); font-weight: var(--font-title-weight); }

/* =========================================================
   BUTTONS & UTILITIES
   ========================================================= */

.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 36px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-size: 0.85rem;
	font-weight: 500;
	border: 1px solid #111111;
	background-color: #111111;
	color: #ffffff;
	transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.btn:hover,
.btn:focus {
	background-color: #ffffff;
	color: #111111;
	border-color: #111111;
	text-decoration: none;
}

.btn--ghost {
	background-color: transparent;
	color: #111111;
}

.btn--ghost:hover,
.btn--ghost:focus {
	background-color: #111111;
	color: #ffffff;
}

.btn--primary {
	background-color: #111111;
	color: #ffffff;
}

/* =========================================================
   HEADER & NAVBAR
   ========================================================= */

/* Oculta cualquier header generado por el Theme Builder de Divi
   para usar solo el header del tema hijo */
.et-l--header,
#top-header,
.et_slide_in_menu_container {
	display: none !important;
}

/* Si Divi Theme Builder intenta ocultar el header por defecto, lo forzamos a mostrarse */
body.et-tb-has-header #main-header { display: block !important; }
#main-header { visibility: visible !important; opacity: 1 !important; transform: none !important; }

.main-header--child {
    background-color: #ffffff;
    border-bottom: 0;
    position: relative; /* no fijo */
    top: auto;
    left: auto;
    right: auto;
    z-index: 1000; /* sobre el contenido inmediato */
    box-shadow: none; /* sin separador/sombra inferior */
}

/* Fuerza eliminar cualquier línea/separador bajo el header que añada Divi */
#main-header,
.main-header--child,
.et_fixed_nav #main-header,
.et_non_fixed_nav #main-header {
  border-bottom: 0 !important;
  box-shadow: none !important;
  background-image: none !important; /* Divi a veces usa gradientes finos */
}

/* Asegurar navbar visible también en proyectos/series individuales */
body.single-project #main-header,
body.single-serie   #main-header,
body.single-obra    #main-header,
body.single-proyecto #main-header {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative;
  z-index: 1000;
}

/* Ajuste admin bar ya no necesario al no ser fijo */
body.admin-bar .main-header--child { top: auto; }

/* Sin empuje extra: el header no es fijo */
#et-main-area { padding-top: 0; }
body.admin-bar #et-main-area { padding-top: 0; }

.main-navbar {
	width: 100%;
    background: #ffffff;
}

.main-navbar__inner {
    max-width: 1180px;
    margin: 0 auto;
    padding: 36px 24px;
    display: flex;
    align-items: center;
    gap: 36px;
}

.main-navbar__branding {
	display: flex;
	align-items: center;
	gap: 0; /* no gap; usaremos solape con margen negativo */
	flex: 0 0 auto;
}

.main-navbar__branding img { max-height: 120px; width: auto; }
.main-navbar__logo { display: inline-flex; align-items: center; }
.main-navbar__logo-img { display: block; height: 92px; width: auto; }
.main-navbar .main-navbar__logo-img { transform: translateY(-2px); }
.main-navbar__close { display: none; }
.main-navbar__logo--2 { margin-left: -6px; }
.main-navbar__logo-img--1 { height: 92px; }
.main-navbar__logo-img--2 { height: 56px; }

/* (sin forzar baseline; usamos ajuste fino -2px del logo) */

.main-navbar__title {
	font-size: 1.1rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-weight: 400;
}

/* Evitar solape de los dos logos en móvil */
@media (max-width: 640px) {
  .main-navbar__branding { gap: 4px; }
  .main-navbar__logo--2 { margin-left: 0; }
  .main-navbar__logo-img--1 { height: 78px; }
  .main-navbar__logo-img--2 { height: 48px; }
}

/* Desplazar el primer logo 20px a la derecha (global) */
.main-navbar__logo--0 { margin-left: 20px; }

/* Desktop: desplazar el segundo logo 10px a la derecha (5px extra) */
@media (min-width: 980px) {
.main-navbar__logo--2 { margin-left: 4px; }
}

.main-navbar__toggle {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 56px;
    height: 56px;
    background-color: transparent;
    border: 0;
    border-radius: 0;
    cursor: pointer;
    position: relative;
}

.main-navbar__toggle-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.main-navbar__toggle-bar {
    width: 22px;
    height: 2px;
    background-color: #111111;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.main-navbar__navigation {
    flex: 1 1 auto;
    display: flex;
    justify-content: flex-end; /* menú a la derecha */
    align-items: center;
    gap: 16px; /* espacio entre menú y redes */
    margin-top: 0;
}

.main-navbar__list {
    list-style: none;
    display: flex;
    gap: 18px;
    margin: -4px 0 0;
    padding: 0;
}

.main-navbar__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-family: 'Roboto', sans-serif;
    font-size: 1.05rem;
    font-weight: 400;
    padding: 8px 6px;
    border-bottom: none; /* sin subrayado/borde inferior */
    transition: color 0.2s ease, border-color 0.2s ease;
    text-decoration: none; /* evita subrayado fino por defecto */
    color: #1a1a1a;
}

/* Evita el subrayado fino en hover/focus; solo dejamos la línea gruesa (border) */
.main-navbar__link:hover,
.main-navbar__link:focus {
	text-decoration: none;
}

/* Asegura tipografía en el texto interno del link */
.main-navbar__text { font-family: 'Roboto', sans-serif; }
/* Resalta el activo como en la referencia (HOME en negrita) */
.main-navbar__item.is-active .main-navbar__text,
.main-navbar__link[aria-current="page"] .main-navbar__text { font-weight: 700; }

.main-navbar__item.is-active > .main-navbar__link,
.main-navbar__link:hover,
.main-navbar__link:focus { border-color: transparent; }

/* Estado activo más oscuro */
.main-navbar__item.is-active > .main-navbar__link,
.main-navbar__link[aria-current="page"] { color: #000; }

/* Hover: aclarar ligeramente el texto */
.main-navbar__link:hover,
.main-navbar__link:focus { color: #333; }

/* (sin overlay bajo el texto; sólo cambio sutil de color) */

.main-navbar__social {
	display: flex;
	align-items: center;
	gap: 6px; /* más juntos */
	flex: 0 0 auto;
	margin-top: -10px;
}

.main-navbar__social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 0;
    background-color: transparent; /* usamos iconos de imagen */
    color: inherit;
    font-size: 0.65rem;
    font-weight: 500;
    letter-spacing: 0.05em;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.main-navbar__social-link:hover,
.main-navbar__social-link:focus {
    background-color: transparent;
    transform: translateY(-1px);
}

/* Icono visual dentro del enlace */
.main-navbar__social-icon {
    display: block;
    width: 28px;
    height: 28px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    text-indent: -9999px; /* oculta las letras (IG, YO, TI) */
    overflow: hidden;
}

/* Imagen directa como icono */
.main-navbar__social-img {
    display: block;
    width: 32px;
    height: 32px;
    object-fit: contain;
}

/* YouTube +1px respecto al resto */
.main-navbar__social-link--youtube .main-navbar__social-img {
    width: 32px;
    height: 33px;
}

/* Iconos por red */
.main-navbar__social-link--youtube .main-navbar__social-icon {
	background-image: url('/wp-content/uploads/2025/10/icons8-youtube-100.png');
    transform: translateY(0);
}

.main-navbar__social-link--tiktok .main-navbar__social-icon {
	background-image: url('/wp-content/uploads/2025/10/icons8-tiktok-100.png');
    transform: translateY(1.5px);
}

.main-navbar__social-link--instagram .main-navbar__social-icon {
	background-image: url('/wp-content/uploads/2025/10/icons8-instagram-100.png');
    transform: translateY(1.5px);
}

.main-navbar__submenu {
    list-style: none;
    margin: 10px 0 0 0;
    padding: 14px 0;
    background-color: #000000;
    color: #ffffff;
    min-width: 230px;
    position: absolute;
    border-radius: 0;
    border: 0 !important;
    outline: none;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.32);
    z-index: 1500;
}

.main-navbar__item {
	position: relative;
}

.main-navbar__item--child > .main-navbar__link {
	justify-content: flex-start;
	padding: 10px 22px;
	border: none;
	color: #ffffff;
}

.main-navbar__item--child > .main-navbar__link:hover,
.main-navbar__item--child > .main-navbar__link:focus {
	background-color: rgba(255, 255, 255, 0.12);
}

/* Mantener texto visible en submenús de fondo negro */
.main-navbar__submenu .main-navbar__link { color: #fff !important; }
.main-navbar__submenu .main-navbar__link:hover,
.main-navbar__submenu .main-navbar__link:focus { color: #fff !important; background-color: rgba(255,255,255,0.12); }
.main-navbar__submenu .main-navbar__item.is-active > .main-navbar__link,
.main-navbar__submenu .main-navbar__link[aria-current="page"] { color: #fff !important; background-color: rgba(255,255,255,0.18); font-weight: 700; }

.main-navbar__item--root > .main-navbar__link {
	position: relative;
}

.main-navbar__item--root:hover > .main-navbar__submenu,
.main-navbar__item--root:focus-within > .main-navbar__submenu {
	display: block;
}

.main-navbar__submenu {
	display: none;
}

/* Also open submenus when parent has .is-open (for click support) */
.main-navbar__item--root.is-open > .main-navbar__submenu {
	display: block;
}

/* (caret removed per request) */

/* =========================================================
   HERO IMAGE
   ========================================================= */

.hero-image {
	width: 100%;
	max-width: 820px;
	margin: 48px auto 64px;
	display: block;
	border: 8px solid #ffffff;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.12);
}
.home-page .hero-image {
	display: none;
}

.home-hero {
	text-align: center;
	margin: 64px auto 80px;
}

.home-hero__title {
	font-size: 2.8rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-weight: 400;
	margin-bottom: 32px;
}

.home-hero__title-image {
	display: block;
	margin: 0 auto 32px;
	max-width: 480px;
	height: auto;
}

.home-hero__title-link {
	display: inline-block;
}

.home-hero__image-wrapper {
	max-width: 760px;
	margin: 0 auto;
}

.home-hero__image {
	width: 100%;
	height: auto;
	display: block;
}

.home-gallery-wrapper {
	padding-bottom: 120px;
}

/* =========================================================
   HOME GALLERY (SHORTCODE)
   ========================================================= */

.home-gallery {
    margin: 60px auto;
    padding: 0; /* sin padding lateral para que el título y la galería coincidan al píxel */
    width: min(var(--home-gallery-width), 100%); /* el contenedor marca el ancho común */
    max-width: var(--home-gallery-width); /* límite superior duro */
    /* Mantener título y grid con el mismo ancho visible */
    --home-gallery-width: 960px; /* ajustado para quedar entre iconos sociales */
    --jg-gap: 20px; /* debe coincidir con el margins del plugin */
}

.gallery-unified {
    width: min(var(--home-gallery-width), 100%);
    max-width: var(--home-gallery-width);
    margin: 32px auto 24px auto;
}


.gallery-unified-title {
    box-sizing: border-box;
    width: calc(100% - (var(--jg-gap) * 2) + 2.3px);
    margin: 0 calc(var(--jg-gap) - 2.3px) 0 var(--jg-gap);
}

/* Serie: alinear el texto inicial con la misma rejilla que los títulos */
.proyecto-serie__content {
  box-sizing: border-box;
  width: calc(100% - (var(--jg-gap) * 2) + 2.3px);
  margin: 0 calc(var(--jg-gap) - 2.3px) 18px var(--jg-gap);
  grid-column: 1 / -1; /* si hay grid de 2 col, ocupar el ancho completo */
}

/* Título como barra horizontal */
.home-gallery__header { 
  box-sizing: border-box;
  width: calc(100% - (var(--jg-gap) * 2) + 2.3px);
  margin: 0 calc(var(--jg-gap) - 2.3px) 0 var(--jg-gap); /* desplaza 2.3px extra hacia la derecha */
}
.home-gallery--flush .home-gallery__header { width: 100%; margin: 0; }
.home-gallery__title {
    display: block;
    padding: 12px 0;
    background-color: #000000;
    color: #ffffff;
    font-size: 1.05rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-align: center;
    margin: 0;
    font-family: var(--font-title);
    font-weight: var(--font-title-weight);
}
@media (max-width: 480px) {
  .home-gallery__title { font-size: 0.95rem; letter-spacing: 0.05em; }
}

.home-gallery--title-only {
    margin: 48px auto;
    width: min(var(--home-gallery-width), 100%);
}

.home-gallery--title-only .home-gallery__header {
    width: 100%;
    margin: 0;
}

.home-gallery--title-only .home-gallery__title {
    padding: 12px 24px;
}

@media (max-width: 600px) {
    .home-gallery--title-only { margin: 40px auto; }
    .home-gallery--title-only .home-gallery__title { padding: 12px 18px; }
}

@media (min-width: 980px) {
    .home-gallery,
    .home-gallery--title-only,
    .gallery-unified,
    .page-dibujos .page-header-simple,
    .page-dibujos .et_pb_row_8,
    .page-dibujos .et_pb_row_9,
    .page-dibujos .et_pb_column_12,
    .page-dibujos .et_pb_column_14,
    .serie-obras-wrap,
    .serie-obras-wrap .home-gallery,
    .serie-obras-wrap .home-gallery--title-only,
    .serie-obras-wrap .obra-fila2 .home-gallery,
    .proyecto-serie {
        width: calc(var(--home-gallery-width) + 32.5px);
        max-width: calc(var(--home-gallery-width) + 32.5px);
        margin-left: calc((100% - var(--home-gallery-width)) / 2);
        margin-right: calc((100% - var(--home-gallery-width)) / 2 - 32.5px);
    }

    .home-gallery__header,
    .gallery-unified-title,
    .proyecto-serie__content,
    .page-dibujos .page-title--simple,
    .serie-obras-wrap .home-gallery__header,
    .serie-obras-wrap .obra-fila2 .home-gallery__header {
        width: calc(100% - (var(--jg-gap) * 2) + 2.3px);
        margin-left: var(--jg-gap);
        margin-right: calc(var(--jg-gap) - 2.3px);
    }
}

/* Offset específico: en Dibujos, desplazar el título 15px a la derecha en desktop */
@media (min-width: 980px) {
  .page-dibujos .page-title--simple {
    margin-left: calc(var(--jg-gap) + 15px) !important;
    margin-right: calc(var(--jg-gap) - 2.3px - 15px) !important;
  }
}

/* Offset específico: en Pinturas, desplazar el título 15px a la derecha en desktop */
@media (min-width: 980px) {
  .page-slug-pintura .page-title--simple,
  .page-slug-pinturas .page-title--simple {
    margin-left: calc(var(--jg-gap) + 15px) !important;
    margin-right: calc(var(--jg-gap) - 2.3px - 15px) !important;
  }
}

/* Serie: alinear el título como en Pinturas (+15px) */
@media (min-width: 980px) {
  .single-serie-page .serie-obras-header {
    margin-left: calc(var(--jg-gap) + 15px) !important;
    margin-right: calc(var(--jg-gap) - 2.3px - 15px) !important;
  }
}

/* Offset 15px a la derecha para el resto de páginas (desktop) */
@media (min-width: 980px) {
  .page-slug-obra .page-title--simple,
  .page-slug-obras .page-title--simple,
  .page-slug-dibujo .page-title--simple,
  .page-slug-dibujos .page-title--simple,
  .page-slug-proyecto .page-title--simple,
  .page-slug-proyectos .page-title--simple {
    margin-left: calc(var(--jg-gap) + 15px) !important;
    margin-right: calc(var(--jg-gap) - 2.3px - 15px) !important;
  }
}

/* Proyectos: desplazar 10px extra sobre el offset base (total +25px) en desktop */
@media (min-width: 980px) {
  .page-slug-proyecto .page-title--simple,
  .page-slug-proyectos .page-title--simple {
    margin-left: calc(var(--jg-gap) + 25px) !important;
    margin-right: calc(var(--jg-gap) - 2.3px - 25px) !important;
  }
}

.page-dibujos .et_pb_section_4,
.page-dibujos .et_pb_row_8,
.page-dibujos .et_pb_row_9,
.page-dibujos .et_pb_column_12,
.page-dibujos .et_pb_column_14 {
    width: 100%;
    max-width: none;
    padding: 0;
    margin: 0 auto;
}

.home-gallery__grid {
  position: relative;
  width: calc(100% - (var(--jg-gap) * 2) + 2.3px);
  margin: 12px calc(var(--jg-gap) - 2.3px) 0 var(--jg-gap); /* separación con el título */
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 20px;
  box-sizing: border-box;
}

/* Estado de carga para evitar parpadeos/reordenaciones visibles */
.home-gallery__grid.is-loading { opacity: 0; }
.home-gallery__grid.is-ready   { opacity: 1; transition: opacity 240ms ease; }

/* ===== Justified Gallery (usa su propio layout) ===== */
.home-gallery__grid.justified-gallery {
  display: block;           /* anula flex del genérico */
  flex-wrap: initial;
  justify-content: initial;
  gap: 0;                   /* lo gestiona el plugin (margins) */
  margin: 12px calc(var(--jg-gap) - 2.3px) 0 var(--jg-gap);         /* igual que la versión JL y Home */
  padding: 0;               /* elimina cualquier padding del contenedor */
}

.home-gallery--flush .home-gallery__grid,
.home-gallery--flush .home-gallery__grid.justified-gallery {
  width: 100%;
  margin: 12px 0 0;
}

.home-gallery__link { display: block; width: 100%; }
.home-gallery__image {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

/* Imágenes y hover en Justified Gallery & JL propio */
.home-gallery__grid.justified-gallery a,
.home-gallery__grid.is-jl a { background-color: #ffffff; }
.home-gallery__grid.justified-gallery img,
.home-gallery__grid.is-jl img {
  width: 100%;
  height: 100%;
  object-fit: cover;   /* llena el tile: sin bandas blancas */
  object-position: center center; /* recorte más natural */
}
.home-gallery__grid.justified-gallery a.is-last-single img { object-fit: cover; }
.home-gallery__grid.justified-gallery a:hover img,
.home-gallery__grid.is-jl a:hover img {
  transform: scale(1.03);
  opacity: 0.9;
}
/* Hover global para obras en cualquier sección */
.obra-enlace img,
.obra-main-img,
.obra-thumb-principal,
.obra-slide-img {
  transition: transform 0.3s ease, opacity 0.3s ease;
}
.obra-enlace:hover img,
.obra-main-item:hover .obra-main-img,
.obra-enlace:hover .obra-thumb-principal,
.obra-thumb-principal:hover,
.obra-slide-img:hover {
  transform: scale(1.03);
  opacity: 0.9;
}

/* Compatibilidad con el layout de columnas (home_bloques) */
.home-gallery__cell {
  flex: 1 1 calc(33.333% - 20px);
  box-sizing: border-box;
  overflow: hidden;
}
.home-gallery__cell:hover .home-gallery__image {
    transform: scale(1.03);
    opacity: 0.95;
}

@media (max-width: 1024px) {
    .home-gallery { padding: 0 20px; }
    .home-gallery__grid { width: 100%; margin: 12px 0 0; }
    .home-gallery__grid.justified-gallery { margin: 12px 0 0; }
    .home-gallery__cell { flex: 1 1 calc(50% - 20px); }
    .page-header-simple {
      justify-content: center;
      padding-left: var(--jg-gap, 20px);
      padding-right: var(--jg-gap, 20px);
    }
    /* En móvil/tablet, el título simple ocupa el 100% y sin márgenes laterales extra */
    .page-dibujos .page-header-simple { padding-left: 0; padding-right: 0; }
    .page-dibujos .page-title--simple { width: 100%; margin: 0 0 18px; }
    .page-slug-pintura .page-title--simple,
    .page-slug-pinturas .page-title--simple { width: 100%; margin: 0 0 18px; }
    .page-slug-obra .page-title--simple,
    .page-slug-obras .page-title--simple,
    .page-slug-dibujo .page-title--simple,
    .page-slug-dibujos .page-title--simple,
    .page-slug-proyecto .page-title--simple,
    .page-slug-proyectos .page-title--simple { width: 100%; margin: 0 0 18px; }
    .page-title--simple { text-align: center; }
    .serie-obras-wrap { width: 100%; max-width: none; padding: 0 var(--jg-gap, 20px); }
    .serie-obras-wrap .home-gallery { width: 100%; max-width: none; margin: 0; }
    .serie-obras-wrap .home-gallery__header,
    .serie-obras-wrap .obra-serie-item > .home-gallery .home-gallery__header,
    .obra-titulo-wrap .home-gallery__header {
      width: 100%;
      margin: 0;
    }
    .serie-obras-wrap .obra-serie-item > .home-gallery,
    .obra-titulo-wrap { margin: 0 0 12px; width: 100%; max-width: none; }
    .obra-titulo-wrap .home-gallery__title { display: block; width: 100%; }
    .obra-col.izquierda { max-width: 100%; }
    .obra-col .obra-titulo { width: 100%; margin: 0 0 10px; }
    .obra-fila1 { padding: 0; }
    .serie-obras-wrap .obra-titulo { margin: 0 auto 10px; width: 100%; }
    .serie-obras-wrap .obra-serie-item--noimage > .home-gallery .home-gallery__header { width: 100% !important; margin: 0 !important; }
    .serie-obras-wrap .obra-serie-item--noimage .obra-fila2 .home-gallery__grid { width: 100% !important; margin: 12px 0 0 !important; }
    /* Alinear galería de detalles con el título en móvil (100% y sin márgenes laterales) */
    .serie-obras-wrap .obra-fila2 .home-gallery__grid { width: 100% !important; margin: 12px 0 0 !important; }
}

@media (max-width: 768px) {
  .serie-obras-wrap { width: 100%; max-width: none; padding: 0 16px; background: transparent; }
  .serie-obras-wrap .obra-serie-item { margin: 20px auto 32px; background: transparent; }
  .serie-obras-wrap .obra-serie-item > .home-gallery,
  .obra-titulo-wrap { margin: 0 0 12px; background: transparent; width: 100%; max-width: none; }
  .serie-obras-wrap .home-gallery { width: 100%; max-width: none; margin: 0; }
  .serie-obras-wrap .obra-serie-item > .home-gallery .home-gallery__header {
    width: 100%;
    margin: 0;
  }
  .obra-titulo-wrap .home-gallery__header { width: 100%; margin: 0; }
  .serie-obras-wrap .obra-serie-item > .home-gallery .home-gallery__title {
    display: block;
    padding: 12px 0;
  }
  .obra-fila1 { padding: 0; }
  .obra-col.izquierda { max-width: 100%; margin: 0 auto; }
  .obra-col .obra-titulo { width: 100%; margin: 0 0 10px; }
  .serie-obras-wrap .obra-col.derecha { padding: 0; display:flex; flex-direction:column; align-items:center; text-align:center; }
  .serie-obras-wrap .obra-col.derecha .obra-ficha,
  .serie-obras-wrap .obra-col.derecha .obra-descripcion,
  .serie-obras-wrap .obra-col.derecha .obra-btn { width: 100%; max-width: 380px; }
  /* Sin imagen principal: usar el mismo padding lateral que el resto */
  .serie-obras-wrap .obra-serie-item--noimage > .home-gallery .home-gallery__header { width: 100% !important; margin: 0 !important; }
  .serie-obras-wrap .obra-serie-item--noimage .obra-fila2 .home-gallery__grid { width: 100% !important; margin: 12px 0 0 !important; }
  /* Alinear galería de detalles con el título en móvil estrecho (para todos) */
  .serie-obras-wrap .obra-fila2 .home-gallery__grid { width: 100% !important; margin: 12px 0 0 !important; }
}

/* Pintura: alineación robusta en responsive usando la misma variable de padding para título e imagen */
@media (max-width: 1024px) {
  .obra-serie-item--pintura { --obra-hpad: 20px; }
  .obra-serie-item--pintura > .home-gallery { padding: 0 var(--obra-hpad) !important; }
  .obra-serie-item--pintura .obra-fila1 { padding: 0 var(--obra-hpad) !important; }
  .obra-serie-item--pintura > .home-gallery .home-gallery__header { width: 100%; margin: 0; }
}
@media (max-width: 768px) {
  .obra-serie-item--pintura { --obra-hpad: 16px; }
}

@media (max-width: 768px) {
    .home-gallery { padding: 0 16px; }
    .home-gallery__grid { width: 100%; margin: 12px 0 0; }
    .home-gallery__grid.justified-gallery { margin: 12px 0 0; }
    .home-gallery__cell { flex: 1 1 100%; }
}

/* =========================================================
   SERIES GRID (DIBUJOS) – sin Justified, 3 por fila
   ========================================================= */
.series-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--jg-gap, 20px);
  margin: 0 var(--jg-gap, 20px);
}
.series-grid__item { display: block; grid-column: span 4; }
.series-grid__image { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; aspect-ratio: 4 / 3; }

/* Primera fila a 4 si aplica la clase (solo escritorio) */
@media (min-width: 1025px) {
  .series-grid--first-row-4 > .series-grid__item:nth-child(-n+4) { grid-column: span 3; }
}

/* Tablet: 2 por fila */
@media (max-width: 1024px) {
  .series-grid__item { grid-column: span 6; }
  .series-grid--first-row-4 > .series-grid__item:nth-child(-n+4) { grid-column: span 6; }
}

/* Móvil: 1 por fila */
@media (max-width: 640px) {
  .series-grid__item { grid-column: span 12; }
}

/* ===== Single Serie (Proyectos) hero ===== */
.proyecto-serie { max-width: 1180px; margin: 0 auto; padding: 0 20px; }
.proyecto-serie__hero { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 28px; align-items: start; }
.proyecto-serie__media { max-width: 760px; margin: 0 auto; width: 100%; }
.proyecto-serie__title { margin: 0 auto 14px; max-width: 100%; }
.proyecto-serie__image { display:block; width:100%; height:auto; aspect-ratio: 16/9; object-fit: cover; }
.proyecto-serie__content { font-size: 1rem; line-height: 1.7; }

@media (max-width: 1024px) {
  .proyecto-serie__hero { grid-template-columns: 1fr; }
  .proyecto-serie__media { max-width: 100%; }
}

/* Títulos negros por obra dentro de la galería (sin empujar layout) */
.single-serie-page .home-gallery__grid.is-jl a { position: relative; }
.single-serie-page .home-gallery__grid.is-jl a::before {
  content: attr(data-title);
  position: absolute; inset: 0 0 auto 0; height: 36px;
  background: #000; color: #fff; display: flex; align-items: center; justify-content: center;
  font-size: 0.85rem; letter-spacing: 0.06em; text-transform: uppercase;
  pointer-events: none; /* no bloquea click en la imagen */
}

/* Asegurar layout correcto para JL (no flex) */
.home-gallery__grid.is-jl { display: block; gap: 0; }

/* ===== Shortcode [serie_obras] ===== */
.serie-obras-wrap {
  /* Igualar ancho visible y sistema de márgenes a Dibujos */
  --home-gallery-width: 960px;
  --jg-gap: 20px;
  --obra-media-width: var(--obra-card-width);
  width: min(var(--home-gallery-width), 100%);
  max-width: var(--home-gallery-width);
  margin: 0 auto;
  padding: 0; /* las filas gestionan su propio margen interno */
}
.serie-obras-wrap img { cursor: zoom-in; }
.obra-serie-item { margin: 24px auto 36px; }
.obra-serie-item { scroll-margin-top: 120px; }
.obra-fila1 { display: grid; grid-template-columns: 1fr; gap: 16px; align-items: start; padding: 0 var(--jg-gap); }
.obra-col.izquierda { width: 100%; max-width: var(--obra-media-width); }
.obra-col.izquierda .obra-main-item { display:block; width:100%; }
.obra-col .obra-titulo { /* barra negra por obra */
  display:block; margin:0 0 10px; padding:12px 0; background:#000; color:#fff; text-transform:uppercase; letter-spacing:.06em; text-align:center;
  font-family: var(--font-title); font-weight: var(--font-title-weight);
  font-size: 1.05rem;
}
.obra-main-img { display:block; width:100%; height:auto; aspect-ratio: auto; object-fit: contain; }
.obra-position-scope { --obra-pos-x: var(--opos-x, 50%); --obra-pos-y: var(--opos-y, 50%); }
.obra-position-scope .obra-main-img,
.obra-position-scope .obra-thumb-principal { object-position: var(--obra-pos-x) var(--obra-pos-y); }
@media (max-width: 1024px) {
  .obra-position-scope { --obra-pos-x: var(--opos-t-x, var(--opos-x, 50%)); --obra-pos-y: var(--opos-t-y, var(--opos-y, 50%)); }
}
@media (max-width: 640px) {
  .obra-position-scope { --obra-pos-x: var(--opos-m-x, var(--opos-t-x, var(--opos-x, 50%))); --obra-pos-y: var(--opos-m-y, var(--opos-t-y, var(--opos-y, 50%))); }
}
.obra-main-item, .home-gallery__link { position: relative; z-index: 2; }
.home-gallery__grid.is-jl a { z-index: 2; pointer-events: auto; }
.serie-obras-wrap .et_overlay, .serie-obras-wrap .box-shadow-overlay { pointer-events: none !important; }
.obra-descripcion { margin-bottom: 12px; font-size: 0.98rem; line-height: 1.65; color: #2a2a2a; }
/* Ficha técnica refinada */
.obra-ficha { 
  --ficha-gap: 4px;
  --ficha-sep: 12px;
  margin-top: 10px; 
  padding-top: 0; 
  border-top: 0; 
  max-width: var(--obra-card-width);
  font-family: var(--font-secondary);
  font-weight: 400;
}
.obra-ficha p { 
  margin: 0; 
  font-size: 0.95rem; 
  line-height: 1.35; 
  letter-spacing: 0.02em; 
  color: #262626; 
}
.obra-ficha p:first-child { font-weight: 400; }
.obra-ficha p + p { 
  margin-top: var(--ficha-gap); 
  padding-top: var(--ficha-gap); 
  border-top: 0; 
  color: #444; 
}

/* Pintura: ficha técnica más compacta y sin separadores */
.obra-serie-item--pintura .obra-ficha { padding-top: 0; border-top: 0; }
.obra-serie-item--pintura .obra-ficha p { line-height: 1.35; }
.obra-serie-item--pintura .obra-ficha p + p { margin-top: 4px; padding-top: 0; border-top: 0; }
/* Pintura: usar misma escala de título que Dibujos */
.obra-serie-item--pintura .home-gallery__title { font-size: 1.05rem; }

/* Override Proyectos (solo series/listados): mantener cuadrado donde aplique, pero las singles usan su proporción real */
/* Cuadrar también las obras listadas dentro de una serie (vista "ver todo") */
.single-serie-page .obra-main-img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

/* (retirado) Alineación específica de .obra-titulo-wrap para Pintura en desktop */

/* Pintura (desktop): sin ajustes especiales; mismo layout que Dibujos */
@media (min-width: 1025px) {
  /* Pintura: hacer más ancha la imagen principal (+20px respecto a base) */
  .obra-serie-item--pintura { --obra-media-width: calc(var(--obra-card-width) + 20px); }
}

/* Pintura (desktop): forzar el mismo ancho/márgenes de cabecera que Dibujos (anula +45px genérico) */
@media (min-width: 1025px) {
  .serie-obras-wrap .obra-serie-item--pintura > .home-gallery .home-gallery__header {
    width: calc(100% - (var(--jg-gap) * 2) + 2.3px);
    margin-left: var(--jg-gap);
    margin-right: calc(var(--jg-gap) - 2.3px);
  }
}
/* CTA más cuidado */
.obra-btn { display:inline-block; margin-top: 16px; padding:10px 16px; border:1px solid #111; background:#111; color:#fff; text-transform:uppercase; letter-spacing:.06em; font-size:.8rem; transition: background-color .2s ease, color .2s ease; text-decoration:none; }
.obra-btn:hover, .obra-btn:focus { background:#fff; color:#111; text-decoration:none; }
.obra-btn--disabled { opacity:.6; }
.obra-fila2 { margin-top: 12px; }
/* revert: los detalles mantienen margen superior por defecto */
/* Sin overlay de título sobre los detalles (igual que Dibujos) */
.serie-obras-wrap .obra-fila2 .home-gallery__grid.is-jl a::before { display: none; }
.obra-detalles-grid { margin: 8px 0 0 !important; }

/* Alineación y ancho consistente en páginas de serie */
.single-serie-page .home-gallery.home-gallery--flush .home-gallery__header { width: 100%; margin: 0; }
.serie-obras-wrap .home-gallery { width: min(var(--home-gallery-width), 100%); max-width: var(--home-gallery-width); margin-left: auto; margin-right: auto; }
.serie-obras-wrap .home-gallery__grid { margin-top: 12px; }
.serie-obras-wrap .obra-serie-item { max-width: 100%; }
.serie-obras-wrap .obra-col.derecha { align-self: start; }

/* Cabecera simple de serie (sin barra negra) */
.serie-obras-header { box-sizing: border-box; width: calc(100% - (var(--jg-gap) * 2) + 2.3px); margin: 0 calc(var(--jg-gap) - 2.3px) 24px var(--jg-gap); }
.serie-obras-header .page-title--simple {
  display: block;
  width: 100%;
  margin: 0 0 18px; /* igual que .page-title--simple base */
  padding: 0;
  background: transparent;
  text-align: center; /* coincide con base */
}

/* Título simple para proyectos (sin barra negra) */
.obra-titulo-simple { display:none; }
.serie-obras-wrap .obra-serie-item--noimage .obra-fila1 { grid-template-columns: 1fr !important; }
.serie-obras-wrap .obra-serie-item--noimage .obra-col.derecha { max-width: none; }

/* ===== Detalles como carrusel (Pintura) ===== */
.obra-slider { position: relative; margin: 12px 0 0; padding: 0 var(--jg-gap); overflow: visible; }
.obra-swiper { width: 100%; }
.obra-swiper .swiper-slide { aspect-ratio: 1 / 1; }
.obra-slide-img { display:block; width: 100%; height: 100%; object-fit: cover; }
.obra-flecha { position:absolute; top:50%; transform: translateY(-50%); z-index: 10; background: transparent; border: 0; color:#111; cursor: pointer; display:flex; align-items:center; justify-content:center; padding: 0; font-size: 28px; line-height: 1; border-radius: 0; box-shadow: none; }
.obra-flecha.izquierda { left: -18px; }
.obra-flecha.derecha   { right: -18px; }
.obra-flecha:hover { color:#000; }
/* Ocultar flechas cuando Swiper las deshabilite por no haber overflow */
.obra-flecha.swiper-button-disabled { opacity: .35; pointer-events: none; cursor: default; color: #111 !important; }
.obra-flecha.swiper-button-disabled:hover,
.obra-flecha.swiper-button-disabled:active,
.obra-flecha.swiper-button-disabled:focus { color: #111 !important; }
/* Ocultar cuando Swiper bloquea navegación por no haber overflow */
.obra-flecha.swiper-button-lock { display: none !important; }
/* Ocultar ambas flechas cuando no hay overflow (controlado por JS) */
.obra-flecha.is-hidden { display: none !important; }

@media (max-width: 768px) {
  .obra-flecha.izquierda { left: 4px; }
  .obra-flecha.derecha   { right: 4px; }
}
/* Ocultar flechas según número de detalles (server-side) */
@media (max-width: 640px) {
  .obra-slider[data-count="0"] > .obra-flecha,
  .obra-slider[data-count="1"] > .obra-flecha,
  .obra-slider[data-count="2"] > .obra-flecha,
  .obra-slider[data-count="3"] > .obra-flecha,
  .obra-slider[data-count="4"] > .obra-flecha { display: none !important; }
}
@media (min-width: 641px) and (max-width: 1024px) {
  .obra-slider[data-count="0"] > .obra-flecha,
  .obra-slider[data-count="1"] > .obra-flecha,
  .obra-slider[data-count="2"] > .obra-flecha,
  .obra-slider[data-count="3"] > .obra-flecha { display: none !important; }
}
@media (min-width: 1025px) {
  .obra-slider[data-count="0"] > .obra-flecha,
  .obra-slider[data-count="1"] > .obra-flecha,
  .obra-slider[data-count="2"] > .obra-flecha,
  .obra-slider[data-count="3"] > .obra-flecha,
  .obra-slider[data-count="4"] > .obra-flecha { display: none !important; }
}
/* Flechas por defecto visibles */

/* Ajuste del comienzo del texto un poco más abajo que la imagen (desktop) */
@media (min-width: 1025px) {
  .serie-obras-wrap .obra-col.derecha { margin-top: 12px; }
}

/* Alinear detalles (grid) con los bordes del contenido como en Dibujos */
.serie-obras-wrap .obra-fila2 .home-gallery__header { width: calc(100% - (var(--jg-gap) * 2) + 2.3px); margin-left: var(--jg-gap); margin-right: calc(var(--jg-gap) - 2.3px); }
/* Rejilla de detalles: usar márgenes estándar (ancho lo gobierna .home-gallery) */
/* Hacer que la rejilla de detalles tenga el mismo ancho visible que el título */
.serie-obras-wrap .obra-fila2 .home-gallery__grid {
  width: calc(100% - (var(--jg-gap) * 2) + 2.3px);
  margin: 12px calc(var(--jg-gap) - 2.3px) 0 var(--jg-gap);
}

/* (revert) Sin imagen principal: mantener reglas genéricas del contenedor */

/* Alinear el título negro de cada obra con los bordes de la ficha */
/* Igualar el ancho del título de cada obra al de Dibujos (sin ajustes extra) */
.serie-obras-wrap .obra-serie-item > .home-gallery .home-gallery__header {
  width: calc(100% - (var(--jg-gap) * 2) + 2.3px);
  margin-left: var(--jg-gap);
  margin-right: calc(var(--jg-gap) - 2.3px);
}
/* (revert) No forzar overrides específicos para no-image */
.serie-obras-wrap .obra-serie-item > .home-gallery { margin: 0 0 10px; }

/* (revert) mantener la barra negra también en el primer proyecto */

/* Overrides específicos para Pintura:
   - Colocados después de la regla genérica con +45px para asegurar precedencia
   - En desktop: mantener como está (igual que Dibujos)
   - En responsive: título a ancho completo del contenedor interno, sin fudge */
@media (min-width: 1025px) {
  .serie-obras-wrap .obra-serie-item--pintura > .home-gallery .home-gallery__header {
    width: calc(100% - (var(--jg-gap) * 2) + 2.3px);
    margin-left: var(--jg-gap);
    margin-right: calc(var(--jg-gap) - 2.3px);
  }
}
@media (max-width: 1024px) {
  .serie-obras-wrap .obra-serie-item--pintura > .home-gallery .home-gallery__header {
    width: 100% !important;
    margin: 0 !important;
  }
}

/* Hero de serie con el mismo ancho visible */
.proyecto-serie { width: min(var(--home-gallery-width), 100%); margin: 0 auto; padding: 0 var(--jg-gap); }

/* ===== Single Obra: usar estilo base sin overrides (hereda de Pintura) ===== */
/* No se necesitan reglas especiales aquí: el layout se alinea con las clases compartidas */
@media (max-width: 1024px) { .obra-fila1 { grid-template-columns: 1fr; } }

@media (min-width: 1025px) {
  .obra-fila1 { grid-template-columns: var(--obra-media-width) 1fr; gap: 28px; }
}
.obras-galeria {
  --jg-gap: 20px;
  width: min(var(--home-gallery-width), 100%);
  max-width: var(--home-gallery-width);
  margin: 0 auto;
  padding: 0 var(--jg-gap);
  box-sizing: border-box;
}

.obra-bloque {
  width: min(var(--obra-card-width), 100%);
  margin: 24px auto 40px;
  text-align: center;
  box-sizing: border-box;
}

.obra-bloque .obra-titulo,
.obras-galeria .titulo-disciplina {
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 12px 0;
  background-color: #000000;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-family: var(--font-title);
  font-weight: var(--font-title-weight);
  font-size: 0.95rem;
  text-align: center;
}

.obras-galeria .titulo-disciplina {
  background: transparent;
  color: #1a1a1a;
  margin-bottom: 18px;
}

.obra-bloque .obra-enlace {
  display: block;
  width: 100%;
  margin: 18px auto 16px;
}

.obra-bloque .obra-thumb-principal {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  object-fit: cover;
  object-position: center;
  margin: 0;
}

.obra-bloque .btn-galeria {
  display: inline-block;
  margin: 10px auto 0;
  padding: 10px 18px;
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border: 1px solid #111111;
  background: #111111;
  color: #ffffff;
  transition: background-color 0.25s ease, color 0.25s ease;
}

.obra-bloque .btn-galeria:hover,
.obra-bloque .btn-galeria:focus {
  background: #ffffff;
  color: #111111;
  text-decoration: none;
}

.obra-bloque .sin-imagen {
  margin: 18px auto 16px;
  font-size: 0.9rem;
  color: #666666;
}

/* =========================================================
   PROYECTOS (disciplina 'proyectos')
   - Centrado en la página
   - Título con la misma barra negra que Dibujos
   ========================================================= */
.obras-galeria--proyectos {
  /* Anchos visuales independientes para barra (título) e imagen */
  --proy-title-width: 900px; /* barra negra algo más pequeña */
  --proy-img-width: 520px;   /* imagen más pequeña */
  max-width: 1200px;
  margin: 24px auto 0;
  padding: 0 24px;
  text-align: center;
}

.obras-galeria--proyectos .obra-titulo { /* títulos por serie (barra negra) */
  display: block;
  width: calc(100% + 45px);
  margin: 0 -45px 10px 0;
  padding: 12px 0;
  background-color: #000000;
  color: #ffffff;
  font-size: 0.95rem; /* igual que los títulos de obras de dibujos */
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-align: center;
  font-family: var(--font-title);
  font-weight: var(--font-title-weight);
}
.obras-galeria--proyectos .titulo-disciplina { /* cabecera principal: texto simple, no barra */
  background: transparent;
  color: #1a1a1a;
  padding: 0;
  margin: 0 0 24px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-align: center;
}
.obras-galeria--proyectos .obra-bloque {
  text-align: center;
  margin: 24px auto 40px;
  width: var(--proy-title-width);      /* todos los bloques con el mismo ancho */
  max-width: 100%;                     /* responsive en pantallas pequeñas */
  display: flex;
  flex-direction: column;
  align-items: center; /* centra imagen y botón de forma robusta */
}
.obras-galeria--proyectos .obra-bloque:first-child {
  margin-top: 0;
}
.obras-galeria--proyectos .obra-bloque:first-child { margin-top: 0; }
.obras-galeria--proyectos .obra-enlace {
  display: block;
  width: min(100%, var(--proy-img-width)); /* todas la misma anchura, responsive si la pantalla es menor */
  margin: 18px auto 16px; /* centra el bloque de la imagen */
}
.obras-galeria--proyectos .obra-thumb-principal {
  display: block;
  width: 100%; /* ocupa el contenedor .obra-enlace */
  aspect-ratio: 16 / 9; /* horizontal (más ancha que alta) */
  height: auto; /* calculada por aspect-ratio */
  object-fit: cover; /* recorte uniforme */
  object-position: center;
  margin: 0; /* el margen lo aporta .obra-enlace */
}
/* Proyectos: alinear con barra (+45px) en tablet y desktop */
@media (min-width: 641px) {
  .obras-galeria--proyectos .obra-enlace { position: relative; left: 22.5px; }
}
@media (max-width: 640px) {
  .obras-galeria--proyectos { padding: 0 16px; }
  .obras-galeria--proyectos .obra-bloque { width: 100%; margin: 20px auto 32px; text-align: center; }
  /* Centrar imagen: eliminar offset en móvil */
  .obras-galeria--proyectos .obra-enlace { margin: 16px auto; position: static !important; left: auto !important; width: 100% !important; }
  .obras-galeria--proyectos .obra-thumb-principal { width: 100%; height: auto; aspect-ratio: 4 / 3; }
}
.obras-galeria--proyectos .btn-galeria {
  display: inline-block;
  margin: 10px auto 32px; /* centrado debajo de la imagen */
  padding: 8px 14px;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border: 1px solid #111;
  background: #fff;
  color: #111;
}
.obras-galeria--proyectos .btn-galeria:hover { background:#111;color:#fff; text-decoration:none; }

/* Corregir desplazamiento del título en responsive: centrar como la imagen */
@media (max-width: 640px) {
  .obras-galeria--proyectos .obra-titulo { width: 100% !important; margin: 0 0 10px !important; }
}

/* =========================================================
   PROYECTOS – páginas individuales
   - Portadas/featured de cada obra en formato cuadrado
   - Foco editable por dispositivo via variables (--opos-*)
   ========================================================= */
.single-serie-page .obra-thumb-principal,
.single-serie-page .proyecto-serie__image {
  aspect-ratio: var(--proy-single-aspect, 1 / 1); /* cuadrado por defecto */
  object-fit: cover;
  object-position: var(--opos-x, 50%) var(--opos-y, 50%);
}
@media (max-width: 1024px) {
  .single-serie-page .obra-thumb-principal,
  .single-serie-page .proyecto-serie__image {
    object-position: var(--opos-t-x, var(--opos-x, 50%)) var(--opos-t-y, var(--opos-y, 50%));
  }
}
@media (max-width: 640px) {
  .single-serie-page .obra-thumb-principal,
  .single-serie-page .proyecto-serie__image {
    object-position: var(--opos-m-x, var(--opos-t-x, var(--opos-x, 50%))) var(--opos-m-y, var(--opos-t-y, var(--opos-y, 50%)));
  }
}

/* Proyectos sin serie: portada/featured en cuadrado (single obra/proyecto) */
body.single-obra.disciplina-proyectos .obra-main-img,
body.single-obra.disciplina-proyecto .obra-main-img,
.single-proyecto .obra-main-img,
.single-proyecto .proyecto-serie__image,
.single-proyecto .obra-thumb-principal {
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  width: 100% !important;
  height: auto !important;
  object-position: center center;
}
/* Refuerzo extra en el contenedor principal (enlace) para asegurar cuadrado */
body.single-obra.disciplina-proyectos .obra-main-item,
body.single-obra.disciplina-proyecto .obra-main-item,
.single-proyecto .obra-main-item {
  aspect-ratio: 1 / 1 !important;
  display: block;
}
/* Refuerzo: neutralizar ajustes previos de contain/auto en main image */
body.single-obra.disciplina-proyectos .obra-main-img,
body.single-obra.disciplina-proyecto .obra-main-img,
.single-proyecto .obra-main-img {
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  width: 100% !important;
  height: auto !important;
}
/* Alinear botón con la imagen (mismo offset que la imagen) */
@media (min-width: 641px) {
  .obras-galeria--proyectos .btn-galeria { position: relative; left: 22.5px; }
}
@media (max-width: 640px) {
  /* Centrar botón en móvil */
  .obras-galeria--proyectos .btn-galeria { position: static !important; left: auto !important; }
}
/* =========================================================
   FOOTER
   ========================================================= */

#main-footer {
  background-color: #ffffff; /* limpio como la referencia */
  padding: 0; /* menos separación externa; el alto lo da min-height */
  color: #1a1a1a;
  min-height: var(--header-height, 150px); /* igual de grande que el header */
  display: block;
  /* Usa la fuente específica del footer (por defecto hereda del cuerpo) */
  font-family: var(--font-footer), var(--font-body), sans-serif;
}

/* (removed) FINAL OVERRIDES – Proyectos: se reemplaza por alineación basada en +45px */

.site-footer__inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 24px;
  min-height: var(--header-height, 150px); /* hereda el alto del footer */
  display: flex;
  flex-direction: column;
  justify-content: center; /* centra verticalmente */
  gap: 10px;
}

/* Marca superior centrada */
.site-footer__brand { text-align: center; margin-bottom: 0; }
.site-footer__title-link { display: inline-block; }
.site-footer__title { font-size: 1.6rem; font-weight: 400; letter-spacing: 0.02em; }
.site-footer__title-image { display: block; width: auto; height: 56px; margin: 0 auto; }

/* Barra inferior: menú centrado + iconos a la derecha */
.site-footer__bar {
  display: grid;
  grid-template-columns: 1fr auto 1fr; /* logos izquierda, centro (logo MM + menú), iconos derecha */
  align-items: center;
  gap: 12px;
  padding: 6px 0;
  min-height: 36px;
  overflow: visible; /* permite que el logo centrado flote encima sin empujar el menú */
}
.site-footer__branding { justify-self: start; }
.site-footer__center { justify-self: center; text-align: center; display: flex; flex-direction: row; align-items: center; gap: 14px; position: relative; }
/* Logo MM encima del menú, centrado */
.site-footer__center .site-footer__title-link { display: inline-flex; align-items: center; position: absolute; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); }
#main-footer .main-navbar__logo-img--2 { height: 56px; width: auto; display: block; }
.site-footer__center .site-footer__nav { margin: 0; padding: 0; }
.site-footer__center .site-footer__list { gap: 59px; align-items: center; }
.site-footer__social { display: inline-flex; align-items: center; gap: 6px; }
.site-footer__social { justify-self: end; }
.site-footer__social-li { display: inline-flex; align-items: center; margin-left: 12px; }
.site-footer__sep { display: inline-block; width: 12px; height: 1px; background: transparent; margin-right: 2px; }

.site-footer__list {
  display: flex;
  gap: 59px; /* separación entre enlaces del menú footer */
  list-style: none;
  margin: 0;
  padding: 0 0 0 95px;
  justify-content: space-between;
  align-items: center; /* alinear con los iconos como en navbar */
  max-width: 960px;
  width: 100%;
  margin-left: calc((100% - min(960px, 100%)) / 2 - 95px);
}
.site-footer__list a {
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 1.05rem; /* igual que navbar */
  font-weight: 400;
  text-decoration: none;
  color: inherit;
  /* Hereda la familia del footer para mantener consistencia */
  font-family: inherit;
  display: inline-block;
  transition: color .18s ease;
  white-space: nowrap;
}
.site-footer__list a:hover,
.site-footer__list a:focus { text-decoration: none; }

/* Hover: aclarar ligeramente el texto en footer */
.site-footer__list a:hover,
.site-footer__list a:focus { color: #333; }
/* Activo: más oscuro */
#main-footer .current-menu-item > a { color: #000; }

/* Iconos: reutiliza estilos del header, pero más pequeños en el footer */
/* Iconos del footer: mismas dimensiones que en navbar */
#main-footer .main-navbar__social { align-items: center; }
#main-footer .main-navbar__social-link { width: 36px; height: 36px; }

/* Desplazar el menú del footer ~100px a la izquierda (solo desktop) */
@media (min-width: 980px) {
  .site-footer__list {
    margin-left: calc((100% - min(960px, 100%)) / 2 - 185px);
  }
}
#main-footer .main-navbar__social-img { width: 32px; height: 32px; display: block; }

/* Fallback legacy styles (Divi default footer-bottom) */
#footer-bottom .container { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
#footer-bottom .container a { text-decoration: none; }
#footer-bottom .container a:hover,
#footer-bottom .container a:focus { text-decoration: underline; }

/* Footer responsive: apilar, centrar y eliminar offsets en móviles y tablets */
@media (max-width: 1024px) {
  .site-footer__inner { min-height: auto; padding: 16px; gap: 12px; }
  .site-footer__bar { display: flex; flex-direction: column; gap: 12px; align-items: center; padding: 10px 0; }
  .site-footer__branding { order: 0; }
  .site-footer__center { order: 1; display: flex; flex-direction: column; align-items: center; gap: 10px; position: static; }
  .site-footer__center .site-footer__title-link { position: static; bottom: auto; left: auto; transform: none; }
  .site-footer__nav { width: 100%; }
  .site-footer__list { padding: 0; margin: 0; width: 100%; max-width: none; justify-content: center; gap: 14px; flex-wrap: wrap; }
  .site-footer__social { order: 2; display: flex; justify-content: center; width: 100%; }
  #main-footer .main-navbar__social { justify-content: center; width: 100%; }
  .site-footer__social-li { margin-left: 8px; }
}

@media (max-width: 480px) {
  .site-footer__list a { font-size: 0.95rem; letter-spacing: 0.08em; }
  #main-footer .main-navbar__social-link { width: 30px; height: 30px; }
  #main-footer .main-navbar__social-img { width: 26px; height: 26px; }
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1024px) {
	.main-navbar__toggle { display: inline-flex; margin-left: auto; }

	.main-navbar__navigation {
		position: fixed;
		inset: 0 0 0 auto;
		width: min(320px, 84vw);
		height: 100vh;
		background-color: #ffffff; /* mobile panel fondo blanco */
		padding: 96px 32px;
		transform: translateX(100%);
		transition: transform 0.35s ease;
		display: block;
		pointer-events: none; /* no captura clics cuando está cerrado */
		z-index: 2000; /* por encima del contenido */
	}

	/* Close button (X) inside the side panel */
	.main-navbar__close { 
		display: inline-flex; 
		align-items: center; 
		justify-content: center; 
		position: absolute; 
		top: 24px; 
		right: 24px; 
		width: 36px; 
		height: 36px; 
		border: 0; 
		background: transparent; 
		color: #111111; /* icono de cierre negro en mobile */
		font-size: 28px; 
		line-height: 1; 
		cursor: pointer; 
	}
	.main-navbar__close:focus { outline: 2px solid #111; outline-offset: 2px; }

	.main-navbar__navigation.is-open {
		transform: translateX(0);
		box-shadow: -18px 0 48px rgba(0, 0, 0, 0.28);
		pointer-events: auto; /* clicable cuando está abierto */
	}

	.main-navbar__list {
		flex-direction: column;
		gap: 20px;
		align-items: flex-start;
	}

	/* Colocar redes debajo del menú en el panel móvil */
	.main-navbar__navigation .main-navbar__social {
		display: flex;
		gap: 10px;
		margin: 24px 0 0 0;
		justify-content: flex-start;
	}

	.main-navbar__link {
		font-family: 'Roboto', sans-serif;
		font-size: 0.95rem;
		color: #111111; /* enlaces negros en panel blanco */
		border: none;
	}

	/* Make dropdowns stack naturally inside the panel */
	.main-navbar__item { position: static; }
	.main-navbar__submenu {
		position: static;
		display: none;
		margin: 8px 0 0;
		padding: 8px 0;
		background-color: #ffffff; /* submenú blanco en mobile */
		box-shadow: none;
		min-width: 100%;
		border: 0;
		border-radius: 0;
	}
	/* Forzar color oscuro en enlaces del submenú en mobile (sobre-escribe !important de desktop) */
	.main-navbar__submenu .main-navbar__link { color: #111 !important; }
	.main-navbar__submenu .main-navbar__link:hover,
	.main-navbar__submenu .main-navbar__link:focus { color: #111 !important; background-color: rgba(0,0,0,0.06); }
	.main-navbar__submenu .main-navbar__item.is-active > .main-navbar__link,
	.main-navbar__submenu .main-navbar__link[aria-current="page"] { color: #111 !important; background-color: rgba(0,0,0,0.09); font-weight: 700; }
	.main-navbar__item--root.is-open > .main-navbar__submenu { display: block; }

	/* (caret removed per request) */

	.main-navbar__social {
		margin-left: auto;
	}
}

@media (max-width: 540px) {
	.main-navbar__inner {
		justify-content: space-between;
	}

	/* Mostrar redes también en móvil estrecho, debajo del menú */
	.main-navbar__navigation .main-navbar__social { display: flex; justify-content: center; margin-top: 20px; }

	.btn {
		width: 100%;
		padding: 14px;
	}
}

/* ===== Additional responsive tweaks ===== */
@media (max-width: 1280px) {
  .main-navbar__inner { padding: 28px 20px; gap: 24px; }
  .main-navbar__list { gap: 22px; }
  .main-navbar__logo-img--1 { height: 84px; }
  .main-navbar__logo-img--2 { height: 52px; }
}

@media (max-width: 900px) {
  .main-navbar__list { gap: 18px; }
  .main-navbar__link { font-size: 0.98rem; letter-spacing: 0.08em; padding: 8px 6px; }
  .home-hero__title-image { max-width: 360px; }
  .serie-obras-wrap { --obra-media-width: 520px; }
}

@media (max-width: 768px) {
  .main-navbar__logo-img--1 { height: 68px; }
  .main-navbar__logo-img--2 { height: 44px; }
  .main-navbar__inner { padding: 18px 16px; }
  .home-hero__title-image { max-width: 320px; }
  .serie-obras-wrap { --obra-media-width: 100%; }
  .proyecto-serie { padding: 0 var(--jg-gap); }
  .site-footer__list { flex-wrap: wrap; justify-content: center; gap: 14px; }
}

@media (max-width: 480px) {
  .main-navbar__logo-img--1 { height: 56px; }
  .main-navbar__logo-img--2 { height: 38px; }
  .main-navbar__link { font-size: 0.9rem; letter-spacing: 0.14em; }
  .home-hero__title-image { max-width: 260px; }
.obra-btn { width: 100%; text-align: center; }

/* Forzar estilo: botón negro y al pasar a blanco (disponibilidad) */
.obra-btn {
  background: #111 !important;
  color: #fff !important;
  border: 1px solid #111 !important;
}
.obra-btn:hover,
.obra-btn:focus {
  background: #fff !important;
  color: #111 !important;
}
  .obra-ficha p { font-size: 0.92rem; }
}

/* =========================================================
   LIGHTBOX – OVERLAY GLOBAL (para todas las secciones)
   ========================================================= */
body.obra-lightbox-open { overflow: hidden; }
.obra-lightbox { 
  position: fixed; inset: 0; z-index: 100000; 
  background: rgba(0,0,0,0.92);
  display: none; /* oculto por defecto para no verse en el footer */
  align-items: center; justify-content: center;
  pointer-events: none; /* se activa al abrir */
  padding-top: env(safe-area-inset-top, 0px);
}
.obra-lightbox.is-open { display: flex; pointer-events: auto; }
.obra-lightbox *, .obra-lightbox *::before, .obra-lightbox *::after { box-sizing: border-box; }
.obra-lightbox-inner { 
  position: relative; width: min(92vw, 1200px); height: min(84vh, 820px);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; background: transparent;
}
.obra-lightbox-img { max-width: 100%; max-height: 100%; object-fit: contain; transform: translate(0,0) scale(1); transition: transform .2s ease; cursor: grab; }
.obra-lightbox-img { touch-action: none; }
.obra-lightbox.is-zoomed .obra-lightbox-img { cursor: move; }
.obra-lightbox-close { position: absolute; top: calc(18px + env(safe-area-inset-top, 0px)); right: 18px; width: 40px; height: 40px; border: 0; background: transparent; color: #fff; font-size: 28px; line-height: 1; cursor: pointer; z-index: 100002; pointer-events: auto; touch-action: manipulation; }
.obra-lightbox-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border: 0; background: transparent; color: #fff; font-size: 32px; cursor: pointer; z-index: 100001; pointer-events: auto; touch-action: manipulation; }
.obra-lightbox-prev { left: 12px; }
.obra-lightbox-next { right: 12px; }
.obra-lightbox-counter { position: absolute; top: 18px; left: 18px; color: #fff; font-size: 14px; letter-spacing: .04em; }
.obra-lightbox-toolbar { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); display: flex; gap: 10px; }
.obra-lightbox-tool { width: 36px; height: 36px; border: 0; background: transparent; color: #fff; cursor: pointer; appearance: none; }
.obra-lightbox-tool:focus { outline: none; }

/* Móvil: hacer la imagen un poco más pequeña para no tapar flechas y cierre */
@media (max-width: 640px) {
  .obra-lightbox-inner { width: min(88vw, 1000px); height: min(74vh, 620px); }
  .obra-lightbox-close { width: 48px; height: 48px; font-size: 30px; }
}

/* =========================================================
   TEXTO JUSTIFICADO (contenido)
   ========================================================= */
/* Justificar párrafos y listas en zonas de contenido sin afectar menús ni títulos */
.entry-content p,
.entry-content li,
.et_pb_text p,
.et_pb_text li,
.proyecto-serie__content p,
.single-project .entry-content p,
.single-project .entry-content li,
.project .entry-content p,
.project .entry-content li,
.bio-content p,
.bio-texto p,
.obras-galeria--proyectos .proyecto-serie__content p,
.obras-galeria--proyectos .obra-descripcion p,
.serie-obras-wrap .obra-descripcion p,
.single-obra-page .obra-descripcion p,
.obra-ficha p { text-align: justify; text-justify: inter-word; }

/* =========================================================
   CONTACTO (ID o slug)
   ========================================================= */
/* Nota: añadimos clases semánticas vía JS en theme.js para tener ganchos de estilo. */
.page-id-4350 .contacto,
.page-slug-contacto .contacto,
.page-slug-contact .contacto { }
/* Títulos detectados (usar Roboto medio para coherencia) */
.page-id-4350 .contacto__heading,
.page-slug-contacto .contacto__heading,
.page-slug-contact .contacto__heading { 
  font-family: var(--font-title); 
  font-weight: var(--font-title-weight);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 1.2rem;
  line-height: 1.25;
  margin: 8px auto 14px;
  text-align: center;
}
.page-id-4350 .contacto__heading--redes,
.page-slug-contacto .contacto__heading--redes,
.page-slug-contact .contacto__heading--redes { }
.page-id-4350 .contacto__heading--form,
.page-slug-contacto .contacto__heading--form,
.page-slug-contact .contacto__heading--form { }
/* Textos secundarios detectados */
.page-id-4350 .contacto__subheading,
.page-slug-contacto .contacto__subheading,
.page-slug-contact .contacto__subheading { 
  font-family: var(--font-secondary); 
  font-weight: 400; 
  color: #333; 
}
.page-id-4350 .contacto-redes,
.page-slug-contacto .contacto-redes,
.page-slug-contact .contacto-redes { font-family: var(--font-secondary); }
.page-id-4350 .contacto-redes__list,
.page-slug-contacto .contacto-redes__list,
.page-slug-contact .contacto-redes__list { }
.page-id-4350 .contacto-redes__item,
.page-slug-contacto .contacto-redes__item,
.page-slug-contact .contacto-redes__item { }
.page-id-4350 .contacto-redes__link,
.page-slug-contacto .contacto-redes__link,
.page-slug-contact .contacto-redes__link { }
.page-id-4350 .contacto-form,
.page-slug-contacto .contacto-form,
.page-slug-contact .contacto-form { 
  font-family: var(--font-secondary); 
  max-width: 680px; 
  margin: 0 auto; /* centra el bloque del formulario */
}
.page-id-4350 .contacto-form-col,
.page-slug-contacto .contacto-form-col,
.page-slug-contact .contacto-form-col { width: 100%; margin: 0 auto; display: block; }
.page-id-4350 .contacto-form__input,
.page-slug-contacto .contacto-form__input,
.page-slug-contact .contacto-form__input { font-family: var(--font-secondary); font-weight: 400; }
.page-id-4350 .contacto-form__textarea,
.page-slug-contacto .contacto-form__textarea,
.page-slug-contact .contacto-form__textarea { font-family: var(--font-secondary); font-weight: 400; }
.page-id-4350 .contacto-form__submit,
.page-slug-contacto .contacto-form__submit,
.page-slug-contact .contacto-form__submit { font-family: var(--font-secondary); font-weight: 600; }

/* Centrar controles inferiores del formulario en Contacto */
.page-id-4350 .contacto-form .et_contact_bottom_container,
.page-slug-contacto .contacto-form .et_contact_bottom_container,
.page-slug-contact .contacto-form .et_contact_bottom_container { 
  float: none; 
  display: flex; 
  justify-content: center; 
  align-items: center; 
  gap: 12px; 
  text-align: center; 
}

/* Contacto: teléfono ocupa toda la fila (debajo de email) */
.page-id-4350 .contacto-form [data-id="phone"],
.page-slug-contacto .contacto-form [data-id="phone"],
.page-slug-contact .contacto-form [data-id="phone"] { 
  width: 100%; 
  float: none; 
  clear: both; 
}

/* Forzar peso 400 en texto secundario genérico (contenido) */
.entry-content p,
.et_pb_text p,
.proyecto-serie__content p,
.single-project .entry-content p,
.project .entry-content p,
.bio-content p,
.bio-texto p,
.serie-obras-wrap .obra-descripcion p,
.single-obra-page .obra-descripcion p,
.obra-ficha p { font-weight: 400; }

/* Ocultar newsletter en Contacto (fallback CSS por si JS no lo elimina) */
.page-id-4350 .et_pb_section:has(.tnp.tnp-subscription),
.page-slug-contacto .et_pb_section:has(.tnp.tnp-subscription),
.page-slug-contact .et_pb_section:has(.tnp.tnp-subscription) { display: none !important; }
/* Ocultar bloque de redes en Contacto como fallback */
.page-id-4350 .et_pb_social_media_follow,
.page-id-4350 .contacto-titulo,
.page-id-4350 .contacto-subtitulo,
.page-slug-contacto .et_pb_social_media_follow,
.page-slug-contacto .contacto-titulo,
.page-slug-contacto .contacto-subtitulo,
.page-slug-contact .et_pb_social_media_follow,
.page-slug-contact .contacto-titulo,
.page-slug-contact .contacto-subtitulo { display: none !important; }

/* Ocultar posibles formularios de plugins en Contacto (solo en esa página) */
.page-id-4350 .wpcf7, .page-slug-contacto .wpcf7, .page-slug-contact .wpcf7,
.page-id-4350 .wpforms-container, .page-slug-contacto .wpforms-container, .page-slug-contact .wpforms-container,
.page-id-4350 .nf-form-cont, .page-slug-contacto .nf-form-cont, .page-slug-contact .nf-form-cont,
.page-id-4350 .fluentform, .page-slug-contacto .fluentform, .page-slug-contact .fluentform,
.page-id-4350 .gform_wrapper, .page-slug-contacto .gform_wrapper, .page-slug-contact .gform_wrapper { display: none !important; }

/* =========================================================
   NEWSLETTER (MM Simple Newsletter)
   ========================================================= */
.mm-newsletter {
  max-width: 420px;
  margin: 24px auto;
  text-align: left;
}
.mm-newsletter .tnp-field {
  margin-bottom: 12px;
}
.mm-newsletter label {
  display: block;
  margin-bottom: 6px;
  font-family: var(--font-secondary);
  font-weight: 400;
  font-size: 0.9rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.mm-newsletter input.tnp-name,
.mm-newsletter input.tnp-email {
  display: block;
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #111111;
  border-radius: 0;
  font-family: var(--font-secondary);
  font-size: 0.95rem;
  font-weight: 400;
  color: #111111;
  background-color: #ffffff;
}
.mm-newsletter input.tnp-name::placeholder,
.mm-newsletter input.tnp-email::placeholder {
  color: #777777;
}
.mm-newsletter .tnp-field-button {
  margin-top: 14px;
}
.mm-newsletter input.tnp-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 22px;
  border-radius: 0;
  border: 1px solid #111111;
  background-color: #111111;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.78rem;
  font-family: var(--font-secondary);
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.mm-newsletter input.tnp-submit:hover,
.mm-newsletter input.tnp-submit:focus {
  background-color: #ffffff;
  color: #111111;
  border-color: #111111;
}
.mm-newsletter-message {
  margin-bottom: 14px;
  padding: 10px 12px;
  font-size: 0.9rem;
  font-family: var(--font-secondary);
}
.mm-newsletter-message--success {
  background-color: #e6f6ea;
  color: #166534;
  border-left: 3px solid #16a34a;
}
.mm-newsletter-message--error {
  background-color: #fef2f2;
  color: #b91c1c;
  border-left: 3px solid #ef4444;
}

/* (cookie banner styles removed — handled by plugin) */

/* =========================================================
   BIO PAGE
   ========================================================= */
.bio-page {
  max-width: 980px;
  margin: 0 auto;
  padding: 0 24px 40px;
}
.bio-hero { margin: 0 0 18px; }

/* =========================================================
   PÁGINAS LEGALES: quitar sidebar (Recent Posts)
   ========================================================= */
/* Oculta el sidebar y expande el contenido a ancho completo solo en estas páginas */
.page-slug-politica-de-cookies #sidebar,
.page-slug-politica-de-cookies .sidebar,
.page-slug-mas-informacion-sobre-las-cookies #sidebar,
.page-slug-mas-informacion-sobre-las-cookies .sidebar,
.page-slug-politica-de-privacidad #sidebar,
.page-slug-politica-de-privacidad .sidebar,
.page-slug-newsletter #sidebar,
.page-slug-newsletter .sidebar { display: none !important; }

.page-slug-politica-de-cookies #left-area,
.page-slug-mas-informacion-sobre-las-cookies #left-area,
.page-slug-politica-de-privacidad #left-area,
.page-slug-newsletter #left-area { width: 100% !important; padding-right: 0 !important; }

/* En Divi, cuando hay sidebar a la derecha, eliminar el separador visual en estas páginas */
.page-slug-politica-de-cookies .et_right_sidebar #main-content .container:before,
.page-slug-mas-informacion-sobre-las-cookies .et_right_sidebar #main-content .container:before,
.page-slug-politica-de-privacidad .et_right_sidebar #main-content .container:before,
.page-slug-newsletter .et_right_sidebar #main-content .container:before { display: none !important; }

/* Ocultar también la línea separadora incluso si no está la clase .et_right_sidebar */
.page-slug-politica-de-cookies #main-content .container:before,
.page-slug-mas-informacion-sobre-las-cookies #main-content .container:before,
.page-slug-politica-de-privacidad #main-content .container:before,
.page-slug-newsletter #main-content .container:before { display: none !important; width: 0 !important; background: transparent !important; }
.bio-image { display: block; width: 100%; height: auto; max-width: 760px; margin: 0 auto; }
.bio-content { max-width: 760px; margin: 0 auto; font-size: 1.02rem; line-height: 1.85; color: #1a1a1a; letter-spacing: 0.01em; font-family: var(--font-secondary); }
.bio-content { font-weight: 400; }
.bio-content p { margin: 0 0 14px; }
/* Detalle: capitular suave en el primer párrafo */
.bio-content p:first-of-type::first-letter { float: none; font-size: inherit; line-height: inherit; padding-right: 0; padding-top: 0; font-weight: inherit; color: inherit; }
/* Remate del último párrafo */
.bio-content p:last-of-type { font-weight: 600; letter-spacing: 0.02em; margin-top: 18px; }
@media (max-width: 768px) {
  .bio-page { padding: 0 18px 32px; }
  .bio-content { font-size: 0.98rem; line-height: 1.75; }
  /* Reducir la imagen en móvil para que no se vea demasiado grande */
  .bio-hero .bio-image { max-width: 520px; width: 100%; height: auto; margin-left: auto; margin-right: auto; }
}
/* Dos columnas en escritorio: imagen + texto */
@media (min-width: 1025px) {
  .bio-page {
    max-width: 1180px;
    padding: 0 var(--jg-gap, 24px) 48px;
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 32px;
    align-items: start;
  }
  .bio-image { max-width: 100%; margin: 0; }
  .bio-content { max-width: none; margin: 0; }
}

/* ===== Compat: Divi Builder bloques .bio-titulo / .bio-texto ===== */
.bio-titulo { display: none; }
.bio-texto,
.bio-texto .et_pb_text_inner {
  max-width: 760px;
  margin: 0 auto;
  font-size: 1.02rem;
  line-height: 1.85;
  letter-spacing: 0.01em;
  color: #1a1a1a;
  font-family: var(--font-secondary);
  font-weight: 400;
}
.bio-texto p { margin: 0 0 14px; }
.bio-texto p:first-of-type::first-letter { float: none; font-size: inherit; line-height: inherit; padding-right: 0; padding-top: 0; font-weight: inherit; color: inherit; }
.bio-texto p:last-of-type { font-weight: 600; letter-spacing: 0.02em; margin-top: 18px; }
@media (max-width: 768px) {
  .bio-texto, .bio-texto .et_pb_text_inner { font-size: 0.98rem; line-height: 1.75; }
}

/* =========================================================
   NEWSLETTER PAGE
   ========================================================= */

.newsletter-page {
    background: linear-gradient(180deg, #f7f5f2 0%, #ffffff 40%);
    padding: 100px 0 140px;
}

.newsletter-page__hero {
    text-align: center;
    margin-bottom: 48px;
}

.newsletter-page__hero-inner {
    max-width: 720px;
    margin: 0 auto;
}

.newsletter-page__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 16px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    background: rgba(0, 0, 0, 0.05);
    color: #111;
    text-transform: uppercase;
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    margin-bottom: 18px;
}

.newsletter-page__title {
    font-size: 2.4rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin: 0 0 18px;
}

.newsletter-page__subtitle {
    font-size: 1.06rem;
    line-height: 1.7;
    color: #2a2a2a;
    margin: 0;
}

.newsletter-page__content {
    max-width: var(--home-gallery-width, 960px);
    margin: 0 auto;
}

.newsletter-page__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 320px);
    gap: 40px;
    align-items: stretch;
}

.newsletter-page__card {
    background: #ffffff;
    border-radius: 14px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 22px 48px rgba(17, 17, 17, 0.12);
    padding: 42px 48px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.newsletter-page__card-title {
    margin: 0 0 12px;
    font-size: 1.6rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.newsletter-page__card-text {
    margin: 0;
    font-size: 1rem;
    line-height: 1.75;
    color: #333;
}

.newsletter-page__form form,
.newsletter-page__form .tnp-subscription {
    display: grid;
    gap: 18px;
}

.newsletter-page__form .tnp-field,
.newsletter-page__form p {
    margin: 0;
}

.newsletter-page__form label {
    display: block;
    font-size: 0.85rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 8px;
    color: #1a1a1a;
}

.newsletter-page__form input[type="email"],
.newsletter-page__form input[type="text"],
.newsletter-page__form input[type="name"],
.newsletter-page__form input[type="tel"],
.newsletter-page__form select,
.newsletter-page__form textarea {
    width: 100%;
    padding: 14px 18px;
    font-family: var(--font-body);
    font-size: 1rem;
    border: 1px solid rgba(0, 0, 0, 0.16);
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.92);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.newsletter-page__form input[type="email"]:focus,
.newsletter-page__form input[type="text"]:focus,
.newsletter-page__form input[type="name"]:focus,
.newsletter-page__form input[type="tel"]:focus,
.newsletter-page__form select:focus,
.newsletter-page__form textarea:focus {
    outline: none;
    border-color: #111111;
    box-shadow: 0 0 0 3px rgba(17, 17, 17, 0.12);
}

.newsletter-page__form .tnp-submit,
.newsletter-page__form input[type="submit"],
.newsletter-page__form button[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 36px;
    background: #111111;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 0.82rem;
    border: 1px solid #111111;
    border-radius: 999px;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.newsletter-page__form .tnp-submit:hover,
.newsletter-page__form input[type="submit"]:hover,
.newsletter-page__form button[type="submit"]:hover,
.newsletter-page__form .tnp-submit:focus,
.newsletter-page__form input[type="submit"]:focus,
.newsletter-page__form button[type="submit"]:focus {
    background: #ffffff;
    color: #111111;
    transform: translateY(-1px);
}

.newsletter-page__form .tnp-success,
.newsletter-page__form .tnp-message,
.newsletter-page__form .tnp-field.tnp-field-button {
    text-align: left;
}

.newsletter-page__form .tnp-success,
.newsletter-page__form .tnp-confirmation {
    padding: 18px 24px;
    background: rgba(17, 17, 17, 0.06);
    border-radius: 8px;
    border: 1px solid rgba(17, 17, 17, 0.12);
    color: #1f1f1f;
    font-size: 0.96rem;
}

.newsletter-page__aside {
    background: linear-gradient(180deg, #141414 0%, #000000 100%);
    border-radius: 14px;
    color: #ffffff;
    padding: 40px 36px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 22px 48px rgba(0, 0, 0, 0.25);
}

.newsletter-page__aside::before {
    content: '';
    position: absolute;
    inset: -20% 50% auto -20%;
    height: 140%;
    background: radial-gradient(circle at top, rgba(255, 255, 255, 0.18), transparent 55%);
    opacity: 0.35;
}

.newsletter-page__aside-inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.newsletter-page__aside-title {
    margin: 0;
    text-transform: uppercase;
    font-size: 1.1rem;
    letter-spacing: 0.08em;
}

.newsletter-page__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
    font-size: 0.98rem;
    line-height: 1.7;
}

.newsletter-page__list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.newsletter-page__list li::before {
    content: '';
    width: 10px;
    height: 10px;
    margin-top: 7px;
    border-radius: 50%;
    background: #ffffff;
    flex-shrink: 0;
}

.newsletter-page__note {
    margin-top: auto;
    font-size: 0.85rem;
    line-height: 1.6;
    opacity: 0.85;
}

@media (max-width: 980px) {
    .newsletter-page {
        padding: 80px 0 120px;
    }

    .newsletter-page__grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .newsletter-page__aside {
        order: -1;
    }
}

@media (max-width: 600px) {
    .newsletter-page__card {
        padding: 32px 28px;
    }

    .newsletter-page__aside {
        padding: 32px 28px;
    }

    .newsletter-page__title {
        font-size: 1.9rem;
        letter-spacing: 0.06em;
    }
}

/* Pintura — alargar barra del título +35px hacia la derecha (solo desktop, ≥1025px) */
@media (min-width: 1025px) {
  .serie-obras-wrap .obra-serie-item--pintura > .home-gallery .home-gallery__header {
    box-sizing: border-box;
    width: calc(100% - (var(--jg-gap) * 2) + 2.3px + 34px) !important;
    margin-left: var(--jg-gap) !important;
    margin-right: calc(var(--jg-gap) - 2.3px - 34px) !important;
  }
}

/* ===== Single Obra: heredar medidas de Pintura (sin overrides específicos) ===== */
