
/* V13 — Blue / turquoise brand system based on the supplied logos */
:root{--bg:#03112b;--bg2:#061d3b;--card:#092647;--white:#f2fbff;--muted:#a0bed3;--blue:#117fff;--cyan:#31e4f0;--teal:#08b9a8;--line:rgba(54,188,233,.22);--shadow:0 28px 70px rgba(0,9,36,.38)}
body{background:radial-gradient(ellipse 75% 520px at 50% -100px,rgba(13,110,243,.16),transparent 70%),var(--bg)}
body:before{background:radial-gradient(ellipse 600px 520px at 85% 24%,rgba(6,137,255,.15),transparent 70%),radial-gradient(ellipse 560px 430px at 9% 38%,rgba(4,206,177,.095),transparent 75%)}
.site-header{background:rgba(3,16,40,.95);border-bottom:1px solid rgba(35,190,232,.19);box-shadow:0 5px 24px rgba(0,5,23,.15)}
.nav{height:62px;gap:20px}
.brand{gap:9px}.brand-mark{width:38px;height:38px;background:linear-gradient(145deg,#faffff,#e8faff);border-radius:10px;box-shadow:0 0 0 1px rgba(58,210,234,.32),0 0 17px rgba(26,178,239,.12)}
.brand-mark img{width:100%;height:100%;object-fit:contain;padding:4px}
.brand-name{font-size:18px;letter-spacing:.7px}.brand-sub{font-size:8px;letter-spacing:1.7px;color:#7ce6eb}
.nav-links{gap:22px}.nav-contact{border-color:rgba(35,223,230,.42);background:linear-gradient(110deg,rgba(11,108,216,.23),rgba(5,182,166,.14));color:#adfff4;padding:8px 13px}
.hero{min-height:0;background:radial-gradient(circle at 78% 44%,rgba(14,121,232,.16),transparent 38%)}
.hero:before,.hero:after{pointer-events:none}
.hero-grid{padding:46px 0 54px;min-height:610px}
.hero-topline{color:#8fd9e6}.gradient-text{background:linear-gradient(100deg,#f6ffff 0%,#62bbff 45%,#37f4d2 100%);-webkit-background-clip:text;background-clip:text}
.hero h1{margin:16px 0 18px;font-size:clamp(52px,5.6vw,78px)}.hero-copy>p{color:#b3cbdf}
.btn.primary{background:linear-gradient(110deg,#117dff 0%,#00a9df 47%,#09c5a7 100%);box-shadow:0 12px 35px rgba(7,122,233,.24)}
.btn.secondary{background:rgba(8,39,75,.7);border-color:rgba(70,215,232,.43);color:#d4f9ff}
.hero-foot{margin-top:31px;padding-top:19px}.hero-foot strong{color:#ecffff}
.hero-art{height:470px}.orb{background:radial-gradient(circle,rgba(24,172,252,.14),rgba(4,210,181,.08) 44%,transparent 70%)}
.brand-tree{width:min(390px,80%);height:auto;max-height:410px;object-fit:contain;opacity:.91;filter:drop-shadow(0 0 24px rgba(24,150,255,.34)) drop-shadow(0 0 12px rgba(20,228,204,.2));animation:brandHover 8s ease-in-out infinite}
@keyframes brandHover{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.orbit{border-color:rgba(40,195,245,.22)}.orbit.two{border-color:rgba(24,235,199,.21)}
.tech-label{background:rgba(4,31,63,.88);border-color:rgba(39,212,225,.35)}
.section.dark{background:#061832}.section{padding:88px 0}
.kicker{color:#53e9d7}.kicker:before{background:#1fe3d1}
.tab,.tool-btn{background:#092849;border-color:rgba(54,187,237,.24);color:#c4e1ef}
.tab.active,.tool-btn.active{background:linear-gradient(110deg,#57bbff,#4bf1d4);color:#042344}
.search input{background:#092442;border-color:rgba(54,187,237,.25)}
.project{background:#071f3d;border-color:rgba(62,187,229,.2)}
.project:hover{border-color:rgba(45,232,219,.6);box-shadow:0 20px 60px rgba(0,10,40,.4)}
.cover{background:radial-gradient(ellipse at 50% 100%,rgba(4,207,179,.16),transparent 62%),linear-gradient(145deg,#103b68,#06192f 75%)}
.card-bottom{background:linear-gradient(180deg,#082745,#071e38)}
.service{background:linear-gradient(150deg,rgba(10,53,90,.88),rgba(5,29,57,.94));border-color:rgba(48,194,230,.2)}
.contact-panel{background:radial-gradient(circle at 87% 12%,rgba(10,181,179,.13),transparent 45%),linear-gradient(130deg,#0a3158,#071b39);border:1px solid rgba(67,213,235,.31);box-shadow:0 25px 70px rgba(0,9,31,.28)}
.support-card{background:linear-gradient(110deg,rgba(13,63,105,.85),rgba(6,39,70,.88));border:1px solid rgba(65,218,235,.3);transition:border-color .2s,transform .2s,background .2s}
.support-card:hover{border-color:rgba(60,245,220,.65);background:linear-gradient(110deg,rgba(15,84,133,.92),rgba(5,72,87,.87));transform:translateY(-2px)}
.staff-avatar{width:66px;height:66px;object-fit:cover;border-radius:14px;border:1px solid rgba(64,221,244,.45);background:#061b3a;flex-shrink:0}
.staff-meta small{color:#91d5e2}.support-go{color:#60f1e5}
.floating-support{background:linear-gradient(120deg,#0979f8,#06b8ae);border-color:rgba(117,255,245,.55);box-shadow:0 12px 35px rgba(0,32,94,.42)}
.modal#supportModal:target{display:flex!important}
#supportModal .support-backdrop{position:absolute;inset:0;z-index:0;cursor:default}
#supportModal .support-dialog{position:relative;z-index:1;background:linear-gradient(145deg,#092c52,#061b37);border:1px solid rgba(64,226,237,.43);box-shadow:0 30px 100px rgba(0,0,0,.6)}
#supportModal .support-dialog .staff-avatar{width:74px;height:74px}
#supportModal .modal-close{display:grid;place-items:center;text-decoration:none}
#supportModal .support-card{min-height:92px}
#supportModal .support-card:focus-visible{outline:2px solid #4ef3df}
.footer{background:#04142b}.footer-brand img{background:#e9faff;object-fit:contain;padding:3px}
@media(max-width:1020px){.nav-links{gap:12px}}
@media(max-width:720px){
 html{scroll-padding-top:60px}.nav{height:56px}.brand-mark{width:34px;height:34px;border-radius:8px}.brand-name{font-size:16px}.brand-sub{font-size:7px;letter-spacing:1.3px}
 .mobile-menu{width:37px;height:37px;border-radius:9px;background:#0a3154;border-color:rgba(75,207,234,.3)}
 .nav-links{top:56px;background:#061a37}
 .hero-grid{padding:23px 0 30px;gap:0;min-height:0}
 .hero h1{font-size:clamp(43px,11.3vw,60px);margin:14px 0 14px;line-height:1.12}
 .hero-copy>p{margin-bottom:19px;line-height:1.8}
 .hero-actions .btn{min-height:44px;padding:10px 12px}
 .hero-foot{margin-top:23px;padding-top:16px}
 .hero-art{height:300px;margin-top:0}.brand-tree{width:245px;max-height:255px;opacity:.9}.orb{width:275px;height:275px}.orbit{width:270px;height:270px}.orbit.two{width:215px;height:215px}
 .tech-label{top:8px;right:2px;font-size:7px;padding:7px 8px}
 .hero-device{width:96px;right:0;bottom:4px}.hero-device.two{width:75px;left:0;bottom:24px}
 .section{padding:64px 0}.contact-panel{padding:24px 17px}
 .support-card{padding:10px}.staff-avatar{width:60px;height:60px}
 .floating-support{bottom:calc(12px + env(safe-area-inset-bottom,0px));right:12px;padding:11px 13px;font-size:11px}
 #supportModal .support-dialog .staff-avatar{width:66px;height:66px}
}
@media(max-width:370px){.brand-name{font-size:15px}.hero-grid{padding-top:17px}.hero h1{font-size:42px}.hero-art{height:280px}}
@media(prefers-reduced-motion:reduce){.brand-tree{animation:none}}
