/**
 * JK Hive — botones e ítems hex con SVG (assets/svg/).
 * Borde: hexagono2.svg (normal) | hexagono.svg (grueso).
 * Color/tamaño vía CSS; no redibujar clip-path en botones jkhive-bttn-* / nav.
 */

:root {
  --jkhive-hex-shell-color: var(--jkhive-bttn-hex-face, var(--jk-accent-honey-light, #f4c430));
  --jkhive-hex-icon-color: var(--jkhive-bttn-hex-face, var(--jk-accent-honey-light, #f4c430));
  /* Calibrados vs botones hex SVG en landing / nav */
  --jkhive-hex-nav-calibrated-scale: 1.235;
  --jkhive-hex-bttn-calibrated-scale: 1.311;
  --jkhive-hex-nav-base: 85px;
  --jkhive-hex-bttn-big-base: 65.17px;
}

.jkhive-hex-svg-btn {
  position: relative;
  display: block;
  flex-shrink: 0;
  overflow: visible;
  --jkhive-hex-inner-scale: 0.74;
  --jkhive-hex-icon-scale: 0.52;
}

.jkhive-hex-svg-btn__inner {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(100% * var(--jkhive-hex-inner-scale));
  height: calc(100% * var(--jkhive-hex-inner-scale));
  transform: translate(-50%, -50%);
  background: var(--jkhive-bttn-hex-inner-bg, #0a0e27);
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  z-index: 0;
  transition: background 0.3s ease, transform 0.3s ease;
  pointer-events: none;
}

.jkhive-hex-svg-btn__shell,
.jkhive-hex-svg-btn__icon {
  position: absolute;
  pointer-events: none;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.jkhive-hex-svg-btn__shell {
  inset: 0;
  z-index: 1;
  background-color: var(--jkhive-hex-shell-color);
  -webkit-mask-size: 98% 98%;
  mask-size: 98% 98%;
  transition: background-color 0.3s ease, transform 0.3s ease, filter 0.3s ease;
}

.jkhive-hex-svg-btn__icon {
  width: calc(100% * var(--jkhive-hex-icon-scale, 0.52));
  height: calc(100% * var(--jkhive-hex-icon-scale, 0.52));
  left: 50%;
  top: 52%;
  translate: -50% -50%;
  transform: none;
  z-index: 2;
  background-color: var(--jkhive-hex-icon-color);
  transition: background-color 0.3s ease;
  transform-origin: center center;
  transform-style: preserve-3d;
}

#jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn,
.jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn {
  --jkhive-hex-icon-scale: 0.54;
}

.jkhive-hex-svg-btn--border-thick .jkhive-hex-svg-btn__shell {
  inset: -1%;
  -webkit-mask-image: url('../svg/hexagono.svg') !important;
  mask-image: url('../svg/hexagono.svg') !important;
}

/* Tamaños */
.jkhive-hex-svg-btn--nav {
  width: calc(var(--jkhive-hex-nav-base) * var(--jkhive-hex-nav-calibrated-scale));
  height: calc(var(--jkhive-hex-nav-base) * 1.1547 * var(--jkhive-hex-nav-calibrated-scale));
}

.jkhive-hex-svg-btn--big {
  width: 65.17px;
  height: calc(65.17px * 1.1547);
  --jkhive-hex-inner-scale: 0.7;
}

.jkhive-hex-svg-btn--med {
  width: 52.136px;
  height: calc(52.136px * 1.1547);
  --jkhive-hex-inner-scale: 0.7;
}

.jkhive-hex-svg-btn--sm {
  width: 40px;
  height: calc(40px * 1.1547);
  --jkhive-hex-inner-scale: 0.68;
}

.jkhive-hex-svg-btn--navbar {
  width: 38px;
  height: calc(38px * 1.1547);
  --jkhive-hex-inner-scale: 0.68;
}

.jkhive-hex-svg-btn--fill {
  width: 100%;
  height: 100%;
}

/* Dentro de contenedores jkhive-bttn-* (borde grueso + escala calibrada en big) */
.jkhive-bttn-med > a .jkhive-hex-svg-btn,
.jkhive-bttn-med > button .jkhive-hex-svg-btn,
.jkhive-bttn-sm > a .jkhive-hex-svg-btn,
.jkhive-bttn-sm > button .jkhive-hex-svg-btn {
  width: 100%;
  height: 100%;
}

.jkhive-bttn-big > a .jkhive-hex-svg-btn,
.jkhive-bttn-big > button .jkhive-hex-svg-btn,
.jkhive-bttn-big .jkhive-hex-svg-btn {
  width: calc(var(--jkhive-hex-bttn-big-base) * var(--jkhive-hex-bttn-calibrated-scale));
  height: calc(var(--jkhive-hex-bttn-big-base) * 1.1547 * var(--jkhive-hex-bttn-calibrated-scale));
}

/* jkhive-bttn-*: borde grueso (hexagono.svg) aunque el HTML no traiga la clase */
.jkhive-bttn-big .jkhive-hex-svg-btn--fill .jkhive-hex-svg-btn__shell,
.jkhive-bttn-big > a .jkhive-hex-svg-btn--fill .jkhive-hex-svg-btn__shell,
.jkhive-bttn-big > button .jkhive-hex-svg-btn--fill .jkhive-hex-svg-btn__shell,
.jkhive-bttn-med .jkhive-hex-svg-btn--fill .jkhive-hex-svg-btn__shell,
.jkhive-bttn-med > a .jkhive-hex-svg-btn--fill .jkhive-hex-svg-btn__shell,
.jkhive-bttn-med > button .jkhive-hex-svg-btn--fill .jkhive-hex-svg-btn__shell {
  -webkit-mask-image: url('../svg/hexagono.svg') !important;
  mask-image: url('../svg/hexagono.svg') !important;
}

/* CTA landing: solo botones .jkhive-hex-svg-btn (sin hex clip-path legacy) */
#cta.cta-section-hex .cta-buttons-hex,
.cta-section-hex .cta-buttons-hex {
  align-items: center;
}

#cta.cta-section-hex .cta-buttons-hex .jkhive-bttn-big,
.cta-section-hex .cta-buttons-hex .jkhive-bttn-big {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#cta.cta-section-hex .cta-buttons-hex .jkhive-bttn-big > a,
#cta.cta-section-hex .cta-buttons-hex .jkhive-bttn-big > button,
.cta-section-hex .cta-buttons-hex .jkhive-bttn-big > a,
.cta-section-hex .cta-buttons-hex .jkhive-bttn-big > button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#cta.cta-section-hex .cta-buttons-hex .jkhive-bttn-big .jkhive-hex-svg-btn,
.cta-section-hex .cta-buttons-hex .jkhive-bttn-big .jkhive-hex-svg-btn {
  flex-shrink: 0;
  margin: 0;
}

/* Hover botones estándar (miel → cyan); escala en shell para no pisar animación del ícono */
.jkhive-bttn-med:not(.jkhive-bttn-new):not(.jkhive-bttn-cat):hover .jkhive-hex-svg-btn,
.jkhive-bttn-med:not(.jkhive-bttn-new):not(.jkhive-bttn-cat):focus-within .jkhive-hex-svg-btn,
.jkhive-bttn-big:not(.jkhive-bttn-new):not(.jkhive-bttn-cat):hover .jkhive-hex-svg-btn,
.jkhive-bttn-big:not(.jkhive-bttn-new):not(.jkhive-bttn-cat):focus-within .jkhive-hex-svg-btn,
.jkhive-bttn-sm:not(.jkhive-bttn-new):not(.jkhive-bttn-cat):hover .jkhive-hex-svg-btn,
.jkhive-bttn-sm:not(.jkhive-bttn-new):not(.jkhive-bttn-cat):focus-within .jkhive-hex-svg-btn {
  --jkhive-hex-shell-color: var(--jkhive-bttn-hex-face-hover, var(--jk-accent-cyan, #06b6d4));
  --jkhive-hex-icon-color: var(--jkhive-bttn-hex-face-hover, var(--jk-accent-cyan, #06b6d4));
  filter: drop-shadow(0 0 12px rgba(6, 182, 212, 0.45));
}

.jkhive-bttn-med:not(.jkhive-bttn-new):not(.jkhive-bttn-cat):hover .jkhive-hex-svg-btn__shell,
.jkhive-bttn-med:not(.jkhive-bttn-new):not(.jkhive-bttn-cat):focus-within .jkhive-hex-svg-btn__shell,
.jkhive-bttn-big:not(.jkhive-bttn-new):not(.jkhive-bttn-cat):hover .jkhive-hex-svg-btn__shell,
.jkhive-bttn-big:not(.jkhive-bttn-new):not(.jkhive-bttn-cat):focus-within .jkhive-hex-svg-btn__shell,
.jkhive-bttn-sm:not(.jkhive-bttn-new):not(.jkhive-bttn-cat):hover .jkhive-hex-svg-btn__shell,
.jkhive-bttn-sm:not(.jkhive-bttn-new):not(.jkhive-bttn-cat):focus-within .jkhive-hex-svg-btn__shell {
  transform: scale(1.05);
}

.jkhive-bttn-med:hover .jkhive-hex-svg-btn__inner,
.jkhive-bttn-big:hover .jkhive-hex-svg-btn__inner {
  transform: translate(-50%, -50%) scale(1.03);
}

/*
 * Nav lateral SVG — panal honeycomb (CANÓN).
 * Documentación: assets/docs/SIDEBAR-NAV-HONEYCOMB-CANON.md
 * Zigzag: jkhive-sidebar.css (21/22 desktop, 14/15 móvil) — no usar otros translateX aquí.
 * Escala 1.2 compensa máscara SVG (1.235 desbordaba la columna 101px).
 */
#jkhive-sidebar,
.jkhive-sidebar {
  --jkhive-hex-nav-calibrated-scale: 1.2;
}

#jkhive-sidebar .jkhive-nav-item:has(.jkhive-hex-svg-btn),
.jkhive-sidebar .jkhive-nav-item:has(.jkhive-hex-svg-btn) {
  width: 100%;
  line-height: 0;
  font-size: 0;
  text-align: center;
  overflow: visible;
}

/* Desktop: solape panal SVG */
@media (min-width: 769px) {
  #jkhive-sidebar .jkhive-nav-item:has(.jkhive-hex-svg-btn),
  .jkhive-sidebar .jkhive-nav-item:has(.jkhive-hex-svg-btn) {
    margin: -22px 0;
  }
}

#jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn,
.jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn {
  --jkhive-hex-shell-color: rgba(56, 189, 248, 0.55);
  --jkhive-hex-icon-color: rgba(56, 189, 248, 0.65);
  --jkhive-hex-icon-scale: 0.58;
  --jkhive-bttn-hex-inner-bg: var(--jk-tech-dark, #1e293b);
  transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1), filter 0.15s ease;
  overflow: visible;
  transform: none;
}

#jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn__shell,
.jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn__shell {
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

#jkhive-sidebar .jkhive-nav-item a,
.jkhive-sidebar .jkhive-nav-item a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
}

#jkhive-sidebar .jkhive-nav-item a:has(.jkhive-hex-svg-btn),
.jkhive-sidebar .jkhive-nav-item a:has(.jkhive-hex-svg-btn) {
  display: flex;
  width: calc(var(--jkhive-hex-nav-base) * var(--jkhive-hex-nav-calibrated-scale));
  height: calc(var(--jkhive-hex-nav-base) * 1.1547 * var(--jkhive-hex-nav-calibrated-scale));
  margin-left: auto;
  margin-right: auto;
  flex-shrink: 0;
  overflow: visible;
}

/* Panal zigzag: ver SIDEBAR-NAV-HONEYCOMB-CANON.md — no duplicar valores distintos */

/* Hit = hexágono completo (marco + ícono); el enlace recibe hover en todo el panal */
#jkhive-sidebar .jkhive-nav-item:has(.jkhive-hex-svg-btn),
.jkhive-sidebar .jkhive-nav-item:has(.jkhive-hex-svg-btn) {
  pointer-events: none;
}

#jkhive-sidebar .jkhive-nav-item > a:has(.jkhive-hex-svg-btn),
.jkhive-sidebar .jkhive-nav-item > a:has(.jkhive-hex-svg-btn) {
  pointer-events: auto;
}

#jkhive-sidebar .jkhive-nav-item > a:has(.jkhive-hex-svg-btn) .jkhive-hex-svg-btn,
.jkhive-sidebar .jkhive-nav-item > a:has(.jkhive-hex-svg-btn) .jkhive-hex-svg-btn {
  pointer-events: auto;
}

#jkhive-sidebar .jkhive-nav-item > a:has(.jkhive-hex-svg-btn):hover,
#jkhive-sidebar .jkhive-nav-item > a:has(.jkhive-hex-svg-btn):focus-visible,
#jkhive-sidebar .jkhive-nav-item.is-svg-hit-target > a:has(.jkhive-hex-svg-btn),
.jkhive-sidebar .jkhive-nav-item > a:has(.jkhive-hex-svg-btn):hover,
.jkhive-sidebar .jkhive-nav-item > a:has(.jkhive-hex-svg-btn):focus-visible,
.jkhive-sidebar .jkhive-nav-item.is-svg-hit-target > a:has(.jkhive-hex-svg-btn) {
  z-index: 26;
}

/* Panal solapado: solo el ítem bajo el cursor recibe hover/clic (JS: is-svg-hit-target) */
#jkhive-sidebar.jkhive-sidebar--svg-hit-active:has(.is-svg-hit-target) .jkhive-nav-item:not(.is-svg-hit-target) > a:has(.jkhive-hex-svg-btn),
.jkhive-sidebar.jkhive-sidebar--svg-hit-active:has(.is-svg-hit-target) .jkhive-nav-item:not(.is-svg-hit-target) > a:has(.jkhive-hex-svg-btn) {
  pointer-events: none !important;
}

#jkhive-sidebar.jkhive-sidebar--svg-hit-active .jkhive-nav-item.is-svg-hit-target > a:has(.jkhive-hex-svg-btn),
.jkhive-sidebar.jkhive-sidebar--svg-hit-active .jkhive-nav-item.is-svg-hit-target > a:has(.jkhive-hex-svg-btn) {
  pointer-events: auto !important;
}

#jkhive-sidebar .jkhive-nav-item a:has(.jkhive-hex-svg-btn) .jkhive-hex-svg-btn,
.jkhive-sidebar .jkhive-nav-item a:has(.jkhive-hex-svg-btn) .jkhive-hex-svg-btn {
  width: 100%;
  height: 100%;
}

#jkhive-sidebar .jkhive-nav-item > a:hover .jkhive-hex-svg-btn,
#jkhive-sidebar .jkhive-nav-item > a:focus-visible .jkhive-hex-svg-btn,
#jkhive-sidebar .jkhive-nav-item.is-svg-hit-target > a .jkhive-hex-svg-btn,
#jkhive-sidebar .jkhive-nav-item:focus-within > a .jkhive-hex-svg-btn,
.jkhive-sidebar .jkhive-nav-item > a:hover .jkhive-hex-svg-btn,
.jkhive-sidebar .jkhive-nav-item > a:focus-visible .jkhive-hex-svg-btn,
.jkhive-sidebar .jkhive-nav-item.is-svg-hit-target > a .jkhive-hex-svg-btn,
.jkhive-sidebar .jkhive-nav-item:focus-within > a .jkhive-hex-svg-btn {
  --jkhive-hex-shell-color: var(--jk-primary-blue-light, #38bdf8);
  --jkhive-hex-icon-color: var(--jk-primary-blue-light, #38bdf8);
  transform: scale(1.05);
  filter: none;
  perspective: 520px;
  transform-style: preserve-3d;
}

/*
 * Nav lateral — pinball hover: doble cara (.icon-flip + front/back), 2 vueltas en eje X.
 * Eje Y (coin720) quedará para ítems con submenú: flip continuo padre ↔ ícono del sub-ítem activo.
 */
#jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn__icon--dblface,
.jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn__icon--dblface {
  display: block;
  background-color: transparent !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  transform-style: preserve-3d;
  overflow: visible;
}

#jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn__icon-flip,
.jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn__icon-flip {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transform-origin: center center;
}

#jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn__icon-face,
.jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn__icon-face {
  position: absolute;
  inset: 0;
  background-color: var(--jkhive-hex-icon-color);
  -webkit-mask-image: var(--jkhive-icon-mask);
  mask-image: var(--jkhive-icon-mask);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform-style: preserve-3d;
}

#jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn__icon-face--front,
.jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn__icon-face--front {
  transform: translateZ(0.75px);
}

/* Hover pinball: siempre eje horizontal (X). Eje vertical (Y) reservado para flip padre ↔ submenú activo. */
#jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn__icon-face--back,
.jkhive-sidebar .jkhive-nav-item .jkhive-hex-svg-btn__icon-face--back {
  transform: rotateX(180deg) translateZ(0.75px);
}

#jkhive-sidebar .jkhive-nav-item > a:hover .jkhive-hex-svg-btn__icon-flip,
#jkhive-sidebar .jkhive-nav-item > a:focus-visible .jkhive-hex-svg-btn__icon-flip,
#jkhive-sidebar .jkhive-nav-item.is-svg-hit-target > a .jkhive-hex-svg-btn__icon-flip,
#jkhive-sidebar .jkhive-nav-item:focus-within > a .jkhive-hex-svg-btn__icon-flip,
.jkhive-sidebar .jkhive-nav-item > a:hover .jkhive-hex-svg-btn__icon-flip,
.jkhive-sidebar .jkhive-nav-item > a:focus-visible .jkhive-hex-svg-btn__icon-flip,
.jkhive-sidebar .jkhive-nav-item.is-svg-hit-target > a .jkhive-hex-svg-btn__icon-flip,
.jkhive-sidebar .jkhive-nav-item:focus-within > a .jkhive-hex-svg-btn__icon-flip {
  animation: jkhive-anmtn-coin720-x 0.65s ease-in-out forwards !important;
}

/* Activo: solo color del shell/ícono — sin filter ni pulse (el drop-shadow se recorta
   en el borde inferior del sidebar y forma una franja amarilla horizontal). */
#jkhive-sidebar .jkhive-nav-item.active .jkhive-hex-svg-btn,
.jkhive-sidebar .jkhive-nav-item.active .jkhive-hex-svg-btn {
  --jkhive-hex-shell-color: var(--jk-theme-highlight, #f4c430);
  --jkhive-hex-icon-color: var(--jk-theme-highlight, #f4c430);
  filter: none;
  animation: none;
}

/* Navbar hex cluster + #searchIcon: solo SVG visible (sin caja cuadrada legacy) */
.jkfw-navbar-hex-cluster .jkhive-navbar-hex-item,
.jkhive-navbar-hex-item:has(.jkhive-hex-svg-btn),
#searchIcon.jkhive-navbar-hex-item:has(.jkhive-hex-svg-btn) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  width: 38px;
  height: calc(38px * 1.1547);
  background: none !important;
  background-image: none !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  clip-path: none !important;
  filter: none !important;
  text-shadow: none !important;
  overflow: visible;
}

.jkfw-navbar-hex-cluster .jkhive-navbar-hex-item:has(.jkhive-hex-svg-btn):hover,
.jkhive-navbar-hex-item:has(.jkhive-hex-svg-btn):hover:not(#searchIcon) {
  background: none !important;
  background-image: none !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none;
}

#searchIcon.jkhive-navbar-hex-item:has(.jkhive-hex-svg-btn):hover {
  background: none !important;
  background-image: none !important;
  border: none !important;
  outline: none !important;
  z-index: 10;
  transform: scale(1.1);
  filter: brightness(1.3);
  box-shadow: var(--jk-shadow-lg), 0 0 20px rgba(6, 182, 212, 0.6);
}

.jkfw-navbar-hex-cluster .jkhive-hex-svg-btn,
.jkhive-navbar-hex-item .jkhive-hex-svg-btn {
  --jkhive-hex-shell-color: rgba(212, 160, 23, 0.75);
  --jkhive-hex-icon-color: var(--jk-accent-honey-light, #f4c430);
  --jkhive-bttn-hex-inner-bg: var(--jk-tech-dark, #1e293b);
  overflow: hidden;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}

/* Buscar: solo color base más intenso; hover sin tocar (cyan + scale en regla general) */
#searchIcon:not(:hover) .jkhive-hex-svg-btn,
.jkhive-navbar-hex-item#searchIcon:not(:hover) .jkhive-hex-svg-btn {
  --jkhive-hex-shell-color: var(--jk-theme-highlight, #f4c430);
  --jkhive-hex-icon-color: var(--jk-theme-highlight, #f4c430);
}

.jkfw-navbar-hex-cluster .jkhive-navbar-hex-item:hover .jkhive-hex-svg-btn,
.jkhive-navbar-hex-item:hover .jkhive-hex-svg-btn,
#searchIcon:hover .jkhive-hex-svg-btn {
  --jkhive-hex-shell-color: var(--jk-accent-cyan, #06b6d4);
  --jkhive-hex-icon-color: var(--jk-accent-cyan, #06b6d4);
  transform: scale(1.08);
}

.jkfw-navbar-hex-cluster .jkhive-navbar-hex-item.is-active .jkhive-hex-svg-btn {
  --jkhive-hex-shell-color: var(--jk-accent-cyan, #06b6d4);
  --jkhive-hex-icon-color: var(--jk-accent-cyan, #06b6d4);
}

/* Ocultar FA solo si ya hay botón SVG hijo (evita vaciar #searchIcon sin migrar) */
.jkhive-navbar-hex-item:has(.jkhive-hex-svg-btn) > i.jkhive-hex-icon,
.jkhive-navbar-hex-item:has(.jkhive-hex-svg-btn) > i[class*="fa-"] {
  display: none !important;
}

body.jkfw-theme-elegant .jkhive-navbar-hex-item:has(.jkhive-hex-svg-btn),
body.jkfw-theme-elegant #searchIcon.jkhive-navbar-hex-item:has(.jkhive-hex-svg-btn) {
  box-shadow: none !important;
  background: none !important;
}

body.jkfw-theme-elegant .jkhive-navbar-hex-item:has(.jkhive-hex-svg-btn):hover:not(#searchIcon) {
  box-shadow: none !important;
  background: none !important;
  filter: none !important;
}

body.jkfw-theme-elegant #searchIcon.jkhive-navbar-hex-item:has(.jkhive-hex-svg-btn):hover {
  box-shadow: none !important;
  background: none !important;
}

/* #searchIcon — pinball hover (misma animación que nav lateral, eje X) */
#searchIcon .jkhive-hex-svg-btn {
  overflow: visible;
  clip-path: none;
}

#searchIcon:hover .jkhive-hex-svg-btn,
#searchIcon:focus-within .jkhive-hex-svg-btn {
  perspective: 520px;
  transform-style: preserve-3d;
}

#searchIcon .jkhive-hex-svg-btn__icon--dblface {
  display: block;
  background-color: transparent !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  transform-style: preserve-3d;
  overflow: visible;
}

#searchIcon .jkhive-hex-svg-btn__icon-flip {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transform-origin: center center;
}

#searchIcon .jkhive-hex-svg-btn__icon-face {
  position: absolute;
  inset: 0;
  background-color: var(--jkhive-hex-icon-color);
  -webkit-mask-image: var(--jkhive-icon-mask);
  mask-image: var(--jkhive-icon-mask);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform-style: preserve-3d;
}

#searchIcon .jkhive-hex-svg-btn__icon-face--front {
  transform: translateZ(0.75px);
}

#searchIcon .jkhive-hex-svg-btn__icon-face--back {
  transform: rotateX(180deg) translateZ(0.75px);
}

#searchIcon:hover .jkhive-hex-svg-btn__icon-flip,
#searchIcon:focus-within .jkhive-hex-svg-btn__icon-flip {
  animation: jkhive-anmtn-coin720-x 0.65s ease-in-out forwards !important;
}

/* Sidebar nav SVG — mobile: base 60px + escala (panal = jkhive-sidebar.css 14px / -15px) */
@media (max-width: 768px) {
  #jkhive-sidebar,
  .jkhive-sidebar {
    --jkhive-hex-nav-base: 60px;
    --jkhive-hex-nav-calibrated-scale: 1.2;
  }

  #jkhive-sidebar .jkhive-nav-item:has(.jkhive-hex-svg-btn),
  .jkhive-sidebar .jkhive-nav-item:has(.jkhive-hex-svg-btn) {
    margin: -15px 0;
  }

  /* Zigzag canónico: mismos offsets que jkhive-sidebar.css en jkhive / jklubs / housesitting */
  #jkhive-sidebar .jkhive-nav-item:nth-child(even):has(.jkhive-hex-svg-btn),
  .jkhive-sidebar .jkhive-nav-item:nth-child(even):has(.jkhive-hex-svg-btn) {
    transform: translateX(14px);
  }

  #jkhive-sidebar .jkhive-nav-item:nth-child(odd):has(.jkhive-hex-svg-btn),
  .jkhive-sidebar .jkhive-nav-item:nth-child(odd):has(.jkhive-hex-svg-btn) {
    transform: translateX(-15px);
  }

  #jkhive-sidebar.jkhive-sidebar,
  .jkhive-sidebar {
    padding-top: calc(
      21px + (var(--jkhive-hex-nav-base) * 1.1547 * var(--jkhive-hex-nav-calibrated-scale) - 24px)
    ) 0 var(--jk-spacing-md) 0;
  }

  #jkhive-sidebar .jkhive-nav-items:has(.jkhive-hex-svg-btn),
  .jkhive-sidebar .jkhive-nav-items:has(.jkhive-hex-svg-btn) {
    padding-top: 14px;
    padding-bottom: 18px;
  }
}

/* Espacio lateral para zigzag sin recorte + puntas arriba/abajo */
#jkhive-sidebar .jkhive-nav-items:has(.jkhive-hex-svg-btn),
.jkhive-sidebar .jkhive-nav-items:has(.jkhive-hex-svg-btn) {
  width: 100%;
  padding: 10px 12px 14px;
  box-sizing: border-box;
  overflow: visible;
}

/* =============================================================================
   Animaciones JK Hive en botones SVG (paridad jkhive-elements.css; keyframes allí)
   Keyframes en jkhive-elements.css; el ícono usa translate + transform por separado.
   ============================================================================= */

.jkhive-bttn-big .jkhive-hex-svg-btn,
.jkhive-bttn-med .jkhive-hex-svg-btn,
.jkhive-bttn-sm .jkhive-hex-svg-btn {
  transform-style: preserve-3d;
}

.jkhive-bttn-big:hover .jkhive-hex-svg-btn__icon,
.jkhive-bttn-big:focus-within .jkhive-hex-svg-btn__icon,
.jkhive-bttn-med:hover .jkhive-hex-svg-btn__icon,
.jkhive-bttn-med:focus-within .jkhive-hex-svg-btn__icon,
.jkhive-bttn-sm:hover .jkhive-hex-svg-btn__icon,
.jkhive-bttn-sm:focus-within .jkhive-hex-svg-btn__icon {
  transition: background-color 0.3s ease !important;
}

/* jkhive-bttn-big — por SVG (equivalente a reglas .fa-* en elements) */
.jkhive-bttn-big:not([class*='jkhive-btn-anim-']):hover .jkhive-hex-svg-btn__icon[style*='portafolio.svg'],
.jkhive-bttn-big:not([class*='jkhive-btn-anim-']):focus-within .jkhive-hex-svg-btn__icon[style*='portafolio.svg'],
.jkhive-bttn-big:not([class*='jkhive-btn-anim-']):hover .jkhive-hex-svg-btn__icon[style*='envelope.svg'],
.jkhive-bttn-big:not([class*='jkhive-btn-anim-']):focus-within .jkhive-hex-svg-btn__icon[style*='envelope.svg'],
.jkhive-bttn-big:not([class*='jkhive-btn-anim-']):hover .jkhive-hex-svg-btn__icon[style*='enviar_mensaje.svg'],
.jkhive-bttn-big:not([class*='jkhive-btn-anim-']):focus-within .jkhive-hex-svg-btn__icon[style*='enviar_mensaje.svg'] {
  animation: jkhive-anmtn-envelope 0.6s ease-in-out forwards !important;
}

#cta.cta-section-hex .jkhive-bttn-big:hover .jkhive-hex-svg-btn__icon[style*='portafolio.svg'],
#cta.cta-section-hex .jkhive-bttn-big:focus-within .jkhive-hex-svg-btn__icon[style*='portafolio.svg'],
.cta-section-hex .jkhive-bttn-big:hover .jkhive-hex-svg-btn__icon[style*='portafolio.svg'],
.cta-section-hex .jkhive-bttn-big:focus-within .jkhive-hex-svg-btn__icon[style*='portafolio.svg'] {
  animation: jkhive-anmtn-envelope 0.6s ease-in-out forwards !important;
}

#cta.cta-section-hex .jkhive-bttn-big:hover .jkhive-hex-svg-btn__icon[style*='envelope.svg'],
#cta.cta-section-hex .jkhive-bttn-big:focus-within .jkhive-hex-svg-btn__icon[style*='envelope.svg'],
.cta-section-hex .jkhive-bttn-big:hover .jkhive-hex-svg-btn__icon[style*='envelope.svg'],
.cta-section-hex .jkhive-bttn-big:focus-within .jkhive-hex-svg-btn__icon[style*='envelope.svg'] {
  animation: jkhive-anmtn-envelope-reverse 0.6s ease-in-out forwards !important;
}

.jkhive-bttn-big:hover .jkhive-hex-svg-btn__icon[style*='about.svg'],
.jkhive-bttn-big:focus-within .jkhive-hex-svg-btn__icon[style*='about.svg'],
.jkhive-bttn-med:hover .jkhive-hex-svg-btn__icon[style*='about.svg'],
.jkhive-bttn-med:focus-within .jkhive-hex-svg-btn__icon[style*='about.svg'] {
  animation: jkhive-anmtn-handshake 0.8s ease-in-out forwards !important;
}

.jkhive-bttn-big:hover .jkhive-hex-svg-btn__icon[style*='galeria.svg'],
.jkhive-bttn-big:focus-within .jkhive-hex-svg-btn__icon[style*='galeria.svg'],
.jkhive-bttn-med:hover .jkhive-hex-svg-btn__icon[style*='galeria.svg'],
.jkhive-bttn-med:focus-within .jkhive-hex-svg-btn__icon[style*='galeria.svg'] {
  animation: jkhive-anmtn-graduation 0.6s ease-in-out forwards !important;
}

.jkhive-bttn-big:hover .jkhive-hex-svg-btn__icon[style*='home.svg'],
.jkhive-bttn-big:focus-within .jkhive-hex-svg-btn__icon[style*='home.svg'],
.jkhive-bttn-med:hover .jkhive-hex-svg-btn__icon[style*='home.svg'],
.jkhive-bttn-med:focus-within .jkhive-hex-svg-btn__icon[style*='home.svg'] {
  animation: jkhive-anmtn-globe 0.6s ease-in-out forwards !important;
}

.jkhive-bttn-big:hover .jkhive-hex-svg-btn__icon[style*='search.svg'],
.jkhive-bttn-big:focus-within .jkhive-hex-svg-btn__icon[style*='search.svg'],
.jkhive-bttn-med:hover .jkhive-hex-svg-btn__icon[style*='search.svg'],
.jkhive-bttn-med:focus-within .jkhive-hex-svg-btn__icon[style*='search.svg'] {
  animation: jkhive-anmtn-globe 0.6s ease-in-out forwards !important;
}

/* jkhive-bttn-med — mismos SVG frecuentes en modales / paginación */
.jkhive-bttn-med:not([class*='jkhive-btn-anim-']):hover .jkhive-hex-svg-btn__icon[style*='envelope.svg'],
.jkhive-bttn-med:not([class*='jkhive-btn-anim-']):focus-within .jkhive-hex-svg-btn__icon[style*='envelope.svg'],
.jkhive-bttn-med:not([class*='jkhive-btn-anim-']):hover .jkhive-hex-svg-btn__icon[style*='enviar_mensaje.svg'],
.jkhive-bttn-med:not([class*='jkhive-btn-anim-']):focus-within .jkhive-hex-svg-btn__icon[style*='enviar_mensaje.svg'] {
  animation: jkhive-anmtn-envelope 0.6s ease-in-out forwards !important;
}

/* Modal detalle + CTA home: contacto = sobre en Z sentido inverso (paridad #cta) */
.jklp-hex-detail-modal .jkhive-bttn-med:hover .jkhive-hex-svg-btn__icon[style*='envelope.svg'],
.jklp-hex-detail-modal .jkhive-bttn-med:focus-within .jkhive-hex-svg-btn__icon[style*='envelope.svg'] {
  animation: jkhive-anmtn-envelope-reverse 0.6s ease-in-out forwards !important;
}

/* Clases jkhive-btn-anim-* (contenedor) — paridad elements.css */
.jkhive-btn-anim-coinleft .jkhive-hex-svg-btn,
.jkhive-btn-anim-coinright .jkhive-hex-svg-btn,
.jkhive-btn-anim-coindouble .jkhive-hex-svg-btn,
.jkhive-btn-anim-coinx .jkhive-hex-svg-btn,
.jkhive-btn-anim-coinhorizontal .jkhive-hex-svg-btn {
  perspective: 520px;
}

.jkhive-btn-anim-coinleft:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-coinleft:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-coin180 0.6s ease-in-out forwards !important;
}

.jkhive-btn-anim-coinright:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-coinright:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-coin180-reverse 0.6s ease-in-out forwards !important;
}

.jkhive-btn-anim-coinx:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-coinx:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-coin360-x 0.62s ease-in-out forwards !important;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.jkhive-btn-anim-coinhorizontal:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-coinhorizontal:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-coin180-x 0.6s ease-in-out forwards !important;
}

.jkhive-btn-anim-coindouble:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-coindouble:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-coin720 0.65s ease-in-out forwards !important;
}

.jkhive-btn-anim-shake:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-shake:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-shake 0.42s ease-in-out !important;
}

.jkhive-btn-anim-linkedin:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-linkedin:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-linkedin 0.5s ease-in-out forwards !important;
}

.jkhive-btn-anim-briefcase:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-briefcase:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-briefcase 0.8s ease-in-out forwards !important;
}

.jkhive-btn-anim-graduation:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-graduation:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-graduation 0.6s ease-in-out forwards !important;
}

.jkhive-btn-anim-inverseclock:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-inverseclock:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-inverseclock 0.38s ease-in-out !important;
}

