/* site-chrome.css · cabecera translúcida, botones y pie · TODAS las páginas (13 Nov 2026) */
/* ───────────── cabecera translúcida que se compacta ───────────── */
.hdr{position:fixed;inset:0 0 auto 0;z-index:50;height:var(--hdr);
  border-bottom:1px solid transparent;
  transition:height .35s var(--ease),border-color .35s}
/* el desenfoque va en un pseudo-elemento: un backdrop-filter en .hdr haría de él el bloque contenedor del menú a pantalla completa */
.hdr::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:color-mix(in srgb,var(--l1) 72%,transparent);
  -webkit-backdrop-filter:saturate(180%) blur(22px);backdrop-filter:saturate(180%) blur(22px)}
.admin-bar .hdr{top:var(--wp-admin--admin-bar--height,32px)}
.hdr{border-bottom-color:color-mix(in srgb,var(--ink) 6%,transparent)}
.hdr.small{--hdr:52px;height:52px;border-bottom-color:var(--line)}
.hdr__in{height:100%;max-width:var(--max);margin:auto;padding:0 var(--gut);display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:12px;min-height:44px;font-weight:600;letter-spacing:-.01em;font-size:1rem}
.brand img{width:32px;height:32px;border-radius:50%;object-fit:cover;transition:transform .35s var(--ease)}
.hdr.small .brand img{transform:scale(.82)}
.nav{display:flex;align-items:center;gap:2px}
.nav a{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 13px;font-size:.8125rem;font-weight:500;letter-spacing:-.005em;color:var(--mute);transition:color .25s}
.nav a:hover{color:var(--ink)}
.nav a:not(.pill)::after{content:"";position:absolute;left:13px;right:13px;bottom:9px;height:1.5px;border-radius:2px;background:var(--red);transform:scaleX(0);transform-origin:50% 50%;transition:transform .3s var(--ease)}
.nav a[aria-current]{color:var(--ink)}
.nav a[aria-current]:not(.pill)::after{transform:scaleX(1)}
.nav .pill{color:#fff;margin-left:10px;padding:0 14px;isolation:isolate}
.nav .pill::before{content:"";position:absolute;inset:7px 0;border-radius:980px;background:var(--red-ink);z-index:-1;transition:background .25s,transform .3s var(--ease)}
.nav .pill:hover{color:#fff}.nav .pill:hover::before{background:var(--navy);transform:scale(1.04)}
.burger{display:none;flex:none;position:relative;width:44px;height:44px;border:0;background:none;color:var(--ink);cursor:pointer;border-radius:50%;padding:0;margin-right:-10px}
.burger span{position:absolute;left:13px;right:13px;height:1.5px;border-radius:2px;background:currentColor;transition:transform .35s var(--ease),top .35s var(--ease)}
.burger span:nth-child(1){top:19px}.burger span:nth-child(2){top:25px}
.burger[aria-expanded="true"] span:nth-child(1){top:22px;transform:rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){top:22px;transform:rotate(-45deg)}
html.menu-open{overflow:hidden}
@media(max-width:820px){
  .burger{display:block}
  .nav{position:fixed;inset:0;z-index:40;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;
    padding:calc(var(--hdr) + var(--wp-admin--admin-bar--height,0px) + 20px) var(--gut) 40px;overflow-y:auto;
    background:color-mix(in srgb,var(--l1) 97%,transparent);-webkit-backdrop-filter:saturate(180%) blur(28px);backdrop-filter:saturate(180%) blur(28px);
    opacity:0;visibility:hidden;transition:opacity .3s var(--ease),visibility 0s .3s}
  .nav.open{opacity:1;visibility:visible;transition:opacity .3s var(--ease)}
  .nav a{font-size:clamp(1.75rem,1.2rem + 2.6vw,2rem);font-weight:600;letter-spacing:-.03em;color:var(--ink);padding:0;min-height:60px;
    opacity:0;transform:translateY(14px);transition:opacity .45s var(--ease),transform .45s var(--ease),color .2s}
  .nav.open a{opacity:1;transform:none;transition-delay:calc(var(--i,0)*45ms + 80ms)}
  .nav a:not(.pill)::after{left:0;right:auto;width:28px;bottom:10px}
  .nav .pill{margin:18px 0 0;justify-content:center;font-size:1.0625rem;font-weight:500;min-height:52px}
  .nav .pill::before{inset:0}
}
@media (prefers-reduced-motion:reduce){.nav a,.nav.open a{transition:none;transform:none;opacity:1}.nav{transition:none}}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;border-radius:980px;font-size:1.0625rem;font-weight:500;
  background:var(--red-ink);color:#fff;border:1.5px solid var(--red-ink);transition:transform .3s var(--ease),background .25s,color .25s,border-color .25s}
.btn:hover{background:var(--navy);border-color:var(--navy);transform:scale(1.03)}
.btn--ghost{background:transparent;color:var(--ink);border-color:color-mix(in srgb,var(--ink) 30%,transparent)}
.btn--ghost:hover{background:var(--ink);color:var(--l1);border-color:var(--ink)}
.s-d .btn:hover{background:#fff;color:var(--d1);border-color:#fff}
/* pie */
.foot{background:var(--d1);color:var(--dmute);font-size:.9375rem;padding:0 0 40px}
.foot .in{width:calc(100% - 2*var(--gut));max-width:calc(var(--max) - 2*var(--gut));margin:auto;padding:36px 0 0;border-top:1px solid var(--dline);display:flex;flex-wrap:wrap;gap:6px 28px;align-items:center;justify-content:space-between}
.foot nav{display:flex;flex-wrap:wrap;gap:0 4px}
.foot a{display:inline-flex;align-items:center;min-height:44px;min-width:44px;justify-content:center;padding:0 10px;color:var(--dink)}
.foot a:hover{color:var(--red)}
.s-end{background:var(--d1);color:var(--dink);--mute:var(--dmute);--line:var(--dline);--accent-l:var(--accent-d);--ink:var(--dink)}
.s-end .btn:hover{background:#fff;color:var(--d1);border-color:#fff}
.foot__links{display:flex;flex-wrap:wrap;gap:0 4px;align-items:center}
.foot .mma-cookie-link{color:var(--dmute)}
.foot .mma-cookie-link:hover{color:var(--red)}
@media (prefers-reduced-transparency:reduce){.hdr::before{background:var(--l1);-webkit-backdrop-filter:none;backdrop-filter:none}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn:hover{transform:none}*{transition-duration:.01ms !important}}

/* interruptor de tema */
.theme{position:relative;flex:none;width:44px;height:44px;border:0;background:none;color:var(--mute);cursor:pointer;border-radius:50%;padding:0;margin-left:2px;transition:color .25s,background .25s}
.theme:hover{color:var(--ink);background:color-mix(in srgb,var(--ink) 7%,transparent)}
.theme svg{position:absolute;left:11px;top:11px;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:0;transform:rotate(-60deg) scale(.6);transition:opacity .35s var(--ease),transform .5s var(--ease)}
.theme[data-mode="auto"] .i-auto,.theme[data-mode="light"] .i-sun,.theme[data-mode="dark"] .i-moon{opacity:1;transform:none}
.hdr__in .theme{order:3}.hdr__in .burger{order:4}
@media(max-width:820px){.theme{margin-left:auto}.hdr__in .burger{margin-left:0}}
@media (prefers-reduced-motion:reduce){.theme svg{transition:none}}
/* apaisado: menú móvil en dos columnas y compacto */
@media (max-width:900px) and (max-height:520px){
  .nav{display:grid;grid-template-columns:1fr 1fr;column-gap:24px;align-content:start;padding-top:calc(var(--hdr) + var(--wp-admin--admin-bar--height,0px) + 8px)}
  .nav a{font-size:1.375rem;min-height:48px}
  .nav .pill{grid-column:1/-1;margin-top:8px;min-height:48px}
}
