/* Domain Ads — design system (vanilla CSS) */
:root{
  --brand:#000066; --glow:#3F5BFF; --glow-2:#4F46E5;
  --font-display:"Space Grotesk","Poppins",system-ui,sans-serif;
  --font-sans:"Inter",system-ui,sans-serif;
}
*{box-sizing:border-box;border-color:rgba(255,255,255,.08)}
html{scroll-behavior:smooth}
html,body{margin:0;background:#000;color:#fff;font-family:var(--font-sans);-webkit-font-smoothing:antialiased}
body{
  background:
    radial-gradient(ellipse 80% 60% at 50% -10%, rgba(63,91,255,.18), transparent 60%),
    radial-gradient(ellipse 60% 50% at 90% 20%, rgba(79,70,229,.14), transparent 60%),
    radial-gradient(ellipse 60% 50% at 10% 80%, rgba(0,0,102,.35), transparent 60%),
    linear-gradient(180deg,#000 0%,#050516 100%);
  background-attachment:fixed; overflow-x:hidden;
}
h1,h2,h3,h4,h5{font-family:var(--font-display);letter-spacing:-.02em}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto}
/* logo sizing (unlayered + element specificity so it always wins) */
img.site-logo{height:26px;width:auto}
img.footer-logo{height:30px;width:auto}


/* Contact Form Loading Spinner */

.spinner {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 8px;
    border: 2px solid rgba(255,255,255,0.3);
    border-top: 2px solid #ffffff;
    border-radius: 50%;
    animation: spinnerRotate 0.8s linear infinite;
    vertical-align: middle;
}

@keyframes spinnerRotate {
    to {
        transform: rotate(360deg);
    }
}

@media (min-width:768px){img.site-logo{height:28px}img.footer-logo{height:34px}}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.font-display{font-family:var(--font-display)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.no-scrollbar{scrollbar-width:none}
.no-scrollbar::-webkit-scrollbar{display:none}

.glass{background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(18px) saturate(140%);border-radius:24px}
.glass-strong{background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(24px) saturate(160%);border-radius:24px}
.text-gradient{background:linear-gradient(90deg,#fff 0%,#b8c1ff 40%,#3F5BFF 70%,#4F46E5 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.text-gradient .word{background-image:inherit;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.text-gradient .char{background:none}
.glow-ring{box-shadow:0 0 0 1px rgba(255,255,255,.06),0 20px 60px -20px rgba(63,91,255,.5),inset 0 1px 0 rgba(255,255,255,.08)}

.btn-glow{position:relative;isolation:isolate;display:inline-block;overflow:hidden;background:linear-gradient(135deg,#3F5BFF,#4F46E5);color:#fff;border-radius:999px;padding:14px 28px;font-weight:600;font-family:var(--font-display);letter-spacing:.01em;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s;box-shadow:0 10px 30px -10px rgba(63,91,255,.7),inset 0 1px 0 rgba(255,255,255,.25)}
.btn-glow:hover{transform:translateY(-2px);box-shadow:0 20px 50px -10px rgba(63,91,255,.9)}
.btn-glow::before{content:"";position:absolute;inset:-2px;border-radius:inherit;z-index:-1;background:conic-gradient(from 0deg,#3F5BFF,#4F46E5,#a78bfa,#3F5BFF);filter:blur(14px);opacity:.6;animation:spin 6s linear infinite}
.btn-ghost{display:inline-block;border-radius:999px;padding:13px 26px;font-weight:600;font-family:var(--font-display);border:1px solid rgba(255,255,255,.15);color:#fff;background:rgba(255,255,255,.03);backdrop-filter:blur(10px);transition:all .3s}
.btn-ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.3)}

.grid-bg{background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:60px 60px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,black 30%,transparent 80%);mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,black 30%,transparent 80%)}

.card-tilt{transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s;transform-style:preserve-3d}
.card-tilt:hover{box-shadow:0 30px 80px -30px rgba(63,91,255,.6)}
.service-card{position:relative;overflow:hidden}
.service-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(63,91,255,.6),rgba(79,70,229,.1),rgba(63,91,255,.6));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .4s}
.service-card:hover::before{opacity:1}

.noise::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.04;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>")}

.cta-border{position:relative}
.cta-border::after{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:conic-gradient(from 0deg,#3F5BFF,#a78bfa,#4F46E5,#3F5BFF);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.55;animation:spin 12s linear infinite;pointer-events:none}

.gradient-line{border-top:1px solid transparent;border-image:linear-gradient(90deg,transparent,rgba(63,91,255,.6),transparent) 1}

::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#000}
::-webkit-scrollbar-thumb{background:linear-gradient(#3F5BFF,#4F46E5);border-radius:10px}
.scroll-progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,#3F5BFF,#4F46E5,#a78bfa);z-index:100;transition:width .1s linear;box-shadow:0 0 12px rgba(63,91,255,.8)}

/* Forms */
.input{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:12px 14px;color:#fff;font-size:14px;font-family:var(--font-sans);outline:none;transition:border-color .2s,box-shadow .2s}
.input:focus{border-color:rgba(63,91,255,.6);box-shadow:0 0 0 4px rgba(63,91,255,.15)}
.input::placeholder{color:rgba(255,255,255,.35)}
select.input option{background:#050516;color:#fff}
.field-label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.5);margin-bottom:6px}

/* FAQ accordion */
.faq-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s cubic-bezier(.2,.8,.2,1)}
.faq-panel[data-open="true"]{grid-template-rows:1fr}
.faq-trigger[aria-expanded="true"] .faq-icon{transform:rotate(45deg)}

/* Filters */
.filter-btn.is-active{background:linear-gradient(135deg,#3F5BFF,#4F46E5);color:#fff;box-shadow:0 10px 30px -10px rgba(63,91,255,.8)}

/* Floating action buttons */
.fab{position:relative;width:48px;height:48px;border-radius:9999px;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 10px 30px -10px rgba(63,91,255,.7);transition:transform .3s}
.fab:hover{transform:scale(1.1)}
.fab-label{position:absolute;right:56px;white-space:nowrap;padding:4px 12px;font-size:12px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(12px);opacity:0;transition:opacity .3s;pointer-events:none}
.fab:hover .fab-label{opacity:1}

/* Social icons */
.social-icon{transition:transform .3s,box-shadow .3s,color .3s}
.social-icon:hover{transform:translateY(-3px);box-shadow:0 0 24px rgba(63,91,255,.6);color:#fff}

/* Ripple */
.ripple .ripple-wave{position:absolute;border-radius:9999px;background:rgba(255,255,255,.45);transform:scale(0);animation:rippleOut .6s ease-out forwards;pointer-events:none}
@keyframes rippleOut{to{transform:scale(3);opacity:0}}






