:root{--brand-a:#16a34a;--brand-b:#059669;--brand-c:#84cc16;--glow:rgba(34,197,94,.24)}
*{scroll-behavior:smooth}body{font-family:Inter,ui-sans-serif,system-ui,sans-serif}
body.dark{background:#080b16;color:#f6f7fb}body.light{background:#f6f8fc;color:#101426}
.dark .surface{background:rgba(17,23,42,.82);border-color:rgba(255,255,255,.09)}
.light .surface{background:rgba(255,255,255,.88);border-color:rgba(15,23,42,.09)}
.dark .muted{color:#a4adc2}.light .muted{color:#667085}
.dark .navglass{background:rgba(8,11,22,.76);border-color:rgba(255,255,255,.08)}
.light .navglass{background:rgba(255,255,255,.82);border-color:rgba(15,23,42,.08)}
.gradient-text{background:linear-gradient(105deg,#22c55e 0%,#10b981 48%,#a3e635 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.gradient-bg{background:linear-gradient(110deg,#16a34a,#059669 52%,#84cc16)}
.glow{box-shadow:0 0 60px var(--glow)}
.grid-pattern{background-image:linear-gradient(rgba(115,135,180,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(115,135,180,.07) 1px,transparent 1px);background-size:42px 42px}
.card-hover{transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .35s,box-shadow .35s}
.card-hover:hover{transform:translateY(-7px);border-color:rgba(34,197,94,.5);box-shadow:0 18px 60px rgba(0,0,0,.14)}
.mock-screen{background:linear-gradient(135deg,#111a31,#202b48);border:1px solid rgba(255,255,255,.12);overflow:hidden}
.mock-screen .bar{height:9px;border-radius:8px;background:rgba(255,255,255,.13)}
.mock-screen .block{border-radius:8px;background:linear-gradient(110deg,rgba(0,201,242,.6),rgba(100,40,245,.65))}
.btn-primary{background:linear-gradient(105deg,#16a34a,#059669 55%,#84cc16);color:white;box-shadow:0 8px 30px rgba(22,163,74,.25)}
.btn-primary:hover{filter:brightness(1.1);transform:translateY(-1px)}
.orb{position:absolute;border-radius:9999px;filter:blur(75px);opacity:.2;pointer-events:none}

/* Genius IT green identity + animated hero background slider */
:root{--green:#16a34a;--emerald:#059669;--lime:#84cc16}
.hero-slider-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;isolation:isolate}
.hero-slider-bg:before,.hero-slider-bg:after{content:"";position:absolute;inset:-18%;z-index:-1;filter:blur(3px);opacity:.34}
.hero-slider-bg:before{background:radial-gradient(ellipse at 18% 35%,rgba(34,197,94,.38),transparent 38%),radial-gradient(ellipse at 78% 25%,rgba(5,150,105,.34),transparent 36%),radial-gradient(ellipse at 55% 85%,rgba(163,230,53,.24),transparent 34%);animation:greenSlideOne 16s ease-in-out infinite alternate}
.hero-slider-bg:after{background:linear-gradient(115deg,transparent 20%,rgba(34,197,94,.10) 45%,transparent 68%),radial-gradient(ellipse at 85% 75%,rgba(16,185,129,.25),transparent 40%);animation:greenSlideTwo 21s ease-in-out infinite alternate}
@keyframes greenSlideOne{0%{transform:translate3d(-3%,1%,0) scale(1)}50%{transform:translate3d(3%,-2%,0) scale(1.12)}100%{transform:translate3d(-1%,3%,0) scale(1.04)}}
@keyframes greenSlideTwo{0%{transform:translate3d(3%,0,0) rotate(0deg)}100%{transform:translate3d(-3%,2%,0) rotate(8deg)}}
.hero-slide{position:absolute;inset:0;opacity:0;animation:heroSlides 18s infinite}
.hero-slide:nth-child(1){animation-delay:0s}.hero-slide:nth-child(2){animation-delay:6s}.hero-slide:nth-child(3){animation-delay:12s}
@keyframes heroSlides{0%,5%{opacity:0;transform:scale(1.06)}12%,30%{opacity:1;transform:scale(1)}38%,100%{opacity:0;transform:scale(.98)}}
.dark .hero-slider-bg{opacity:1}.light .hero-slider-bg{opacity:.55}
@media(prefers-reduced-motion:reduce){.hero-slider-bg:before,.hero-slider-bg:after,.hero-slide{animation:none}}

/* Full-page website screenshot: scrolls from top to bottom on hover */
.fullpage-shot-frame{height:560px;overflow:hidden;background:linear-gradient(145deg,rgba(22,163,74,.12),rgba(5,150,105,.08));border:1px solid rgba(34,197,94,.22);isolation:isolate}
.fullpage-shot-image{display:block;width:100%;height:auto;min-height:100%;object-fit:cover;object-position:top center;transform:translateY(0);transition:transform 9s linear;will-change:transform}
.fullpage-shot-frame:hover .fullpage-shot-image{transform:translateY(calc(560px - 100%))}
.fullpage-shot-hint{position:absolute;right:14px;bottom:14px;border:1px solid rgba(34,197,94,.35);border-radius:999px;background:rgba(3,12,8,.82);padding:9px 13px;color:#86efac;font-size:11px;font-weight:700;opacity:.9;pointer-events:none;transition:opacity .25s}
.fullpage-shot-frame:hover .fullpage-shot-hint{opacity:0}
.fullpage-shot-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px;background:radial-gradient(ellipse at 50% 15%,rgba(34,197,94,.2),transparent 60%),linear-gradient(145deg,#071b12,#0a2418)}
@media(max-width:640px){.fullpage-shot-frame{height:420px}.fullpage-shot-frame:hover .fullpage-shot-image{transform:translateY(calc(420px - 100%))}}
@media(prefers-reduced-motion:reduce){.fullpage-shot-image{transition:none}}