/* ROKKUS — estructura, cabecera, pie, páginas y portada.
   Medidas tomadas del sitio anterior (Kadence). Se conservan sus clases para que los
   ajustes de los mu-plugins del sitio (rokkus-avenir-font, clappbox-product-layout, CSS
   adicional) sigan aplicando igual. */

/* Paleta y variables globales que usan los bloques de Kadence Blocks de las páginas.
   :root:root le gana a la paleta por defecto que imprime Kadence Blocks. */
:root:root {
	--global-palette1: #2B6CB0;
	--global-palette2: #215387;
	--global-palette3: #1A202C;
	--global-palette4: #2D3748;
	--global-palette5: #4A5568;
	--global-palette6: #718096;
	--global-palette7: #f7fafc;
	--global-palette8: #F7FAFC;
	--global-palette9: #ffffff;
	--global-palette-highlight: #000000;
	--global-palette-highlight-alt: #222222;
	--global-palette-highlight-alt2: var(--global-palette9);
	--global-palette-btn-bg: #000000;
	--global-palette-btn-bg-hover: #222222;
	--global-palette-btn: var(--global-palette9);
	--global-palette-btn-hover: var(--global-palette9);
	--global-body-font-family: Montserrat, sans-serif;
	--global-heading-font-family: Montserrat, sans-serif;
	--global-gray-400: #CBD5E0;
	--global-gray-500: #A0AEC0;
	--global-xs-spacing: 1em;
	--global-sm-spacing: 1.5rem;
	--global-md-spacing: 2rem;
	--global-lg-spacing: 2.5em;
	--global-xl-spacing: 3.5em;
	--global-xxl-spacing: 5rem;
	--global-edge-spacing: 1.5rem;
	--global-boxed-spacing: 2rem;
	--global-content-width: 1290px;
	--global-content-edge-padding: 1.5rem;
	--global-content-boxed-padding: 2rem;
	--global-kb-row-default-top: var(--global-sm-spacing);
	--global-kb-row-default-bottom: var(--global-sm-spacing);
}

