/*
Theme Name: Latim Forex
Description: A custom block theme scaffolded by Studio Code.
Requires at least: 6.7
Tested up to: 6.9
Requires PHP: 7.2
Version: 0.1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: latim-forex
Tags: full-site-editing, block-patterns, block-styles, wide-blocks, accessibility-ready, style-variations
*/

/* WordPress inserts margin-block-start: var(--wp--style--block-gap) between the
   template's top-level sections (header part, main, footer part) — a gap that
   exists even when no markup asks for it. Zero it so sections butt edge-to-edge
   and own their vertical rhythm via padding; this does not affect block gaps
   inside nested layouts. */
.wp-site-blocks > * + * {
	margin-block-start: 0;
}

/* With that gap gone, main carries its own vertical padding so templates this
   theme does not author (WooCommerce shop, product, cart…) still clear the
   header and footer. A descendant selector, not a child one: WooCommerce wraps
   the single-product main in an extra group. Templates built from full-bleed
   sections opt out with is-flush and let the sections own the rhythm. */
.wp-site-blocks main {
	padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--70);
}
.wp-site-blocks main.is-flush {
	padding-block: 0;
}

:root {
	--site-bg: var( --wp--preset--color--background );
	--ink: var( --wp--preset--color--primary );
	--accent: var( --wp--preset--color--accent );
	--text: var( --wp--preset--color--text );
	--surface: #f3f5f8;
	--line: #e4e8ee;
	--muted: #5b6675;
}

/* === masthead === */
.masthead {
	background: var( --site-bg );
}
.masthead-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 16px 24px;
}
.masthead-brand .wp-block-site-title {
	color: var( --ink );
	font-size: clamp( 1.7rem, 4.5vw, 2.6rem );
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.04;
	text-transform: uppercase;
	margin: 0;
}
.masthead-tagline {
	margin: 4px 0 0;
	color: var( --muted );
	font-size: 0.95rem;
}
.masthead-dateline {
	margin: 0;
	color: var( --accent );
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-align: right;
}

