:root{
  --black:#070707;
  --panel:#0d0f0c;
  --panel-2:#111411;
  --green:#8EFF5A;
  --green-dim: rgba(142,255,90,0.14);
  --white:#ffffff;
  --gray:#9a9c96;
  --gray-dim:#5b5d57;
  --line: rgba(255,255,255,0.08);
  --ease: cubic-bezier(.16,.84,.32,1);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{background:var(--black);}
body{
  background:var(--black);
  color:var(--white);
  font-family:'Space Grotesk', sans-serif;
  overflow-x:hidden;
  cursor:none;
}
::selection{background:var(--green);color:#000;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
button{font-family:inherit;border:none;background:none;color:inherit;cursor:none;}

.display{
  font-family:'Bebas Neue', sans-serif;
  letter-spacing:0.01em;
  line-height:0.92;
  text-transform:uppercase;
}

/* ===== grain overlay ===== */
.grain{
  position:fixed;inset:0;pointer-events:none;z-index:9998;
  opacity:0.035;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ===== cursor ===== */
.cursor{
  position:fixed;top:0;left:0;width:10px;height:10px;border-radius:50%;
  background:var(--green);pointer-events:none;z-index:9999;
  transform:translate(-50%,-50%);
  transition:width .25s var(--ease),height .25s var(--ease),background .25s var(--ease),opacity .25s;
  mix-blend-mode:difference;
}
.cursor-ring{
  position:fixed;top:0;left:0;width:38px;height:38px;border-radius:50%;
  border:1px solid rgba(142,255,90,0.6);pointer-events:none;z-index:9999;
  transform:translate(-50%,-50%);
  transition:width .3s var(--ease),height .3s var(--ease),border-color .3s var(--ease),opacity .3s;
}
.cursor-ring.big{width:90px;height:90px;border-color:var(--green);}
.cursor.hide,.cursor-ring.hide{opacity:0;}
@media(hover:none){.cursor,.cursor-ring{display:none;}body{cursor:auto;}a,button{cursor:pointer;}}

/* ===== layout helpers ===== */
.wrap{max-width:1280px;margin:0 auto;padding:0 clamp(24px, 5vw, 72px);}
section{position:relative;}
.eyebrow{
  font-size:12px;letter-spacing:0.28em;text-transform:uppercase;color:var(--green);
  display:flex;align-items:center;gap:10px;font-weight:600;
}
.eyebrow::before{content:'';width:24px;height:1px;background:var(--green);}

/* ===== nav ===== */
header{
  position:fixed;top:0;left:0;right:0;z-index:500;
  display:flex;align-items:center;justify-content:space-between;
  padding:26px 40px;
  mix-blend-mode:difference;
}
.logo{font-family:'Bebas Neue';font-size:24px;letter-spacing:0.06em;}
.logo span{color:var(--green);}
nav ul{list-style:none;display:flex;gap:38px;}
nav a{font-size:13px;letter-spacing:0.04em;text-transform:uppercase;position:relative;padding-bottom:4px;}
nav a::after{content:'';position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--white);transition:width .35s var(--ease);}
nav a:hover::after{width:100%;}
.nav-cta{
  border:1px solid var(--white);padding:10px 22px;border-radius:100px;font-size:12px;
  text-transform:uppercase;letter-spacing:0.06em;
}
.nav-links,.nav-cta{display:none;}
@media(min-width:900px){.nav-links{display:flex;}.nav-cta{display:inline-block;}}

/* ===== magnetic buttons ===== */
.magnetic{display:inline-flex;}
.btn{
  position:relative;display:inline-flex;align-items:center;gap:10px;
  padding:18px 34px;border-radius:100px;font-size:14px;letter-spacing:0.03em;
  text-transform:uppercase;font-weight:600;overflow:hidden;isolation:isolate;
}
.btn-primary{background:var(--green);color:#050505;}
.btn-primary::before{
  content:'';position:absolute;inset:0;background:#fff;transform:translateY(101%);
  transition:transform .45s var(--ease);z-index:-1;
}
.btn-primary:hover::before{transform:translateY(0);}
.btn-outline{border:1px solid rgba(255,255,255,0.25);color:var(--white);}
.btn-outline:hover{border-color:var(--green);color:var(--green);}

/* ===== hero ===== */
.hero{
  height:100vh;min-height:760px;display:flex;flex-direction:column;justify-content:center;
  position:relative;overflow:hidden;
  background:radial-gradient(ellipse 90% 60% at 50% 20%, #10160c 0%, #070707 65%);
}
.hero-bg{position:absolute;inset:0;z-index:0;}
.hero-video{

    position:absolute;
    inset:0;

    width:100%;
    height:100%;

    object-fit:cover;

    z-index:-2;

    filter:brightness(.45);

}
.hero-bg .blob{
  position:absolute;border-radius:50%;filter:blur(90px);opacity:0.35;
  background:radial-gradient(circle, var(--green), transparent 70%);
}
.blob-a{width:520px;height:520px;top:-160px;left:-120px;}
.blob-b{width:420px;height:420px;bottom:-140px;right:-80px;opacity:0.22;}
.hero-inner{position:relative;z-index:2;padding:0 40px;}

.hero-subscribe{
    margin-top:32px;
}

#subscribeForm{
    display:flex;
    gap:12px;
    max-width:480px;
}

#subscribeForm input{
    flex:1;
    height:48px;
    padding:0 18px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.15);
    background:rgba(255,255,255,.06);
    color:#fff;
    outline:none;
}

#subscribeForm input::placeholder{
    color:#bdbdbd;
}

