/*
Theme Name: INTA AeroTech
Theme URI: https://inta.edu.pe
Author: INTA Development Team
Author URI: https://inta.edu.pe
Description: Theme institucional profesional para el Instituto Nacional de Tecnología Aeronáutica. Especializado en aeronáutica, drones y formación técnica. Diseño moderno, responsive y optimizado.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: inta-aerotech
Tags: education, institutional, aviation, technology, responsive, custom-menu, custom-logo, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 - CSS Variables (Identidad Visual INTA)
2.0 - Reset & Base Styles
3.0 - Typography
4.0 - Accessibility
--------------------------------------------------------------*/

/*--------------------------------------------------------------
1.0 - CSS Variables (Identidad Visual INTA)
--------------------------------------------------------------*/
:root {
	/* Colores Institucionales INTA */
	--color-primary: #1BB3E8;
	--color-secondary: #9ADCF5;
	--color-dark: #0E1418;
	--color-white: #FFFFFF;
	--color-text: #1A1A1A;
	--color-text-light: #6B6B6B;
	--color-border: #E5E5E5;
	
	/* Colores complementarios */
	--color-primary-dark: #1496C4;
	--color-primary-light: #E8F8FD;
	--color-success: #10B981;
	--color-warning: #F59E0B;
	--color-error: #EF4444;
	
	/* Tipografía */
	--font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
	--font-heading: 'Poppins', var(--font-primary);
	
	/* Tamaños de fuente */
	--font-size-base: 16px;
	--font-size-small: 0.875rem;
	--font-size-large: 1.125rem;
	
	/* Espaciado */
	--spacing-xs: 0.5rem;
	--spacing-sm: 1rem;
	--spacing-md: 1.5rem;
	--spacing-lg: 2rem;
	--spacing-xl: 3rem;
	--spacing-xxl: 4rem;
	
	/* Bordes y sombras */
	--border-radius: 8px;
	--border-radius-lg: 12px;
	--box-shadow: 0 2px 8px rgba(14, 20, 24, 0.1);
	--box-shadow-lg: 0 4px 16px rgba(14, 20, 24, 0.15);
	
	/* Transiciones */
	--transition-fast: 0.2s ease;
	--transition-normal: 0.3s ease;
	--transition-slow: 0.5s ease;
	
	/* Contenedor */
	--container-max-width: 1200px;
	--container-padding: 1rem;
	
	/* Header */
	--header-height: 80px;
}

/*--------------------------------------------------------------
2.0 - Reset & Base Styles
--------------------------------------------------------------*/
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html {
	font-size: var(--font-size-base);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	scroll-behavior: smooth;
}

body {
	font-family: var(--font-primary);
	font-size: 1rem;
	line-height: 1.6;
	color: var(--color-text);
	background-color: var(--color-white);
	overflow-x: hidden;
}

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

a {
	color: var(--color-primary);
	text-decoration: none;
	transition: color var(--transition-fast);
}

a:hover,
a:focus {
	color: var(--color-primary-dark);
}

/*--------------------------------------------------------------
3.0 - Typography
--------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-heading);
	font-weight: 700;
	line-height: 1.2;
	margin-bottom: var(--spacing-sm);
	color: var(--color-dark);
}

h1 {
	font-size: clamp(2rem, 5vw, 3.5rem);
}

h2 {
	font-size: clamp(1.75rem, 4vw, 2.75rem);
}

h3 {
	font-size: clamp(1.5rem, 3vw, 2.25rem);
}

h4 {
	font-size: clamp(1.25rem, 2.5vw, 1.75rem);
}

h5 {
	font-size: clamp(1.125rem, 2vw, 1.5rem);
}

h6 {
	font-size: clamp(1rem, 1.5vw, 1.25rem);
}

p {
	margin-bottom: var(--spacing-sm);
}

/*--------------------------------------------------------------
4.0 - Accessibility
--------------------------------------------------------------*/
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: var(--color-white);
	border-radius: var(--border-radius);
	box-shadow: var(--box-shadow);
	clip: auto !important;
	clip-path: none;
	color: var(--color-dark);
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Skip to content link */
.skip-link {
	position: absolute;
	left: -9999px;
	top: 2.5rem;
	z-index: 999999999;
	text-decoration: underline;
}

.skip-link:focus {
	display: block;
	left: 6px;
	top: 7px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	line-height: normal;
	padding: 15px 23px 14px;
	z-index: 100000;
	right: auto;
}