/*
Theme Name: MH Optitax & Legal
Theme URI: https://www.mhoptitaxlegal.com/
Author: MH Optitax & Legal
Description: Tema personalizado de una página basado en la maqueta HTML proporcionada por el cliente. Incluye banner editorial, vídeos y estructura para formulario de contacto mediante MH Core; quedan módulos por completar.
Version: 0.5.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: mhoptitaxlegal
*/
/* ============================================================
   MH OPTITAX & LEGAL — prototipo de sitio
   Paleta: azul #264A74 · dorado #D2AE32 · dorado claro #EDD9A2
   Motivo estructural: la diagonal ascendente del logotipo
   ============================================================ */

:root{
  --paper:#FBFAF6;
  --surface:#FFFFFF;
  --surface-2:#F2F0E8;
  --ink:#14202E;
  --muted:#5C6B7E;
  --line:#E3DFD3;
  --line-strong:#CFC9B8;
  --navy:#264A74;
  --navy-solid:#264A74;
  --navy-deep:#16304F;
  --navy-ink:#0E2038;
  --gold:#D2AE32;
  --gold-deep:#A8871F;
  --gold-soft:#EDD9A2;
  --gold-on-dark:#EDD9A2;
  --on-navy:#EAF0F8;
  --on-navy-muted:#A9BCD4;
  --shadow:0 1px 2px rgba(20,32,46,.05), 0 12px 32px -18px rgba(20,32,46,.35);
  --shadow-lg:0 2px 4px rgba(20,32,46,.06), 0 28px 60px -28px rgba(20,32,46,.45);
  --r:4px;
  --maxw:1180px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#0F1926; --surface:#16222F; --surface-2:#1C2A39;
    --ink:#E9EEF5; --muted:#98A7B9; --line:#26374A; --line-strong:#33475D;
    --navy:#4C7CB3; --navy-solid:#35608F; --navy-deep:#0B1725; --navy-ink:#081321;
    --gold:#DFBE4B; --gold-deep:#DFBE4B; --gold-soft:#5E4F1E;
    --on-navy:#E7EEF7; --on-navy-muted:#9DB2CB;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 12px 32px -18px rgba(0,0,0,.8);
    --shadow-lg:0 2px 4px rgba(0,0,0,.45), 0 28px 60px -28px rgba(0,0,0,.9);
  }
}
:root[data-theme="dark"]{
  --paper:#0F1926; --surface:#16222F; --surface-2:#1C2A39;
  --ink:#E9EEF5; --muted:#98A7B9; --line:#26374A; --line-strong:#33475D;
  --navy:#4C7CB3; --navy-solid:#35608F; --navy-deep:#0B1725; --navy-ink:#081321;
  --gold:#DFBE4B; --gold-deep:#DFBE4B; --gold-soft:#5E4F1E;
  --on-navy:#E7EEF7; --on-navy-muted:#9DB2CB;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 12px 32px -18px rgba(0,0,0,.8);
  --shadow-lg:0 2px 4px rgba(0,0,0,.45), 0 28px 60px -28px rgba(0,0,0,.9);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:88px}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Archivo","Helvetica Neue",Arial,sans-serif;
  font-size:16px; line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:inherit}
h1,h2,h3,h4{
  font-family:"Newsreader",Georgia,"Times New Roman",serif;
  font-weight:500; line-height:1.14; text-wrap:balance; margin:0;
  letter-spacing:-.012em;
}
p{margin:0}
button{font:inherit; color:inherit}
:focus-visible{outline:2px solid var(--gold); outline-offset:3px; border-radius:2px}

.wrap{width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:24px}
.section{padding-block:clamp(64px,8vw,116px)}

/* ---------- eyebrow: la diagonal del logo como marcador ---------- */
.eyebrow{
  display:flex; align-items:center; gap:10px;
  font-size:11.5px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-deep); margin-bottom:18px;
}
.eyebrow::before{
  content:""; width:16px; height:3px; background:var(--gold);
  transform:skewX(-32deg); flex:none;
}
.lede{color:var(--muted); font-size:17.5px; max-width:62ch}