/* === nav === */
.main-nav {
	border-top: 2px solid var( --ink );
	border-bottom: 1px solid var( --line );
	margin-top: 6px;
}
.main-nav .wp-block-navigation-item a,
.main-nav .wp-block-page-list a,
.main-nav .wp-block-navigation a {
	color: var( --text );
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.main-nav .wp-block-navigation-item a:hover,
.main-nav a:hover {
	color: var( --accent );
}

/* === typography === */
.wp-block-heading {
	color: var( --ink );
}
.eyebrow {
	color: var( --accent );
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

/* === buttons & links === */
.wp-element-button {
	transition: transform 0.15s ease-out, background-color 0.15s ease-out, box-shadow 0.15s ease-out;
}
.wp-element-button:hover {
	transform: translateY( -2px );
}
a {
	transition: color 0.15s ease;
}
a:hover {
	color: var( --accent );
}
/* === lead / hero === */
.paper-lead {
	background: var( --ink );
	color: #fff;
}
.paper-lead .wp-block-heading {
	color: #fff;
}
.paper-lead h2 {
	font-size: clamp( 2rem, 5vw, 3.4rem );
	line-height: 1.05;
}
.paper-lead p {
	color: rgba( 255, 255, 255, 0.86 );
}
.paper-lead .wp-element-button {
	background: var( --accent );
}
.paper-lead .is-style-outline .wp-element-button {
	background: transparent;
	border: 2px solid #fff;
}
.lead-rule {
	border-top: 3px solid var( --accent );
	width: 64px;
}
.dateline {
	color: var( --muted );
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

/* === market ticker === */
.ticker-wrap {
	border: 1px solid var( --line );
	border-radius: 6px;
	background: #fff;
}
.quote-symbol {
	color: var( --ink );
	font-weight: 700;
	font-size: 1.02rem;
}
.quote-value {
	font-variant-numeric: tabular-nums;
	font-size: 1.4rem;
	font-weight: 600;
	color: var( --ink );
	line-height: 1.1;
}
.quote-change {
	font-size: 0.85rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}
.quote-change.up { color: #0f8a8a; }
.quote-change.down { color: #c0532b; }
.ticker-note {
	color: var( --muted );
	font-size: 0.8rem;
}

/* === cards === */
.is-style-card {
	background: #fff;
	border: 1px solid var( --line );
	border-radius: 6px;
	padding: 1.6rem;
	box-shadow: 0 1px 3px rgb( 16 24 40 / 0.06 );
	transition: transform 0.15s ease-out, box-shadow 0.15s ease-out;
}
.is-style-card:hover {
	transform: translateY( -2px );
	box-shadow: 0 6px 16px rgb( 16 24 40 / 0.08 );
}
.is-style-stat {
	background: var( --surface );
	border: 1px solid var( --line );
	border-top: 3px solid var( --accent );
	border-radius: 6px;
	padding: 1.6rem;
	text-align: center;
}
.stat-number {
	font-size: 2.2rem;
	font-weight: 700;
	color: var( --ink );
	font-variant-numeric: tabular-nums;
	line-height: 1;
}
.stat-label {
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var( --muted );
}

/* === sections === */
.section-band {
	padding-block: 5rem;
}
.band-gray { background: var( --surface ); }
.band-white { background: #fff; }
.band-navy {
	background: var( --ink );
	color: #fff;
}
.band-navy .wp-block-heading,
.band-navy h2,
.band-navy h3 { color: #fff; }
.band-navy p { color: rgba( 255, 255, 255, 0.85 ); }
/* === credibility / cta === */
.cta-band {
	background: var( --ink );
	color: #fff;
}
.cta-band .wp-block-heading,
.cta-band h2 { color: #fff; }
.cta-band p { color: rgba( 255, 255, 255, 0.85 );
}
.cta-band .wp-element-button {
	background: var( --accent );
}

/* === refinements === */
.lead-heading {
	max-width: 36rem;
}
.lead-sub {
	max-width: 34rem;
}
.broker-intro {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.news-list li {
	margin-block: 0.45rem;
}
.quote-value,
.quote-change {
	margin-block: 0.15rem;
}
.wp-block-jetpack-contact-form input[type="text"],
.wp-block-jetpack-contact-form input[type="email"],
.wp-block-jetpack-contact-form input[type="tel"],
.wp-block-jetpack-contact-form input[type="url"],
.wp-block-jetpack-contact-form textarea,
.wp-block-jetpack-contact-form select {
	border-radius: 6px;
	border: 1px solid var( --line );
}

/* === footer === */
.site-footer {
	background: var( --ink );
	color: rgba( 255, 255, 255, 0.86 );
}
.site-footer .wp-block-site-title {
	color: #fff;
}
.footer-tagline {
	color: rgba( 255, 255, 255, 0.7 );
	max-width: 30rem;
}
.footer-h {
	color: #fff;
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	margin-bottom: 0.6rem;
}
.footer-links {
	list-style: none;
	padding: 0;
	color: rgba( 255, 255, 255, 0.82 );
}
.footer-links a {
	color: rgba( 255, 255, 255, 0.85 );
}
.footer-links a:hover {
	color: #8fd9d9;
}
.footer-cols {
	gap: 2rem;
}
.footer-rule {
	border-color: rgba( 255, 255, 255, 0.2 );
	margin-block: 2rem;
}
.footer-risk {
	font-size: 0.82rem;
	color: rgba( 255, 255, 255, 0.6 );
	line-height: 1.5;
	max-width: 62rem;
}
.footer-copy {
	font-size: 0.8rem;
	color: rgba( 255, 255, 255, 0.55 );
}

/* === posts === */
.post-img img {
	border-radius: 6px;
	border: 1px solid var( --line );
}
.entry-meta {
	color: var( --muted );
	font-size: 0.78rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.single-title {
	font-size: clamp( 2rem, 4.5vw, 3rem );
}

/* === botón flotante de WhatsApp === */
.latim-wa {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 90;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #25d366;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 10px 26px rgb( 16 24 40 / 0.28 );
	transition: transform 0.15s ease-out, box-shadow 0.15s ease-out;
}
.latim-wa:hover {
	transform: translateY( -2px );
	color: #fff;
	box-shadow: 0 14px 32px rgb( 16 24 40 / 0.34 );
}
@media ( max-width: 782px ) {
	.latim-wa {
		right: 16px;
		bottom: 16px;
		width: 50px;
		height: 50px;
	}
}

/* === redes sociales === */
.footer-redes-titulo {
	margin: 1.4rem 0 0.5rem;
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #fff;
}
.latim-redes {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.latim-redes a {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	color: rgba(255, 255, 255, 0.86);
	text-decoration: none;
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 6px;
	padding: 9px 13px;
	font-size: 0.85rem;
	font-weight: 600;
	transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}
.latim-redes a:hover {
	color: #8fd9d9;
	border-color: #8fd9d9;
	background: rgba(255, 255, 255, 0.06);
}
.latim-redes svg {
	flex: none;
}
/* variante solo iconos */
.latim-redes--iconos a {
	border-radius: 50%;
	width: 42px;
	height: 42px;
	padding: 0;
	justify-content: center;
}

/* === logotipo === */
.masthead-logo {
	margin: 0;
}
.masthead-logo img {
	display: block;
	height: 78px;
	width: auto;
	max-width: 100%;
}
.footer-logo {
	margin: 0 0 14px;
}
.footer-logo img {
	display: block;
	height: 76px;
	width: auto;
	max-width: 100%;
}

/* texto solo para lectores de pantalla y buscadores (SEO y accesibilidad) */
.solo-lectores {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect( 0, 0, 0, 0 );
	white-space: nowrap;
	border: 0;
}

/* === botones sobre fondo oscuro: texto siempre legible === */
.paper-lead .wp-block-button__link,
.cta-band .wp-block-button__link,
.band-navy .wp-block-button__link,
.site-footer .wp-block-button__link {
	color: #ffffff;
}
.paper-lead .is-style-outline .wp-block-button__link,
.cta-band .is-style-outline .wp-block-button__link,
.band-navy .is-style-outline .wp-block-button__link {
	color: #ffffff;
	border-color: rgba( 255, 255, 255, 0.75 );
}
.paper-lead .is-style-outline .wp-block-button__link:hover,
.cta-band .is-style-outline .wp-block-button__link:hover {
	background: rgba( 255, 255, 255, 0.12 );
}

/* === vídeos educativos === */
.latim-video {
	margin-block: 2rem;
	border: 1px solid var( --line );
	border-radius: 6px;
	overflow: hidden;
	background: #fff;
}
.latim-video__marco {
	position: relative;
	aspect-ratio: 16 / 9;
	background: #0b1526;
}
.latim-video__marco iframe,
.latim-video__marco video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
	object-fit: contain;
}
.latim-video figcaption {
	padding: 0.9rem 1.1rem;
	font-size: 0.92rem;
	color: var( --ink );
	border-top: 1px solid var( --line );
}
.latim-video__meta {
	display: block;
	margin-top: 0.25rem;
	font-size: 0.8rem;
	color: var( --muted );
}
.latim-video__meta a {
	color: var( --accent );
}

/* rejilla de videoteca */
.videoteca-item {
	border: 1px solid var( --line );
	border-radius: 6px;
	background: #fff;
	padding: 1.2rem 1.3rem;
	height: 100%;
}
.videoteca-item h3 {
	margin-top: 0;
	font-size: 1.05rem;
}
.videoteca-item p {
	font-size: 0.92rem;
	color: var( --muted );
	margin-block: 0.4rem;
}
.etiqueta-licencia {
	display: inline-block;
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #fff;
	background: var( --accent );
	border-radius: 4px;
	padding: 3px 8px;
	margin-bottom: 0.5rem;
}
.etiqueta-licencia.libre { background: #2f7d5b; }
.etiqueta-licencia.institucional { background: var( --ink ); }

/* === widgets de mercado (TradingView) === */
.latim-widget {
	margin-block: 1.5rem;
	border: 1px solid var( --line );
	border-radius: 6px;
	background: #fff;
	overflow: hidden;
}
.latim-widget iframe {
	display: block;
	width: 100%;
	border: 0;
}

/* === botón de afiliado EBC === */
.latim-ebc {
	margin-block: 1.5rem;
}
.latim-btn-full .wp-block-button__link {
	display: block;
	width: 100%;
	text-align: center;
}
.latim-ebc-nota {
	margin-top: -0.75rem;
	font-size: 0.82rem;
	color: var( --muted );
}

/* === contenido de artículos y páginas === */
.entry-content > * + *,
.wp-block-post-content > * + * {
	margin-block-start: 1.1rem;
}
.entry-content h2,
.wp-block-post-content h2 {
	margin-top: 2.6rem;
	font-size: clamp( 1.5rem, 3vw, 2rem );
}
.entry-content h3,
.wp-block-post-content h3 {
	margin-top: 2rem;
	font-size: clamp( 1.2rem, 2.4vw, 1.45rem );
}
.entry-content ul,
.entry-content ol,
.wp-block-post-content ul,
.wp-block-post-content ol {
	padding-left: 1.3rem;
}
.entry-content li,
.wp-block-post-content li {
	margin-block: 0.4rem;
	line-height: 1.65;
}
/* enlaces dentro del contenido: se excluyen los botones, que tienen su
   propio color y fondo (si no, el texto del botón hereda el color del enlace
   y queda ilegible sobre el fondo azul marino) */
.entry-content a:not( .wp-block-button__link ):not( .wp-element-button ),
.wp-block-post-content a:not( .wp-block-button__link ):not( .wp-element-button ) {
	color: var( --accent );
	text-decoration: underline;
	text-underline-offset: 2px;
}
/* los botones con relleno llevan siempre su texto en blanco */
.wp-block-button:not( .is-style-outline ) .wp-block-button__link {
	color: #ffffff;
}
.entry-content img,
.wp-block-post-content img {
	border-radius: 6px;
}
.wp-block-image figcaption {
	margin-top: 0.5rem;
	font-size: 0.82rem;
	color: var( --muted );
	text-align: left;
}

/* tablas de datos */
.wp-block-table table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.95rem;
}
.wp-block-table th,
.wp-block-table td {
	padding: 0.7rem 0.85rem;
	border: 1px solid var( --line );
	text-align: left;
}
.wp-block-table th {
	background: var( --surface );
	color: var( --ink );
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}
.wp-block-table td:not(:first-child) {
	font-variant-numeric: tabular-nums;
}

/* preguntas frecuentes */
.wp-block-details {
	border: 1px solid var( --line );
	border-radius: 6px;
	padding: 1rem 1.25rem;
	margin-block: 0.6rem !important;
	background: #fff;
}
.wp-block-details summary {
	cursor: pointer;
	font-weight: 600;
	color: var( --ink );
}
.wp-block-details[open] summary {
	color: var( --accent );
	margin-bottom: 0.6rem;
}

/* cita destacada */
.wp-block-quote {
	border-left: 3px solid var( --accent );
	padding-left: 1.25rem;
	font-size: 1.1rem;
	color: var( --ink );
}

/* tarjetas de la sección educación */
.is-style-card .wp-block-heading a,
.card-link a {
	text-decoration: none;
}

/* === responsive === */
@media ( max-width: 782px ) {
	.masthead-dateline {
		text-align: left;
	}
	.main-nav .wp-block-navigation-item a,
	.main-nav a {
		padding-block: 12px;
	}
	.section-band {
		padding-block: 3.5rem;
	}
}
@media ( prefers-reduced-motion: reduce ) {
	*,
	*::before,
	*::after {
		animation: none !important;
		transition: none !important;
		scroll-behavior: auto !important;
	}
}
