*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:#050505;color:#E2E8F0;font-family:'Plus Jakarta Sans',sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased;margin:0}
h1,h2,h3,h4,h5,h6,.font-display{font-family:'Syne',sans-serif;letter-spacing:-0.02em}
/* ========================================
THREE.JS BACKGROUND
======================================== */
#canvas-container{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;background:#050505;pointer-events:none;overflow:hidden}
#canvas-container canvas{display:block;width:100%;height:100%}
/* ========================================
PAGE LAYERS
======================================== */
header,section,footer{position:relative;z-index:10}
/* ========================================
NOISE
======================================== */
.noise{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}
/* ========================================
SCROLLBAR
======================================== */
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:#050505}
::-webkit-scrollbar-thumb{background:#1A1A1A;border-radius:10px;border:1px solid rgba(0,229,255,.2)}
::-webkit-scrollbar-thumb:hover{background:#00E5FF}
/* ========================================
GLASS PANELS
======================================== */
.glass-panel{background:rgba(10,12,16,.48);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08);box-shadow:0 8px 32px rgba(0,0,0,.3);transition:all .4s cubic-bezier(.4,0,.2,1)}
.glass-panel:hover{background:rgba(15,18,22,.6);border-color:rgba(255,255,255,.15);transform:translateY(-4px)}
/* ========================================
CYAN BUTTON
======================================== */
.btn-chic-cyan{background:rgba(0,229,255,.05);backdrop-filter:blur(4px);color:#fff;border:1px solid rgba(0,229,255,.4);position:relative;overflow:hidden;transition:all .3s ease}
.btn-chic-cyan:before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(0,229,255,.15),transparent);transform:translateX(-100%);transition:transform .5s ease}
.btn-chic-cyan:hover:before{transform:translateX(100%)}
.btn-chic-cyan:hover{border-color:#00E5FF;box-shadow:0 0 20px rgba(0,229,255,.2);background:rgba(0,229,255,.1)}
/* ========================================
FORM INPUTS
======================================== */
.chic-input{background:rgba(255,255,255,.03);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.1);color:#E2E8F0;transition:all .3s ease}
.chic-input:focus{outline:none;background:rgba(255,255,255,.08);border-color:rgba(0,229,255,.6);box-shadow:0 0 20px rgba(0,229,255,.15)}
select.chic-input{color-scheme:dark;background-color:rgba(26,26,26,.9);color:#E2E8F0}
select.chic-input option{background:#1A1A1A;color:#E2E8F0}
.chic-input::placeholder{color:#6B7280}
/* ========================================
FADE ANIMATION
======================================== */
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.animate-fade-up{animation:fadeUp .8s ease forwards}
/* ========================================
FORM STATUS
======================================== */
.form-status{display:none;padding:14px 18px;border-radius:12px;font-size:14px;font-family:'DM Mono',monospace}
.form-status.success{display:block;color:#00FF88;background:rgba(0,255,136,.08);border:1px solid rgba(0,255,136,.3)}
.form-status.error{display:block;color:#ff7777;background:rgba(255,50,50,.08);border:1px solid rgba(255,50,50,.3)}
/* ========================================
SERVER RACK
======================================== */
.server-rack{position:relative;width:100%;height:100%;transform-style:preserve-3d}
.server-rack-frame{position:absolute;inset:0;border:1px solid rgba(255,255,255,.18);border-radius:10px;background:linear-gradient(90deg,rgba(0,229,255,.035),rgba(177,156,217,.025),rgba(0,255,136,.035)),rgba(0,0,0,.5);box-shadow:inset 0 0 30px rgba(0,229,255,.035),0 0 30px rgba(0,0,0,.5);overflow:hidden}
.server-rack-frame:before,.server-rack-frame:after{content:'';position:absolute;top:0;bottom:0;width:2px;opacity:.55}
.server-rack-frame:before{left:14px;background:#00E5FF;box-shadow:0 0 12px rgba(0,229,255,.7)}
.server-rack-frame:after{right:14px;background:#00FF88;box-shadow:0 0 12px rgba(0,255,136,.7)}
.server-top{position:absolute;top:8px;left:24px;right:24px;height:18px;border:1px solid rgba(177,156,217,.35);border-radius:4px;background:linear-gradient(90deg,rgba(0,229,255,.08),rgba(177,156,217,.12),rgba(0,255,136,.08))}
.server-units{position:absolute;top:35px;left:24px;right:24px;bottom:24px;display:flex;flex-direction:column;gap:7px}
.server-unit{flex:1;min-height:18px;border:1px solid rgba(255,255,255,.12);border-radius:3px;background:linear-gradient(90deg,rgba(255,255,255,.04),rgba(0,0,0,.55));position:relative;overflow:hidden}
.server-unit:before{content:'';position:absolute;left:7px;top:50%;transform:translateY(-50%);width:22%;height:3px;background:rgba(255,255,255,.08);box-shadow:0 6px rgba(255,255,255,.05),0 -6px rgba(255,255,255,.05)}
.server-unit:after{content:'';position:absolute;right:10px;top:50%;transform:translateY(-50%);width:4px;height:4px;border-radius:50%;background:#00E5FF;box-shadow:-9px 0 #00FF88,-18px 0 #B19CD9,0 0 8px #00E5FF}
.server-label{position:absolute;left:42%;top:50%;transform:translateY(-50%);font-family:'DM Mono',monospace;font-size:6px;letter-spacing:.12em;color:rgba(255,255,255,.25);text-transform:uppercase}
.server-glow{position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 20%,rgba(0,229,255,.05) 45%,rgba(177,156,217,.04) 55%,transparent 80%);animation:serverSweep 6s linear infinite}
@keyframes serverSweep{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
@media (max-width:768px){
.server-unit{min-height:15px}
.server-label{display:none}
}
/* ========================================
REDUCED MOTION
======================================== */
@media (prefers-reduced-motion:reduce){
*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
/* ========================================
GOOGLE REVIEW FLOATING BUTTON
======================================== */
/*
IMPORTANT:
This button is intentionally NOT inside
a section or footer.
It is a direct child of .
*/
#cyberdelia-review-floater{position:fixed!important;right:25px!important;bottom:100px!important;z-index:2147483647!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;width:56px!important;min-width:56px!important;height:56px!important;padding:0!important;margin:0!important;background:rgba(8,9,11,.30)!important;backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important;color:#fff!important;border:2px solid #00FF88!important;border-radius:50%!important;font-family:'DM Mono',monospace!important;font-size:13px!important;font-weight:500!important;line-height:1!important;text-decoration:none!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important;isolation:isolate!important;box-shadow:0 8px 30px rgba(0,0,0,.7),0 0 20px rgba(0,255,136,.3)!important;transition:width .3s ease,min-width .3s ease,border-radius .3s ease,transform .25s ease,background .25s ease,box-shadow .25s ease!important;overflow:hidden!important;white-space:nowrap!important}
/* STAR — YELLOW ONLY */
#cyberdelia-review-floater .review-star{display:block!important;flex-shrink:0!important;width:auto!important;height:auto!important;color:#FFD700!important;font-family:Arial,sans-serif!important;font-size:25px!important;font-weight:normal!important;line-height:1!important;text-shadow:0 0 6px rgba(255,215,0,.9),0 0 15px rgba(255,215,0,.5)!important}
/* TEXT */
#cyberdelia-review-floater .review-label{display:block!important;max-width:0!important;opacity:0!important;overflow:hidden!important;color:#fff!important;font-family:'DM Mono',monospace!important;font-size:13px!important;font-weight:500!important;line-height:1!important;white-space:nowrap!important;transition:max-width .3s ease,opacity .2s ease!important}
/* HOVER */
#cyberdelia-review-floater:hover{width:175px!important;min-width:175px!important;border-radius:999px!important;background:rgba(17,21,27,.45)!important;border-color:#00FF88!important;transform:translateY(-4px)!important;box-shadow:0 12px 40px rgba(0,0,0,.8),0 0 35px rgba(0,255,136,.45)!important}
#cyberdelia-review-floater:hover .review-label{max-width:120px!important;opacity:1!important}
/* ========================================
REVIEW BUTTON — MOBILE
======================================== */
@media (max-width:768px){
#cyberdelia-review-floater{right:16px!important;bottom:70px!important;width:56px!important;min-width:56px!important;height:56px!important;padding:0!important;border-radius:50%!important}
#cyberdelia-review-floater:hover{width:175px!important;min-width:175px!important;border-radius:999px!important}
#cyberdelia-review-floater .review-label{display:block!important}
}