:root{--bg:#000000;--ink:#e9ecf5;--mu:#9aa3b8;--a:#00AFF2;--b:#F7941D;--blue:#078BCB;--royal:#2B3991;--org:#F57826;--gl:rgba(255,255,255,.045);--ln:rgba(255,255,255,.09)}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:400 16px/1.65 Inter,system-ui,sans-serif;overflow-x:hidden}
#bg{position:fixed;inset:0;width:100%;height:100%;z-index:-2;display:block}
.bg-fallback{position:fixed;inset:0;z-index:-3;background:radial-gradient(60% 50% at 70% 20%,rgba(247,148,29,.22),transparent 70%),radial-gradient(50% 50% at 20% 80%,rgba(0,175,242,.15),transparent 70%),var(--bg)}
.vignette{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(120% 80% at 50% 40%,transparent 40%,rgba(0,0,0,.85))}
a{color:inherit;text-decoration:none}
.wrap{width:min(1160px,92vw);margin:auto}
h1,h2,h3,.logo{font-family:Montserrat,sans-serif;letter-spacing:-.02em}
h1{font-size:clamp(2.6rem,7.5vw,6rem);line-height:1.02;font-weight:800;letter-spacing:-.03em;margin:.4em 0 .35em}
h2{font-size:clamp(2rem,4.4vw,3.3rem);line-height:1.08;margin:.3em 0 .8em;max-width:18ch}
h3{font-size:1.25rem;margin:.6em 0 .4em}
.grad{background:linear-gradient(90deg,#00AFF2,#078BCB 46%,#F57826 54%,#F9A33E);-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow{color:var(--a);font:600 .78rem/1 Montserrat;text-transform:uppercase;letter-spacing:.22em}
.lead{text-shadow:0 2px 12px #000;color:var(--mu);font-size:clamp(1.05rem,1.6vw,1.25rem);max-width:60ch}
.nav{position:fixed;top:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:14px 4vw;background:rgba(0,0,0,.45);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--ln)}
.logo img{height:52px;width:auto;display:block}.hero-mark{width:84px;height:84px;display:block;margin-bottom:18px;filter:drop-shadow(0 0 24px rgba(0,175,242,.35))}.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.15rem}.logo b{font-weight:400;color:var(--mu);margin-left:6px}
nav{display:flex;gap:28px;align-items:center}nav a{color:var(--mu);font-size:.95rem;transition:color .2s}nav a:hover{color:var(--ink)}
.btn{color:#fff!important;display:inline-flex;align-items:center;justify-content:center;padding:14px 26px;border-radius:999px;font:600 1rem Montserrat;color:#000;background:linear-gradient(90deg,var(--a),var(--b));border:0;cursor:pointer;box-shadow:0 8px 30px -8px rgba(0,175,242,.5);transition:transform .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 40px -8px rgba(247,148,29,.6)}
nav .btn.sm{padding:9px 18px;font-size:.9rem;color:#000}
.btn.ghost{background:rgba(255,255,255,.045)!important;background:var(--gl);color:var(--ink);border:1px solid var(--ln);box-shadow:none;backdrop-filter:blur(10px)}
.burger{display:none;background:none;border:0;width:36px;height:36px;cursor:pointer}.burger span{display:block;height:2px;background:var(--ink);margin:7px 6px;transition:.3s}
.hero{min-height:100svh;display:flex;align-items:center;padding:120px 0 80px;position:relative}
.cta{display:flex;gap:14px;flex-wrap:wrap;margin:2rem 0}
.chips{display:flex;flex-wrap:wrap;gap:10px;list-style:none}.chips li{padding:6px 14px;border:1px solid var(--ln);border-radius:999px;background:var(--gl);color:var(--mu);font-size:.85rem;backdrop-filter:blur(8px)}
.scroll{position:absolute;bottom:28px;left:50%;width:24px;height:38px;border:1.5px solid var(--ln);border-radius:14px;transform:translateX(-50%)}.scroll span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--a);animation:sc 1.8s infinite}
@keyframes sc{0%{opacity:0;transform:translateY(0)}40%{opacity:1}100%{opacity:0;transform:translateY(12px)}}
.sec{padding:clamp(80px,12vw,150px) 0}
.grid{display:grid;gap:20px}.svc{grid-template-columns:repeat(2,1fr)}.svc .wide{grid-column:1/-1}
.card{background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid var(--ln);border-radius:22px;padding:32px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:border-color .3s,transform .3s}
.card:hover{border-color:rgba(0,175,242,.35);transform:translateY(-3px)}
.card i{font:600 .8rem Montserrat;font-style:normal}.card p{color:var(--mu)}
.note{color:var(--mu);margin:-1.5rem 0 2rem}.note b{color:var(--ink)}
.work{grid-template-columns:repeat(3,1fr)}
.shot{border-radius:18px;overflow:hidden;border:1px solid var(--ln);background:var(--gl);backdrop-filter:blur(10px);display:block;transition:transform .35s,border-color .35s}
.shot:hover{transform:translateY(-4px);border-color:rgba(247,148,29,.5)}
.shot .im{aspect-ratio:16/10;overflow:hidden}.shot img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;transition:transform .6s}.shot:hover img{transform:scale(1.04)}
.shot div.t{padding:14px 18px;display:flex;justify-content:space-between;align-items:center;gap:8px}.shot b{font:600 1rem Montserrat}.shot small{color:var(--mu);font-size:.75rem;border:1px solid var(--ln);border-radius:99px;padding:2px 9px;white-space:nowrap}
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:s}
.steps li{counter-increment:s;padding:28px;border-top:1px solid var(--ln);position:relative}.steps li:before{content:"0" counter(s);font:700 2.6rem Montserrat;display:block;margin-bottom:.4rem;background:linear-gradient(90deg,var(--a),var(--b));-webkit-background-clip:text;background-clip:text;color:transparent}
.steps b{font:600 1.2rem Montserrat}.steps p{color:var(--mu);margin-top:.4rem}
.two{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}
.mail a{font:600 1.4rem Montserrat;color:var(--a);display:inline-block;margin-top:1.4rem}
.form{display:grid;gap:14px}.form label{display:grid;gap:6px;font-size:.85rem;color:var(--mu)}
input,select,textarea{font:inherit;color:var(--ink);background:rgba(0,0,0,.35);border:1px solid var(--ln);border-radius:12px;padding:12px 14px;outline:none;transition:border-color .2s}
input:focus,select:focus,textarea:focus{border-color:var(--a)}select option{background:#0b0d14}
.fmsg{min-height:1.2em;font-size:.9rem;color:var(--a)}.fine{font-size:.75rem;color:var(--mu)}
footer{border-top:1px solid var(--ln);padding:28px 0;color:var(--mu);font-size:.9rem}footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}.reveal.in{opacity:1;transform:none}
@media (max-width:900px){.work{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}.two{grid-template-columns:1fr}}
@media (max-width:680px){.burger{display:block}nav{position:fixed;top:64px;left:0;right:0;flex-direction:column;padding:24px;background:rgba(0,0,0,.95);backdrop-filter:blur(14px);border-bottom:1px solid var(--ln);transform:translateY(-130%);transition:transform .35s}
nav.open{transform:none}.svc,.work,.steps{grid-template-columns:1fr}.card{padding:24px}.logo b{display:none}.hero{padding-top:100px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.scroll span{animation:none}*{transition-duration:0s!important}}

.card i,.steps li:before{color:var(--b)}.eyebrow{color:var(--a)}@media (max-width:680px){.logo img{height:36px}.hero-mark{width:64px;height:64px}}