/* ---------- botones ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:13px 22px; border-radius:var(--r); border:1px solid transparent;
  font-size:14.5px; font-weight:600; letter-spacing:.01em;
  text-decoration:none; cursor:pointer;
  transition:transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease;
}
.btn:hover{transform:translateY(-1px)}
.btn-gold{background:var(--gold); color:#1B1403; border-color:var(--gold)}
.btn-gold:hover{background:#C29F27}
.btn-navy{background:var(--navy-solid); color:#fff; border-color:var(--navy-solid)}
.btn-navy:hover{background:var(--navy-deep); border-color:var(--navy-deep)}
.btn-ghost{border-color:var(--line-strong); color:var(--ink); background:transparent}
.btn-ghost:hover{border-color:var(--gold); color:var(--gold-deep)}
.btn-ghost-light{border-color:rgba(233,240,248,.32); color:var(--on-navy); background:transparent}
.btn-ghost-light:hover{border-color:var(--gold); color:var(--gold)}
.btn-sm{padding:9px 16px; font-size:13px}

/* ---------- nav ---------- */
.nav{
  position:sticky; top:0; z-index:60;
  background:color-mix(in srgb, var(--paper) 88%, transparent);
  backdrop-filter:saturate(1.4) blur(14px);
  border-bottom:1px solid var(--line);
  transition:box-shadow .25s ease;
}
.nav.scrolled{box-shadow:0 10px 30px -22px rgba(20,32,46,.6)}
.nav-in{display:flex; align-items:center; gap:28px; height:74px}
.brand{display:flex; align-items:center; gap:11px; text-decoration:none; flex:none}
.brand img{height:38px; width:auto}
.brand .mark-dark{display:none}
:root[data-theme="dark"] .brand .mark-light{display:none}
:root[data-theme="dark"] .brand .mark-dark{display:block}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .brand .mark-light{display:none}
  :root:not([data-theme="light"]) .brand .mark-dark{display:block}
}
.brand-txt{display:flex; flex-direction:column; line-height:1.05}
.brand-txt b{
  font-family:"Newsreader",serif; font-size:16.5px; font-weight:600;
  color:var(--navy); letter-spacing:.01em;
}
:root[data-theme="dark"] .brand-txt b{color:var(--on-navy)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .brand-txt b{color:var(--on-navy)}}
.brand-txt span{
  font-size:9.5px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold-deep); font-weight:600;
}
.nav-links{display:flex; gap:4px; margin-left:auto; align-items:center}
.nav-links a{
  position:relative; padding:8px 13px; font-size:14px; font-weight:500;
  text-decoration:none; color:var(--muted); border-radius:var(--r);
  transition:color .18s ease;
}
.nav-links a:hover{color:var(--ink)}
.nav-links a.active{color:var(--ink)}
.nav-links a.active::after{
  content:""; position:absolute; left:13px; right:13px; bottom:2px;
  height:2.5px; background:var(--gold); transform:skewX(-32deg);
}
.nav-cta{margin-left:14px}
.burger{
  display:none; margin-left:auto; width:42px; height:42px; align-items:center; justify-content:center;
  background:none; border:1px solid var(--line-strong); border-radius:var(--r); cursor:pointer;
}
.burger span{display:block; width:18px; height:1.5px; background:var(--ink); position:relative}
.burger span::before,.burger span::after{
  content:""; position:absolute; left:0; width:18px; height:1.5px; background:var(--ink);
  transition:transform .2s ease, top .2s ease;
}
.burger span::before{top:-6px} .burger span::after{top:6px}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{top:0; transform:rotate(45deg)}
.burger[aria-expanded="true"] span::after{top:0; transform:rotate(-45deg)}
.mobile-menu{display:none; border-top:1px solid var(--line); background:var(--surface)}
.mobile-menu.open{display:block}
.mobile-menu a{
  display:block; padding:14px 24px; text-decoration:none; font-weight:500;
  border-bottom:1px solid var(--line); color:var(--ink);
}
.mobile-menu .btn{margin:16px 24px; width:calc(100% - 48px)}
@media (max-width:940px){
  .nav-links,.nav-cta{display:none}
  .burger{display:flex}
}

