/* =========================================================
   GOMPECK 2026 — FINAL HOMEPAGE LAYER
   This file is loaded after style.css and intentionally owns
   the new homepage visual system. Old experimental hero files
   are no longer required.
========================================================= */
:root{--gx-blue:#16b9ff;--gx-purple:#6b7cff;--gx-ink:#07111f;--gx-ink2:#0d1b2d;--gx-paper:#f7f9fc;--gx-line:#dfe5ed;--gx-green:#4fe1a0}
.gompeck-logo{width:37px;height:37px;display:block;object-fit:contain;filter:drop-shadow(0 0 14px rgba(22,185,255,.2))}.brand:hover .gompeck-logo{filter:drop-shadow(0 0 18px rgba(22,185,255,.45));transform:scale(1.04);transition:.25s}
.site-header{background:rgba(7,17,31,.82);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.desktop-nav a.active{color:#fff}
/* Exact dark / white rhythm */
.logo-strip,.solutions,.services,.process,.final-cta{background:#fff!important;color:var(--gx-ink)}
.problem-section,.work,.about-band{background:var(--gx-ink)!important;color:#fff}
.work{background:var(--gx-ink)!important}.work .section-heading h2,.work .section-kicker{color:#fff}.work .section-heading h2 span{color:#6bd9ff}.work .text-link{color:#7edfff}
.about-band{background:linear-gradient(135deg,#07111f,#0d1b2d)!important}.about-band h2{color:#fff}.about-band p{color:#9eafc1}
.final-cta{background:#fff!important}
.final-cta h2{color:var(--gx-ink)}
.hero{background:var(--gx-ink)!important;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;inset:-30%;pointer-events:none;background:radial-gradient(circle at 75% 35%,rgba(22,185,255,.13),transparent 22%),radial-gradient(circle at 30% 75%,rgba(107,124,255,.09),transparent 25%);animation:heroGlow 12s ease-in-out infinite alternate}
.hero:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(22,185,255,.025) 48%,transparent 58%);animation:heroFlow 15s linear infinite}
@keyframes heroGlow{to{transform:scale(1.08) translate3d(-1%,1%,0);opacity:1}}
@keyframes heroFlow{0%{transform:translateX(-8%)}50%{transform:translateX(8%)}100%{transform:translateX(-8%)}}
.hero-inner{z-index:3}.hero-copy{z-index:4}.hero h1 em{background:linear-gradient(105deg,#52d0ff,#9de9ff,#16b9ff,#52d0ff);background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:textShimmer 4.5s linear infinite}@keyframes textShimmer{to{background-position:220% center}}
.hero-particles{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}.hero-particle{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);border-radius:50%;background:#8ce5ff;box-shadow:0 0 4px #8ce5ff,0 0 12px rgba(22,185,255,.65),0 0 24px rgba(22,185,255,.2);opacity:0;animation:particleMove var(--duration) ease-in-out var(--delay) infinite,particlePulse var(--glow) ease-in-out var(--delay) infinite}.hero-particle.purple{background:#aeb7ff;box-shadow:0 0 4px #aeb7ff,0 0 12px rgba(107,124,255,.65),0 0 24px rgba(107,124,255,.2)}.hero-particle.streak{width:1px;height:var(--length);border-radius:999px;transform:rotate(var(--angle))}@keyframes particleMove{0%{opacity:0;transform:translate3d(0,18px,0) scale(.5)}12%{opacity:var(--op)}48%{opacity:var(--op);transform:translate3d(var(--mx),var(--my),0) scale(1)}78%{opacity:.35}100%{opacity:0;transform:translate3d(var(--mx2),var(--my2),0) scale(.35)}}@keyframes particlePulse{50%{filter:brightness(1.7)}}
/* Living buttons */
.hero .btn-primary{position:relative;overflow:hidden;border:1px solid rgba(157,233,255,.25);box-shadow:0 10px 35px rgba(22,185,255,.18);animation:ctaBreath 3.2s ease-in-out infinite}.hero .btn-primary:before{content:"";position:absolute;inset:-2px;background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.38) 48%,transparent 75%);transform:translateX(-130%);animation:ctaSweep 4.5s ease-in-out infinite}.hero .btn-primary span,.hero .btn-ghost span{position:relative;z-index:2;display:inline-block}.hero .btn-primary:hover{transform:translateY(-3px);box-shadow:0 15px 45px rgba(22,185,255,.32)}@keyframes ctaBreath{50%{box-shadow:0 0 0 7px rgba(22,185,255,.035),0 13px 42px rgba(22,185,255,.24)}}@keyframes ctaSweep{0%,55%{transform:translateX(-130%)}75%,100%{transform:translateX(130%)}}
.hero .btn-ghost{position:relative;overflow:hidden}.hero .btn-ghost:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 20%,rgba(22,185,255,.1) 50%,transparent 75%);transform:translateX(-120%);animation:ghostSweep 6s ease-in-out infinite}@keyframes ghostSweep{0%,58%{transform:translateX(-120%)}75%,100%{transform:translateX(120%)}}
/* Dashboard */
.hero-visual{height:560px;position:relative;display:flex;align-items:center;justify-content:center;perspective:1200px}.dashboard{width:100%;max-width:560px;position:relative;z-index:3;border:1px solid rgba(125,211,252,.16);border-radius:18px;background:linear-gradient(145deg,rgba(14,29,47,.97),rgba(5,13,24,.96));box-shadow:0 45px 100px rgba(0,0,0,.45),0 0 55px rgba(22,185,255,.06);overflow:hidden;animation:dashFloat 6s ease-in-out infinite}@keyframes dashFloat{50%{transform:perspective(1200px) rotateY(-5deg) rotateX(2deg) translateY(-7px)}}
.dash-top{height:42px}.dash-top>b{color:#4fe1a0;font-size:7px;animation:statusPulse 1.7s infinite}@keyframes statusPulse{50%{opacity:.5;filter:drop-shadow(0 0 6px #4fe1a0)}}
.dash-content{padding:17px}.metric-grid{gap:7px;margin-top:14px}.metric{padding:9px;background:linear-gradient(145deg,#10253a,#0b1a2b);border:1px solid #20364b}.metric strong{font-size:13px}.metric b{color:#4fe1a0!important}.mini-pill{display:flex;align-items:center;gap:4px}.mini-pill i{width:5px;height:5px;border-radius:50%;background:#4fe1a0;box-shadow:0 0 8px #4fe1a0}
.dash-panels{display:grid;grid-template-columns:1.45fr .75fr;gap:7px;margin-top:7px}.dash-panel{background:#0b1a2b;border:1px solid #20364b;border-radius:9px;padding:9px}.panel-head{display:flex;justify-content:space-between;align-items:center;color:#6f859a;font-size:6px;letter-spacing:.08em}.panel-head b{font-size:6px;color:#687f94}.panel-head .green{color:#4fe1a0}.chart-number{font-size:12px;font-weight:800;color:#edf5fa;margin:4px 0}.chart-number em{font-style:normal;color:#4fe1a0;font-size:6px;margin-left:4px}.sparkline{width:100%;height:78px;display:block}.sparkline .area{fill:url(#gArea)}.sparkline .line{fill:none;stroke:url(#gLine);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:600;stroke-dashoffset:600;animation:drawLine 2s ease forwards,chartGlow 3s 2s ease-in-out infinite alternate}@keyframes drawLine{to{stroke-dashoffset:0}}@keyframes chartGlow{to{filter:drop-shadow(0 0 5px rgba(22,185,255,.55))}}.chart-axis{display:flex;justify-content:space-between;color:#4f687f;font-size:5px}.donut{width:78px;height:78px;margin:4px auto 6px;border-radius:50%;background:conic-gradient(#16b9ff 0 187deg,#6b7cff 187deg 295deg,#263d53 295deg);display:grid;place-items:center;animation:donutIn 1.4s ease both}.donut>div{width:48px;height:48px;border-radius:50%;background:#0b1a2b;display:flex;flex-direction:column;align-items:center;justify-content:center}.donut strong{font-size:12px;color:#fff}.donut small{font-size:5px;color:#667d92}.legend{display:grid;gap:4px}.legend span{display:grid;grid-template-columns:6px 1fr auto;gap:4px;color:#70859a;font-size:5px}.legend i{width:5px;height:5px;border-radius:50%;background:#16b9ff}.legend i.purple{background:#6b7cff}.legend i.muted{background:#344b60}.legend b{color:#aabaca}@keyframes donutIn{from{transform:scale(.7) rotate(-30deg);opacity:.2}to{transform:scale(1);opacity:1}}
.bottom-panels{grid-template-columns:1fr 1fr}.mini-bars{height:55px;display:flex;align-items:end;gap:4px;padding-top:8px}.mini-bars i{display:block;flex:1;height:var(--h);border-radius:3px 3px 1px 1px;background:linear-gradient(to top,#087eb7,#16b9ff);transform-origin:bottom;animation:barBreathe 2.2s ease-in-out infinite alternate}.mini-bars i:nth-child(2){animation-delay:.1s}.mini-bars i:nth-child(3){animation-delay:.2s}.mini-bars i:nth-child(4){animation-delay:.3s}.mini-bars i:nth-child(5){animation-delay:.4s}.mini-bars i:nth-child(6){animation-delay:.5s}.mini-bars i:nth-child(7){animation-delay:.6s}.mini-bars i:nth-child(8){animation-delay:.7s}.mini-bars i:nth-child(9){animation-delay:.8s}.mini-bars i:nth-child(10){animation-delay:.9s}@keyframes barBreathe{to{transform:scaleY(.84);filter:brightness(.82)}}
.event{display:flex;align-items:center;gap:6px;margin-top:6px}.event>i{width:5px;height:5px;border-radius:50%;flex:0 0 auto}.event .green-dot{background:#4fe1a0;box-shadow:0 0 7px #4fe1a0}.event .blue-dot{background:#16b9ff;box-shadow:0 0 7px #16b9ff}.event .purple-dot{background:#6b7cff;box-shadow:0 0 7px #6b7cff}.event span{display:flex;flex-direction:column}.event b{font-size:6px;color:#aebfcd}.event small{font-size:5px;color:#526a81}.system-row{display:flex;gap:10px;padding-top:7px;color:#526a81;font-size:5px}.system-row span{display:flex;align-items:center;gap:3px}.system-row i{width:4px;height:4px;border-radius:50%;background:#4fe1a0;box-shadow:0 0 6px #4fe1a0}
/* Full hero particles generated by JS */
.hero-energy-rings{position:absolute;inset:0;z-index:1;pointer-events:none}.hero-energy-rings span{position:absolute;border:1px solid rgba(22,185,255,.06);border-radius:50%;left:var(--left);top:var(--top);width:var(--size);height:var(--size);transform:translate(-50%,-50%);animation:ringDrift var(--dur) ease-in-out var(--delay) infinite alternate}@keyframes ringDrift{to{transform:translate(-50%,-50%) scale(1.04) rotate(12deg);opacity:.75}}
/* Correct section alternation */
.logo-strip-inner{height:82px}.solutions,.services,.process,.final-cta{background:#fff!important}.problem-section,.work,.about-band{background:#07111f!important}.problem-section .section-kicker,.work .section-kicker,.about-band .section-kicker{color:#16b9ff}.problem-section h2,.work h2,.about-band h2{color:#fff}.problem-list{border-color:#203149}.problem-list>div{border-color:#203149}.work .project{background:#0d1b2d;border-color:#203149;color:#fff}.work .project-info p{color:#9aaabd}.work .project-info span{color:#16b9ff}.about-band p{color:#9aaabd}.final-cta p{color:#667085}
/* Make all hero arrows visible and clean */
.btn span,.nav-cta span,.text-link span{display:inline-block;color:currentColor;font-family:Arial,sans-serif;font-weight:900;line-height:1}.hero .btn-primary span{color:#03111c}.hero .btn-ghost span{color:#fff}
/* Mobile */
@media(max-width:900px){.hero-inner{grid-template-columns:1fr;gap:25px}.hero-visual{height:500px}.dashboard{transform:none}.dash-intelligence{grid-template-columns:1fr}.dash-panels{grid-template-columns:1fr}.bottom-panels{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.container{width:min(100% - 28px,1160px)}.hero{padding-top:125px}.hero-visual{height:430px}.dashboard{max-width:100%}.dash-main{grid-template-columns:38px 1fr}.dash-sidebar{padding:14px 8px;gap:13px}.dash-content{padding:11px}.metric strong{font-size:10px}.metric small,.metric b{font-size:5px}.dash-panels{grid-template-columns:1.3fr .7fr}.bottom-panels{grid-template-columns:1fr 1fr}.system-row{display:none}.floating-card{transform:scale(.82)}.automation-card{left:-22px;bottom:40px}.ai-card{right:-18px;top:45px}.gompeck-logo{width:34px;height:34px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}