/**
 * Theme Name: opoGC Public Child
 * Theme URI: https://opogc.es
 * Description: Tema hijo para la web pública de opoGC. Diseño premium orientado a conversión, blanco/verde pastel/dorado.
 * Author: Codex
 * Template: twentytwentyfive
 * Version: 2.0.0
 * Text Domain: opogc-public-child
 */

/* =================================================================
   TOKENS DE DISEÑO — opoGC Premium v2
   ================================================================= */

:root {
    /* Colores principales */
    --opogc-white:           #FFFFFF;
    --opogc-white-off:       #F8FAFB;
    --opogc-white-warm:      #FAFAF8;

    /* Verde pastel (identidad, confianza, progreso) */
    --opogc-green-pastel:    #4CAF7D;
    --opogc-green-deep:      #1A6B40;
    --opogc-green-mid:       #2D8B5A;
    --opogc-green-soft:      #EDF7F1;
    --opogc-green-border:    rgba(76, 175, 125, 0.22);

    /* Dorado pastel (acento premium) */
    --opogc-gold-pastel:     #C9A84C;
    --opogc-gold-soft:       #FDF8ED;
    --opogc-gold-border:     rgba(201, 168, 76, 0.28);
    --opogc-gold-deep:       #A8882A;

    /* Texto */
    --opogc-text:            #1A2B2E;
    --opogc-text-soft:       #4A6570;
    --opogc-text-muted:      #7A9AA8;

    /* Bordes y superficies */
    --opogc-border:          rgba(26, 43, 46, 0.09);
    --opogc-surface:         #FFFFFF;
    --opogc-surface-alt:     #F4F9F6;

    /* Sombras */
    --opogc-shadow-xs:       0 1px 4px rgba(26, 107, 64, 0.06);
    --opogc-shadow-sm:       0 2px 12px rgba(26, 107, 64, 0.09);
    --opogc-shadow-md:       0 8px 32px rgba(26, 107, 64, 0.12);
    --opogc-shadow-lg:       0 16px 48px rgba(26, 107, 64, 0.16);

    /* Tipografía */
    --opogc-font-title:      'Sora', 'Segoe UI', Arial, sans-serif;
    --opogc-font-body:       'Manrope', 'Segoe UI', Arial, sans-serif;

    /* Espaciados */
    --opogc-space-2:         0.125rem;
    --opogc-space-4:         0.25rem;
    --opogc-space-8:         0.5rem;
    --opogc-space-12:        0.75rem;
    --opogc-space-16:        1rem;
    --opogc-space-24:        1.5rem;
    --opogc-space-32:        2rem;
    --opogc-space-48:        3rem;
    --opogc-space-64:        4rem;
    --opogc-space-80:        5rem;

    /* Geometría */
    --opogc-radius:          16px;
    --opogc-radius-sm:       10px;
    --opogc-radius-xs:       6px;
    --opogc-radius-pill:     999px;
    --opogc-max-w:           1140px;

    /* Transiciones */
    --opogc-transition:      0.22s ease;
}

/* =================================================================
   RESET BASE
   ================================================================= */

*, *::before, *::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: var(--opogc-font-body);
    color: var(--opogc-text);
    background-color: var(--opogc-white-off);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

/* Anular estilos del parent theme que puedan interferir */
.wp-site-blocks,
.wp-block-template-part,
.is-layout-flow {
    all: unset;
}

a {
    color: var(--opogc-green-pastel);
    text-decoration: none;
    transition: color var(--opogc-transition);
}

a:hover {
    color: var(--opogc-green-deep);
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--opogc-font-title);
    line-height: 1.2;
    margin: 0 0 var(--opogc-space-16);
    color: var(--opogc-text);
    font-weight: 700;
}

p {
    margin: 0 0 var(--opogc-space-16);
}

p:last-child {
    margin-bottom: 0;
}

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

ul, ol {
    margin: 0;
    padding: 0;
}

/* =================================================================
   CONTENEDOR
   ================================================================= */

.opogc-wrap {
    width: min(var(--opogc-max-w), calc(100% - 3rem));
    margin-inline: auto;
}

/* =================================================================
   HEADER
   ================================================================= */

.site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid var(--opogc-border);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transition: box-shadow var(--opogc-transition);
}

.site-header.is-scrolled {
    box-shadow: var(--opogc-shadow-sm);
}

.opogc-header-inner {
    display: flex;
    align-items: center;
    gap: var(--opogc-space-24);
    min-height: 72px;
    justify-content: space-between;
    width: min(var(--opogc-max-w), calc(100% - 3rem));
    margin-inline: auto;
}

/* Logo */
.opogc-logo {
    display: flex;
    align-items: center;
    gap: var(--opogc-space-8);
    text-decoration: none;
    flex-shrink: 0;
}

.opogc-logo img {
    height: 36px;
    width: auto;
}

.opogc-logo-text {
    font-family: var(--opogc-font-title);
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--opogc-text);
    letter-spacing: -0.01em;
}

.opogc-logo-text span {
    color: var(--opogc-green-pastel);
}

/* Navegación */
.opogc-nav {
    flex: 1;
}

.opogc-nav ul {
    display: flex;
    flex-wrap: wrap;
    gap: var(--opogc-space-4);
    margin: 0;
    padding: 0;
    list-style: none;
    justify-content: center;
}

.opogc-nav a {
    display: block;
    text-decoration: none;
    color: var(--opogc-text-soft);
    font-weight: 500;
    font-size: 0.88rem;
    padding: var(--opogc-space-8) var(--opogc-space-12);
    border-radius: var(--opogc-radius-xs);
    transition: color var(--opogc-transition), background var(--opogc-transition);
}

.opogc-nav a:hover,
.opogc-nav a:focus,
.opogc-nav .current-menu-item > a {
    color: var(--opogc-green-deep);
    background: var(--opogc-green-soft);
}

/* Header CTA */
.opogc-header-cta {
    flex-shrink: 0;
}

/* Hamburger */
.opogc-hamburger {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: var(--opogc-space-8);
    border-radius: var(--opogc-radius-xs);
    color: var(--opogc-text);
    transition: background var(--opogc-transition);
}

.opogc-hamburger:hover {
    background: var(--opogc-green-soft);
}

.opogc-hamburger svg {
    display: block;
    width: 22px;
    height: 22px;
    stroke: currentColor;
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
}