/* ── Base ─────────────────────────────────────────────────────────── */
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #fff; color: #000; font-family: var(--global-body-font-family); font-size: 16px; font-weight: 500; line-height: 1.15; -webkit-font-smoothing: antialiased; }
*, *::before, *::after { box-sizing: border-box; }
img { max-width: 100%; height: auto; }
h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; font-family: var(--global-heading-font-family); }
p { margin-top: 0; }
a { color: #000; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; transition: color .1s linear; }
a:hover { color: #222; }
button { font: inherit; }
.screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; word-wrap: normal !important; }
.screen-reader-text:focus { clip: auto !important; height: auto; width: auto; display: block; padding: 10px; background: #fff; z-index: 100000; }

/* Pie siempre abajo: la columna de bloques ocupa al menos la pantalla. */
.wp-site-blocks { display: flex; flex-direction: column; min-height: 100vh; }
.wp-site-blocks > .wrap { flex: 1 0 auto; }
.wp-site-blocks > * { margin-block-start: 0; margin-block-end: 0; }

.site-container { max-width: var(--global-content-width); margin-left: auto; margin-right: auto; padding-left: var(--global-content-edge-padding); padding-right: var(--global-content-edge-padding); }

/* ── Cabecera ─────────────────────────────────────────────────────── */
.rk-tp-cabecera { position: relative; z-index: 1000; }
.site-header { position: relative; z-index: 1000; background: var(--global-palette9); }
.site-main-header-inner-wrap { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; min-height: 80px; }
.site-header-section { display: flex; align-items: center; min-height: 80px; }
.site-header-section-center { justify-content: center; }
.site-header-section-right { justify-content: flex-end; }
.site-branding a.brand { display: flex; align-items: center; gap: 16px; text-decoration: none; }
.site-branding a.brand img { display: block; max-width: 100px; width: auto; height: auto; }
#mobile-header { display: none; }

/* Menús de escritorio */
.header-navigation ul { list-style: none; margin: 0; padding: 0; }
.header-navigation .header-menu-container > ul { display: flex; flex-wrap: wrap; align-items: center; }
.header-navigation li { position: relative; }
.header-navigation .header-menu-container > ul > li.menu-item > a { display: block; padding: .6em .6em; color: #000; text-decoration: none; font-size: 16px; line-height: 1.15; }
.header-navigation .header-menu-container > ul > li.menu-item > a:hover { color: #000; }
.nav-drop-title-wrap { position: relative; display: block; padding-right: 1em; }
.dropdown-nav-toggle { position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: flex; align-items: center; font-size: .9em; width: .9em; height: .9em; }
.kadence-svg-iconset { display: inline-flex; align-self: center; }
.kadence-svg-iconset svg { width: 1em; height: 1em; }
.dropdown-nav-toggle .kadence-svg-iconset svg { width: .9em; height: .9em; }

.header-navigation ul ul.sub-menu { position: absolute; top: 100%; left: 0; z-index: 1000; min-width: 100%; background: var(--global-palette3); box-shadow: 0 2px 13px 0 rgba(0, 0, 0, .1); opacity: 0; visibility: hidden; clip: rect(0, 0, 0, 0); transition: opacity .2s ease; }
.header-navigation li:hover > ul.sub-menu,
.header-navigation li:focus-within > ul.sub-menu { opacity: 1; visibility: visible; clip: auto; }
.header-navigation .header-menu-container ul ul li.menu-item { border-bottom: 1px solid rgba(255, 255, 255, .1); }
.header-navigation .header-menu-container ul ul li.menu-item > a { display: block; width: 200px; padding: 1em; color: var(--global-palette8); font-size: 12px; line-height: 1.15; text-decoration: none; }
.header-navigation .header-menu-container ul ul li.menu-item > a:hover { color: var(--global-palette9); background: var(--global-palette4); }
.secondary-navigation ul ul.sub-menu { left: auto; right: 0; }

/* Cabecera transparente sobre la foto de la portada */
@media (min-width: 1025px) {
	.transparent-header #masthead { position: absolute; left: 0; right: 0; z-index: 100; background: transparent; }
	.transparent-header .header-navigation .header-menu-container > ul > li.menu-item > a { color: var(--global-palette9); }
}

/* ── Cabecera del celular y panel ─────────────────────────────────── */
@media (max-width: 1024px) {
	#main-header { display: none; }
	#mobile-header { display: block; }
	#mobile-header .site-main-header-inner-wrap { grid-template-columns: 1fr auto; }
	.mobile-transparent-header #masthead { position: absolute; left: 0; right: 0; z-index: 100; background: transparent; }
	.mobile-transparent-header .mobile-toggle-open-container .menu-toggle-open { color: var(--global-palette9); }
}
.mobile-toggle-open-container .menu-toggle-open { display: flex; align-items: center; background: transparent; border: 0; box-shadow: none; padding: .4em .6em; font-size: 14px; line-height: 1.6; color: var(--global-palette5); cursor: pointer; }
.mobile-toggle-open-container .menu-toggle-open:hover { color: var(--global-palette-highlight); }
.menu-toggle-open .menu-toggle-icon { display: flex; font-size: 20px; }

#mobile-drawer { position: fixed; inset: 0; z-index: 100000; }
#mobile-drawer[hidden] { display: none; }
#mobile-drawer .drawer-overlay { position: fixed; inset: 0; background: rgba(0, 0, 0, .4); }
#mobile-drawer .drawer-inner { position: fixed; top: 0; right: 0; bottom: 0; width: 100%; max-width: 90%; background: #090c10; color: var(--global-palette8); display: flex; flex-direction: column; overflow: auto; }
#mobile-drawer .drawer-header { display: flex; justify-content: flex-end; min-height: calc(1.2em + 24px); padding: 0 1.5em; }
#mobile-drawer .drawer-header .drawer-toggle { background: transparent; border: 0; color: inherit; padding: .6em .15em; font-size: 24px; line-height: 1; cursor: pointer; display: flex; align-items: center; }
#mobile-drawer .drawer-header .drawer-toggle .kadence-svg-iconset svg { width: 24px; height: 24px; }
#mobile-drawer .drawer-content { padding: 0 1.5em 1.5em; }
.mobile-navigation ul { list-style: none; margin: 0; padding: 0; }
.mobile-navigation ul li { font-size: 14px; position: relative; }
.mobile-navigation ul li a { display: block; padding: 1em .5em; color: var(--global-palette8); text-decoration: none; }
.mobile-navigation ul li:not(.menu-item-has-children) > a,
.mobile-navigation ul li.menu-item-has-children > .drawer-nav-drop-wrap { border-bottom: 1px solid rgba(255, 255, 255, .1); }
.mobile-navigation .drawer-nav-drop-wrap { display: flex; align-items: stretch; }
.mobile-navigation .drawer-nav-drop-wrap > a { flex: 1; }
.mobile-navigation .drawer-sub-toggle { background: transparent; border: 0; border-left: 1px solid rgba(255, 255, 255, .1); border-radius: 0; color: inherit; padding: .5em .7em; font-size: 18px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; width: 44px; }
.mobile-navigation .drawer-sub-toggle .kadence-svg-iconset { transition: transform .2s ease; }
.mobile-navigation .drawer-sub-toggle[aria-expanded="true"] .kadence-svg-iconset { transform: rotate(180deg); }
.mobile-navigation ul ul.sub-menu { display: none; padding-left: 1em; }
.mobile-navigation li.rk-abierto > ul.sub-menu { display: block; }
body.rk-panel-abierto { overflow: hidden; }

/* ── Encabezado de sección (título centrado) ──────────────────────── */
.entry-hero { position: relative; }
.entry-hero .entry-header { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; min-height: 200px; }
.entry-hero.product-archive-hero-section .entry-header { min-height: 100px; }
.entry-hero .page-title { font-size: 32px; font-weight: 500; line-height: 1.5; color: var(--global-palette3); margin: 0; }
.product-archive-hero-section .page-title { text-transform: capitalize; }

/* ── Contenido ────────────────────────────────────────────────────── */
#inner-wrap .content-area { margin-top: 5rem; margin-bottom: 5rem; }
#inner-wrap .entry-hero + .content-area { margin-top: 2rem; }
body.page #inner-wrap .content-area { margin-top: 0; }
@media (max-width: 1024px) {
	#inner-wrap .content-area { margin-top: 3rem; margin-bottom: 3rem; }
	:root:root { --global-content-boxed-padding: 2rem; }
}
@media (max-width: 767px) {
	#inner-wrap .content-area { margin-top: 2rem; margin-bottom: 2rem; }
	:root:root { --global-content-boxed-padding: 1.5rem; }
}
.entry.single-entry { background: var(--global-palette9); border-radius: .25rem; }
.entry-content-wrap { padding: 2rem; }
@media (max-width: 767px) {
	.entry-content-wrap { padding: 1.5rem; }
	.entry.single-entry { margin-left: -1rem; margin-right: -1rem; }
}
/* Bloques de HTML propios de páginas del sitio (Contacto) */
.entry-content .rokkus-contact-info { margin-top: 0; }

.entry-content { word-break: break-word; }
.entry-content::after { content: ""; display: table; clear: both; }
.entry-content p { margin: 0 0 var(--global-md-spacing); }
.entry-content > :last-child { margin-bottom: 0; }
.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6 { margin: 1.5em 0 .5em; }
.entry-content :is(h1, h2, h3, h4, h5, h6):first-child,
.entry-content > :first-child,
.entry-content :where(.wp-block-column, .wp-block-group, .kt-inside-inner-col) > :first-child { margin-top: 0; }
.entry-content :where(.wp-block-column, .kt-inside-inner-col) > :last-child { margin-bottom: 0; }
.entry-content ul, .entry-content ol { margin: 0 0 var(--global-md-spacing); padding-left: 2em; }
.entry-content .alignfull { margin-left: calc(-1 * var(--global-content-boxed-padding)); margin-right: calc(-1 * var(--global-content-boxed-padding)); }

/* Botones (los del sitio: negros, sin redondeo fuerte) */
button, .button, input[type="button"], input[type="reset"], input[type="submit"] { background: var(--global-palette-btn-bg); color: var(--global-palette-btn); border: 0; border-radius: 3px; padding: .4em 1em; font-family: inherit; font-size: 1.125rem; font-weight: 400; line-height: 1.6; text-decoration: none; cursor: pointer; box-shadow: 0 0 0 -7px rgba(0, 0, 0, 0); transition: all .2s ease; display: inline-block; }
button:hover, .button:hover, input[type="submit"]:hover { background: var(--global-palette-btn-bg-hover); color: var(--global-palette-btn-hover); }
.mobile-toggle-open-container button, #mobile-drawer button, .header-navigation button, .clappbox-filter-btn { font-size: inherit; }

/* Formularios */
input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="date"], select, textarea {
	font-family: inherit; font-size: 1em; color: var(--global-palette5); background: var(--global-palette9); border: 1px solid var(--global-gray-400); border-radius: 3px; padding: .4em .5em; max-width: 100%; box-shadow: 0 0 0 -7px rgba(0, 0, 0, 0); transition: all .1s linear;
}
input:focus, select:focus, textarea:focus { color: var(--global-palette3); border-color: var(--global-gray-500); outline: 0; box-shadow: 0 5px 15px -7px rgba(0, 0, 0, .1); }

/* ── Columna lateral ──────────────────────────────────────────────── */
@media (min-width: 1025px) {
	.has-sidebar .content-container { display: grid; grid-template-columns: 20% 1fr; gap: var(--global-xl-spacing); justify-content: center; }
	.has-left-sidebar #secondary { grid-column: 1; grid-row: 1; }
	.has-left-sidebar .site-main { grid-column: 2; grid-row: 1; min-width: 0; }
}
@media (max-width: 1024px) { .primary-sidebar { padding: 1.5rem 0; } }
.primary-sidebar.widget-area .widget { margin-bottom: 1.5em; color: var(--global-palette4); }
.primary-sidebar.widget-area .widget-title { font-size: 20px; font-weight: 500; line-height: 1.5; color: var(--global-palette3); text-transform: uppercase; margin: 0 0 10px; }
.primary-sidebar .widget ul { list-style: none; margin: 0; padding: 0; }
.primary-sidebar .widget li { line-height: 1.8; }
.primary-sidebar .widget li a { display: block; line-height: 2; color: var(--global-palette3); text-decoration: none; border-bottom: 1px solid var(--global-palette8); }
.primary-sidebar .widget li a:hover { color: #000; }
.primary-sidebar .widget li.current-cat > a { font-weight: 700; }

/* ── Pie ──────────────────────────────────────────────────────────── */
.site-footer .site-footer-row { display: grid; }
.site-middle-footer-wrap .site-footer-row-container-inner { background: var(--global-palette9); }
.site-middle-footer-inner-wrap { padding-top: 5px; padding-bottom: 5px; grid-column-gap: 30px; grid-row-gap: 30px; justify-content: center; }
.footer-social-wrap .footer-social-inner-wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; font-size: 1em; gap: .3em; }
.footer-social-inner-wrap .social-button { display: inline-flex; align-items: center; justify-content: center; width: 2em; height: 2em; border: 2px none transparent; border-radius: 3px; background: var(--global-palette8); color: var(--global-palette4); text-decoration: none; transition: color .2s, background .2s; }
.footer-social-inner-wrap .social-button:hover { background: var(--global-palette-btn-bg); color: var(--global-palette-btn); }
.site-bottom-footer-wrap .site-footer-row-container-inner { background: #1d2327; font-size: 13px; color: var(--global-palette8); }
.site-bottom-footer-inner-wrap { padding-top: 0; padding-bottom: 0; grid-column-gap: 30px; justify-content: center; }
.footer-html { margin: 1em 0; }
.footer-html p { margin: 0; text-align: center; }
.site-footer .site-bottom-footer-wrap a { color: var(--global-palette8); text-decoration: none; }

/* ── Portada: foto o video a pantalla completa, sin scroll ────────────
   El contenedor ocupa la pantalla (svh: la altura con la barra del navegador
   visible); el <main> rellena el espacio entre la cabecera (transparente, no ocupa
   alto) y el pie, y la imagen/video lo cubre entero. En Android el mu-plugin
   rokkus-home-fullheight fija además la altura real con window.innerHeight. */
.home .wp-site-blocks { min-height: 100vh; min-height: 100svh; }
.rk-inicio { position: relative; flex: 1 1 auto; min-height: 0; overflow: hidden; }
.rk-inicio > .entry-content, .rk-portada { position: static; margin: 0; }
.rk-portada__img, .rk-portada__video { position: absolute; inset: 0; margin: 0 !important; max-width: none !important; width: 100%; height: 100%; }
.rk-portada__img img, .rk-portada__video video { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; display: block; margin: 0; }
.rk-portada__img--movil { display: none; }
@media (max-width: 767px) {
	.rk-portada__img--movil { display: block; }
	.rk-portada:has(.rk-portada__img--movil) .rk-portada__img:not(.rk-portada__img--movil) { display: none; }
}
/* Texto opcional sobre el fondo */
.rk-portada__texto { position: absolute; z-index: 2; left: 0; right: 0; bottom: 12%; padding: 0 1.5rem; text-align: center; color: #fff; }
.rk-portada__texto * { color: #fff; }

/* ── Resultados de búsqueda (tarjetas como en Kadence) ────────────── */
body.search { background: var(--global-palette8); }
.search-archive-title { margin: 0 0 1rem; }
.search-archive-title .page-title { font-size: 32px; font-weight: 500; line-height: 1.5; color: var(--global-palette3); }
.rk-busqueda .wp-block-post-template { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.5rem; list-style: none; margin: 0; padding: 0; }
@media (min-width: 576px) { .rk-busqueda .wp-block-post-template { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1025px) { .rk-busqueda .wp-block-post-template { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rk-busqueda .wp-block-post-template > li { margin: 0; }
.rk-busqueda .loop-entry { height: 100%; background: var(--global-palette9); border-radius: .25rem; box-shadow: 0 15px 15px -10px rgba(0, 0, 0, .05); overflow: hidden; }
.rk-busqueda .post-thumbnail { margin: 0; }
.rk-busqueda .post-thumbnail img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rk-busqueda .entry-content-wrap { padding: 2rem; }
.rk-busqueda .entry-title { font-size: 28px; font-weight: 500; line-height: 1.5; color: var(--global-palette3); margin: 0; }
.rk-busqueda .entry-title a { color: inherit; text-decoration: none; }
.rk-busqueda .entry-meta { font-size: 80%; margin: .8em 0; }
.rk-busqueda .entry-summary { margin: 1rem 0 0; }
.rk-busqueda .entry-summary p { margin: 1rem 0; }
.rk-busqueda .entry-summary p:first-child { margin-top: 0; }
.rk-busqueda .post-more-link { font-size: 80%; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #000; text-decoration: none; }
.rk-busqueda .post-more-link::after { content: " →"; }
.rk-busqueda .pagination { margin: 2.5rem 0; display: flex; justify-content: center; gap: .5em; }
.rk-busqueda .pagination a, .rk-busqueda .pagination .page-numbers { display: inline-block; min-width: 2.5em; line-height: 2.25em; text-align: center; border: 2px solid transparent; border-radius: .25rem; text-decoration: none; color: inherit; }
.rk-busqueda .pagination .current { background: var(--global-palette-btn-bg); border-color: var(--global-palette-btn-bg); color: var(--global-palette-btn); }