/*
Theme Name: ENGYKO-CO
Theme URI: https://confiabilidadoperacional.com
Author: Victor
Author URI: https://engyko.com
Description: Tema modular, bilingue y academico-tecnico para ConfiabilidadOperacional.com, portal editorial y de conocimiento del ecosistema ENGYKO.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 8.0
Tested up to: 6.5
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: engyko-co
Tags: blog, education, custom-colors, custom-menu, editor-style, featured-images, translation-ready, two-columns

ENGYKO-CO es un tema desarrollado para el ecosistema ENGYKO (ENGYKO.com,
ENGYKO.shop, OperationalReliability.com, ConfiabilidadOperacional.com).
*/

/* ==========================================================================
   1. Design tokens (paleta ENGYKO, tipografia, espaciado)
   ========================================================================== */

:root {
	/* Paleta azul-gris ENGYKO */
	--engyko-blue-900: #0d1b2a;
	--engyko-blue-700: #1b3a5c;
	--engyko-blue-500: #2b6cb0;
	--engyko-blue-300: #7fa8d9;
	--engyko-gray-900: #1a1f24;
	--engyko-gray-700: #3d454d;
	--engyko-gray-400: #8a939b;
	--engyko-gray-200: #e3e7ea;
	--engyko-gray-100: #f4f6f7;
	--engyko-white: #ffffff;
	--engyko-accent-yellow: #f2b705;
	--engyko-accent-orange: #e8720c;
	--engyko-area-blue: #2b6cb0;
	--engyko-area-teal: #1f6f5c;
	--engyko-area-orange: #e8720c;
	--engyko-area-navy: #16324a;

	/* Roles semanticos (modo claro) */
	--color-bg: var(--engyko-white);
	--color-bg-alt: var(--engyko-gray-100);
	--color-surface: var(--engyko-white);
	--color-border: var(--engyko-gray-200);
	--color-text: var(--engyko-gray-900);
	--color-text-muted: var(--engyko-gray-700);
	--color-primary: var(--engyko-blue-700);
	--color-primary-strong: var(--engyko-blue-900);
	--color-accent: var(--engyko-accent-orange);
	--color-link: var(--engyko-blue-500);
	--color-header-bg: var(--engyko-blue-900);
	--color-header-text: var(--engyko-white);
	--color-footer-bg: var(--engyko-blue-900);
	--color-footer-text: var(--engyko-gray-200);

	/* Tipografia */
	--font-body: "Inter", "Roboto", -apple-system, BlinkMacSystemFont, sans-serif;
	--font-heading: "Inter", "Roboto", -apple-system, BlinkMacSystemFont, sans-serif;

	/* Layout */
	--container-max: 1200px;
	--radius-md: 8px;
	--radius-lg: 16px;
	--space-xs: 0.5rem;
	--space-sm: 1rem;
	--space-md: 1.5rem;
	--space-lg: 2.5rem;
	--space-xl: 4rem;
}

[data-theme="dark"] {
	--color-bg: var(--engyko-gray-900);
	--color-bg-alt: #12171c;
	--color-surface: #202830;
	--color-border: #2c3640;
	--color-text: var(--engyko-gray-100);
	--color-text-muted: var(--engyko-gray-400);
	--color-primary: var(--engyko-blue-300);
	--color-primary-strong: var(--engyko-white);
	--color-link: var(--engyko-blue-300);
	--color-header-bg: #0a141f;
	--color-footer-bg: #0a141f;
}

/* ==========================================================================
   2. Base
   ========================================================================== */

* { box-sizing: border-box; }

body {
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-body);
	line-height: 1.6;
	margin: 0;
	transition: background-color .2s ease, color .2s ease;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-heading);
	color: var(--color-primary-strong);
	line-height: 1.25;
	font-weight: 700;
}

a { color: var(--color-link); text-decoration: none; }
a:hover { text-decoration: underline; }

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

.container {
	max-width: var(--container-max);
	margin-inline: auto;
	padding-inline: var(--space-md);
}

.screen-reader-text {
	position: absolute;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px,1px,1px,1px);
}