/* Menú móvil con llave (wrench) para las páginas con header.top (home, talleres y tema oscuro #ttTop).
   Antes, bajo 1000px el nav se escondía y no había forma de llegar a servicios ni herramientas. */
.tt-wrench{display:none;flex:0 0 auto;width:44px;height:44px;min-width:44px;border:0;margin:0;padding:0;
  background:transparent;color:#F5F5F7;border-radius:999px;cursor:pointer;place-items:center;
  touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:background .2s}
.tt-wrench:hover,.tt-wrench:focus-visible{background:rgba(255,255,255,.08)}
.tt-wrench:focus-visible{outline:2px solid #C9C2B6;outline-offset:2px}
.tt-wrench svg{width:22px;height:22px;display:block;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.tt-wrench .ic-close{display:none}
.tt-wrench[aria-expanded="true"] .ic-open{display:none}
.tt-wrench[aria-expanded="true"] .ic-close{display:block}
.tt-wrench:active svg{transform:rotate(-20deg)}

.tt-mmenu{position:fixed;inset:0;z-index:40;background:#2E353D;color:#F5F5F7;overflow-y:auto;
  -webkit-overflow-scrolling:touch;padding:92px 20px 40px;
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .25s cubic-bezier(.2,.8,.2,1),transform .25s cubic-bezier(.2,.8,.2,1),visibility .25s}
.tt-mmenu.open{opacity:1;visibility:visible;transform:none}
.tt-mmenu nav{max-width:560px;margin:0 auto}
.tt-mmenu .mm-label{display:block;font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:.72rem;
  letter-spacing:.14em;text-transform:uppercase;color:#C9C2B6;margin:26px 0 4px}
.tt-mmenu .mm-label:first-child{margin-top:0}
.tt-mmenu a.mm-link{display:block;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.1);
  text-decoration:none;color:#F5F5F7;font-family:"Space Grotesk",system-ui,sans-serif;
  font-size:1.15rem;font-weight:600;letter-spacing:-.015em}
.tt-mmenu a.mm-link small{display:block;margin-top:2px;font-family:"IBM Plex Sans",system-ui,sans-serif;
  font-size:.85rem;font-weight:400;letter-spacing:0;color:#A1A1A6}
.tt-mmenu a.mm-link[aria-current]{color:#C9C2B6}
.tt-mmenu a.mm-cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
  min-height:52px;margin-top:30px;border-radius:999px;text-decoration:none;font-weight:600;
  font-size:1rem;background:#C9C2B6;color:#1D1D1F}
.tt-mmenu a.mm-cta:hover{background:#DDD7CC}
.tt-mmenu .mm-note{margin:10px 0 0;text-align:center;font-size:.8rem;color:#A1A1A6}

/* El header queda por encima del panel para que la llave siga visible como botón de cerrar */
header.top{z-index:50}
@media (max-width:1000px){
  .tt-wrench{display:grid}
  header.top .wrap,header.top .tt-bar{gap:10px}
}
/* En pantallas estrechas el CTA vive dentro del menú para que la barra no se desborde */
@media (max-width:430px){
  header.top > .wrap > .btn,header.top .tt-cta{display:none !important}
}
@media (prefers-reduced-motion:reduce){.tt-mmenu,.tt-wrench svg{transition:none}}

/* Áreas de toque de 44px en la barra y en los enlaces de texto del home/talleres */
@media (max-width:1000px){
  header.top .brand,header.top .tt-brand{display:inline-flex !important;align-items:center !important;min-height:44px}
}
@media (max-width:640px){
  a.textlink{padding:12px 0;margin:-12px 0}
}