/* ---------- hero ---------- */
.hero{
  position:relative; overflow:hidden;
  background:var(--navy-ink);
  color:var(--on-navy);
  padding-block:clamp(72px,9vw,128px);
  isolation:isolate;
}
.hero::before{
  /* la diagonal ascendente del monograma, a escala arquitectónica */
  content:""; position:absolute; inset:-20% -10%; z-index:-2;
  background:
    linear-gradient(103deg, transparent 0 38%, rgba(210,174,50,.13) 38% 41.6%, transparent 41.6% 100%),
    linear-gradient(103deg, transparent 0 46%, rgba(210,174,50,.06) 46% 47.4%, transparent 47.4% 100%),
    radial-gradient(120% 90% at 78% 8%, rgba(76,124,179,.35), transparent 62%);
}
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg, transparent 60%, rgba(8,19,33,.75));
  pointer-events:none;
}
.hero-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(32px,5vw,72px); align-items:center}
.hero .eyebrow{color:var(--gold-on-dark)}
.hero h1{
  font-size:clamp(38px,5.4vw,66px); color:#fff; margin-bottom:22px; letter-spacing:-.02em;
}
.hero h1 em{font-style:italic; color:var(--gold-on-dark)}
.hero p.lede{color:var(--on-navy-muted); font-size:18px; max-width:52ch}
.hero-actions{display:flex; flex-wrap:wrap; gap:12px; margin-top:32px}
.hero-card{
  background:rgba(255,255,255,.055); border:1px solid rgba(233,240,248,.16);
  border-radius:6px; padding:26px; backdrop-filter:blur(8px);
}
.hero-card h3{
  font-size:11.5px; font-family:"Archivo",sans-serif; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--gold-on-dark); margin-bottom:18px;
}
.cred{display:flex; gap:12px; padding:12px 0; border-top:1px solid rgba(233,240,248,.12)}
.cred:first-of-type{border-top:none; padding-top:0}
.cred svg{flex:none; margin-top:3px; color:var(--gold)}
.cred b{display:block; font-size:14.5px; font-weight:600; color:#fff}
.cred span{font-size:13px; color:var(--on-navy-muted)}
@media (max-width:860px){ .hero-grid{grid-template-columns:1fr} }

/* ---------- franja de credibilidad ---------- */
.strip{background:var(--surface); border-bottom:1px solid var(--line)}
.strip-in{display:grid; grid-template-columns:repeat(5,1fr); background:var(--surface)}
.strip-item{background:var(--surface); padding:26px 20px; border-left:1px solid var(--line)}
.strip-item:nth-child(5n+1){border-left:none}
.strip-item b{
  display:block; font-family:"Newsreader",serif; font-size:30px; font-weight:600;
  color:var(--navy); font-variant-numeric:tabular-nums; line-height:1;
}
:root[data-theme="dark"] .strip-item b{color:var(--gold)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .strip-item b{color:var(--gold)}}
.strip-item > span{display:block; margin-top:7px; font-size:12.5px; color:var(--muted); letter-spacing:.02em}
@media (max-width:1050px){
  .strip-in{grid-template-columns:repeat(3,1fr)}
  .strip-item:nth-child(5n+1){border-left:1px solid var(--line)}
  .strip-item:nth-child(3n+1){border-left:none}
  .strip-item:nth-child(n+4){border-top:1px solid var(--line)}
}
@media (max-width:640px){
  .strip-in{grid-template-columns:repeat(2,1fr)}
  .strip-item:nth-child(3n+1){border-left:1px solid var(--line)}
  .strip-item:nth-child(2n+1){border-left:none}
  .strip-item:nth-child(n+3){border-top:1px solid var(--line)}
}
.live-dot{
  display:inline-block; width:6px; height:6px; border-radius:50%; background:#3E9E6E;
  margin-right:7px; vertical-align:middle; box-shadow:0 0 0 0 rgba(62,158,110,.55);
  animation:pulse 2.4s ease-out infinite;
}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(62,158,110,.5)}
  70%{box-shadow:0 0 0 7px rgba(62,158,110,0)}
  100%{box-shadow:0 0 0 0 rgba(62,158,110,0)}
}

/* ---------- encabezado de sección ---------- */
.sec-head{display:grid; grid-template-columns:1fr auto; gap:32px; align-items:end; margin-bottom:48px}
.sec-head h2{font-size:clamp(28px,3.6vw,42px)}
.sec-head p{margin-top:14px}
@media (max-width:760px){ .sec-head{grid-template-columns:1fr; align-items:start} }

/* ---------- tarjetas de servicio ---------- */
.svc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line)}
.svc{
  position:relative; background:var(--surface); padding:30px 26px 28px; overflow:hidden;
  transition:background .2s ease;
}
.svc::before{
  content:""; position:absolute; top:0; left:0; width:64px; height:4px;
  background:var(--gold); transform:skewX(-32deg) translateX(-110%);
  transition:transform .3s cubic-bezier(.22,.9,.3,1);
}
.svc:hover{background:var(--surface-2)}
.svc:hover::before{transform:skewX(-32deg) translateX(6px)}
.svc-ico{
  width:38px; height:38px; color:var(--navy); margin-bottom:18px;
}
:root[data-theme="dark"] .svc-ico{color:var(--gold)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .svc-ico{color:var(--gold)}}
.svc h3{font-size:20px; margin-bottom:9px; display:flex; align-items:center; gap:9px; flex-wrap:wrap}
.svc p{font-size:14.5px; color:var(--muted); line-height:1.6}
.tag-new{
  font-family:"Archivo",sans-serif; font-size:9.5px; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold-deep); border:1px solid var(--gold);
  padding:2px 7px; border-radius:2px; line-height:1.6;
}
:root[data-theme="dark"] .tag-new{color:var(--gold)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .tag-new{color:var(--gold)}}
@media (max-width:900px){ .svc-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:600px){ .svc-grid{grid-template-columns:1fr} }

