/* Cabeceras del periódico (logotipo + menú). Se elige en Ajustes → Diseños; clase mh-N en <body>. mh-1 = la de siempre. */
.mh-2 .brand-name,.mh-3 .brand-name,.mh-14 .brand-name{font-family:Merriweather,Georgia,"Times New Roman",serif}

/* 2 · Tradicional: nombre grande en serif y doble filete */
.mh-2 .site-head{border-bottom:0}
.mh-2 .head-row{border-bottom:1px solid var(--text)}
.mh-2 .brand-name{font-weight:700;font-size:2.6rem;letter-spacing:-.01em}
.mh-2 .main-nav{border-top:0;border-bottom:4px double var(--text);background:#fff;box-shadow:none}
.mh-2 .menu a{font-family:Merriweather,Georgia,serif;font-size:.84rem;text-transform:uppercase;letter-spacing:.07em}
.mh-2 .menu>li>a::before{display:none}

/* 3 · Histórica: filete grueso, versalitas */
.mh-3 .site-head{border-top:6px solid var(--text);border-bottom:0}
.mh-3 .brand-name{font-weight:700;font-variant:small-caps;font-size:2.9rem;letter-spacing:.04em}
.mh-3 .main-nav{border-top:1px solid var(--text);border-bottom:1px solid var(--text);background:#fff;box-shadow:none;margin-bottom:3px}
.mh-3 .menu a{font-weight:700;font-size:.9rem;font-variant:small-caps;letter-spacing:.06em}
.mh-3 .menu>li>a::before{display:none}

/* 4 · Una línea: nombre, menú y herramientas juntos */
.mh-4 .main-nav{border:0;background:none;box-shadow:none}
.mh-4 .brand-name{font-size:1.5rem}
.mh-4 .menu a{font-weight:500;font-size:.95rem;padding:8px 11px}
.mh-4 .menu>li>a::before,.mh-4 .menu>li+li::before{display:none}

/* 5 · Noche: todo sobre fondo oscuro */
.mh-5 .site-head{background:#0f1724;border-bottom:0}
.mh-5 .brand,.mh-5 .brand-name{color:#fff}
.mh-5 .main-nav{background:#0f1724;border-top:1px solid #26334a;box-shadow:none}
.mh-5 .menu a{color:#dbe4f3}.mh-5 .menu>li>a:hover,.mh-5 .menu>li:hover>a,.mh-5 .menu>li:focus-within>a{background:#1a2740;color:#fff;box-shadow:none}
.mh-5 .menu>li+li::before{background:#26334a}
.mh-5 .langs a{color:#fff;border-color:#33425e}.mh-5 .langs a.cur{background:#1a2740;border-color:#6aa8ff}
.mh-5 .search input{background:#1a2740;border-color:#33425e;color:#fff}.mh-5 .search input::placeholder{color:#9fb0cc}
.mh-5 .nav-toggle{color:#fff;border-color:#33425e}

/* 6 · Color del periódico: fondo del color principal */
.mh-6 .site-head{background:var(--primary);border-bottom:0}
.mh-6 .brand,.mh-6 .brand-name{color:#fff}
.mh-6 .main-nav{background:rgba(0,0,0,.18);border-top:0;box-shadow:none}
.mh-6 .menu a{color:#fff}.mh-6 .menu>li>a:hover,.mh-6 .menu>li:hover>a,.mh-6 .menu>li:focus-within>a{background:rgba(255,255,255,.16);color:#fff;box-shadow:none}
.mh-6 .menu>li+li::before{background:rgba(255,255,255,.25)}
.mh-6 .menu>li>a::before{background:#fff;opacity:.7}
.mh-6 .langs a{background:rgba(255,255,255,.92)}
.mh-6 .search button{background:#0b1f3a;border-color:#0b1f3a}
.mh-6 .nav-toggle{color:#fff;border-color:rgba(255,255,255,.5)}

/* 7 · Centrada con menú en píldoras */
.mh-7 .main-nav{background:#fff;border-top:0;box-shadow:none}
.mh-7 .menu{gap:6px;padding:8px 0}
.mh-7 .menu>li+li::before{display:none}
.mh-7 .menu>li>a{border-radius:999px;padding:7px 15px;background:var(--soft,#f3f5f8);font-size:.92rem}
.mh-7 .menu>li>a::after{display:none}
.mh-7 .menu>li>a:hover,.mh-7 .menu>li:hover>a{background:var(--mc);color:#fff;box-shadow:none}
.mh-7 .brand-name{font-size:2.2rem}

/* 8 · Menú arriba, nombre debajo */
.mh-8 .site-head{display:flex;flex-direction:column}
.mh-8 .main-nav{order:-1;border-top:0;border-bottom:1px solid var(--border);box-shadow:none;background:#fff}
.mh-8 .menu a{font-size:.9rem;padding:9px 13px}
.mh-8 .brand-name{font-size:2.8rem;font-weight:800;letter-spacing:-.03em}

/* 9 · Menú en barra oscura bajo nombre blanco */
.mh-9 .main-nav{background:#111827;border-top:0;box-shadow:none}
.mh-9 .menu a{color:#f3f4f6}.mh-9 .menu>li>a:hover,.mh-9 .menu>li:hover>a,.mh-9 .menu>li:focus-within>a{background:#1f2937;color:#fff;box-shadow:none}
.mh-9 .menu>li+li::before{background:#374151}
.mh-9 .brand-name{font-size:2.1rem}

/* 10 · Menú en barra del color principal */
.mh-10 .main-nav{background:var(--primary);border-top:0;box-shadow:none}
.mh-10 .menu a{color:#fff}.mh-10 .menu>li>a:hover,.mh-10 .menu>li:hover>a,.mh-10 .menu>li:focus-within>a{background:rgba(0,0,0,.2);color:#fff;box-shadow:none}
.mh-10 .menu>li>a::before{background:#fff;opacity:.7}
.mh-10 .menu>li+li::before{background:rgba(255,255,255,.3)}
.mh-10 .brand-name{font-size:2.1rem}

/* 11 · Editorial: barra gruesa de color junto al nombre, menú subrayado */
.mh-11 .brand{border-left:8px solid var(--primary);padding-left:14px}
.mh-11 .brand-name{font-size:2.3rem;font-weight:800;letter-spacing:-.03em;line-height:1}
.mh-11 .head-row{padding-top:16px;padding-bottom:14px}
.mh-11 .main-nav{background:#fff;border-top:0;border-bottom:3px solid var(--text);box-shadow:none}
.mh-11 .menu a{font-weight:700;text-transform:uppercase;font-size:.82rem;letter-spacing:.05em}
.mh-11 .menu>li>a::before{display:none}

/* 12 · Triple franja de color arriba, nombre centrado */
.mh-12 .site-head{border-top:6px solid var(--primary);border-image:linear-gradient(90deg,var(--primary) 33%,var(--accent,#e0a526) 33% 66%,var(--text) 66%) 1;border-bottom:1px solid var(--border)}
.mh-12 .brand-name{font-size:2.4rem;font-weight:800;letter-spacing:-.02em}
.mh-12 .main-nav{background:#fff;border-top:1px solid var(--border);box-shadow:none}
.mh-12 .menu a{font-size:.95rem}

/* 13 · Tarjeta flotante redondeada */
.mh-13 .site-head{background:var(--soft,#f3f5f8);border-bottom:0;padding:10px 0 0}
.mh-13 .head-row,.mh-13 .main-nav .wrap{background:#fff}
.mh-13 .head-row{border-radius:12px 12px 0 0;box-shadow:0 1px 0 var(--border),0 8px 24px rgba(15,23,42,.06);padding-left:22px;padding-right:22px;padding-top:12px;padding-bottom:12px}
.mh-13 .main-nav{background:none;border:0;box-shadow:none}
.mh-13 .main-nav .wrap{border-radius:0 0 12px 12px;box-shadow:0 10px 24px rgba(15,23,42,.08);margin-bottom:12px;border-top:1px solid var(--border)}
.mh-13 .brand-name{font-size:1.8rem}

/* 14 · Degradado suave con nombre grande */
.mh-14 .site-head{background:linear-gradient(135deg,#fff 40%,color-mix(in srgb,var(--primary) 14%,#fff));border-bottom:0}
.mh-14 .brand-name{font-size:3.1rem;font-weight:700;letter-spacing:-.025em;color:var(--primary)}
.mh-14 .head-row{padding-top:18px;padding-bottom:12px}
.mh-14 .main-nav{background:none;border-top:2px solid var(--primary);box-shadow:none}
.mh-14 .menu a{font-weight:700;font-size:.95rem}

/* 15 · Pestañas: nombre centrado y menú con pestañas */
.mh-15 .site-head{border-bottom:0}
.mh-15 .brand-name{font-size:2.3rem;font-weight:800;letter-spacing:-.025em}
.mh-15 .main-nav{background:var(--soft,#f3f5f8);border-top:0;border-bottom:3px solid var(--primary);box-shadow:none;padding-top:6px}
.mh-15 .menu{gap:3px}
.mh-15 .menu>li+li::before{display:none}
.mh-15 .menu>li>a{border-radius:8px 8px 0 0;padding:9px 16px;background:#e6eaf0;font-size:.93rem}
.mh-15 .menu>li>a::after{display:none}
.mh-15 .menu>li>a:hover,.mh-15 .menu>li:hover>a{background:#fff;color:var(--mc);box-shadow:none}

/* Disposiciones (solo pantallas anchas; en móvil se mantiene el menú plegable de siempre) */
@media (min-width:901px){
  /* nombre centrado, herramientas a la derecha */
  :is(.mh-2,.mh-3,.mh-7,.mh-9,.mh-10,.mh-12,.mh-14,.mh-15,.mh-8) .head-row{display:grid;grid-template-columns:1fr auto 1fr}
  :is(.mh-2,.mh-3,.mh-7,.mh-9,.mh-10,.mh-12,.mh-14,.mh-15,.mh-8) .brand{grid-column:2;justify-self:center}
  :is(.mh-2,.mh-3,.mh-7,.mh-9,.mh-10,.mh-12,.mh-14,.mh-15,.mh-8) .head-tools{grid-column:3;justify-self:end}
  :is(.mh-2,.mh-3,.mh-7,.mh-9,.mh-10,.mh-12,.mh-15,.mh-8) .menu{justify-content:center}
  :is(.mh-2,.mh-3,.mh-14) .head-row{padding-top:18px;padding-bottom:14px}
  :is(.mh-8) .head-row{padding-top:16px;padding-bottom:12px}
  /* una línea */
  .mh-4 .site-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:0 22px;padding:6px max(16px,calc((100% - var(--maxw,1200px))/2 + 16px))}
  .mh-4 .head-row{display:contents}
  .mh-4 .main-nav .wrap{padding:0;max-width:none}
  .mh-4 .menu{flex-wrap:nowrap}
}
@media (max-width:900px){
  .mh-2 .brand-name,.mh-3 .brand-name,.mh-8 .brand-name,.mh-14 .brand-name{font-size:1.9rem}
  .mh-5 .menu a,.mh-9 .menu a,.mh-10 .menu a,.mh-6 .menu a{border-top:1px solid rgba(255,255,255,.12)}
  .mh-13 .head-row,.mh-13 .main-nav .wrap{border-radius:0}
}
.mh-4 .brand{white-space:nowrap}
.mh-8 .site-head>*{align-self:stretch}
.mh-5 .menu>li.mi-home>a::before,.mh-6 .menu>li.mi-home>a::before,.mh-10 .menu>li.mi-home>a::before{color:#fff;background:none;opacity:1}
@media (min-width:901px){.mh-8 .head-row{margin:0;width:100%;max-width:none;box-sizing:border-box;padding-left:max(16px,calc((100% - var(--maxw,1200px))/2 + 16px));padding-right:max(16px,calc((100% - var(--maxw,1200px))/2 + 16px))}}