.jkhive-btn-anim-heartbeat:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-heartbeat:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-heartbeat 1.1s ease-in-out forwards !important;
}

.jkhive-btn-anim-flip180-left:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-flip180-left:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-flip180-left 0.5s ease-in-out forwards !important;
}

.jkhive-btn-anim-flip180-right:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-flip180-right:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-flip180-right 0.5s ease-in-out forwards !important;
}

.jkhive-btn-anim-flip180-up:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-flip180-up:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-flip180-up 0.5s ease-in-out forwards !important;
}

.jkhive-btn-anim-flip180-down:hover .jkhive-hex-svg-btn__icon,
.jkhive-btn-anim-flip180-down:focus-within .jkhive-hex-svg-btn__icon {
  animation: jkhive-anmtn-flip180-down 0.5s ease-in-out forwards !important;
}

/* ========================================
   MÓVIL — jkhive-bttn-big / med con .jkhive-hex-svg-btn (global, todas las páginas)
   Paridad jkhive-style.css (55.39px legacy .jkhive-hex). Sin escala calibrada en móvil.
   ======================================== */
@media (max-width: 768px) {
  :root {
    --jkhive-hex-bttn-big-base: 55.39px;
    --jkhive-hex-bttn-calibrated-scale: 1;
  }

  html body .jkhive-bttn-big,
  html body .jkhive-bttn-big > a,
  html body .jkhive-bttn-big > button,
  html body #jkhive-system-modal-container .jkhive-bttn-big,
  html body #jkhive-system-modal-container .jkhive-bttn-big > a,
  html body #jkhive-system-modal-container .jkhive-bttn-big > button,
  .jkhive-bttn-big,
  .jkhive-bttn-big > a,
  .jkhive-bttn-big > button {
    width: var(--jkhive-hex-bttn-big-base) !important;
    height: calc(var(--jkhive-hex-bttn-big-base) * 1.1547) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  html body .jkhive-bttn-big .jkhive-hex-svg-btn,
  html body .jkhive-bttn-big > a .jkhive-hex-svg-btn,
  html body .jkhive-bttn-big > button .jkhive-hex-svg-btn,
  html body .jkhive-bttn-big > .jkhive-hex-svg-btn,
  html body #jkhive-system-modal-container .jkhive-bttn-big .jkhive-hex-svg-btn,
  .jkhive-bttn-big .jkhive-hex-svg-btn,
  .jkhive-bttn-big > a .jkhive-hex-svg-btn,
  .jkhive-bttn-big > button .jkhive-hex-svg-btn {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
  }
}