/*
Theme Name: Sinapsia Hub
Theme URI: https://sinapsiahub.com
Author: Sinapsia Hub
Description: Tema de bloques a medida para Sinapsia Hub. Naranja, negro y blanco; tipografía Schibsted Grotesk.
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sinapsiahub
*/

/* ---------- Base ---------- */
a { text-decoration-color: var(--wp--preset--color--naranja); text-decoration-thickness: 2px; text-underline-offset: 0.22em; }
a:hover { color: var(--wp--preset--color--naranja); }
::selection { background: var(--wp--preset--color--naranja); color: var(--wp--preset--color--negro); }

/* ---------- Logotipo (texto) ---------- */
.sh-wordmark {
	font-family: var(--wp--preset--font-family--schibsted);
	font-weight: 800;
	font-size: 1.5rem;
	line-height: 1;
	letter-spacing: -0.05em;
	color: var(--wp--preset--color--negro);
	text-decoration: none;
	white-space: nowrap;
	display: inline-block;
}
.sh-wordmark:hover { color: var(--wp--preset--color--negro); }
.sh-wordmark .sh-i { position: relative; display: inline-block; color: var(--wp--preset--color--naranja); }
.sh-wordmark .sh-i > span { position: absolute; left: 0; top: 0; color: var(--wp--preset--color--negro); }
.sh-wordmark .sh-hub { color: var(--wp--preset--color--gris-hub); }
.sh-wordmark--small { font-size: 1.125rem; }

/* ---------- Cabecera y pie ---------- */
.sh-header { padding-top: 1.5rem; padding-bottom: 1.25rem; border-bottom: 1px dotted var(--wp--preset--color--gris-hub); background: var(--wp--preset--color--blanco); }
.sh-header .wp-block-navigation { font-size: 0.875rem; gap: 1.5rem; }
.sh-header .wp-block-navigation a { text-decoration: none; }
.sh-header .wp-block-navigation a:hover { text-decoration: underline; text-decoration-color: var(--wp--preset--color--naranja); }

.sh-footer { padding-top: 2rem; padding-bottom: 2.5rem; background: var(--wp--preset--color--negro); color: #BDBDBD; font-size: var(--wp--preset--font-size--pie); }
.sh-footer a { color: #BDBDBD; text-decoration: none; }
.sh-footer a:hover { color: var(--wp--preset--color--blanco); }
.sh-footer p { margin: 0; }
.sh-footer .sh-wordmark,
.sh-footer .sh-wordmark:hover,
.sh-footer .sh-wordmark .sh-i > span { color: var(--wp--preset--color--blanco); }

/* ---------- Secciones ---------- */
.sh-main { margin-block-start: 0; }
.sh-main > * { margin-block-start: 0; }
.sh-section { padding-top: var(--wp--preset--spacing--60); padding-bottom: var(--wp--preset--spacing--60); }

.sh-section--suave { background: var(--wp--preset--color--suave); }
.sh-section--papel { background: var(--wp--preset--color--papel); }
.sh-section--naranja { background: var(--wp--preset--color--naranja); color: var(--wp--preset--color--negro); }
.sh-section--negro { background: var(--wp--preset--color--negro); color: var(--wp--preset--color--blanco); }

.sh-section--naranja a,
.sh-section--naranja a:hover { color: var(--wp--preset--color--negro); text-decoration-color: var(--wp--preset--color--negro); }
.sh-section--naranja .wp-block-button__link:hover { background: var(--wp--preset--color--blanco); color: var(--wp--preset--color--negro); }

.sh-section--negro a { color: var(--wp--preset--color--blanco); }
.sh-section--negro .sh-kicker { color: var(--wp--preset--color--naranja); }

/* Textos */
/* Naranja oscurecido para textos pequeños: se lee bien sobre blanco */
.sh-kicker { font-size: var(--wp--preset--font-size--pie); font-weight: 700; letter-spacing: 0.02em; color: #B8431A; margin: 0; }
.sh-section--naranja .sh-kicker { color: var(--wp--preset--color--negro); }
.sh-display { font-size: var(--wp--preset--font-size--display); line-height: 0.98; letter-spacing: -0.055em; }
.sh-hero .sh-display { font-size: clamp(2.5rem, 5.2vw, 4.5rem); }
.sh-lead { font-size: var(--wp--preset--font-size--destacado); font-weight: 500; max-width: 40ch; }
.sh-num { font-size: var(--wp--preset--font-size--pie); font-weight: 800; color: #B8431A; margin: 0; }
.sh-section--naranja .sh-num { color: var(--wp--preset--color--negro); }
.sh-muted { color: var(--wp--preset--color--gris); }

/* Columnas texto + ilustración */
.sh-split { gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.sh-split .wp-block-image img { width: 100%; height: auto; }

/* Rejilla con filete */
.sh-grid { gap: 2rem; }
.sh-grid > .wp-block-column { border-top: 1px dotted var(--wp--preset--color--gris-hub); padding-top: 1.25rem; }
.sh-grid h3 { margin-top: 1rem; }
.sh-grid .wp-block-image { margin: 0; background: var(--wp--preset--color--suave); padding: 1.5rem; }
.sh-grid .wp-block-image img { width: 100%; height: auto; display: block; }

/* Tarjetas */
.sh-cards { gap: 1.25rem; margin-top: 2rem; }
.sh-cards + .sh-cards { margin-top: 1.25rem; }
.sh-cards > .wp-block-column { background: var(--wp--preset--color--papel); padding: 1.75rem; border-top: 4px solid var(--wp--preset--color--naranja); }
.sh-cards--blancas > .wp-block-column { background: var(--wp--preset--color--blanco); border-top-color: var(--wp--preset--color--negro); }
.sh-cards h3 { font-size: 1.25rem; margin-top: 0.5rem; }
.sh-cards p { margin-top: 0.6rem; font-size: 0.975rem; }

/* Lista con marcas */
.sh-checks { list-style: none; padding-left: 0; margin-top: 2rem; }
.sh-checks li { position: relative; padding-left: 1.75rem; margin-bottom: 1rem; color: #E6E6E6; }
.sh-checks li strong { color: var(--wp--preset--color--blanco); }
.sh-checks li::before { content: ""; position: absolute; left: 0; top: 0.5em; width: 0.7rem; height: 0.7rem; background: var(--wp--preset--color--naranja); }

/* Preguntas frecuentes */
.sh-faq { background: var(--wp--preset--color--blanco); padding: 1.25rem 1.5rem; margin-top: 0.75rem; }
.sh-faq summary { font-weight: 700; font-size: 1.125rem; cursor: pointer; }
.sh-faq summary::marker { color: var(--wp--preset--color--naranja); }
.sh-faq[open] summary { margin-bottom: 0.5rem; }

/* Botones */
.wp-block-button.is-style-outline > .wp-block-button__link { background: transparent; color: var(--wp--preset--color--negro); border: 2px solid var(--wp--preset--color--negro); }
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--wp--preset--color--negro); color: var(--wp--preset--color--blanco); }

/* Páginas interiores */
.sh-page { padding-top: var(--wp--preset--spacing--50); padding-bottom: var(--wp--preset--spacing--60); }

/* Móvil: la ilustración del principio, debajo y más pequeña */
@media (max-width: 781px) {
	.sh-split .wp-block-image { max-width: 420px; margin-inline: auto; }
}