/* Syght — shared styles */
:root{--bg:#060508;--bg-rgb:6,5,8;--text:#f5f3f8;--text-rgb:245,243,248;--heading:#f9f7fc;--mark-filter:none}
[data-theme="light"]{--bg:#f5f3f2;--bg-rgb:245,243,242;--text:#15121f;--text-rgb:21,18,31;--heading:#0d0b14;--mark-filter:invert(1)}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg);font-family:'Instrument Sans',sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}

@keyframes revealUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes heroIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes lapDot{from{transform:rotate(0deg) translateX(120px) rotate(0deg)}to{transform:rotate(360deg) translateX(120px) rotate(-360deg)}}
@keyframes uptimePulse{0%,100%{opacity:.4}50%{opacity:1}}
@keyframes reelSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes orbitSpinSlow{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes orbitSpinSlower{from{transform:rotate(0deg)}to{transform:rotate(-360deg)}}

/* Nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:22px 56px;background:transparent;border-bottom:1px solid transparent;transition:background .4s ease,border-color .4s ease,backdrop-filter .4s ease;font-family:'Instrument Sans',sans-serif}
.nav.scrolled{background:rgba(var(--bg-rgb),.72);backdrop-filter:blur(14px);border-bottom-color:rgba(var(--text-rgb),.08)}
.nav__brand{display:flex;align-items:center;gap:10px}
.nav__brand img{width:18px;height:18px;object-fit:contain;opacity:.95;filter:var(--mark-filter,none)}
.nav__brand span{font:600 14px 'Instrument Sans',sans-serif;letter-spacing:-.01em;color:var(--text)}
.nav__links{display:flex;align-items:center;gap:36px;font:400 13.5px 'Instrument Sans',sans-serif}
.nav__links a{color:rgba(var(--text-rgb),.65);transition:color .2s ease,opacity .2s ease}
.nav__links a:hover{color:var(--heading)}
.nav__links a.active{color:var(--heading)}
.nav__links a.hello{color:var(--text)}
.nav__links a.hello:hover{opacity:.7}
.nav__toggle{width:38px;height:21px;border-radius:11px;background:rgba(var(--text-rgb),.15);position:relative;cursor:pointer;transition:background .3s ease}
.nav__toggle:hover{background:rgba(var(--text-rgb),.25)}
.nav__knob{position:absolute;top:2px;left:2px;width:17px;height:17px;border-radius:50%;background:var(--heading);transition:left .3s cubic-bezier(.2,.7,.3,1)}
[data-theme="light"] .nav__knob{left:19px}

/* Footer */
.footer{position:relative;padding:44px 56px;border-top:1px solid rgba(var(--text-rgb),.08);display:flex;align-items:center;justify-content:space-between;font-family:'Instrument Sans',sans-serif;background:var(--bg)}
.footer__brand{display:flex;align-items:center;gap:10px}
.footer__brand img{width:15px;height:15px;object-fit:contain;opacity:.8;filter:var(--mark-filter,none)}
.footer__brand span{font:500 12.5px 'Instrument Sans',sans-serif;color:rgba(var(--text-rgb),.5)}
.footer__mail{font:500 13px 'Instrument Sans',sans-serif;color:rgba(var(--text-rgb),.6);transition:color .2s ease}
.footer__mail:hover{color:var(--heading)}

/* Common interactive bits */
.link-arrow{transition:opacity .2s ease}
.link-arrow:hover{opacity:.6}
.btn{display:inline-block;padding:13px 26px;background:var(--text);color:var(--bg);font:600 14px 'Instrument Sans',sans-serif;border-radius:7px;transition:opacity .2s ease,transform .2s ease}
.btn:hover{opacity:.85;transform:translateY(-1px)}
.back-link{font:500 13px 'Instrument Sans',sans-serif;color:rgba(var(--text-rgb),.45);display:inline-block;margin-bottom:36px;transition:color .2s ease}
.back-link:hover{color:var(--heading)}

/* Responsive */
@media (max-width:860px){
  .nav{padding:18px 24px}
  .nav__links{gap:18px;flex-wrap:wrap}
  section{padding-left:24px !important;padding-right:24px !important}
  .grid-2col,.grid-3col,.split-row{grid-template-columns:1fr !important;gap:32px !important}
  .grid-3col>div{border-right:none !important;padding-left:0 !important;padding-right:0 !important}
  h1{font-size:42px !important}
}
