/* ============================================================
   NEXUS CREATIVE AGENCY — Styles (Premium Tier)
   Theme: Ultra dark (#0a0a0a) / neon green (#00ff88) / white
   ============================================================ */

body { font-family:'Inter','Helvetica Neue',sans-serif;background:#0a0a0a;color:#e0e8e4;cursor:none; }
h1,h2,h3 { font-family:'Space Grotesk','Inter',sans-serif; }

/* Custom Cursor */
.cursor-dot { width:6px;height:6px;background:#00ff88;position:fixed;border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%); }
.cursor-ring { width:32px;height:32px;border:1.5px solid rgba(0,255,136,0.5);position:fixed;border-radius:50%;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:width 0.25s,height 0.25s,border-color 0.25s; }
.cursor-ring.hover { width:50px;height:50px;border-color:#00ff88;background:rgba(0,255,136,0.05); }

/* Loader */
.page-loader { position:fixed;inset:0;background:#0a0a0a;z-index:9997;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;transition:opacity 0.8s,visibility 0.8s; }
.page-loader.done { opacity:0;visibility:hidden; }
.loader-logo { font-size:1.8rem;color:#fff;font-weight:800;letter-spacing:2px; }
.loader-logo span { color:#00ff88; }
.loader-bar { width:200px;height:1px;background:rgba(0,255,136,0.1);position:relative;overflow:hidden; }
.loader-bar::after { content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:#00ff88;animation:loaderSlide 1.4s ease forwards; }
@keyframes loaderSlide { to{left:100%} }

/* Nav */
.site-nav { position:fixed;top:0;left:0;right:0;z-index:100;padding:1.2rem 0;transition:all 0.4s ease; }
.site-nav.scrolled { background:rgba(10,10,10,0.97);backdrop-filter:blur(14px);box-shadow:0 1px 40px rgba(0,255,136,0.07);padding:0.75rem 0; }
.nav-logo { font-size:1.5rem;font-weight:800;color:#fff;letter-spacing:-0.5px; }
.nav-logo span { color:#00ff88; }
.nav-links { display:flex;gap:2.5rem;list-style:none; }
.nav-links a { font-size:0.82rem;font-weight:500;color:rgba(224,232,228,0.5);position:relative;transition:color 0.3s; }
.nav-links a::after { content:'';position:absolute;bottom:-3px;left:0;width:0;height:1px;background:#00ff88;transition:width 0.3s; }
.nav-links a:hover,.nav-links a.active { color:#00ff88; }
.nav-links a:hover::after,.nav-links a.active::after { width:100%; }
.nav-cta { border:1px solid rgba(0,255,136,0.35);color:#00ff88;padding:0.55rem 1.4rem;font-size:0.78rem;font-weight:600;letter-spacing:0.5px;transition:all 0.3s; }
.nav-cta:hover { background:rgba(0,255,136,0.08); }
.hamburger { background:none;border:none;cursor:none;display:flex;flex-direction:column;gap:5px;padding:4px; }
.hamburger span { width:22px;height:1.5px;background:#00ff88;display:block;transition:all 0.3s; }
.mobile-nav { list-style:none;max-height:0;overflow:hidden;background:rgba(10,10,10,0.99);transition:max-height 0.4s ease; }
.mobile-nav.open { max-height:300px;padding:1rem 0; }
.mobile-nav li a { display:block;padding:0.85rem 1.5rem;font-size:0.85rem;color:rgba(224,232,228,0.55);border-bottom:1px solid rgba(0,255,136,0.06); }
.mobile-nav li a:hover { color:#00ff88; }

/* Hero */
.hero-section { position:relative;min-height:100vh;background:#0a0a0a;display:flex;align-items:center;overflow:hidden; }
.hero-content { position:relative;z-index:2;padding-top:100px; }
.hero-eyebrow { font-size:0.72rem;letter-spacing:3px;text-transform:uppercase;color:rgba(0,255,136,0.65);margin-bottom:1.5rem;display:block; }
.hero-title { font-size:clamp(2.8rem,6.5vw,5.5rem);color:#fff;line-height:1;font-weight:800;margin-bottom:1.5rem;letter-spacing:-1.5px; }
.hero-title .neon { color:#00ff88;text-shadow:0 0 20px rgba(0,255,136,0.4); }
.hero-subtitle { font-size:1.02rem;color:rgba(224,232,228,0.55);max-width:500px;line-height:1.75;margin-bottom:2.5rem; }
.hero-cta { display:flex;flex-wrap:wrap;gap:1rem;align-items:center; }
.btn-nexus-primary { background:#00ff88;color:#0a0a0a;padding:1rem 2.5rem;font-size:0.85rem;font-weight:800;letter-spacing:0.5px;border:none;cursor:none;transition:all 0.3s; }
.btn-nexus-primary:hover { background:#00e87c;transform:translateY(-2px);box-shadow:0 8px 30px rgba(0,255,136,0.25); }
.btn-nexus-outline { border:1px solid rgba(0,255,136,0.35);color:#00ff88;padding:1rem 2.5rem;font-size:0.85rem;font-weight:600;background:transparent;cursor:none;transition:all 0.3s; }
.btn-nexus-outline:hover { border-color:#00ff88;background:rgba(0,255,136,0.05); }

/* Stats */
.stats-bar { border-top:1px solid rgba(0,255,136,0.1);border-bottom:1px solid rgba(0,255,136,0.1);padding:2.5rem 0;background:#0a0a0a; }
.stats-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;text-align:center; }
.stat-num { display:block;font-size:2.5rem;font-weight:800;color:#00ff88;font-family:'Space Grotesk',sans-serif; }
.stat-label { font-size:0.72rem;letter-spacing:2px;text-transform:uppercase;color:rgba(224,232,228,0.4); }

/* Section */
.section-label { font-size:0.68rem;letter-spacing:3px;text-transform:uppercase;color:rgba(0,255,136,0.7);font-weight:600;margin-bottom:0.75rem;display:block; }
.section-title { font-size:clamp(1.8rem,3.5vw,2.8rem);color:#fff;line-height:1.1;margin-bottom:1.5rem;font-weight:700;letter-spacing:-0.5px; }
.section-body { color:rgba(224,232,228,0.55);line-height:1.8;margin-bottom:1rem;max-width:520px;font-size:0.92rem; }
.section-header { text-align:center;margin-bottom:4rem; }
.section-cta { text-align:center;margin-top:3rem; }

/* Work Cards */
.work-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2.5rem; }
.work-card { background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);overflow:hidden;transition:border-color 0.4s,transform 0.4s;cursor:none; }
.work-card:hover { border-color:rgba(0,255,136,0.25);transform:translateY(-6px); }
.work-thumb { aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;font-size:4.5rem;position:relative;overflow:hidden; }
.work-tag { position:absolute;top:1rem;left:1rem;background:rgba(0,255,136,0.9);color:#0a0a0a;font-size:0.65rem;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;padding:0.2rem 0.7rem; }
.work-info { padding:1.5rem; }
.work-cat { font-size:0.68rem;letter-spacing:2px;text-transform:uppercase;color:#00ff88;margin-bottom:0.4rem;opacity:0.7; }
.work-title { font-size:1.15rem;font-weight:700;color:#fff;margin-bottom:0.5rem; }
.work-desc { font-size:0.82rem;color:rgba(224,232,228,0.5);line-height:1.6; }

/* Service Cards */
.services-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:2rem; }
.service-card { background:rgba(255,255,255,0.03);border:1px solid rgba(0,255,136,0.08);padding:2.5rem 2rem;transition:border-color 0.3s,background 0.3s; }
.service-card:hover { border-color:rgba(0,255,136,0.25);background:rgba(0,255,136,0.03); }
.service-icon { font-size:2rem;margin-bottom:1rem;display:block; }
.service-name { font-size:1rem;font-weight:700;color:#fff;margin-bottom:0.5rem; }
.service-desc { font-size:0.82rem;color:rgba(224,232,228,0.5);line-height:1.6; }

/* Testimonials */
.testimonials-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:2rem; }
.t-card { background:rgba(255,255,255,0.03);border:1px solid rgba(0,255,136,0.08);padding:2rem;transition:border-color 0.3s; }
.t-card:hover { border-color:rgba(0,255,136,0.25); }
.t-card p { color:rgba(224,232,228,0.7);font-size:0.9rem;line-height:1.7;margin:1rem 0; }
.reviewer { font-size:0.78rem;color:rgba(224,232,228,0.35); }
.reviewer strong { color:#e0e8e4; }
.stars { color:#00ff88;font-size:0.9rem; }

/* Pricing */
.pricing-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:2rem; }
.pricing-card { background:rgba(255,255,255,0.03);border:1px solid rgba(0,255,136,0.08);padding:2.5rem 2rem;transition:border-color 0.3s; }
.pricing-card.featured { border-color:rgba(0,255,136,0.3);background:rgba(0,255,136,0.04); }
.pricing-card:hover { border-color:rgba(0,255,136,0.3); }
.pricing-tier { font-size:0.68rem;letter-spacing:2.5px;text-transform:uppercase;color:#00ff88;opacity:0.7;margin-bottom:0.5rem; }
.pricing-price { font-size:2.8rem;font-weight:800;color:#fff;margin:0.5rem 0 0.25rem; }
.pricing-period { font-size:0.78rem;color:rgba(224,232,228,0.35); }
.pricing-desc { font-size:0.82rem;color:rgba(224,232,228,0.5);line-height:1.6;margin:1rem 0; }
.pricing-features { list-style:none;margin:1.5rem 0;display:flex;flex-direction:column;gap:0.6rem; }
.pricing-features li { font-size:0.82rem;color:rgba(224,232,228,0.65);display:flex;align-items:center;gap:0.5rem; }
.pricing-features li::before { content:'›';color:#00ff88;font-weight:700; }

/* CTA */
.cta-banner { background:rgba(0,255,136,0.04);border-top:1px solid rgba(0,255,136,0.1);border-bottom:1px solid rgba(0,255,136,0.1);padding:6rem 0;text-align:center; }
.cta-banner h2 { font-size:clamp(2rem,4.5vw,3.5rem);color:#fff;margin-bottom:1rem;font-weight:800;letter-spacing:-0.5px; }
.cta-banner p { color:rgba(224,232,228,0.5);margin-bottom:2.5rem;font-size:0.9rem; }

/* Footer */
.site-footer { background:#050505;color:rgba(224,232,228,0.4);padding:5rem 0 2rem;border-top:1px solid rgba(0,255,136,0.07); }
.footer-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:3rem;margin-bottom:4rem; }
.footer-grid h4 { color:rgba(0,255,136,0.7);font-size:0.68rem;letter-spacing:2.5px;text-transform:uppercase;font-weight:600;margin-bottom:1.25rem; }
.footer-grid ul { list-style:none; }
.footer-grid ul li,.footer-grid p { font-size:0.82rem;line-height:2.2; }
.footer-grid ul li a { color:rgba(224,232,228,0.4);transition:color 0.3s; }
.footer-grid ul li a:hover { color:#00ff88; }
.footer-bottom { border-top:1px solid rgba(255,255,255,0.05);padding-top:1.5rem;text-align:center;font-size:0.75rem;opacity:0.3; }

@media(max-width:640px) { .hero-title{font-size:2.5rem;letter-spacing:-0.5px} .hero-cta{flex-direction:column} }