#subscribeForm button{
    padding:0 22px;
    border:none;
    border-radius:999px;
    background:var(--green);
    color:#000;
    font-weight:700;
    cursor:pointer;
}

#subscribeMsg{
    display:block;
    margin-top:10px;
    color:var(--green);
    font-size:14px;
}
.hero-eyebrow{margin-bottom:26px;}
.hero h1{
  font-size:clamp(52px,9.4vw,148px);
  color:var(--white);
}
.hero h1 .accent{color:var(--green);}
.hero-sub{
  max-width:520px;margin-top:28px;color:var(--gray);font-size:16px;line-height:1.6;
}
.hero-actions{display:flex;gap:18px;margin-top:44px;flex-wrap:wrap;}
.hero-scroll{
  position:absolute;bottom:36px;left:40px;z-index:2;display:flex;align-items:center;gap:12px;
  font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--gray-dim);
}
.hero-scroll .line{width:1px;height:44px;background:linear-gradient(var(--green),transparent);}

/* floating chips */
.chip{
  position:absolute;z-index:2;display:flex;align-items:center;gap:8px;
  background:rgba(15,17,13,0.7);backdrop-filter:blur(14px);
  border:1px solid var(--line);padding:10px 16px;border-radius:100px;
  font-size:12px;font-weight:600;color:var(--white);
  box-shadow:0 20px 40px rgba(0,0,0,0.35);
}
.chip .dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green);}
.chip-1{top:16%;right:9%;}
.chip-2{top:38%;right:2%;}
.chip-3{bottom:20%;right:14%;}
.chip-4{bottom:10%;left:5%;}
@media(max-width:900px){.chip{display:none;}}

/* ===== marquee (client logos) ===== */
.marquee-section{padding:60px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.marquee-track{display:flex;gap:70px;width:max-content;animation:scroll-x 26s linear infinite;}
.marquee-section:hover .marquee-track{animation-play-state:paused;}
@keyframes scroll-x{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.marquee-item{
  font-family:'Bebas Neue';font-size:26px;letter-spacing:0.04em;color:var(--gray-dim);
  filter:blur(2px);opacity:0.5;transition:filter .35s, opacity .35s, color .35s;white-space:nowrap;
}
.marquee-item:hover{filter:blur(0);opacity:1;color:var(--green);}

/* ===== stats ===== */
.stats{padding:150px 0;}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--line);border:1px solid var(--line);}
.stat{background:var(--black);padding:50px 30px;text-align:center;}
.stat-num{font-family:'Bebas Neue';font-size:clamp(38px,4.6vw,64px);color:var(--white);}
.stat-num .plus{color:var(--green);}
.stat-label{margin-top:10px;font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:var(--gray);}
@media(max-width:800px){.stats-grid{grid-template-columns:repeat(2,1fr);}}

