/**
 * ============================================================
 * ALYDRON CORE DESIGN TOKENS
 * Qué hace: centraliza color, tipografía, espaciado y shell documental.
 * Por qué existe: mantiene contraste y consistencia entre todas las superficies.
 * Riesgos: solo las variables viven en :root; las reglas visuales se aíslan.
 * Conexión: base de components.css, home.css y hub-pages.css.
 * ============================================================
 */
:root {
    --aly-bg: #050706;
    --aly-bg-elevated: #080b09;
    --aly-surface: #0b0f0c;
    --aly-surface-hover: #101510;
    --aly-border: #1d261f;
    --aly-border-strong: #2a352d;
    --aly-text: #f2f5f3;
    --aly-text-secondary: #a2ada6;
    --aly-text-muted: #69756d;
    --aly-accent: #39ff14;
    --aly-accent-soft: rgba(57, 255, 20, .1);
    --aly-accent-border: rgba(57, 255, 20, .35);
    --aly-danger: #ff5f56;
    --aly-warning: #ffbd2e;
    --aly-radius-sm: 4px;
    --aly-radius-md: 8px;
    --aly-content-width: 1180px;
    --aly-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --aly-font-mono: "Cascadia Code", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

body.alydron-hub {
    min-width: 320px;
    margin: 0;
    background: var(--aly-bg);
    color: var(--aly-text);
    font-family: var(--aly-font-sans);
    line-height: 1.6;
}

body.alydron-hub * { box-sizing: border-box; }
body.alydron-hub a { color: inherit; text-decoration: none; }
body.alydron-hub :where(h1, h2, h3, h4, p, ul, ol) { overflow-wrap: break-word; }
body.alydron-hub :where(h1, h2, h3, h4) { color: var(--aly-text); }
body.alydron-hub ::selection { background: var(--aly-accent); color: #020402; }
body.alydron-hub :focus-visible { outline: 2px solid var(--aly-accent); outline-offset: 3px; }

.alydron-site-shell { min-height: 100vh; overflow: clip; background: var(--aly-bg); }
.alydron-main { min-height: 60vh; }
.alydron-page-width { width: min(var(--aly-content-width), calc(100% - 48px)); margin-inline: auto; }
.alydron-skip-link { position: fixed; z-index: 100000; top: 12px; left: 12px; transform: translateY(-180%); border-radius: var(--aly-radius-sm); padding: 12px 16px; background: var(--aly-accent); color: #031003 !important; font: 750 12px/1 var(--aly-font-mono); }
.alydron-skip-link:focus { transform: translateY(0); }
.alydron-grid { position: absolute; z-index: -2; inset: 0; opacity: .42; background-image: linear-gradient(rgba(112, 132, 118, .075) 1px, transparent 1px), linear-gradient(90deg, rgba(112, 132, 118, .075) 1px, transparent 1px); background-size: 44px 44px; mask-image: linear-gradient(90deg, #000, #000 72%, transparent); }
.alydron-eyebrow, .alydron-label { margin: 0; color: var(--aly-accent); font: 700 11px/1.5 var(--aly-font-mono); letter-spacing: .13em; text-transform: uppercase; }

/* ============================================================
 * ADMINISTRABLE HEADER
 * WordPress controla el menú; details ofrece navegación móvil sin JavaScript.
 * ============================================================ */
.alydron-site-header { position: relative; z-index: 50; border-bottom: 1px solid var(--aly-border); background: rgba(5, 7, 6, .96); }
.alydron-header-inner { min-height: 72px; display: flex; align-items: center; gap: 32px; }
.alydron-brand { flex: none; display: inline-flex; align-items: center; gap: 10px; color: var(--aly-text) !important; font: 800 18px/1 var(--aly-font-mono); letter-spacing: .09em; }
.alydron-brand img { width: 32px; height: 32px; object-fit: contain; }
.alydron-brand i { color: var(--aly-accent); font-style: normal; }
.alydron-main-nav { margin-left: auto; }
.alydron-nav-list { display: flex; align-items: center; gap: clamp(18px, 2.4vw, 32px); margin: 0; padding: 0; list-style: none; }
.alydron-nav-list a { display: inline-flex; min-height: 44px; align-items: center; color: var(--aly-text-secondary) !important; font: 650 11px/1 var(--aly-font-mono); letter-spacing: .07em; text-transform: uppercase; transition: color 160ms ease; }
.alydron-nav-list a:hover, .alydron-nav-list a:focus-visible, .alydron-nav-list .current-menu-item > a { color: var(--aly-accent) !important; }
.alydron-header-cta { flex: none; min-height: 42px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--aly-border-strong); border-radius: var(--aly-radius-sm); padding: 0 14px; color: var(--aly-text) !important; font: 750 10px/1 var(--aly-font-mono); letter-spacing: .07em; text-transform: uppercase; transition: border-color 160ms ease, background 160ms ease; }
.alydron-header-cta span { color: var(--aly-accent); }
.alydron-header-cta:hover { border-color: var(--aly-accent-border); background: var(--aly-accent-soft); }
.alydron-mobile-nav { display: none; margin-left: auto; }
.alydron-mobile-nav summary { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--aly-border-strong); border-radius: var(--aly-radius-sm); padding: 0 11px; color: var(--aly-text-secondary); cursor: pointer; font: 700 10px/1 var(--aly-font-mono); list-style: none; text-transform: uppercase; }
.alydron-mobile-nav summary::-webkit-details-marker { display: none; }
.alydron-mobile-nav summary b { color: var(--aly-accent); font-size: 17px; }
.alydron-mobile-nav nav { position: absolute; top: calc(100% + 1px); right: 0; left: 0; border-bottom: 1px solid var(--aly-border); padding: 14px 24px 20px; background: #070a08; }
.alydron-mobile-nav-list { margin: 0; padding: 0; list-style: none; }
.alydron-mobile-nav-list a { min-height: 48px; display: flex; align-items: center; border-bottom: 1px solid var(--aly-border); color: var(--aly-text-secondary); font: 700 11px/1 var(--aly-font-mono); text-transform: uppercase; }
.alydron-mobile-nav-list a:hover { color: var(--aly-accent); }

/* ============================================================
 * FOOTER
 * Mantiene navegación y estado sin depender del parent theme.
 * ============================================================ */
.alydron-site-footer { border-top: 1px solid var(--aly-border); background: #030504; }
.alydron-footer-grid { display: grid; grid-template-columns: 1.2fr .7fr 1fr; gap: 64px; padding-block: 56px; }
.alydron-brand-compact img { width: 28px; height: 28px; }
.alydron-brand-compact .alydron-brand-copy b { color: var(--aly-text); font: 800 15px/1 var(--aly-font-mono); letter-spacing: .1em; }
.alydron-footer-grid > div:first-child > p { max-width: 380px; margin: 18px 0 0; color: var(--aly-text-muted); }
.alydron-footer-grid nav { display: flex; flex-direction: column; gap: 12px; }
.alydron-footer-grid nav a { color: var(--aly-text-secondary); font: 650 10px/1.5 var(--aly-font-mono); text-transform: uppercase; }
.alydron-footer-grid nav a:hover { color: var(--aly-accent); }
.alydron-footer-legal { text-align: right; }
.alydron-footer-legal p { color: var(--aly-accent); font: 700 10px/1 var(--aly-font-mono); text-transform: uppercase; }
.alydron-footer-legal p span { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--aly-accent); }
.alydron-footer-legal small { color: var(--aly-text-muted); }

@media (max-width: 980px) {
    .alydron-main-nav, .alydron-header-cta { display: none; }
    .alydron-mobile-nav { display: block; }
    .alydron-footer-grid { grid-template-columns: 1fr 1fr; }
    .alydron-footer-legal { grid-column: 1 / -1; text-align: left; }
}

@media (max-width: 680px) {
    .alydron-page-width { width: min(var(--aly-content-width), calc(100% - 28px)); }
    .alydron-header-inner { min-height: 64px; }
    .alydron-brand { font-size: 16px; }
    .alydron-brand img { width: 29px; height: 29px; }
    .alydron-footer-grid { grid-template-columns: 1fr; gap: 34px; }
    .alydron-footer-legal { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
    body.alydron-hub { scroll-behavior: auto; }
    body.alydron-hub *, body.alydron-hub *::before, body.alydron-hub *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
