/* ===== TIPOGRAFÍA ===== Neue Haas Grotesk necesita licencia web (la versión "Trial" no la incluye ni trae tildes). Mientras tanto se usa Helvetica Neue / Helvetica / Arial, que son las más parecidas. Cuando tengan la licencia web, suban el archivo .woff2 a Medios, descomenten este bloque y cambien la URL: @font-face{ font-family:'Neue Haas Grotesk Display';src:url('https://katabyhub.com/wp-content/uploads/AAAA/NeueHaasGroteskDisplay-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap } */ .kh2-header{--kf-font:'Neue Haas Grotesk Display','Neue Haas Grotesk Text','Helvetica Neue',Helvetica,Arial,sans-serif;--kf-bg:#151515;--kf-panel:#1c1c1c;--kf-line:rgba(255,255,255,.1);--kf-text:#ececec;--kf-muted:#b3b3b3;--kf-orange:#f76324;position:relative;z-index:999;background:var(--kf-bg);border-bottom:1px solid var(--kf-line);font-family:var(--kf-font)} .kh2-header,.kh2-header *{box-sizing:border-box} /* Que Elementor no encoja ni recorte el header: ocupa todo el ancho de la pantalla */ .elementor-widget-html:has(.kh2-header){width:100%;max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:1;margin:0} .elementor-widget-html:has(.kh2-header)>.elementor-widget-container{width:100%;padding:0;margin:0} .kh2-header{width:100%;max-width:100%} .kh2-header a{text-decoration:none;color:inherit} .kh2-header .kh2-en{display:none} html[lang^="en"] .kh2-header .kh2-es{display:none} html[lang^="en"] .kh2-header .kh2-en{display:inline} .kh2-header .kh2-bar{width:min(94%,1500px);margin:0 auto;min-height:84px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px} .kh2-header .kh2-brand{display:flex;align-items:center;gap:16px;color:#fff;font-weight:700;font-size:19px;letter-spacing:.3em} .kh2-header .kh2-brand img{display:block;width:42px;height:43px} .kh2-header .kh2-main-nav{display:flex;align-items:center;gap:6px} .kh2-header .kh2-main-nav>a,.kh2-header .kh2-nav-group>summary{display:flex;align-items:center;gap:6px;padding:10px 12px;border-radius:10px;color:var(--kf-text);font-size:14.5px;font-weight:500;letter-spacing:.005em;list-style:none;cursor:pointer;transition:color .2s ease,background .2s ease} .kh2-header .kh2-nav-group>summary::-webkit-details-marker{display:none} .kh2-header .kh2-main-nav>a:hover,.kh2-header .kh2-nav-group>summary:hover,.kh2-header .kh2-nav-group[open]>summary{color:#fff;background:rgba(255,255,255,.07)} .kh2-header .kh2-nav-group>summary svg{width:14px;height:14px;opacity:.7;transition:transform .25s ease} .kh2-header .kh2-nav-group[open]>summary svg{transform:rotate(180deg)} .kh2-header .kh2-nav-group{position:relative} .kh2-header .kh2-dropdown{position:absolute;top:calc(100% + 10px);left:0;min-width:230px;padding:10px;background:var(--kf-panel);border:1px solid var(--kf-line);border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.5)} .kh2-header .kh2-dropdown a{display:block;padding:11px 14px;border-radius:10px;color:var(--kf-text);font-size:14px;font-weight:500;transition:background .2s ease,color .2s ease} .kh2-header .kh2-dropdown a:hover{background:rgba(247,99,36,.16);color:#fff} .kh2-header .kh2-services-panel{width:560px;left:50%;transform:translateX(-50%)} .kh2-header .kh2-dropdown-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px} .kh2-header .kh2-dropdown-footer{margin-top:8px;padding-top:8px;border-top:1px solid var(--kf-line)} .kh2-header .kh2-dropdown-footer a{color:var(--kf-orange);font-weight:600} /* ===== BOTÓN HABLEMOS: naranja #f76324, letras blancas ===== */ .kh2-header a.kh2-cta{justify-self:end;display:inline-flex;align-items:center;gap:12px;padding:15px 26px;border-radius:999px;border:1px solid var(--kf-orange);background:var(--kf-orange);color:#fff;font-family:var(--kf-font);font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;box-shadow:0 10px 26px rgba(247,99,36,.3);transition:transform .3s ease,box-shadow .3s ease,filter .3s ease} .kh2-header a.kh2-cta svg{transition:transform .3s ease} .kh2-header a.kh2-cta:hover{transform:translateY(-2px);filter:brightness(1.08);box-shadow:0 16px 34px rgba(247,99,36,.45)} .kh2-header a.kh2-cta:hover svg{transform:translateX(4px)} .kh2-header a:focus-visible,.kh2-header summary:focus-visible{outline:2px solid #fff;outline-offset:3px} .kh2-header .kh2-mobile-nav{display:none} @media(max-width:1280px){ .kh2-header .kh2-bar{gap:14px} .kh2-header .kh2-brand{font-size:17px;letter-spacing:.22em;gap:12px} .kh2-header .kh2-main-nav{gap:2px} .kh2-header .kh2-main-nav>a,.kh2-header .kh2-nav-group>summary{padding:10px 9px;font-size:13.5px} .kh2-header a.kh2-cta{padding:13px 20px;font-size:12px;letter-spacing:.13em} } @media(max-width:1024px){ .kh2-header .kh2-bar{display:flex;justify-content:space-between;min-height:70px;gap:14px} .kh2-header .kh2-brand{margin-right:auto;font-size:17px} .kh2-header .kh2-main-nav{display:none} .kh2-header a.kh2-cta{padding:12px 18px;font-size:11.5px} .kh2-header .kh2-mobile-nav{display:block} .kh2-header .kh2-mobile-nav>summary{list-style:none;cursor:pointer;display:flex;flex-direction:column;gap:5px;padding:12px 8px} .kh2-header .kh2-mobile-nav>summary::-webkit-details-marker{display:none} .kh2-header .kh2-mobile-nav>summary span{display:block;width:24px;height:2px;border-radius:2px;background:#fff;transition:transform .25s ease,opacity .25s ease} .kh2-header .kh2-mobile-nav[open]>summary span:nth-child(1){transform:translateY(7px) rotate(45deg)} .kh2-header .kh2-mobile-nav[open]>summary span:nth-child(2){opacity:0} .kh2-header .kh2-mobile-nav[open]>summary span:nth-child(3){transform:translateY(-7px) rotate(-45deg)} .kh2-header .kh2-mobile-panel{position:absolute;left:0;right:0;top:100%;max-height:calc(100svh - 70px);overflow:auto;padding:14px 5% 26px;background:var(--kf-bg);border-top:1px solid var(--kf-line);box-shadow:0 30px 60px rgba(0,0,0,.5)} .kh2-header .kh2-mobile-panel nav{display:flex;flex-direction:column} .kh2-header .kh2-mobile-panel nav>a,.kh2-header .kh2-mobile-group>summary{display:flex;align-items:center;justify-content:space-between;padding:16px 4px;border-bottom:1px solid var(--kf-line);color:var(--kf-text);font-size:17px;font-weight:500;list-style:none;cursor:pointer} .kh2-header .kh2-mobile-group>summary::-webkit-details-marker{display:none} .kh2-header .kh2-mobile-group>summary svg{width:16px;height:16px;transition:transform .25s ease} .kh2-header .kh2-mobile-group[open]>summary svg{transform:rotate(180deg)} .kh2-header .kh2-mobile-submenu{display:flex;flex-direction:column;padding:6px 0 10px 14px} .kh2-header .kh2-mobile-submenu a{padding:12px 4px;color:var(--kf-muted);font-size:15px} .kh2-header .kh2-mobile-submenu a.kh2-mobile-all{color:var(--kf-orange);font-weight:600} .kh2-header .kh2-mobile-panel nav>a.kh2-mobile-contact{margin-top:18px;justify-content:center;border:1px solid var(--kf-orange);border-radius:999px;background:var(--kf-orange);color:#fff;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:13px} } @media(max-width:767px){ .kh2-header .kh2-bar{width:92%;min-height:64px} .kh2-header .kh2-brand span{display:none} .kh2-header .kh2-brand img{width:38px;height:39px} .kh2-header a.kh2-cta{padding:11px 16px;font-size:11px;letter-spacing:.12em;gap:8px} .kh2-header .kh2-mobile-panel{max-height:calc(100svh - 64px)} .kh2-header .kh2-mobile-panel nav>a,.kh2-header .kh2-mobile-group>summary{font-size:16px} } @media(max-width:360px){ .kh2-header a.kh2-cta svg{display:none} .kh2-header a.kh2-cta{padding:10px 14px} } @media(prefers-reduced-motion:reduce){.kh2-header *{transition:none!important}}(function(){ function setup(){ var groups=document.querySelectorAll(".kh2-header .kh2-main-nav .kh2-nav-group, .elementor-location-header .kh2-main-nav .kh2-nav-group"); groups.forEach(function(d){ if(d.dataset.hoverReady)return; d.dataset.hoverReady="1"; var timer=null; d.addEventListener("pointerenter",function(e){ if(e.pointerType!=="mouse"||window.matchMedia("(max-width:1024px)").matches)return; clearTimeout(timer); groups.forEach(function(other){if(other!==d)other.open=false;}); d.open=true; }); d.addEventListener("pointerleave",function(e){ if(e.pointerType!=="mouse")return; clearTimeout(timer); timer=setTimeout(function(){if(!d.matches(":hover")&&!d.contains(document.activeElement))d.open=false;},160); }); d.addEventListener("focusout",function(e){ if(!d.contains(e.relatedTarget)){setTimeout(function(){if(!d.matches(":hover")&&!d.contains(document.activeElement))d.open=false;},100);} }); }); document.addEventListener("keydown",function(e){if(e.key==="Escape")groups.forEach(function(d){d.open=false;});}); document.addEventListener("click",function(e){if(!e.target.closest(".kh2-main-nav .kh2-nav-group"))groups.forEach(function(d){d.open=false;});}); } if(document.readyState==="loading")document.addEventListener("DOMContentLoaded",setup,{once:true});else setup(); })();