/* ===== section heads ===== */
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:70px;flex-wrap:wrap;}
.section-title{font-size:clamp(36px,5.2vw,72px);max-width:640px;}
.section-desc{max-width:340px;color:var(--gray);font-size:15px;line-height:1.7;padding-bottom:8px;}

/* ===== services ===== */
.services{padding:150px 0;}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.service-card{
  background:var(--panel);padding:44px 34px;min-height:260px;
  display:flex;flex-direction:column;justify-content:space-between;
  transform-style:preserve-3d;transition:background .4s;position:relative;overflow:hidden;
}
.service-card::after{
  content:'';position:absolute;inset:0;background:radial-gradient(circle at var(--mx,50%) var(--my,50%), var(--green-dim), transparent 60%);
  opacity:0;transition:opacity .4s;
}
.service-card:hover::after{opacity:1;}
.service-card:hover{background:#0c0f0a;}
.service-num{font-size:12px;color:var(--gray-dim);letter-spacing:0.1em;}
.service-name{font-family:'Bebas Neue';font-size:30px;margin-top:60px;}
.service-icon{
  width:44px;height:44px;border-radius:50%;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;margin-top:24px;
  transition:border-color .3s, transform .3s;
}
.service-card:hover .service-icon{border-color:var(--green);transform:rotate(45deg);}
.service-icon svg{width:16px;height:16px;stroke:var(--green);transition:transform .3s;}
.service-card:hover .service-icon svg{transform:rotate(-45deg);}
@media(max-width:900px){.services-grid{grid-template-columns:1fr;}}

/* ===== portfolio ===== */
.portfolio{padding:150px 0 120px;}
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:50px;}
.pill{
  padding:10px 20px;border-radius:100px;border:1px solid var(--line);font-size:12px;
  letter-spacing:0.04em;text-transform:uppercase;color:var(--gray);transition:.35s var(--ease);
}
.pill.active,.pill:hover{border-color:var(--green);color:var(--green);background:var(--green-dim);}
.grid-portfolio{
  columns:3 280px;column-gap:16px;
}
@media(max-width:900px){.grid-portfolio{columns:2 200px;}}
@media(max-width:560px){.grid-portfolio{columns:1;}}
.pf-card{
  break-inside:avoid;margin-bottom:16px;border-radius:14px;overflow:hidden;position:relative;
  border:1px solid var(--line);background:var(--panel);
  transition:transform .5s var(--ease), box-shadow .5s var(--ease);
}
.pf-card:hover{transform:translateY(-6px) scale(1.01);box-shadow:0 30px 60px rgba(0,0,0,0.5), 0 0 0 1px var(--green);}
.pf-thumb{
  width:100%;aspect-ratio:var(--ar, 4/5);position:relative;
  display:flex;align-items:flex-end;
}
.pf-video{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:.4s;
}