/* ---------- redes sociales y dominio ---------- */
.social{display:flex; gap:9px; flex-wrap:wrap; margin-top:4px}
.social a{
  display:flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:50%;
  border:1px solid var(--line-strong); color:var(--muted);
  text-decoration:none; transition:color .18s ease, border-color .18s ease, transform .18s ease, background .18s ease;
}
.social a:hover{color:var(--gold-deep); border-color:var(--gold); transform:translateY(-2px)}
.footer .social{margin-top:18px}
.footer .social a{border-color:rgba(233,240,248,.24); color:var(--on-navy-muted)}
.footer .social a:hover{color:#1B1403; background:var(--gold); border-color:var(--gold)}
.domain{
  display:inline-block; margin-top:16px; font-size:13.5px; font-weight:600;
  color:var(--gold-on-dark); text-decoration:none;
  border-bottom:1px solid rgba(237,217,162,.35); padding-bottom:2px;
}
.domain:hover{border-color:var(--gold-on-dark)}

/* ---------- tablero de indicadores ---------- */
.ind-board{border:1px solid var(--line); background:var(--surface); border-radius:5px; overflow:hidden}
.ind-bar{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:14px 20px; background:var(--surface-2); border-bottom:1px solid var(--line);
  font-size:12.5px; color:var(--muted);
}
.ind-bar strong{
  font-family:"Archivo",sans-serif; font-size:11px; font-weight:700; letter-spacing:.15em;
  text-transform:uppercase; color:var(--ink);
}
.ind-bar .spacer{margin-left:auto}
.ind-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line)}
.ind{background:var(--surface); padding:22px 20px 20px; display:flex; flex-direction:column; gap:5px}
.ind .k{
  font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted); display:flex; align-items:center; gap:8px;
}
.ind .v{
  font-family:"Newsreader",Georgia,serif; font-size:34px; font-weight:600; line-height:1.05;
  color:var(--ink); font-variant-numeric:tabular-nums; letter-spacing:-.015em;
}
.ind .v sup{font-size:.45em; font-family:"Archivo",sans-serif; font-weight:600; color:var(--muted); margin-left:3px; top:-.9em}
.ind .m{font-size:12.5px; color:var(--muted); line-height:1.5}
.ind .m b{color:var(--ink); font-weight:600; font-variant-numeric:tabular-nums}
.ind .when{
  margin-top:auto; padding-top:12px; font-size:10.5px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--muted); opacity:.8;
}
.delta{
  display:inline-flex; align-items:center; gap:4px; font-family:"Archivo",sans-serif;
  font-size:11px; font-weight:700; padding:2px 7px; border-radius:20px; letter-spacing:.02em;
}
.delta.up{background:color-mix(in srgb, #B4522F 15%, transparent); color:#B4522F}
.delta.down{background:color-mix(in srgb, #2E7D5B 15%, transparent); color:#2E7D5B}
:root[data-theme="dark"] .delta.up{color:#E68B66}
:root[data-theme="dark"] .delta.down{color:#6FCFA3}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .delta.up{color:#E68B66}
  :root:not([data-theme="light"]) .delta.down{color:#6FCFA3}
}
.ind-foot{
  padding:16px 20px; border-top:1px solid var(--line); background:var(--surface-2);
  font-size:12.5px; color:var(--muted); display:flex; gap:14px; flex-wrap:wrap; align-items:center;
}
@media (max-width:900px){ .ind-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .ind-grid{grid-template-columns:1fr} .ind .v{font-size:30px} }

/* ---------- recursos ---------- */
.res{background:var(--surface-2)}
.tabs{display:flex; gap:2px; border-bottom:1px solid var(--line-strong); margin-bottom:36px; overflow-x:auto}
.tab{
  position:relative; background:none; border:none; cursor:pointer;
  padding:14px 20px; font-size:14.5px; font-weight:600; color:var(--muted);
  white-space:nowrap; transition:color .18s ease;
}
.tab:hover{color:var(--ink)}
.tab[aria-selected="true"]{color:var(--ink)}
.tab[aria-selected="true"]::after{
  content:""; position:absolute; left:14px; right:14px; bottom:-1px; height:3px;
  background:var(--gold); transform:skewX(-32deg);
}
.tab small{
  display:inline-block; margin-left:8px; font-size:10.5px; font-weight:700;
  background:var(--navy); color:#fff; border-radius:20px; padding:1px 7px;
  font-variant-numeric:tabular-nums;
}
:root[data-theme="dark"] .tab small{background:var(--gold); color:#1B1403}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .tab small{background:var(--gold); color:#1B1403}}
.panel[hidden]{display:none}
.card-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
@media (max-width:940px){ .card-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:620px){ .card-grid{grid-template-columns:1fr} }

.rcard{
  display:flex; flex-direction:column; background:var(--surface);
  border:1px solid var(--line); border-radius:5px; overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.rcard:hover{transform:translateY(-3px); box-shadow:var(--shadow-lg); border-color:var(--line-strong)}
.rcard-top{
  position:relative; height:112px; background:var(--navy-ink); overflow:hidden;
  display:flex; align-items:flex-end; padding:14px 18px;
}
.rcard-top::before{
  content:""; position:absolute; inset:-40%;
  background:
    linear-gradient(103deg, transparent 0 44%, rgba(210,174,50,.42) 44% 47.5%, transparent 47.5% 100%),
    linear-gradient(103deg, transparent 0 53%, rgba(210,174,50,.14) 53% 54.6%, transparent 54.6% 100%),
    radial-gradient(90% 120% at 85% 0%, rgba(76,124,179,.34), transparent 60%);
}
.rcard-top .kind{
  position:relative; font-size:10.5px; font-weight:700; letter-spacing:.15em;
  text-transform:uppercase; color:var(--gold-on-dark);
}
.rcard-body{padding:20px 18px 22px; display:flex; flex-direction:column; gap:10px; flex:1}
.rcard-meta{
  display:flex; align-items:center; gap:10px; font-size:11.5px; color:var(--muted);
  letter-spacing:.04em; text-transform:uppercase; font-weight:600;
}
.dot{width:3px; height:3px; border-radius:50%; background:var(--line-strong)}
.rcard h3{font-size:19px; line-height:1.25}
.rcard p{font-size:14px; color:var(--muted); line-height:1.6}
.rcard-foot{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin-top:auto; padding-top:16px; border-top:1px solid var(--line);
}
.price{
  font-family:"Newsreader",serif; font-size:24px; font-weight:600; color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.price small{font-family:"Archivo",sans-serif; font-size:11px; color:var(--muted); font-weight:600; margin-left:4px}
.free{
  font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold-deep);
}
:root[data-theme="dark"] .free{color:var(--gold)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .free{color:var(--gold)}}

/* captura de correo */
.lead{
  margin-top:28px; background:var(--surface); border:1px solid var(--line);
  border-left:3px solid var(--gold); border-radius:5px; padding:26px 28px;
  display:grid; grid-template-columns:1fr auto; gap:24px; align-items:center;
}
.lead h3{font-size:22px; margin-bottom:6px}
.lead p{font-size:14px; color:var(--muted)}
.lead form{display:flex; gap:10px; flex-wrap:wrap}
.lead input{
  min-width:250px; padding:13px 15px; border:1px solid var(--line-strong);
  border-radius:var(--r); background:var(--paper); color:var(--ink); font:inherit; font-size:14.5px;
}
.lead input::placeholder{color:var(--muted)}
@media (max-width:820px){ .lead{grid-template-columns:1fr} }

/* ---------- portal de clientes ---------- */
.portal{background:var(--navy-ink); color:var(--on-navy); position:relative; overflow:hidden}
.portal::before{
  content:""; position:absolute; inset:-30% -10%;
  background:linear-gradient(103deg, transparent 0 52%, rgba(210,174,50,.10) 52% 55%, transparent 55% 100%);
}
.portal-grid{position:relative; display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,5vw,72px); align-items:center}
.portal .eyebrow{color:var(--gold-on-dark)}
.portal h2{font-size:clamp(28px,3.6vw,42px); color:#fff}
.portal .lede{color:var(--on-navy-muted); margin-top:16px}
.plist{list-style:none; padding:0; margin:28px 0 0; display:flex; flex-direction:column; gap:2px}
.plist li{display:flex; gap:14px; padding:14px 0; border-top:1px solid rgba(233,240,248,.13)}
.plist svg{flex:none; color:var(--gold); margin-top:3px}
.plist b{display:block; font-size:15px; color:#fff; font-weight:600}
.plist span{font-size:13.5px; color:var(--on-navy-muted)}

/* maqueta del portal */
.mock{
  background:var(--surface); border:1px solid var(--line); border-radius:7px;
  box-shadow:var(--shadow-lg); overflow:hidden; color:var(--ink);
}
.mock-bar{
  display:flex; align-items:center; gap:8px; padding:11px 14px;
  background:var(--surface-2); border-bottom:1px solid var(--line);
}
.mock-bar i{width:8px; height:8px; border-radius:50%; background:var(--line-strong); display:block}
.mock-url{
  margin-left:8px; font-size:11.5px; color:var(--muted); background:var(--paper);
  border:1px solid var(--line); border-radius:20px; padding:3px 12px; flex:1;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.mock-body{padding:18px}
.mock-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px}
.mock-head b{font-family:"Newsreader",serif; font-size:17px; font-weight:600}
.mock-head em{font-style:normal; font-size:11px; color:var(--muted)}
.mock-row{
  display:grid; grid-template-columns:22px 1fr auto; gap:12px; align-items:center;
  padding:11px 0; border-top:1px solid var(--line); font-size:13.5px;
}
.mock-row:first-of-type{border-top:none}
.mock-row svg{color:var(--navy)}
:root[data-theme="dark"] .mock-row svg{color:var(--gold)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .mock-row svg{color:var(--gold)}}
.mock-row span{color:var(--muted); font-size:11.5px; font-variant-numeric:tabular-nums}
.pill{
  font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  padding:3px 8px; border-radius:20px;
}
.pill.ok{background:color-mix(in srgb, #2E7D5B 16%, transparent); color:#2E7D5B}
.pill.wait{background:color-mix(in srgb, var(--gold) 22%, transparent); color:var(--gold-deep)}
:root[data-theme="dark"] .pill.ok{color:#6FCFA3}
:root[data-theme="dark"] .pill.wait{color:var(--gold)}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .pill.ok{color:#6FCFA3}
  :root:not([data-theme="light"]) .pill.wait{color:var(--gold)}
}
.mock-drop{
  margin-top:16px; border:1.5px dashed var(--line-strong); border-radius:5px;
  padding:18px; text-align:center; font-size:12.5px; color:var(--muted);
}
@media (max-width:860px){ .portal-grid{grid-template-columns:1fr} }

/* ---------- nosotros ---------- */
.about-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(36px,5vw,72px); align-items:start}
.portrait{
  position:relative; aspect-ratio:4/5; background:var(--navy-ink); border-radius:5px;
  overflow:hidden; display:flex; align-items:center; justify-content:center;
}
.portrait::before{
  content:""; position:absolute; inset:-30%;
  background:linear-gradient(103deg, transparent 0 42%, rgba(210,174,50,.16) 42% 47%, transparent 47% 100%);
}
.portrait img{position:relative; width:56%; opacity:.9}
.portrait em{
  position:absolute; bottom:16px; left:16px; right:16px; text-align:center;
  font-style:normal; font-size:10.5px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--on-navy-muted);
}
.about h2{font-size:clamp(28px,3.4vw,40px); margin-bottom:18px}
.about p{color:var(--muted); font-size:16px; margin-bottom:16px}
.about p strong{color:var(--ink); font-weight:600}
.chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:26px}
.chip{
  font-size:12.5px; font-weight:500; padding:7px 13px; border:1px solid var(--line-strong);
  border-radius:20px; color:var(--muted); background:var(--surface);
}
.values{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:34px}
.value{border-top:2px solid var(--gold); padding-top:14px}
.value b{display:block; font-family:"Newsreader",serif; font-size:19px; font-weight:600; margin-bottom:5px}
.value span{font-size:13.5px; color:var(--muted); line-height:1.55}
@media (max-width:860px){ .about-grid{grid-template-columns:1fr} .portrait{max-width:340px} }
@media (max-width:520px){ .values{grid-template-columns:1fr} }

/* ---------- contacto ---------- */
.contact{background:var(--surface-2)}
.contact-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(36px,5vw,64px)}
.form{display:grid; gap:14px}
.field{display:grid; gap:6px}
.field label{font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.field input,.field select,.field textarea{
  padding:13px 15px; border:1px solid var(--line-strong); border-radius:var(--r);
  background:var(--surface); color:var(--ink); font:inherit; font-size:15px; width:100%;
}
.field textarea{resize:vertical; min-height:112px}
.two{display:grid; grid-template-columns:1fr 1fr; gap:14px}
@media (max-width:520px){ .two{grid-template-columns:1fr} }
.form-note{font-size:12.5px; color:var(--muted)}
.info-block{border-top:1px solid var(--line-strong); padding:20px 0; display:grid; gap:4px}
.info-block:first-of-type{border-top:none; padding-top:0}
.info-block .k{font-size:11.5px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--gold-deep)}
:root[data-theme="dark"] .info-block .k{color:var(--gold)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .info-block .k{color:var(--gold)}}
.info-block .v{font-size:16px; font-weight:500}
.info-block .v a{text-decoration:none; border-bottom:1px solid var(--line-strong)}
.info-block .v a:hover{border-color:var(--gold)}
.info-block small{font-size:13.5px; color:var(--muted)}
@media (max-width:860px){ .contact-grid{grid-template-columns:1fr} }

/* ---------- pie ---------- */
.footer{background:var(--navy-ink); color:var(--on-navy-muted); position:relative; overflow:hidden}
.footer::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(103deg, transparent 0 62%, rgba(210,174,50,.08) 62% 64.5%, transparent 64.5% 100%);
}
.footer-in{position:relative; display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:36px; padding-block:60px 32px}
.footer img{height:74px; width:auto; margin-bottom:18px}
.footer p{font-size:13.5px; line-height:1.65; max-width:34ch}
.footer h4{
  font-family:"Archivo",sans-serif; font-size:11px; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:var(--gold-on-dark); margin-bottom:14px;
}
.footer ul{list-style:none; padding:0; margin:0; display:grid; gap:9px}
.footer ul a{font-size:13.5px; text-decoration:none; color:var(--on-navy-muted)}
.footer ul a:hover{color:var(--gold)}
.footer-bot{
  position:relative; border-top:1px solid rgba(233,240,248,.13); padding-block:20px;
  display:flex; flex-wrap:wrap; gap:16px; justify-content:space-between; font-size:12.5px;
}
.footer-bot button{
  background:none; border:none; cursor:pointer; color:var(--gold);
  font-size:12.5px; font-weight:600; text-decoration:underline; text-underline-offset:3px;
}
@media (max-width:860px){ .footer-in{grid-template-columns:1fr 1fr} }
@media (max-width:520px){ .footer-in{grid-template-columns:1fr} }

/* ---------- cajón de notas técnicas ---------- */
.drawer-bg{
  position:fixed; inset:0; z-index:90; background:rgba(8,19,33,.55);
  backdrop-filter:blur(3px); opacity:0; pointer-events:none; transition:opacity .28s ease;
}
.drawer-bg.open{opacity:1; pointer-events:auto}
.drawer{
  position:fixed; top:0; right:0; bottom:0; z-index:91; width:min(680px,100%);
  background:var(--paper); border-left:1px solid var(--line);
  transform:translateX(102%); transition:transform .34s cubic-bezier(.3,.9,.3,1);
  display:flex; flex-direction:column; box-shadow:var(--shadow-lg);
}
.drawer.open{transform:none}
.drawer-head{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:20px 26px; border-bottom:1px solid var(--line); background:var(--surface);
}
.drawer-head h2{font-size:21px}
.drawer-head small{display:block; font-size:12px; color:var(--muted); font-family:"Archivo",sans-serif}
.drawer-close{
  width:38px; height:38px; border:1px solid var(--line-strong); background:none;
  border-radius:var(--r); cursor:pointer; font-size:18px; line-height:1; flex:none;
}
.drawer-body{overflow-y:auto; padding:26px; display:grid; gap:30px}
.dsec h3{
  font-family:"Archivo",sans-serif; font-size:11px; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:var(--gold-deep); margin-bottom:12px;
  display:flex; align-items:center; gap:9px;
}
:root[data-theme="dark"] .dsec h3{color:var(--gold)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .dsec h3{color:var(--gold)}}
.dsec h3::before{content:""; width:14px; height:3px; background:var(--gold); transform:skewX(-32deg); flex:none}
.dsec p{font-size:14.5px; color:var(--muted); margin-bottom:12px}
.dsec ul{margin:0; padding-left:18px; display:grid; gap:7px; font-size:14.5px; color:var(--muted)}
.dsec li strong{color:var(--ink); font-weight:600}
.dtable{width:100%; border-collapse:collapse; font-size:13.5px}
.dtable th,.dtable td{text-align:left; padding:9px 10px; border-bottom:1px solid var(--line); vertical-align:top}
.dtable th{
  font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted);
  font-weight:700; border-bottom:1px solid var(--line-strong);
}
.dtable td:first-child{font-weight:600; color:var(--ink); white-space:nowrap}
.dwrap{overflow-x:auto}
code{
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace; font-size:12.5px;
  background:var(--surface-2); border:1px solid var(--line); border-radius:3px; padding:1px 5px;
}

/* ---------- animación de entrada ---------- */
.reveal{opacity:0; transform:translateY(16px)}
.reveal.in{opacity:1; transform:none; transition:opacity .6s ease, transform .6s cubic-bezier(.22,.9,.3,1)}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1; transform:none}
  *,*::before,*::after{transition-duration:.01ms !important; animation-duration:.01ms !important}
}
/* Compatibilidad con la barra de administración de WordPress */
body.admin-bar .nav { top: 32px; }
@media (max-width: 782px) { body.admin-bar .nav { top: 46px; } }
/* Para páginas interiores del tema */
.mh-page { min-height: 52vh; }
.mh-page h1 { font-size: clamp(32px, 4.4vw, 52px); margin-bottom: 22px; }
.mh-page .entry-content > * + * { margin-top: 1.2em; }

/* Ajustes de fidelidad v0.2 — recursos gráficos oficiales */
.brand img { width: auto; height: 38px; object-fit: contain; }
.footer img { width: auto; height: 74px; object-fit: contain; }
.portrait img { width: 56%; height: auto; object-fit: contain; }
/* Avoid hidden tab content being exposed by other WordPress block styles. */
.panel[hidden] { display: none !important; }

/* v0.3 — perfiles sin URL: icono visual sin enlaces falsos */
.social .social-placeholder { display:flex; align-items:center; justify-content:center; width:38px; height:38px; border:1px solid var(--line-strong); border-radius:50%; color:var(--muted); opacity:.65; }
.footer .social .social-placeholder { border-color:rgba(233,240,248,.24); color:var(--on-navy-muted); }
.mh-embedded-form { width:100%; }
.mh-embedded-form input, .mh-embedded-form textarea, .mh-embedded-form select,
.mh-embedded-newsletter input { max-width:100%; }

.mh-entry-content p {margin:0 0 1.1em;} .mh-entry-content h2,.mh-entry-content h3 {margin:1.2em 0 .5em;} .mh-entry-content ul,.mh-entry-content ol {padding-left:24px;margin:0 0 1.2em;} .mh-entry-content img {height:auto;}

/* v0.4 — Herramientas independientes del tema: catálogo y vista embebida. */
.mh-tools-section { background:var(--paper); border-top:1px solid var(--line); }
.mh-tools-section .card-grid { max-width:1180px; }
.mh-tools-card .rcard-body { min-height:190px; }
.mh-tools-card .rcard-foot { flex-wrap:wrap; }
.mh-tools-empty { color:var(--muted); font-size:14.5px; }
.mh-tools-archive h1 { font-size:clamp(30px,3.6vw,44px); }
.mh-tools-archive h2 {font-size:21px;}
.mh-tool-page { background:var(--paper); }
.mh-tool-page-inner { padding-top:20px; padding-bottom:44px; }
.mh-tool-breadcrumb {font-size:12px; color:var(--muted); display:flex; flex-wrap:wrap; gap:8px; padding-block:6px 18px;}
.mh-tool-breadcrumb a {text-decoration:none; color:var(--navy);}
.mh-tool-breadcrumb a:hover {color:var(--gold-deep); text-decoration:underline;}
.mh-tool-frame { display:block; width:100%; height:1850px; background:#132a4f; border:0; border-radius:8px; }
/* El menú gana un elemento: usar diseño móvil antes de que se produzca desbordamiento. */
.nav-in { gap:16px; }
.nav-links a { padding-left:9px; padding-right:9px; font-size:13.5px; }
.nav-cta { margin-left:4px; }
@media (max-width:1080px) { .nav-links,.nav-cta {display:none;} .burger {display:flex;} }
@media (max-width:600px) { .mh-tool-page-inner {padding-left:0;padding-right:0;} .mh-tool-breadcrumb {padding-inline:18px;} .mh-tool-frame {border-radius:0;} }

/* v0.5 — Banner del libro / vídeos Tendencias / formulario */
.mh-book-promo {background:var(--navy-ink); color:var(--on-navy); overflow:hidden; border-top:3px solid var(--gold);}
.mh-book-in {display:grid;grid-template-columns:minmax(160px,240px) 1fr;gap:clamp(28px,5vw,72px);align-items:center;padding-block:clamp(38px,5vw,64px);}
.mh-book-art {min-height:210px;display:flex;justify-content:center;align-items:center;}
.mh-book-image {max-height:270px;width:auto;object-fit:contain;box-shadow:18px 18px 38px rgba(0,0,0,.32);border:1px solid rgba(255,255,255,.14);}
.mh-book-symbol {width:175px;aspect-ratio:3/4;background:linear-gradient(125deg,#1b3656,#0d1d31);border-left:8px solid var(--gold);box-shadow:18px 18px 30px rgba(0,0,0,.3);display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center;color:var(--gold-on-dark);}
.mh-book-symbol span {font-family:'Newsreader',serif;font-size:74px;line-height:1;letter-spacing:-.1em;}
.mh-book-symbol small {font-size:8px;letter-spacing:.16em;}
.mh-book-symbol i {font-size:10px;letter-spacing:.13em;font-style:normal;margin-top:24px;border-top:1px solid rgba(237,217,162,.6);padding-top:10px;}
.mh-book-copy .eyebrow {color:var(--gold-on-dark);}
.mh-book-copy h2 {font-size:clamp(29px,3.5vw,44px);color:white;margin-bottom:16px;}
.mh-book-copy p {font-size:17px;color:var(--on-navy-muted);max-width:58ch;margin-bottom:24px;}
.mh-trends-section {background:var(--surface-2);}
.mh-trend-poster {height:176px;background:linear-gradient(110deg,#0e2038,#284b74);display:block;position:relative;overflow:hidden;}
.mh-trend-image {width:100%;height:100%;object-fit:cover;}
.mh-trend-play {position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:50%;background:var(--gold);color:#1a2637;font-size:21px;box-shadow:0 3px 19px rgba(0,0,0,.3);}
.mh-trend-card h3 a {text-decoration:none;}
.mh-trend-card h3 a:hover {color:var(--navy);}
.mh-trend-card .rcard-foot {justify-content:flex-end;}
.mh-trend-embed {position:relative;padding-bottom:56.25%;height:0;overflow:hidden;background:#0e2038;border-radius:5px;margin:26px 0;}
.mh-trend-embed iframe {position:absolute;top:0;left:0;width:100%;height:100%;border:0;}
.mh-trend-single h1,.mh-trend-archive h1 {font-size:clamp(32px,4vw,48px);margin:0 0 18px;}
.mh-trend-single .mh-video-intro {font-size:17px;color:var(--muted);margin-bottom:12px;}
.mh-trend-single .entry-content {max-width:850px;}
.mh-trends-list {margin-top:32px;}
.mh-contact-unconfigured {font-size:15px;color:var(--muted);padding:16px;border:1px solid var(--line);background:var(--surface);border-radius:5px;}
.mh-contact-unconfigured a {color:var(--navy);}
.mh-honeypot {position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important;}
.mh-consent label {display:flex;align-items:flex-start;gap:10px;font-size:13px;color:var(--muted);}
.mh-consent input[type=checkbox] {width:18px;height:18px;flex:none;accent-color:var(--navy);margin-top:2px;}
.mh-portal-pending {cursor:default;opacity:.7;}
@media(max-width:650px){.mh-book-in{grid-template-columns:1fr;gap:18px;padding-block:38px;}.mh-book-art{justify-content:flex-start;min-height:170px;}.mh-book-symbol{width:128px;}.mh-book-symbol span{font-size:54px;}.mh-book-image{max-height:215px;}}
