/* ===== Contenedores y utilidades ===== */
.container{width:min(1200px,92%);margin-inline:auto}
.section{position:relative;z-index:2;padding:5rem 0}
.section-tight{padding:3rem 0}
.section-head{text-align:center;margin-bottom:2.2rem}
.section-kicker{display:inline-block;font-size:var(--fs-label);letter-spacing:.22em;text-transform:uppercase;color:var(--acc2);opacity:.9;margin-bottom:.7rem}
.section-title{font-size:clamp(1.8rem,4vw,3rem);line-height:1.15;font-weight:800;color:var(--txt);margin-bottom:.8rem;text-wrap:balance}
.section-subtitle{max-width:760px;margin:0 auto;color:color-mix(in srgb,var(--txt) 82%,transparent);opacity:.92;font-size:var(--fs-body)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:46px;padding:.82rem 1.2rem;border-radius:14px;border:1px solid var(--btn-border);background:var(--btn-bg);color:var(--txt);text-decoration:none;font-weight:700;letter-spacing:.02em;transition:transform .25s ease,border-color .25s ease,background .25s ease,box-shadow .25s ease,color .25s ease;cursor:pointer;backdrop-filter:blur(10px)}
.btn:hover{transform:translateY(-1px);border-color:var(--acc);background:var(--btn-hover-bg);box-shadow:0 0 0 1px color-mix(in srgb,var(--acc) 20%,transparent),0 10px 28px rgba(0,0,0,.22)}
.btn:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.btn--primary{background:var(--acc);color:var(--btn-active-text);border-color:var(--acc);box-shadow:0 0 18px var(--glow)}
.btn--ghost{background:transparent}
.btn--pill{border-radius:999px}

/* ===== Navegación ===== */
.site-nav{position:sticky;top:0;z-index:1000;background:var(--nav-bg);border-bottom:1px solid var(--nav-border);display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.82rem 1.2rem;box-shadow:0 2px 20px rgba(0,0,0,.25);backdrop-filter:blur(10px)}
.nav-brand,.nav-logo{display:flex;align-items:center;gap:.7rem;min-width:max-content}
.nav-brand a,.nav-logo a{display:flex;align-items:center;gap:.7rem;color:var(--acc2);text-decoration:none;text-transform:uppercase;letter-spacing:.18em;font-size:calc(.82rem * var(--fz));font-weight:800}
.nav-dot{width:8px;height:8px;border-radius:50%;background:var(--acc);box-shadow:0 0 12px var(--glow);flex-shrink:0}
.nav-center,.nav-panel{flex:1;display:flex;justify-content:center;min-width:0}
.nav-links{display:flex;align-items:center;justify-content:center;gap:.9rem;list-style:none;flex-wrap:wrap;min-width:0}
.nav-links li{list-style:none}
.nav-links a{color:var(--nav-link);text-decoration:none;text-transform:uppercase;letter-spacing:.08em;font-size:calc(.70rem * var(--fz));font-weight:700;padding:.35rem .2rem;transition:color .24s ease,opacity .24s ease}
.nav-links a:hover,.nav-links a.active{color:var(--acc)}
.nav-right{display:flex;align-items:center;justify-content:flex-end;gap:.8rem;min-width:max-content}
.nav-lang-fixed{flex:0 0 auto}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:4px}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--acc2);border-radius:2px;transition:all .3s}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ===== Selector de idioma ===== */
.lang-menu-wrap{display:flex;align-items:center;gap:.5rem}
.lang-menu-label{font-family:'Noto Sans',sans-serif;font-size:calc(.58rem * var(--fz));font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--txt) 65%,transparent);white-space:nowrap}
.lang-menu{font-family:'Noto Sans',sans-serif;font-size:calc(.64rem * var(--fz));font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:color-mix(in srgb,var(--txt) 82%,transparent);background:var(--console-bg);border:1px solid var(--console-border);border-radius:8px;padding:.5rem .7rem;cursor:pointer;transition:all .25s;min-width:110px}
.lang-menu:hover,.lang-menu:focus{border-color:var(--acc);color:var(--acc);outline:none}

/* ===== Consola ===== */
.phi-console{position:fixed;left:50%;bottom:25px;transform:translateX(-50%);display:flex;align-items:center;gap:15px;padding:10px 20px;border-radius:40px;z-index:10000;background:var(--console-bg);border:1px solid var(--console-border);box-shadow:0 10px 40px rgba(0,0,0,.8),0 0 20px var(--glow);backdrop-filter:blur(15px)}
.freq-grid{display:flex;align-items:center;gap:8px}
.console-separator{width:1px;height:30px;background:var(--separator)}
.phi-btn{background:var(--btn-bg);border:1px solid var(--btn-border);color:var(--acc2);border-radius:12px;padding:6px 14px;cursor:pointer;font-family:'Space Mono', monospace;transition:all .35s ease;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:100px;min-height:44px}
.phi-btn:hover{border-color:var(--acc);background:var(--btn-hover-bg)}
.phi-btn.active{background:var(--acc);color:var(--btn-active-text);border-color:var(--acc);box-shadow:0 0 15px var(--acc)}
.phi-btn .phi-aud-lbl{font-size:.75rem;font-weight:700;margin-bottom:2px}
.phi-btn .wave-status{font-size:.45rem;text-transform:uppercase;letter-spacing:1px;opacity:.55}
.phi-btn.active .wave-status{opacity:1;color:var(--btn-active-text)}

/* ===== Responsive ===== */
@media (max-width:900px){
  .site-nav{flex-wrap:wrap;padding:.8rem 1rem}
  .nav-panel{display:none !important}
  .nav-toggle{display:flex !important}
  .nav-links{position:absolute;top:100%;left:0;right:0;width:100%;flex-direction:column;gap:0;background:rgba(0,0,0,.98);border-bottom:2px solid var(--acc);padding:1.5rem 0;display:none !important;max-height:calc(100vh - 70px);overflow-y:auto;z-index:9999}
  .nav-links.open{display:flex !important}
  .nav-links li{width:100%}
  .nav-links a{display:block;padding:1rem 1.5rem;border-bottom:1px solid color-mix(in srgb,var(--acc) 10%,transparent);font-size:.95rem}
  .phi-console{flex-wrap:wrap;justify-content:center;width:96%;border-radius:24px;bottom:12px;padding:12px}
  .freq-grid{overflow-x:auto;width:100%;justify-content:flex-start;padding-bottom:6px}
}
@media (min-width:901px){
  .nav-panel{display:flex !important}
  .nav-toggle{display:none !important}
  .nav-links{display:flex !important;position:static !important;flex-direction:row !important;background:transparent !important;border:none !important;padding:0 !important}
}
@media (max-width:560px){
  .nav-logo a{font-size:calc(.66rem * var(--fz));letter-spacing:.12em}
  .lang-menu{min-width:82px;padding:.38rem .45rem}
  .phi-btn{min-width:88px;padding:6px 10px}
}