.pf-card:hover .pf-video{
    transform:scale(1.05);
}
.pf-thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg, transparent 40%, rgba(0,0,0,0.75));}
.pf-play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0.7);
  width:56px;height:56px;border-radius:50%;background:rgba(0,0,0,0.4);backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,0.5);display:flex;align-items:center;justify-content:center;
  opacity:0;transition:.4s var(--ease);z-index:2;
}
.pf-card:hover .pf-play{opacity:1;transform:translate(-50%,-50%) scale(1);}
.pf-play svg{width:16px;height:16px;fill:#fff;margin-left:2px;}
.pf-meta{position:relative;z-index:2;padding:16px 18px;width:100%;}
.pf-cat{font-size:10px;text-transform:uppercase;letter-spacing:0.12em;color:var(--green);}
.pf-name{font-family:'Bebas Neue';font-size:22px;margin-top:4px;}

/* ===== process ===== */
.process{padding:150px 0;}
.timeline{position:relative;padding-left:2px;}
.timeline::before{content:'';position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--line);}
.timeline-fill{position:absolute;left:0;top:0;width:1px;height:0%;background:var(--green);box-shadow:0 0 12px var(--green);}
.step{display:flex;gap:36px;padding:36px 0 36px 40px;border-bottom:1px solid var(--line);align-items:center;}
.step:last-child{border-bottom:none;}
.step-index{font-family:'Bebas Neue';font-size:16px;color:var(--gray-dim);width:40px;flex-shrink:0;}
.step-name{font-family:'Bebas Neue';font-size:clamp(28px,4vw,46px);flex:1;transition:color .3s, transform .3s;}
.step-desc{max-width:280px;color:var(--gray);font-size:13px;line-height:1.6;flex-shrink:0;}
.step:hover .step-name{color:var(--green);transform:translateX(10px);}
@media(max-width:800px){.step{flex-wrap:wrap;gap:10px;}.step-desc{max-width:100%;}}

/* ===== testimonials ===== */
.testimonials{padding:150px 0;overflow:hidden;}
.t-track{display:flex;gap:24px;overflow-x:auto;padding-bottom:20px;scroll-snap-type:x mandatory;}
.t-track::-webkit-scrollbar{height:3px;}
.t-track::-webkit-scrollbar-thumb{background:var(--green);}
.t-card{
  scroll-snap-align:start;flex:0 0 min(420px,80vw);background:var(--panel);border:1px solid var(--line);
  border-radius:16px;padding:38px;display:flex;flex-direction:column;justify-content:space-between;min-height:280px;
}
.t-quote{font-size:36px;font-family:'Bebas Neue';color:var(--green);line-height:1;}
.t-text{margin-top:14px;font-size:16px;line-height:1.6;color:#dcdcd8;}
.t-person{display:flex;align-items:center;gap:12px;margin-top:26px;}
.t-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--green),#2c3d1e);}
.t-name{font-size:14px;font-weight:600;}
.t-role{font-size:12px;color:var(--gray);}

/* ===== about ===== */
.about{padding:150px 0;}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.about-visual{
  aspect-ratio:4/5;border-radius:18px;position:relative;overflow:hidden;
  background:linear-gradient(160deg,#0e120b,#070707 60%);border:1px solid var(--line);
}
.about-video{

    position:absolute;

    inset:0;

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.5s;

}
.about-visual:hover .about-video{

    transform:scale(1.05);

}
.about-copy .section-title{margin-bottom:24px;}
.about-copy p{color:var(--gray);font-size:16px;line-height:1.8;margin-bottom:18px;}
.about-stats{display:flex;gap:40px;margin-top:36px;}
.about-stats div span{display:block;font-family:'Bebas Neue';font-size:36px;color:var(--green);}
@media(max-width:850px){.about-grid{grid-template-columns:1fr;}}
.about-visual::after{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(
        rgba(0,0,0,.15),
        rgba(0,0,0,.35)
    );

}
.about-visual{

    transition:.4s;

}

.about-visual:hover{

    border-color:var(--green);

    box-shadow:

    0 0 40px rgba(142,255,90,.12);

}

/* ===== mission / vision / team ===== */
.mvt{padding:150px 0;}
.mv-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:110px;}
.mv-card{background:var(--panel);padding:44px;}
.mv-icon{width:48px;height:48px;border-radius:50%;border:1px solid var(--green);display:flex;align-items:center;justify-content:center;margin-bottom:26px;}
.mv-icon svg{width:20px;height:20px;stroke:var(--green);}
.mv-card h3{font-size:28px;margin-bottom:14px;}
.mv-card p{color:var(--gray);font-size:15px;line-height:1.7;max-width:440px;}
@media(max-width:800px){.mv-grid{grid-template-columns:1fr;}}

