/* ==========================================================================
   ¿Hablamos? en hoja (8/10/26) — leer antes de tocar.
   La pastilla del menú es la misma forma que se abre en esta hoja naranja: sus
   bordes viajan con muelles distintos (el inferior cae primero, el izquierdo
   llega el último) y las letras de la pastilla vuelan hasta el titular. Al
   enviar, la hoja se recoge en un punto y vuelve al menú como confirmación.
   Todo el movimiento lo calcula assets/js/ma-hablamos.js (sin transiciones CSS).
   Legibilidad: sobre el naranja, todo texto funcional va en tinta al 100 %
   (contraste 4,7:1); los filetes, al 35 %.
   En reposo la hoja vive fuera de pantalla (left:-300vw), no en display:none,
   para que Turnstile pueda pintarse dentro y el IntersectionObserver de
   ma-rendimiento.php no lo pida en cada carga.
   ========================================================================== */
.mh{position:fixed;left:-300vw;top:0;width:100vw;height:100vh;overflow:hidden;background:var(--orange);z-index:900;visibility:hidden;color:var(--ink)}
.mh.on{visibility:visible}
.mh *{visibility:inherit}
body.mh-lock{overflow:hidden}
.mh-box{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.mh-box>*{grid-area:1/1}
.mh-spin{width:26px;height:26px;opacity:0}
.mh-done{display:flex;align-items:center;gap:10px;height:100%;box-sizing:border-box;padding:0 20px 0 8px;white-space:nowrap;font-family:var(--f-label);font-size:12px;letter-spacing:.05em;color:var(--bone);opacity:0}
.mh-ck{width:28px;height:28px;border-radius:50%;background:var(--orange);display:grid;place-items:center;flex:0 0 auto}
.mh-in{position:absolute;left:0;top:0;width:100vw;height:100vh;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.mh-w{width:min(90%,var(--maxw,1280px));margin:0 auto;padding:16px 0 56px;box-sizing:border-box}
.mh-top{height:55px;display:flex;align-items:center;justify-content:space-between;padding:0 8px 0 18px}
.mh-k{font-family:var(--f-label);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.mh-x{all:unset;box-sizing:border-box;cursor:pointer;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--bone)}
.mh-x:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.mh-t{margin:clamp(24px,7vh,88px) 0 0 -.04em;font-family:'nh-ultralight',var(--f-light);font-weight:200;font-size:clamp(54px,11vw,176px);letter-spacing:-.035em;line-height:1;white-space:nowrap;color:var(--ink)}
.mh-t span{display:inline-block;line-height:1;visibility:hidden}
.mh-t.real span{visibility:inherit}
.mh-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);margin-top:clamp(22px,4vh,46px);align-items:start}
.mh-s{margin:0;max-width:34ch;font-family:var(--f-light);font-weight:300;font-size:clamp(18px,1.6vw,23px);line-height:1.38}
.mh-d{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:10px;font-size:14px}
.mh-d span{display:block;font-family:var(--f-label);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:2px}
.mh-d a{color:var(--ink);text-decoration:none;border-bottom:1px solid rgba(31,35,34,.35)}
.mh-d a:hover{border-bottom-color:var(--ink)}
.mh-r{min-width:0}
.mh-chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px;padding:0;border:0;min-width:0}
.mh-chips legend{font-family:var(--f-label);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:10px;padding:0;float:left;width:100%}
.mh-chips label{position:relative}
.mh-chips input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.mh-chips label span{display:block;padding:10px 16px;border-radius:999px;border:1px solid rgba(31,35,34,.4);font-family:var(--f-label);font-size:12.5px;letter-spacing:.03em}
.mh-chips input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--bone)}
.mh-chips input:focus-visible+span{outline:2px solid var(--ink);outline-offset:2px}
/* Formulario Contact Form 7 (el mismo 2820 del pie, otra instancia) */
.mh .wpcf7{margin:0}
.mh .ctf-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px 22px}
.mh .ctf-grid p{margin:0}
.mh .ctf-full,.mh .ctf-grid>.cf7-cf-turnstile,.mh .ctf-grid>.wpcf7-submit{grid-column:1/-1}
.mh .ctf-grid>br,.mh .cf-turnstile-br{display:none}
.mh .ctf-grid>.wpcf7-submit{justify-self:start}
.mh input[type=text],.mh input[type=email],.mh input[type=tel],.mh textarea{width:100%;box-sizing:border-box;background:transparent;border:0;border-bottom:1px solid rgba(31,35,34,.35);border-radius:0;color:var(--ink);padding:12px 0;font-family:var(--f-light);font-weight:300;font-size:clamp(16px,1.35vw,19px);line-height:1.3}
.mh textarea{min-height:92px;height:92px;resize:vertical}
.mh ::placeholder{color:rgba(31,35,34,.62);opacity:1}
.mh input:focus,.mh textarea:focus{outline:none;border-bottom-color:var(--ink)}
.mh .wpcf7-not-valid,.mh [aria-invalid=true]{border-bottom:2px solid var(--ink)}
.mh .ctf-priv{font-size:13px;line-height:1.4;margin-top:10px}
.mh .ctf-priv a{color:var(--ink)}
.mh .wpcf7-list-item{margin:0}
.mh input[type=checkbox]{accent-color:var(--ink);margin-right:8px;vertical-align:-2px}
.mh .cf7-cf-turnstile{margin:8px 0 -6px!important}
.mh .wpcf7-submit{font-family:var(--f-label);font-size:13px;letter-spacing:.06em;text-transform:uppercase;background:var(--ink);color:var(--bone);border:0;border-radius:999px;padding:17px 38px;cursor:pointer;margin-top:10px}
.mh .wpcf7-submit:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.mh .wpcf7-spinner{display:none}
.mh .wpcf7-not-valid-tip{font-family:var(--f-label);font-size:12px;color:var(--ink);margin-top:4px}
.mh .wpcf7 form .wpcf7-response-output{margin:14px 0 0;padding:12px 16px;border:1px solid var(--ink);border-radius:12px;font-size:13.5px;color:var(--ink)}
.mh .wpcf7 form.init .wpcf7-response-output,.mh .wpcf7 form.sent .wpcf7-response-output{display:none}
.mh-err{margin:12px 0 0;font-family:var(--f-label);font-size:13px;min-height:1em}
.mh-fly{position:fixed;left:0;top:0;width:0;height:0;z-index:901;pointer-events:none;visibility:hidden}
.mh-fly.on{visibility:visible}
.mh-fly span{position:absolute;left:0;top:0;display:inline-block;line-height:1;font-family:'nh-ultralight',var(--f-light);font-weight:200;letter-spacing:-.035em;transform-origin:0 0;white-space:pre;visibility:inherit}
/* Móvil: la confirmación es solo el círculo con la marca, del alto de la pastilla, para no pisar el logotipo */
@media (max-width:519px){
  .mh-done{padding:0 3px;gap:0}
  .mh-done>span:last-child{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
@media (max-width:820px){
  .mh-g{grid-template-columns:1fr;gap:24px;margin-top:14px}
  .mh-t{margin-top:22px}
  .mh-s{font-size:17px}
  .mh-d{margin-top:16px;grid-template-columns:1fr 1fr}
  .mh .ctf-grid{grid-template-columns:1fr}
  .mh-top{padding-left:14px}
}