:root{
  --primary:#1f6feb;
  --primary-dark:#1253b5;
  --ink:#101828;
  --muted:#667085;
  --light:#f5f8fc;
  --dark:#071426;
  --line:#e6ebf2;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:"Inter",sans-serif;color:var(--ink);overflow-x:hidden}
h1,h2,h3,h4,h5,h6,.navbar-brand{font-family:"Manrope",sans-serif}
a{text-decoration:none}
.topbar{background:var(--dark);color:#b9c6d8;font-size:.78rem;padding:9px 0;letter-spacing:.02em}
.main-nav{box-shadow:0 1px 0 rgba(16,24,40,.06)}
.navbar-brand strong{display:block;line-height:1;font-size:.86rem;letter-spacing:.08em}
.navbar-brand small{display:block;font-size:.58rem;letter-spacing:.23em;color:var(--primary);margin-top:4px}
.brand-mark{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:11px;background:var(--primary);color:#fff;font:800 1.15rem "Manrope";box-shadow:0 8px 20px rgba(31,111,235,.2)}
.nav-link{font-size:.9rem;font-weight:600;color:#344054!important;padding:.7rem .75rem!important}
.nav-link:hover,.nav-link.active{color:var(--primary)!important}
.btn-primary{background:var(--primary);border-color:var(--primary);box-shadow:0 8px 20px rgba(31,111,235,.18)}
.btn-primary:hover{background:var(--primary-dark);border-color:var(--primary-dark)}
.hero-section{position:relative;background:var(--dark);color:#fff;min-height:760px;overflow:hidden}
.hero-grid{position:absolute;inset:0;opacity:.22;background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:70px 70px;mask-image:linear-gradient(90deg,black,transparent)}
.hero-section:after{content:"";position:absolute;width:600px;height:600px;border-radius:50%;right:-220px;top:-120px;background:radial-gradient(circle,rgba(31,111,235,.35),transparent 65%)}
.min-vh-75{min-height:760px}
.eyebrow,.section-kicker{font-size:.74rem;font-weight:800;letter-spacing:.18em;color:var(--primary);display:inline-block;margin-bottom:16px}
.hero-section .eyebrow{color:#75aefb}
.hero-section h1{font-size:clamp(3rem,6vw,5.4rem);line-height:1.02;letter-spacing:-.055em;max-width:800px;margin:0}
.hero-section h1 span,.section-title span{color:var(--primary)}
.hero-copy{color:#b7c3d4;max-width:610px;font-size:1.1rem;line-height:1.8;margin-top:24px}
.hero-trust{display:flex;gap:34px;flex-wrap:wrap}
.hero-trust div{display:flex;flex-direction:column;border-left:1px solid rgba(255,255,255,.2);padding-left:14px}
.hero-trust strong{font-size:.75rem;color:#75aefb}
.hero-trust span{font-size:.76rem;color:#b7c3d4;margin-top:4px}
.hero-card{height:500px;position:relative;border:1px solid rgba(255,255,255,.12);border-radius:32px;background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.015));backdrop-filter:blur(8px);overflow:hidden}
.hero-card:before{content:"";position:absolute;width:280px;height:280px;border-radius:50%;background:rgba(31,111,235,.22);filter:blur(10px);right:-70px;bottom:-50px}
.hero-card-content{position:absolute;left:50px;bottom:55px;z-index:2}
.small-label{font-size:.68rem;letter-spacing:.16em;color:#9db2ca;font-weight:800}
.hero-card h3{font-size:3rem;line-height:1.05;margin:15px 0}
.hero-card h3 span{color:#75aefb}
.hero-card p{color:#9db2ca;max-width:250px;line-height:1.6}
.floating-badge{position:absolute;right:25px;top:25px;border:1px solid rgba(255,255,255,.15);border-radius:15px;padding:12px 16px;font-size:.6rem;letter-spacing:.12em;color:#b9c6d8;text-align:right}
.floating-badge strong{color:#fff}
.hero-orbit{position:absolute;border:1px solid rgba(117,174,251,.22);border-radius:50%;left:35px;top:50px}
.orbit-one{width:350px;height:350px}
.orbit-two{width:250px;height:250px;left:85px;top:100px}
.logo-strip{background:#fff;border-bottom:1px solid var(--line);color:#98a2b3;font-size:.68rem;font-weight:800;letter-spacing:.15em}
.section-padding{padding:110px 0}
.section-title{font-size:clamp(2.2rem,4vw,3.5rem);letter-spacing:-.045em;line-height:1.1;margin-bottom:22px}
.lead{font-size:1.08rem;line-height:1.8}
.about-visual{height:520px;position:relative}
.visual-main{position:absolute;inset:25px 50px 25px 0;border-radius:30px;background:linear-gradient(145deg,#e9f1fc,#cdddf3);overflow:hidden}
.visual-letter{font:800 21rem "Manrope";color:rgba(31,111,235,.12);line-height:.85;position:absolute;right:-20px;bottom:-35px}
.visual-lines{position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 25px,rgba(255,255,255,.28) 26px 27px)}
.experience-card{position:absolute;right:0;bottom:50px;background:var(--dark);color:#fff;border-radius:20px;padding:25px;box-shadow:0 20px 45px rgba(7,20,38,.2);display:flex;gap:16px;align-items:center}
.experience-card strong{font:800 2.6rem "Manrope";color:#75aefb}
.experience-card span{font-size:.75rem;line-height:1.5;color:#c6d0df}
.dot-pattern{position:absolute;width:100px;height:100px;right:0;top:0;background-image:radial-gradient(#9fb4cf 1.4px,transparent 1.4px);background-size:12px 12px}
.mini-feature{border:1px solid var(--line);border-radius:13px;padding:13px;display:flex;gap:10px;align-items:center;font-size:.84rem}
.mini-feature span{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#e7f0fd;color:var(--primary);font-weight:800}
.services-section{background:var(--light)}
.section-intro{max-width:700px}
.section-intro p{color:var(--muted);line-height:1.7}
.service-card{height:100%;background:#fff;border:1px solid var(--line);border-radius:20px;padding:32px;transition:.3s}
.service-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(16,24,40,.08)}
.service-card.featured{background:var(--dark);color:#fff;border-color:var(--dark)}
.service-card.featured p{color:#aebdd0}
.service-card.featured a{color:#75aefb}
.service-icon{font:800 .75rem "Manrope";color:var(--primary);letter-spacing:.12em;margin-bottom:40px}
.service-card h3{font-size:1.3rem;margin-bottom:12px}
.service-card p{color:var(--muted);font-size:.9rem;line-height:1.7;min-height:80px}
.service-card a{color:var(--ink);font-size:.8rem;font-weight:800}
.stats-section{background:var(--primary);color:#fff;padding:65px 0}
.stat{border-right:1px solid rgba(255,255,255,.2)}
.stat:last-child{border-right:0}
.stat strong{display:block;font:800 3rem "Manrope";letter-spacing:-.05em}
.stat strong span{font-size:1.5rem}
.stat small{color:#d9e8ff;font-size:.75rem}
.project-card{min-height:330px;border-radius:22px;position:relative;overflow:hidden;background:linear-gradient(145deg,#dce8f8,#9fbce0)}
.project-card:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 20%,rgba(7,20,38,.85))}
.project-large{min-height:480px;background:radial-gradient(circle at 70% 20%,#6fa4ed,transparent 32%),linear-gradient(135deg,#0b2343,#1d5fae)}
.project-blue{background:linear-gradient(145deg,#1f6feb,#071426)}
.project-dark{background:linear-gradient(145deg,#071426,#344c68)}
.project-light{background:linear-gradient(145deg,#e5eef9,#9db8d9)}
.project-overlay{position:absolute;bottom:0;left:0;right:0;padding:30px;color:#fff}
.project-light .project-overlay{color:var(--ink)}
.project-overlay span{font-size:.65rem;letter-spacing:.16em;font-weight:800;opacity:.75}
.project-overlay h3{font-size:1.7rem;margin:8px 0 4px}
.project-overlay p{font-size:.78rem;margin:0;opacity:.75}
.project-note{max-width:350px;color:var(--muted);font-size:.85rem;line-height:1.6}
.why-section{background:var(--light)}
.reason-list{background:#fff;border:1px solid var(--line);border-radius:24px;padding:10px}
.reason{display:flex;gap:22px;padding:27px 25px;border-bottom:1px solid var(--line)}
.reason:last-child{border-bottom:0}
.reason>b{font-size:.72rem;color:var(--primary);padding-top:4px}
.reason h4{font-size:1.05rem;margin:0 0 6px}
.reason p{color:var(--muted);font-size:.82rem;line-height:1.6;margin:0}
.testimonial-section{background:#fff}
.testimonial-card{background:var(--light);border-radius:28px;padding:50px 55px;text-align:center}
.quote-mark{font:800 5rem "Manrope";color:var(--primary);height:55px;line-height:1}
.testimonial-card blockquote{font:600 1.35rem "Manrope";line-height:1.7;max-width:760px;margin:15px auto 30px}
.client-line{display:flex;justify-content:center;align-items:center;gap:12px;text-align:left}
.client-avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--dark);color:#fff;font-weight:800}
.client-line strong,.client-line small{display:block}
.client-line small{font-size:.7rem;color:var(--muted);margin-top:2px}
.contact-section{background:var(--dark)}
.contact-wrap{background:linear-gradient(135deg,#0d2340,#071426);border-radius:30px;padding:65px;overflow:hidden;position:relative}
.contact-wrap:after{content:"";position:absolute;width:450px;height:450px;border-radius:50%;right:-180px;bottom:-250px;background:rgba(31,111,235,.2)}
.contact-wrap>*{position:relative;z-index:2}
.contact-detail{margin-top:25px}
.contact-detail span{display:block;font-size:.62rem;letter-spacing:.16em;color:#7890ac;font-weight:800;margin-bottom:6px}
.contact-detail a,.contact-detail p{color:#fff;margin:0;font-size:.88rem}
.contact-form{background:#fff;padding:32px;border-radius:22px}
.contact-form label{font-size:.72rem;font-weight:700;display:block;margin-bottom:7px}
.contact-form input,.contact-form textarea{width:100%;border:1px solid #dfe5ec;border-radius:10px;padding:12px 14px;font:inherit;font-size:.82rem;outline:none;transition:.2s}
.contact-form input:focus,.contact-form textarea:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(31,111,235,.1)}
.footer{background:#050e1a;color:#c4cfdd}
.footer .brand-mark{background:#fff;color:var(--dark)}
.footer h6{color:#fff;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:18px}
.footer a{display:block;color:#9aaabd;font-size:.78rem;margin-bottom:10px}
.footer a:hover{color:#75aefb}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding:18px 0;font-size:.68rem;color:#6f8095}
@media(max-width:991.98px){
  .hero-section{min-height:auto}
  .min-vh-75{min-height:auto}
  .hero-section h1{font-size:clamp(2.8rem,10vw,4.2rem)}
  .section-padding{padding:80px 0}
  .about-visual{height:440px}
  .contact-wrap{padding:40px 25px}
}
@media(max-width:575.98px){
  .topbar span:first-child{font-size:.68rem}
  .hero-section h1{font-size:2.8rem}
  .hero-copy{font-size:1rem}
  .hero-trust{gap:18px}
  .section-padding{padding:65px 0}
  .section-title{font-size:2.25rem}
  .about-visual{height:340px}
  .visual-main{inset:15px 25px 15px 0}
  .visual-letter{font-size:13rem}
  .experience-card{bottom:20px;padding:17px}
  .experience-card strong{font-size:2rem}
  .testimonial-card{padding:35px 20px}
  .testimonial-card blockquote{font-size:1.08rem}
  .contact-form{padding:22px 18px}
  .stat strong{font-size:2.2rem}
  .stat{border-right:0}
}