.team-head{margin-bottom:40px;}
.team-head h3{font-size:26px;}
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.team-card{
  background:var(--panel);border:1px solid var(--line);border-radius:16px;
  padding:32px 24px;text-align:center;transition:border-color .3s, transform .3s;
}
.team-card:hover{border-color:var(--green);transform:translateY(-6px);}
.team-avatar{
  width:64px;height:64px;border-radius:50%;margin:0 auto 18px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--green),#2c3d1e);
  font-family:'Bebas Neue';font-size:20px;color:#050505;
}
.team-name{font-size:15px;font-weight:600;}
.team-role{font-size:12px;color:var(--gray);margin-top:4px;}
.team-socials{display:flex;justify-content:center;gap:10px;margin-top:16px;}
.team-socials a{
  width:30px;height:30px;border-radius:50%;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;font-size:11px;
  text-transform:uppercase;color:var(--gray);transition:.3s;
}
.team-socials a:hover{border-color:var(--green);color:var(--green);}
@media(max-width:900px){.team-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:520px){.team-grid{grid-template-columns:1fr;}}

/* ===== contact ===== */
.contact{padding:0 0 150px;}
.contact-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:50px;}
.contact-form{
  background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:38px;
  display:flex;flex-direction:column;gap:20px;
}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.field{display:flex;flex-direction:column;gap:8px;}
.field label{font-size:12px;letter-spacing:0.08em;text-transform:uppercase;color:var(--gray);}
.field input, .field textarea{
  background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:10px;
  padding:14px 16px;color:var(--white);font-family:inherit;font-size:14px;outline:none;
  transition:border-color .3s;resize:vertical;
}
.field input:focus, .field textarea:focus{border-color:var(--green);}
.field input, .field textarea, #subscribeForm input{cursor:text;}
.field input::placeholder, .field textarea::placeholder{color:var(--gray-dim);}
.contact-form .btn{align-self:flex-start;}
#contactMsg{font-size:13px;color:var(--green);}
@media(max-width:700px){.contact-grid{grid-template-columns:1fr;}.field-row{grid-template-columns:1fr;}}

.contact-info{display:flex;flex-direction:column;gap:26px;}
.info-item{border-bottom:1px solid var(--line);padding-bottom:20px;}
.info-label{display:block;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--gray-dim);margin-bottom:8px;}
.info-item a{font-size:18px;font-weight:600;transition:color .3s;}
.info-item a:hover{color:var(--green);}

/* ===== cta ===== */
.cta{
  padding:180px 0;text-align:center;position:relative;overflow:hidden;
  background:radial-gradient(ellipse 70% 70% at 50% 50%, #0f1a0c, #070707 70%);
}
.cta h2{font-size:clamp(38px,7.2vw,110px);max-width:1000px;margin:0 auto;}
.cta h2 .accent{color:var(--green);}
.cta-actions{margin-top:50px;display:flex;justify-content:center;gap:18px;flex-wrap:wrap;}
.cta .glow-btn{position:relative;}
.cta .glow-btn::before{
  content:'';position:absolute;inset:-3px;border-radius:100px;background:var(--green);filter:blur(18px);opacity:0.5;z-index:-1;
}

/* ===== footer ===== */
footer{padding:90px 0 40px;border-top:1px solid var(--line);}
.footer-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:60px;margin-bottom:80px;}
.footer-brand .logo{font-size:36px;margin-bottom:16px;}
.footer-brand p{color:var(--gray);max-width:260px;font-size:14px;line-height:1.6;}
.footer-cols{display:flex;gap:70px;flex-wrap:wrap;}
.footer-col h4{font-size:11px;text-transform:uppercase;letter-spacing:0.14em;color:var(--gray-dim);margin-bottom:18px;}
.footer-col a{display:block;font-size:14px;color:var(--gray);margin-bottom:12px;transition:color .3s, padding-left .3s;}
.footer-col a:hover{color:var(--green);padding-left:6px;}
.footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;color:var(--gray-dim);font-size:12px;padding-top:15px;border-top:1px solid var(--line);}

.reveal{opacity:0;transform:translateY(40px);}