*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:17px}
body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  background:#fafafa;
  color:#4a4c4f;
  line-height:1.65;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
ul{list-style:none}
::selection{background:rgba(59,231,255,.15);color:#111}

.wrap{max-width:1080px;margin:0 auto;padding:0 28px}

/* Smooth reveal */
[data-reveal]{
  opacity:0;transform:translateY(40px);
  transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1);
}
[data-reveal].is-visible{opacity:1;transform:none}
[data-reveal="1"]{transition-delay:.08s}
[data-reveal="2"]{transition-delay:.16s}
[data-reveal="3"]{transition-delay:.24s}
[data-reveal="4"]{transition-delay:.32s}

/* Navbar */
nav{
  position:fixed;top:0;left:0;right:0;z-index:90;
  padding:20px 0;transition:background .4s,box-shadow .4s;
}
nav.pinned{
  background:rgba(255,255,255,.85);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  box-shadow:0 1px 0 rgba(0,0,0,.06);
}
nav .wrap{display:flex;align-items:center;justify-content:space-between}
.logo{font-family:'Antonio',sans-serif;font-weight:700;font-size:1.45rem;letter-spacing:-.3px;color:#111}
.logo em{font-style:normal;color:#3be7ff}
.nav-r{display:flex;align-items:center;gap:32px}
.nav-r a{font-size:.82rem;font-weight:500;color:#888;letter-spacing:.3px;transition:color .25s}
.nav-r a:hover{color:#111}
.nav-linkedin{display:flex;align-items:center;color:#888;transition:color .25s}
.nav-linkedin:hover{color:#0a66c2}
.lang-btn{
  font-size:.78rem;font-weight:600;color:#039cb8;cursor:pointer;
  background:rgba(59,231,255,.06);border:1px solid rgba(59,231,255,.28);
  padding:5px 10px;border-radius:8px;transition:all .2s;
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23039cb8' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 8px center;
  padding-right:24px;
}
.lang-btn:hover{background-color:rgba(59,231,255,.12);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23039cb8' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;}
.lang-btn:focus{outline:2px solid rgba(59,231,255,.4);outline-offset:2px}
.nav-r .cta{
  color:#fff;background:#111;padding:8px 18px;border-radius:100px;font-weight:600;
  transition:background .2s,transform .15s;
}
.nav-r .cta:hover{background:#333;transform:translateY(-1px)}
.burger{display:none;background:none;border:none;width:28px;height:20px;position:relative;cursor:pointer}
.burger i{position:absolute;left:0;width:100%;height:2px;background:#111;border-radius:2px;transition:all .3s}
.burger i:nth-child(1){top:0}.burger i:nth-child(2){top:9px}.burger i:nth-child(3){top:18px}
.burger.open i:nth-child(1){top:9px;transform:rotate(45deg)}
.burger.open i:nth-child(2){opacity:0}
.burger.open i:nth-child(3){top:9px;transform:rotate(-45deg)}

/* Hero */
.hero{
  min-height:clamp(480px,80vh,820px);display:flex;align-items:center;justify-content:center;
  text-align:center;position:relative;padding:120px 28px 80px;
  background-color:#f4f9fb;
  background-image:radial-gradient(rgba(59,231,255,.18) 1px,transparent 1px),radial-gradient(rgba(0,151,178,.07) 1px,transparent 1px);
  background-size:28px 28px,56px 56px;
  background-position:0 0,14px 14px;
}
.hero-glow{
  position:absolute;top:-20%;left:50%;transform:translateX(-50%);
  width:800px;height:800px;
  background:radial-gradient(circle,rgba(59,231,255,.05) 0%,transparent 65%);
  pointer-events:none;
}
.hero-inner{position:relative;max-width:740px}
.hero h1{
  font-family:'Antonio',sans-serif;
  font-size:clamp(2.8rem,6vw,4.8rem);font-weight:700;letter-spacing:-1px;
  line-height:1.2;color:#111;margin-bottom:24px;text-transform:uppercase;
}
.hero h1 span{
  background:linear-gradient(135deg,#0097b2 0%,#3be7ff 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.hero p{
  font-size:1.12rem;color:#777;max-width:660px;margin:0 auto 44px;line-height:1.7;
}
.hero-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 26px;border-radius:100px;font-weight:600;font-size:.9rem;
  border:none;cursor:pointer;transition:all .25s;
}
.btn-p{background:#111;color:#fff}
.btn-p:hover{background:#333;transform:translateY(-2px);box-shadow:0 6px 28px rgba(0,0,0,.12)}
.btn-g{background:rgba(0,0,0,.04);color:#555;border:1px solid rgba(0,0,0,.08)}
.btn-g:hover{background:rgba(0,0,0,.07);color:#222;transform:translateY(-2px)}
.btn svg{width:16px;height:16px}
.hero-sub{
  margin-top:80px;display:flex;gap:48px;justify-content:center;
  font-size:.78rem;color:#999;letter-spacing:.5px;
}
.hero-sub span{display:flex;align-items:center;gap:6px}
.hero-sub svg{width:14px;height:14px;opacity:.45}

/* Section shared */
section{padding:120px 0}
.stag{
  font-size:.72rem;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;
  color:#039cb8;margin-bottom:14px;
}
.sh{
  font-family:'Antonio',sans-serif;
  font-size:clamp(1.8rem,3.2vw,2.6rem);font-weight:700;color:#111;
  letter-spacing:-.5px;line-height:1.15;margin-bottom:14px;text-transform:uppercase;
}
.sp{font-size:1rem;color:#777;max-width:480px;margin-bottom:56px}
.centered{text-align:center}
.centered .sp{margin-left:auto;margin-right:auto}

/* Cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{
  background:#fff;border:1px solid rgba(0,0,0,.06);
  border-radius:12px;padding:36px 30px;position:relative;overflow:hidden;
  transition:all .4s cubic-bezier(.16,1,.3,1);
}
.card::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 50% 0%,rgba(59,231,255,.03),transparent 60%);
  opacity:0;transition:opacity .4s;
}
.card:hover{
  border-color:rgba(59,231,255,.2);border-top-color:#3be7ff;transform:translateY(-6px);
  box-shadow:0 20px 60px rgba(0,0,0,.06);
}
.card:hover::before{opacity:1}
.card-icon{
  width:40px;height:40px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;margin-bottom:18px;
}
.card-icon.c1{background:rgba(59,231,255,.07)}
.card-icon.c2{background:rgba(58,143,212,.07)}
.card-icon.c3{background:rgba(220,150,30,.07)}
.card h3{font-family:'Antonio',sans-serif;font-size:1.1rem;font-weight:600;color:#222;margin-bottom:8px;text-transform:uppercase;letter-spacing:.3px}
.card p{font-size:.88rem;color:#777;line-height:1.7}
.card ul{margin-top:14px}
.card li{
  padding:4px 0;font-size:.84rem;color:#888;
  display:flex;align-items:baseline;gap:8px;
}
.card li::before{
  content:'';width:4px;height:4px;background:#3be7ff;border-radius:50%;flex-shrink:0;position:relative;top:-1px;
}

/* Split section */
.split{
  display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;
  padding:100px 0;
}
.split+.split{padding-top:0}

/* Service section layout */
.service-layout{padding:50px 0;display:flex;flex-direction:column;gap:0}
.service-layout>.stag{margin-bottom:16px}
.service-cols{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.service-cta{display:flex;justify-content:center;gap:16px}
.split-text .stag{margin-bottom:10px}
.split-text h3{
  font-family:'Antonio',sans-serif;
  font-size:1.65rem;font-weight:700;color:#111;letter-spacing:-.3px;
  line-height:1.2;margin-bottom:14px;text-transform:uppercase;
}
.split-text p{font-size:.95rem;color:#777;margin-bottom:24px;line-height:1.75}
.split-text ul{margin-bottom:28px}
.split-text li{
  padding:6px 0;font-size:.9rem;color:#666;display:flex;align-items:center;gap:10px;
}
.split-text li svg{width:16px;height:16px;color:#3be7ff;flex-shrink:0}

.res-code{
  margin-top:40px;
  max-width:860px;
  margin-left:auto;
  margin-right:auto;
}

.term-tabs{margin-left:16px;display:flex;gap:4px}
.term-tab{
  font-family:'JetBrains Mono',monospace;font-size:.72rem;font-weight:500;
  color:#666;background:transparent;border:1px solid transparent;
  padding:2px 10px;border-radius:6px;cursor:pointer;transition:all .2s;
}
.term-tab:hover{color:#aaa}
.term-tab.active{color:#3be7ff;border-color:rgba(59,231,255,.25);background:rgba(59,231,255,.06)}

/* Terminal */
.terminal{
  background:#0f1117;border:1px solid rgba(59,231,255,.1);
  border-radius:12px;overflow:hidden;
  box-shadow:0 30px 80px rgba(0,0,0,.14);
}
.term-bar{
  display:flex;align-items:center;gap:7px;padding:14px 18px;
  background:rgba(255,255,255,.03);border-bottom:1px solid rgba(255,255,255,.05);
}
.term-dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.1)}
.term-dot:first-child{background:#ff5f57}
.term-dot:nth-child(2){background:#febc2e}
.term-dot:nth-child(3){background:#28c840}
.term-body{padding:22px 22px 26px;font-family:'JetBrains Mono',monospace;font-size:.82rem;line-height:1.9;color:#8888aa}
.term-body .prompt{color:#3be7ff}
.term-body .cmd{color:#e0e0f0}
.term-body .out{color:#e6db74}
.term-body .comment{color:#75715e}
.term-body .ok{color:#3be7ff}
.term-body .kw{color:#f92672}   /* Monokai: keyword - pink */
.term-body .cls{color:#a6e22e}  /* Monokai: class/name - green */
.term-body .fn{color:#66d9e8}   /* Monokai: function call - cyan */

/* Metric visual */
.metric-visual{
  background:#fff;border:1px solid rgba(0,0,0,.06);
  border-radius:12px;padding:44px;display:flex;flex-direction:column;gap:24px;
  box-shadow:0 30px 80px rgba(0,0,0,.06);
}
.mv-row{display:flex;align-items:center;gap:16px}
.mv-bar{flex:1;height:6px;border-radius:3px;background:rgba(0,0,0,.04);overflow:hidden;position:relative}
.mv-fill{height:100%;border-radius:3px;transition:width 1.2s cubic-bezier(.16,1,.3,1)}
.mv-fill.g{background:#3be7ff}
.mv-fill.b{background:#3a8fd4}
.mv-fill.a{background:#dc961e}
.mv-label{font-size:.78rem;color:#888;min-width:110px}
.mv-val{font-size:.78rem;color:#333;font-weight:600;font-family:'JetBrains Mono',monospace;min-width:50px;text-align:right}
.mv-head{font-size:.72rem;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:#999;margin-bottom:4px}

/* Feature pills */
.pills{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:64px}
.fpill{
  display:flex;align-items:center;gap:8px;
  padding:12px 22px;border-radius:12px;
  background:#fff;border:1px solid rgba(0,0,0,.06);
  font-size:.85rem;color:#777;font-weight:500;
  transition:all .3s;
}
.fpill:hover{border-color:rgba(59,231,255,.25);color:#333;transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.04)}
.fpill svg{width:16px;height:16px;color:#3be7ff;opacity:.8}

/* Resources */
.res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.res{
  padding:28px 24px;border-radius:10px;
  background:#fff;border:1px solid rgba(0,0,0,.06);
  transition:all .35s cubic-bezier(.16,1,.3,1);display:block;
}
.res:hover{border-color:rgba(59,231,255,.25);transform:translateY(-3px);box-shadow:0 12px 40px rgba(0,0,0,.06)}
.res h4{font-size:.95rem;font-weight:600;color:#222;margin-bottom:6px;display:flex;align-items:center;gap:8px}
.res h4 svg{width:14px;height:14px;color:#3be7ff;opacity:.7}
.res p{font-size:.84rem;color:#888;line-height:1.6}

/* CTA */
.cta-s{padding:80px 0 120px}
.cta-card{
  text-align:center;padding:72px 40px;border-radius:14px;
  background:#fff;
  border:1px solid rgba(59,231,255,.12);position:relative;overflow:hidden;
}
.cta-card::before{
  content:'';position:absolute;top:-100px;left:50%;transform:translateX(-50%);
  width:600px;height:600px;
  background:radial-gradient(circle,rgba(59,231,255,.04),transparent 60%);pointer-events:none;
}
.cta-card>*{position:relative}
.cta-card .sh{margin-bottom:12px}
.cta-card p{font-size:1rem;color:#777;max-width:440px;margin:0 auto 36px}

/* Contact */
.contact{padding:100px 0 120px}
.con-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:72px;align-items:start}
.con-info p{color:#777;font-size:.95rem;margin-bottom:28px;line-height:1.7}
.con-links{display:flex;flex-direction:column;gap:10px}
.cl{
  display:flex;align-items:center;gap:12px;padding:14px 18px;
  border-radius:10px;background:#fff;
  border:1px solid rgba(0,0,0,.06);transition:all .3s;
}
.cl:hover{border-color:rgba(59,231,255,.18);box-shadow:0 4px 16px rgba(0,0,0,.04)}
.cl-i{
  width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;
}
.cl-i svg{width:14px;height:14px}
.cl-i.li{background:rgba(58,143,212,.07);color:#3a8fd4}
.cl-i.su{background:rgba(220,150,30,.07);color:#dc961e}
.cl-i.gh{background:rgba(130,80,220,.07);color:#8250dc}
.cl span{font-size:.87rem;color:#666;font-weight:500}

.con-form{
  background:#fff;border:1px solid rgba(0,0,0,.06);
  border-radius:12px;padding:36px;
}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.fg{margin-bottom:12px}
.fg-last{margin-bottom:2px}
.fg label{display:block;font-size:.78rem;font-weight:500;color:#888;margin-bottom:5px}
.fg input,.fg select,.fg textarea{
  width:100%;padding:11px 14px;font-size:.88rem;font-family:inherit;color:#222;
  background:#fafafa;border:1px solid rgba(0,0,0,.1);
  border-radius:8px;outline:none;transition:all .25s;
}
.fg input::placeholder,.fg textarea::placeholder{color:#bbb}
.fg input:focus,.fg select:focus,.fg textarea:focus{
  border-color:#3be7ff;box-shadow:0 0 0 2px rgba(59,231,255,.1);background:#fff;
}
.fg textarea{min-height:100px;resize:vertical}
/* intl-tel-input overrides — visual styling only; let iti manage horizontal padding */
.iti{width:100%}
.iti .iti__tel-input{font-size:.88rem;font-family:inherit;color:#222;background:#fafafa;border:1px solid rgba(0,0,0,.1);border-radius:8px;outline:none;transition:all .25s;}
.iti .iti__tel-input:focus{border-color:#3be7ff;box-shadow:0 0 0 2px rgba(59,231,255,.1);background:#fff;}
.iti .iti__tel-input::placeholder{color:#bbb}
.iti__flag-container{top:0;bottom:0}
.iti__selected-dial-code{font-size:.82rem;color:#555}
.fg select{
  cursor:pointer;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%23888' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;
}
.fg select option{background:#fff}
.f-submit{width:100%;margin-top:4px}

/* Form status */
.form-status{font-size:.85rem;padding:0;margin-bottom:0;transition:opacity .3s}
.form-status:not(:empty){padding:10px 0;margin-bottom:8px}
.form-status.success{color:#3be7ff}
.form-status.error{color:#e05555}
.form-status.error a{color:#e05555;text-decoration:underline}
.req{color:#e05555;font-style:normal}
.form-req-note{font-size:.75rem;color:#aaa;margin:0 0 12px}
.form-privacy-note{font-size:.75rem;color:#aaa;margin:2px 0 0;line-height:1.5}
.form-privacy-note a{color:#aaa;text-decoration:underline}
.f-submit{margin-top:8px!important}
.form-privacy-note a:hover{color:#666}
.cf-turnstile{margin:16px 0 8px}

/* Footer */
footer{
  padding:32px 0;border-top:1px solid rgba(0,0,0,.06);background:#fff;
}
footer .wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
footer p{font-size:.8rem;color:#999}
footer a{color:#3be7ff;font-weight:500;transition:color .2s}
footer a:hover{color:#00bdd4}
.flinks{display:flex;gap:20px}
.flinks a{color:#aaa;font-size:.8rem}
.flinks a:hover{color:#555}

/* Responsive */
@media(max-width:900px){
  .cards{grid-template-columns:1fr}
  .split{grid-template-columns:1fr;gap:40px}
  .split.rev .terminal,.split.rev .metric-visual{order:-1}
  .service-cols{grid-template-columns:1fr;gap:40px}
  .res-grid{grid-template-columns:1fr}
  .con-grid{grid-template-columns:1fr;gap:40px}
}
@media(max-width:768px){
  section{padding:80px 0}
  .nav-r{
    display:none;position:absolute;top:64px;left:0;right:0;
    flex-direction:column;background:rgba(255,255,255,.97);backdrop-filter:blur(20px);
    padding:24px;gap:20px;border-bottom:1px solid rgba(0,0,0,.06);
  }
  .nav-r.open{display:flex}
  .burger{display:block}
  .hero{min-height:clamp(400px,70vh,640px);padding:100px 28px 64px}
  .hero h1{font-size:2.4rem;letter-spacing:-1px}
  .hero-sub{flex-direction:column;gap:12px;align-items:center}
  .pills{gap:10px}
  .fr{grid-template-columns:1fr}
  .cta-card{padding:48px 24px}
}
@media(max-width:480px){
  .hero-btns{flex-direction:column}
  .btn{width:100%;justify-content:center}
}
