/* Hub v5 = v2 + tabla periódica (banda oscura). Se carga después de hub2.css. */
@font-face{ font-family:"JB Mono Hub"; src:url(fonts/jetbrainsmono.woff2) format("woff2"); font-weight:400 700; font-display:swap; }
.hub5 .h5-kit{ background:var(--ink); border-block:0; color:#D5E2D9; position:relative; }
.hub5 .h5-kit::before{ content:""; position:absolute; inset:0; pointer-events:none;
	background:repeating-linear-gradient(90deg, transparent 0 79px, rgba(74,174,52,.07) 79px 80px); }
.hub5 .h5-kit > .e-con{ position:relative; }
.hub5 .h5-kit .h2-eyebrow .elementor-heading-title{ color:var(--leaf); }
.hub5 .h5-kit .h2-h2 .elementor-heading-title{ color:#fff; }
.hub5 .h5-kit .h2-intro, .hub5 .h5-kit .h2-intro p{ color:#A9BCB0; margin-bottom:28px; }

.hub5 .h3t-legend{ list-style:none; margin:0 0 18px; padding:0; display:flex; flex-wrap:wrap; gap:8px 18px; }
.hub5 .h3t-legend li{ font-family:"JB Mono Hub",var(--mono); font-size:.76rem; }
.hub5 .h3t-legend a{ color:#D5E2D9; display:inline-flex; align-items:center; gap:8px; }
.hub5 .h3t-legend a::before{ content:""; width:10px; height:10px; border-radius:2px; background:var(--k); }
.hub5 .h3t-legend a:hover{ color:#fff; }
.hub5 .h3t-cat--checker{ --k:#5CC8E6; } .hub5 .h3t-cat--generator{ --k:#6EE08A; } .hub5 .h3t-cat--developer{ --k:#B69CFF; }
.hub5 .h3t-cat--converter{ --k:#F2B544; } .hub5 .h3t-cat--text{ --k:#7FA8FF; } .hub5 .h3t-cat--qr{ --k:#FF8FC7; } .hub5 .h3t-cat--misc{ --k:#A7B6AC; }
.hub5 .h3t-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(92px,1fr)); gap:6px; }
.hub5 .h3t-el{ position:relative; display:flex; flex-direction:column; aspect-ratio:1/1.05; padding:8px 9px; border-radius:6px;
	background:color-mix(in srgb, var(--k) 9%, #10231A); border:1px solid color-mix(in srgb, var(--k) 30%, transparent); color:#D5E2D9;
	transition:transform .15s ease, background .15s ease, box-shadow .2s ease; }
.hub5 .h3t-el:hover, .hub5 .h3t-el:focus-visible{ transform:translateY(-3px) scale(1.04); z-index:2; background:color-mix(in srgb, var(--k) 20%, #10231A);
	box-shadow:0 10px 30px -10px var(--k); color:#fff; }
.hub5 .h3t-n{ font-family:"JB Mono Hub",var(--mono); font-size:.62rem; color:#7F958A; }
.hub5 .h3t-s{ font-family:var(--disp); font-weight:800; font-size:1.75rem; letter-spacing:-.02em; color:var(--k); line-height:1; margin:auto 0 4px; }
.hub5 .h3t-s sub{ font-family:"JB Mono Hub",var(--mono); font-size:.62rem; font-weight:600; vertical-align:baseline; margin-left:2px; letter-spacing:0; }
.hub5 .h3t-name{ font-size:.66rem; line-height:1.2; color:#93A89B; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.hub5 .h3t-el:hover .h3t-name{ color:#D5E2D9; }
.hub5 .h3t.is-in .h3t-el{ animation:h5pop .45s cubic-bezier(.2,.7,.3,1.2) backwards; animation-delay:calc(var(--i) * 14ms); }
@keyframes h5pop{ from{ opacity:0; transform:scale(.7); } }

.hub5 .h5-kit-foot{ display:flex; flex-wrap:wrap; align-items:center; gap:16px 28px; margin-top:32px; }
.hub5 .h5-ivr{ color:#A9BCB0; font-size:.95rem; }
.hub5 .h5-ivr span{ font-family:"JB Mono Hub",var(--mono); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--leaf); }
.hub5 .h5-ivr b{ color:#fff; }
.hub5 .h5-ivr:hover b{ color:var(--leaf); }

@media (max-width:700px){
	.hub5 .h3t-grid{ grid-template-columns:repeat(auto-fill,minmax(74px,1fr)); }
	.hub5 .h3t-s{ font-size:1.4rem; }
}
@media (prefers-reduced-motion:reduce){ .hub5 .h3t-el{ animation:none !important; transition:none !important; } }