.homelab-page{min-height:100vh;padding:calc(var(--nav-height) + 5rem) 2rem 5rem;animation:.8s ease-out fadeInUp;position:relative;overflow:hidden}.container{z-index:1;max-width:1200px;margin:0 auto;position:relative}.homelab-header{text-align:center;margin-bottom:5.5rem}.page-title{font-family:var(--font-heading);color:var(--color-text);letter-spacing:-.02em;margin-bottom:.75rem;font-size:clamp(2.5rem,8vw,4rem);font-weight:700}.page-subtitle{color:var(--color-text-dim);max-width:500px;margin:0 auto;font-size:1.1rem;line-height:1.6}.category-grid{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:2rem;display:grid}.category-card{color:#fff;perspective:1000px;touch-action:manipulation;text-decoration:none;display:block;position:relative}.card-inner{background:var(--color-bg-card);isolation:isolate;min-height:420px;transform-style:preserve-3d;backface-visibility:hidden;will-change:transform;border:1px solid #ffffff14;border-radius:1.5rem;flex-direction:column;padding:2.5rem;transition:transform .6s cubic-bezier(.4,0,.2,1),box-shadow .6s cubic-bezier(.4,0,.2,1),border-color .3s;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 6px #00000012,0 12px 24px #0000001f}.card-inner.tilt-active{transition:transform .12s ease-out,box-shadow .12s ease-out,border-color .3s}.category-card:hover .card-inner{border-color:var(--color-accent-purple)}.category-card-overlay{background:linear-gradient(to top, var(--overlay-color-top) 0%, var(--overlay-color-mid) 40%, var(--overlay-color-bot) 100%);backdrop-filter:blur(2px);transition:background .4s,backdrop-filter .4s;position:absolute;inset:0}.category-card-content{z-index:2;flex-direction:column;flex-grow:1;justify-content:flex-end;height:100%;margin-top:auto;display:flex;position:relative}.category-title{font-family:var(--font-heading);color:var(--color-accent-purple);letter-spacing:-.02em;text-shadow:0 2px 20px #00000080;margin-bottom:.75rem;font-size:clamp(1.75rem,4vw,2.5rem);font-weight:700}.category-description{color:var(--color-accent-pink);text-shadow:0 1px 10px #00000080;margin-bottom:2rem;font-size:1.1rem;line-height:1.6}[data-theme=light] .category-title,[data-theme=light] .category-description{color:var(--color-text);text-shadow:none;font-weight:500}.category-arrow{backdrop-filter:blur(10px);color:#fff;background:#ffffff1a;border:1px solid #fff3;border-radius:50%;justify-content:center;align-self:flex-start;align-items:center;width:48px;height:48px;transition:all .3s;display:inline-flex}.category-card:hover .category-arrow{background:var(--color-primary);border-color:var(--color-primary);transform:translate(8px);box-shadow:0 8px 24px #f1c40f66}.card-glare{border-radius:inherit;pointer-events:none;z-index:3;opacity:0;mix-blend-mode:overlay;background:radial-gradient(circle at var(--gx,50%) var(--gy,50%), #fff3 0%, #ffffff12 20%, transparent 50%);transition:opacity .3s;position:absolute;inset:0}.animated-scene{z-index:0;width:100%;height:100%;position:absolute;inset:0}.card-animated .category-card-overlay{background:linear-gradient(to top, var(--overlay-color-top) 0%, var(--overlay-color-mid) 18%, var(--overlay-color-mid2) 35%, var(--overlay-color-mid3) 55%, var(--overlay-color-bot) 100%);transition:background .4s}.yubikey{will-change:transform;transition:transform .7s cubic-bezier(.25,.46,.45,.94)}.card-animated:hover .yubikey{transform:translate(248px)}.led,.drive-led,.yk-led{transition:stroke .4s,filter .4s}.led-power{animation:4s ease-in-out infinite idleBreatheStroke}@keyframes idleBreatheStroke{0%,to{stroke:#334155}50%{stroke:#22c55e}}.card-animated:hover .led-power{stroke:#22c55e;filter:url(#glow-sm);transition-delay:.45s;animation:none}.card-animated:hover .led-hdd{stroke:#3b82f6;filter:url(#glow-sm);transition-delay:.55s}.card-animated:hover .led-net{stroke:#f59e0b;filter:url(#glow-sm);transition-delay:.65s}.card-animated:hover .dl-1{stroke:#22c55e;filter:url(#glow-sm);transition-delay:.5s}.card-animated:hover .dl-2{stroke:#22c55e;filter:url(#glow-sm);transition-delay:.6s}.card-animated:hover .dl-3{stroke:#22c55e;filter:url(#glow-sm);transition-delay:.7s}.card-animated:hover .yk-led{stroke:#22c55e;filter:url(#glow-sm);transition-delay:.55s}.yk-touch{transition:all .4s}.card-animated:hover .yk-touch{stroke:#ffe066;stroke-width:2px;filter:url(#glow-sm);transition-delay:.6s}.power-icon,.power-icon-arc{transition:stroke .4s}.card-animated:hover .power-icon,.card-animated:hover .power-icon-arc{stroke:#22c55e;transition-delay:.45s}.fan-blades{transform-origin:300px 237px}.card-animated:hover .fan-blades{animation:.4s linear .5s infinite fanSpin}@keyframes fanSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.insertion-spark{transform-box:fill-box;transform-origin:50%;transition:opacity .3s,transform .3s;transform:scale(0)}.card-animated:hover .insertion-spark{opacity:.8;transition-delay:.5s;animation:1.5s ease-in-out .5s infinite sparkPulse;transform:scale(1)}@keyframes sparkPulse{0%,to{opacity:.5;transform:scale(.8)}50%{opacity:.1;transform:scale(2)}}.animated-scene-diagram{z-index:0;width:100%;height:100%;position:absolute;inset:0}.card-diagram .category-card-overlay{background:linear-gradient(to top, var(--overlay-color-top) 0%, var(--overlay-color-mid) 18%, var(--overlay-color-mid2) 35%, var(--overlay-color-mid3) 55%, var(--overlay-color-bot) 100%)}.card-diagram:hover .npath{stroke:#38bdf8;opacity:.9;filter:url(#glow-diag);transition:stroke .4s,opacity .4s}.card-diagram:hover .core-node polygon{stroke:#3b82f6;filter:url(#glow-diag);transition:stroke .4s}.card-diagram:hover .core-dot{stroke:#60a5fa;filter:url(#glow-diag);animation:1.5s ease-in-out infinite pulseCore}@keyframes pulseCore{0%,to{r:5}50%{r:7}}.card-diagram:hover .peripheral-node rect{stroke:#64748b;transition:stroke .3s}.card-diagram:hover .inode{filter:url(#glow-diag);transition:stroke .3s}.card-diagram:hover .i-1{stroke:#38bdf8;transition-delay:.1s}.card-diagram:hover .i-2{stroke:#34d399;transition-delay:.2s}.card-diagram:hover .i-3{stroke:#818cf8;transition-delay:.3s}.card-diagram:hover .i-4{stroke:#f472b6;transition-delay:.4s}.animated-scene-docs{z-index:0;transform-origin:50%;width:100%;height:100%;transition:transform .6s cubic-bezier(.4,0,.2,1);position:absolute;inset:0}.category-card:hover .animated-scene-docs{transition:transform .6s cubic-bezier(.4,0,.2,1);transform:scale(1.05)}.card-docs .category-card-overlay{background:linear-gradient(to top, var(--overlay-color-top) 0%, var(--overlay-color-mid) 18%, var(--overlay-color-mid2) 35%, var(--overlay-color-mid3) 55%, var(--overlay-color-bot) 100%)}.dline{opacity:.6;transition:stroke .4s}.card-docs:hover .dl0{stroke:#94a3b8;transition-delay:.1s}.card-docs:hover .dl1{stroke:#94a3b8;transition-delay:.15s}.card-docs:hover .dl2{stroke:#94a3b8;transition-delay:.2s}.card-docs:hover .dl3{stroke:#64748b;transition-delay:.3s}.card-docs:hover .dl4{stroke:#94a3b8;transition-delay:.35s}.card-docs:hover .dl5{stroke:#94a3b8;transition-delay:.4s}.card-docs:hover .dl6{stroke:#94a3b8;transition-delay:.45s}.card-docs:hover .dl7{stroke:#64748b;transition-delay:.55s}.card-docs:hover .dl8{stroke:#94a3b8;transition-delay:.6s}.card-docs:hover .dl9{stroke:#64748b;transition-delay:.65s}.card-docs:hover .dl10{stroke:#94a3b8;transition-delay:.7s}.card-docs:hover .dl11{stroke:#94a3b8;transition-delay:.75s}@media (width<=768px){.homelab-page{padding-top:calc(var(--nav-height) + 2rem)}.category-grid{grid-template-columns:1fr}.card-inner{min-height:320px;padding:2rem}.yubikey{transition:none;transform:translate(248px)}.card-animated:hover .yubikey{transform:translate(248px)}.dline{stroke:#94a3b8}}
