/* Micrositios: Ochenta & Ocho Politics y Navidad en Ochenta & Ocho (23 de octubre: «quiero que se sienta como si entras en
   una nueva página… que esas dos secciones se sientan que son páginas aparte»). Solo la estructura de su encabezado, su menú
   y su pie; los colores y la tipografía los pone cada tema (politics.css, navidad.css) con estas variables:
   --mc-fondo, --mc-tinta, --mc-tenue, --mc-linea, --mc-cta, --mc-cta-tinta, --mc-pie, --mc-pie-tinta.
   Lo arma micrositio.py; build.page() quita los megamenús, el pie general y la capa de movimiento general. */
body[data-micro]{--header-height:76px}
.micro-header{position:sticky;top:0;z-index:20;background:var(--mc-fondo);color:var(--mc-tinta);border-bottom:1px solid var(--mc-linea)}
.micro-bar{display:flex;align-items:center;justify-content:space-between;gap:28px;width:calc(100% - 72px);max-width:1440px;height:var(--header-height);margin:auto}
.micro-brand{display:inline-flex;align-items:center;gap:14px;min-height:44px;flex:0 0 auto}
.micro-logo{display:block;width:auto;height:48px}
.micro-header nav{display:flex;align-items:center;gap:clamp(16px,2vw,28px);font:500 .875rem/1.2 var(--utility,var(--body))}
.micro-header nav>a{display:inline-flex;align-items:center;min-height:44px;color:inherit;white-space:nowrap;transition:color var(--t-ui,.2s) var(--ease-out,ease)}
.micro-header nav>a:hover{color:var(--mc-acento)}
.micro-header nav>a.micro-cta{padding:0 18px;background:var(--mc-cta);color:var(--mc-cta-tinta);border:1px solid var(--mc-cta)}
.micro-header nav>a.micro-cta:hover{color:var(--mc-cta-tinta);filter:brightness(.88)}
.micro-header nav>a.micro-casa{gap:6px;padding-left:clamp(14px,1.6vw,22px);border-left:1px solid var(--mc-linea);color:var(--mc-tenue);font-weight:400}
.micro-header nav>a.micro-casa:hover{color:var(--mc-tinta)}
.micro-header .micro-toggle{display:none}
.micro-header a:focus-visible,.micro-header button:focus-visible,.micro-footer a:focus-visible{outline:2px solid var(--mc-acento);outline-offset:4px}

.micro-footer{background:var(--mc-pie);color:var(--mc-pie-tinta);padding:clamp(56px,7vw,88px) 0 28px}
.micro-footer-wrap{width:calc(100% - 72px);max-width:1344px;margin:auto}
.micro-footer-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:end;gap:24px 56px;padding-bottom:36px;border-bottom:1px solid var(--mc-linea)}
.micro-footer-top>p:last-child{max-width:46ch;justify-self:end;font-size:.9375rem;line-height:1.65;color:var(--mc-tenue)}
.micro-footer-logo{display:block;width:220px;height:auto}
.micro-footer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:36px 0}
.micro-footer-grid h2{margin:0 0 14px;font:500 .8125rem/1.3 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--mc-tenue)}
.micro-footer-grid a{display:flex;align-items:center;min-height:40px;width:fit-content;font-size:.9375rem;color:inherit}
.micro-footer-grid a:hover{color:var(--mc-acento)}
.micro-footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;padding-top:22px;border-top:1px solid var(--mc-linea);font-size:.8125rem;line-height:1.6;color:var(--mc-tenue)}
.micro-footer-bottom a{color:inherit;text-decoration:underline;text-underline-offset:4px}

@media (max-width:1020px){
  body[data-micro]{--header-height:68px}
  .micro-bar{width:calc(100% - 40px)}
  .micro-logo{height:38px}
  .micro-header .micro-toggle{display:flex;align-items:center;gap:18px;min-height:44px;padding:0 16px;border:1px solid var(--mc-linea);border-radius:0!important;background:transparent;color:inherit;font:500 .9375rem/1 var(--utility,var(--body))}
  .micro-header nav{display:none;position:fixed;left:0;right:0;top:var(--header-height);bottom:0;flex-direction:column;align-items:stretch;gap:0;padding:12px 20px 32px;overflow:auto;background:var(--mc-fondo);font-size:1.0625rem}
  .micro-header nav.is-open{display:flex}
  .micro-header nav>a{min-height:56px;border-bottom:1px solid var(--mc-linea)}
  .micro-header nav>a.micro-cta{justify-content:center;margin-top:20px;min-height:52px;border-bottom:1px solid var(--mc-cta)}
  .micro-header nav>a.micro-casa{gap:6px;padding-left:0;border-left:0;border-bottom:0}
  .micro-footer-wrap{width:calc(100% - 40px)}
  .micro-footer-top{grid-template-columns:minmax(0,1fr)}
  .micro-footer-top>p:last-child{justify-self:start}
  .micro-footer-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .micro-footer-grid>div:first-child{grid-column:1/-1}
}
@media (max-width:420px){.micro-footer-grid{grid-template-columns:minmax(0,1fr)}.micro-header .micro-toggle{gap:12px;padding:0 12px}.micro-bar{gap:12px}}