@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root{
  --blue:#087bd9; --blue2:#0758b8; --navy:#0c2850; --text:#334766;
  --muted:#6f819a; --line:#dbe8f5; --white:#fff; --soft:#f5faff;
  --shadow:0 8px 26px rgba(25,84,145,.10);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:82px}
body{font-family:Inter,Arial,sans-serif;color:var(--text);background:#fff;line-height:1.55}
a{text-decoration:none;color:inherit}
.container{width:min(1180px,calc(100% - 48px));margin:auto}
.site-header{position:sticky;top:0;left:0;width:100%;z-index:1000;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(220,232,244,.85);box-shadow:0 4px 18px rgba(25,84,145,.06)}
.nav-wrap{height:76px;display:flex;align-items:center;gap:30px}
.brand{display:flex;align-items:center;gap:9px;color:var(--navy);min-width:210px}
.brand-mark{font-size:42px;font-weight:800;line-height:1;color:var(--blue);font-family:Georgia,serif;font-style:italic}
.brand strong{display:block;font-size:16px;letter-spacing:.6px;line-height:1.05}
.brand small{display:block;font-size:10px;letter-spacing:3px;font-weight:700;margin-top:4px}
.nav{display:flex;justify-content:center;align-items:center;gap:28px;flex:1;height:100%}
.nav a{font-size:12px;color:#52637b;position:relative;height:100%;display:flex;align-items:center}
.nav a.active,.nav a:hover{color:var(--blue)}
.nav a.active:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--blue)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:5px;font-size:12px;font-weight:700;border:1px solid transparent;transition:.2s}
.btn-primary{background:var(--blue);color:white;box-shadow:0 5px 14px rgba(8,123,217,.18)}
.btn-primary:hover{background:var(--blue2);transform:translateY(-1px)}
.btn-outline{border-color:#2388df;color:var(--blue);background:#fff}
.btn-outline:hover{background:#eff8ff}
.nav-cta{white-space:nowrap;padding:12px 18px}
.menu-btn{display:none;border:0;background:none;font-size:24px;color:var(--navy)}
.section-bg{background-repeat:no-repeat;background-size:cover;background-position:center}
.section1-bg{background-image:url("assets/section1.png")}
.section2-bg{background-image:url("assets/section2.png")}
.project-bg{background-image:url("assets/haveAproectsection.png")}
.section2contct-bg{background-image:url("assets/section2.2.png")}
.hero{min-height:560px;padding:120px 0 95px;position:relative}
.hero-content{display:flex;align-items:center;min-height:370px}
.hero-copy{width:58%}
.eyebrow{font-size:10px;letter-spacing:2px;font-weight:800;color:#2387d9;margin-bottom:8px}
.hero h1{font-size:45px;line-height:1.02;letter-spacing:-1.6px;color:var(--navy);margin-bottom:14px}
.hero h1 span{color:var(--blue)}
.lead{max-width:620px;font-size:14px;color:#62748c;line-height:1.55}
.actions{display:flex;gap:12px;margin-top:20px}
.trust-row{display:flex;gap:35px;margin-top:26px;font-size:10px;color:#51647e}
.hero-note{margin-left:auto;width:310px;position:relative;align-self:center}
.handwritten{position:absolute;left:-145px;top:-50px;font-family:cursive;font-size:22px;line-height:1.0;color:#273f60;transform:rotate(-8deg)}
.partner-card{margin-left:auto;width:190px;background:#fff;border-radius:9px;padding:20px 18px;box-shadow:0 10px 28px rgba(20,69,115,.13)}
.partner-card h3{font-size:15px;line-height:1.35;color:var(--navy)}
.partner-card h3 span{color:var(--blue)}
.mini-links{font-size:8px;color:#8998aa;margin-top:24px;padding-top:9px;border-top:1px solid #e4edf6}
.stats-strip{position:absolute;bottom:-35px;left:50%;transform:translateX(-50%);background:#fff;border:1px solid #e3edf6;border-radius:9px;display:grid;grid-template-columns:repeat(4,1fr);box-shadow:0 8px 24px rgba(34,83,130,.12);overflow:hidden}
.stat{display:flex;align-items:center;justify-content:center;gap:13px;padding:17px;border-right:1px solid #e7eef5}
.stat:last-child{border:0}
.stat-icon{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#eef8ff;color:var(--blue);font-weight:800}
.stat b{display:block;font-size:18px;color:var(--blue);line-height:1.1}
.stat small{display:block;font-size:9px;color:#72849b}

.about{padding:95px 0 65px}
.about-grid{display:grid;grid-template-columns:1.1fr 2fr 65px;gap:28px;align-items:center}
.about-copy h2,.section-heading h2,.why h2,.process h2,.contact h2{font-size:27px;line-height:1.12;color:var(--navy);letter-spacing:-.6px}
.about-copy>p:not(.eyebrow){font-size:12px;color:#667991;margin:13px 0 16px;max-width:350px}
.about-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.info-card{background:rgba(255,255,255,.9);border:1px solid #e7eef6;border-radius:8px;padding:17px;min-height:150px;box-shadow:var(--shadow)}
.card-icon,.service-icon{color:var(--blue);font-size:28px;margin-bottom:12px}
.info-card h3{font-size:12px;color:var(--navy);margin-bottom:7px}
.info-card p{font-size:10px;color:#74849a}
.side-word{border-left:2px solid #54a8ed;color:#4699df;font-size:9px;line-height:2;letter-spacing:2px;padding-left:14px}

.services,.industries,.technology,.why,.process{padding:45px 0}
.section-heading{text-align:center;max-width:700px;margin:0 auto 28px}
.section-heading>p:last-child,.process-title>p:last-child{font-size:11px;color:#718198;margin-top:7px}
.service-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.service-card{background:rgba(255,255,255,.93);border:1px solid #e4edf6;border-radius:7px;padding:17px;min-height:200px;box-shadow:var(--shadow)}
.service-card h3{font-size:11px;color:var(--navy);line-height:1.3;margin-bottom:8px}
.service-card p{font-size:9px;color:#718198;line-height:1.45}
.service-card a{display:block;margin-top:14px;color:var(--blue);font-size:9px;font-weight:700}
.service-icon{font-size:25px;margin-bottom:8px}
.industry-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.industry-grid>div{background:rgba(255,255,255,.9);border:1px solid #e5eef7;border-radius:6px;padding:17px 7px;text-align:center;color:var(--blue);font-size:22px;box-shadow:var(--shadow)}
.industry-grid span{display:block;color:#50657e;font-size:9px;font-weight:600;margin-top:8px}
.tech-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.tech-card{background:rgba(255,255,255,.92);border:1px solid #e3edf6;border-radius:6px;padding:12px;min-height:85px}
.tech-card b{font-size:10px;color:var(--navy)}
.tech-card p{font-size:8px;color:#708198;line-height:1.8;margin-top:6px}

.why-grid{display:grid;grid-template-columns:1fr 280px;gap:50px;align-items:center}
.why> .container>p{font-size:11px}
.why-items{display:grid;grid-template-columns:repeat(6,1fr);margin-top:22px}
.why-items div{text-align:center;border-right:1px solid #dce7f1;color:var(--blue);font-size:21px;padding:5px}
.why-items div:last-child{border:0}
.why-items b{display:block;color:#50657e;font-size:9px;line-height:1.35;margin-top:7px}
blockquote{background:rgba(255,255,255,.75);border-left:2px solid #5eafea;padding:24px;border-radius:8px;color:#5f7188;font-size:11px;box-shadow:var(--shadow)}
blockquote:first-letter{font-size:40px;color:#77b8ea}
blockquote span{display:block;width:22px;height:2px;background:var(--blue);margin-top:18px}

.process-title{text-align:left;margin-bottom:25px}
.process-title h2{margin-bottom:3px}
.process-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:15px}
.step{position:relative;padding-top:10px;border-top:1px solid #94c9f0}
.step i{font-style:normal;font-size:10px;color:var(--blue);font-weight:800}
.step b{display:block;color:var(--navy);font-size:10px;margin:8px 0 5px}
.step p{font-size:8px;color:#718198;line-height:1.45}

.project-cta{padding:38px 0;color:white}
.cta-content{display:flex;align-items:center;justify-content:space-between}
.cta-content h2{font-size:24px;margin-bottom:3px}
.cta-content p{font-size:11px;opacity:.9}
.btn-light{background:white;color:#1262a8}
.btn-outline-light{border-color:#fff;color:white;background:transparent;min-width:110px}

.contact{padding:55px 0 40px}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}
.contact-info>p:not(.eyebrow){font-size:11px;color:#708198;margin-top:8px}
.contact-details{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px}
.contact-details div{display:flex;flex-direction:column;gap:3px}
.contact-details b{font-size:10px;color:var(--navy)}
.contact-details span{font-size:9px;color:#718198}
.contact-form{background:#fff;padding:20px;border:1px solid #e1ebf5;border-radius:8px;box-shadow:0 10px 28px rgba(35,87,132,.10)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
input,select,textarea{width:100%;border:1px solid #dfe8f1;border-radius:4px;padding:11px 12px;margin-bottom:10px;font:inherit;font-size:9px;color:#52647c;background:#fff;outline:none}
input:focus,select:focus,textarea:focus{border-color:#76b9ec}
textarea{height:82px;resize:vertical}
.contact-form .btn{margin-left:auto;display:flex}

.footer{background:#09253d;color:#b7c8da;padding:42px 0 0;background-image:linear-gradient(135deg,#0a2944,#061c30)}
.footer-grid{display:grid;grid-template-columns:1.45fr 1fr 1.1fr 1.1fr 1.2fr;gap:35px;padding-bottom:35px}
.footer .brand{color:white}
.footer-brand p{font-size:10px;line-height:1.7;max-width:220px;margin:14px 0}
.footer h4{font-size:10px;color:#fff;margin-bottom:12px}
.footer-grid>div:not(.footer-brand) a{display:block;font-size:8px;margin:7px 0;color:#b5c5d6}
.socials{font-size:12px;color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:15px 0;display:flex;justify-content:space-between;font-size:8px;color:#8fa4b9}

@media(max-width:1000px){
  .nav{gap:15px}.nav a{font-size:10px}.brand{min-width:180px}
  .service-grid{grid-template-columns:repeat(3,1fr)}.tech-grid{grid-template-columns:repeat(3,1fr)}
  .industry-grid{grid-template-columns:repeat(4,1fr)}.process-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
  .container{width:min(100% - 28px,1180px)}
  .site-header{position:relative}.nav{display:none}.nav-cta{display:none}.menu-btn{display:block;margin-left:auto}
  .hero{padding-top:55px;min-height:auto;padding-bottom:100px}.hero-content{min-height:520px;display:block}
  .hero-copy{width:100%}.hero h1{font-size:37px}.hero-note{margin:50px 0 0;width:100%}.handwritten{left:20px;top:-35px}.partner-card{margin:auto}
  .stats-strip{position:relative;bottom:auto;left:auto;transform:none;margin-top:-55px;grid-template-columns:repeat(2,1fr)}
  .stat{border-bottom:1px solid #e7eef5}.about-grid,.contact-grid,.why-grid{grid-template-columns:1fr}.about-cards{grid-template-columns:1fr}.side-word{display:none}
  .service-grid,.tech-grid{grid-template-columns:1fr 1fr}.industry-grid{grid-template-columns:repeat(2,1fr)}
  .why-items{grid-template-columns:repeat(3,1fr);gap:12px}.why-items div{border:0}
  .process-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}
  .cta-content{display:block}.cta-content .actions{margin-top:18px}
}
@media(max-width:480px){
  .hero h1{font-size:31px}.service-grid,.tech-grid,.process-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}
  .footer-bottom{display:block}.footer-bottom span{display:block;margin:5px 0}.contact-details{grid-template-columns:1fr}
}
.stats-strip {
  position: absolute;
  bottom: -35px;
  left: 50%;
  transform: translateX(-50%);

  background: rgba(255, 255, 255, 0.97);
  border: 1px solid #e3edf6;
  border-radius: 10px;

  display: grid;
  grid-template-columns: repeat(4, 1fr);

  box-shadow: 0 8px 24px rgba(34, 83, 130, 0.12);
  overflow: hidden;
  z-index: 5;
}

.stat {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;

  padding: 18px 15px;

  border-right: 1px solid #e5edf5;
}

.stat:last-child {
  border-right: none;
}

.stat-icon {
  width: 40px;
  height: 40px;
  min-width: 40px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;
  background: #eef8ff;

  color: #087bd9;
  font-size: 17px;
}

.stat b {
  display: block;
  color: #0c2850;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
}

.stat small {
  display: block;
  color: #72849b;
  font-size: 9px;
  line-height: 1.4;
  margin-top: 3px;
}

.service-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.service-card {
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid #e2ecf5;
  border-radius: 10px;
  padding: 24px 20px;

  min-height: 230px;

  box-shadow: 0 6px 20px rgba(34, 83, 130, 0.08);

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    border-color 0.25s ease;
}

.service-card:hover {
  transform: translateY(-5px);
  border-color: #a9d5f5;
  box-shadow: 0 12px 28px rgba(34, 83, 130, 0.13);
}


/* Icon */
.service-icon {
  width: 48px;
  height: 48px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 10px;

  background: #eef8ff;
  color: #087bd9;

  font-size: 20px;

  margin-bottom: 18px;
}

.service-icon i {
  line-height: 1;
}


/* Title */
.service-card h3 {
  color: #0c2850;
  font-size: 14px;
  line-height: 1.35;

  margin-bottom: 10px;
}


/* Description */
.service-card p {
  color: #718198;
  font-size: 10px;
  line-height: 1.6;

  margin-bottom: 18px;
}


/* Learn More */
.service-card a {
  display: inline-flex;
  align-items: center;
  gap: 7px;

  color: #087bd9;

  font-size: 10px;
  font-weight: 700;

  transition: gap 0.2s ease;
}

.service-card a:hover {
  gap: 11px;
}

.service-card a i {
  font-size: 8px;
}

.industry-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 12px;
}

.industry-card {
  min-height: 145px;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  text-align: center;

  background: rgba(255, 255, 255, 0.94);
  border: 1px solid #e2ecf5;
  border-radius: 10px;

  padding: 18px 10px;

  box-shadow: 0 6px 20px rgba(34, 83, 130, 0.07);

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    border-color 0.25s ease;
}

.industry-card:hover {
  transform: translateY(-5px);

  border-color: #acd7f5;

  box-shadow: 0 12px 28px rgba(34, 83, 130, 0.13);
}


/* Icon background */
.industry-icon {
  width: 50px;
  height: 50px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 12px;

  background: #eef8ff;
  color: #087bd9;

  font-size: 21px;

  margin-bottom: 14px;

  transition: 0.25s ease;
}

.industry-card:hover .industry-icon {
  background: #087bd9;
  color: #ffffff;
}


/* Industry name */
.industry-card span {
  color: #405875;

  font-size: 10px;
  font-weight: 600;

  line-height: 1.4;
}

.why {
  padding: 70px 0;
}

/* Header */

.why-header {
  display: grid;
  grid-template-columns:1.6fr 1fr;
  gap: 70px;
  align-items: end;
  margin-bottom: 38px;
}

.why-header h2 {
  font-size: 30px;
  line-height: 1.15;
  color: #0c2850;
  letter-spacing: -0.8px;
}

.why-header h2 span {
  color: #087bd9;
}

.why-intro {
  max-width: 470px;
  font-size: 13px;
  line-height: 1.7;
  color: #718198;
  padding-bottom: 3px;
}


/* Main content */

.why-content {
  display: grid;
  grid-template-columns: 1.7fr 1fr;
  gap: 25px;
  align-items: stretch;
}


/* Feature grid */

.why-items {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.why-item {
  display: flex;
  align-items: flex-start;
  gap: 13px;

  background: rgba(255, 255, 255, 0.94);

  border: 1px solid #e2ecf5;
  border-radius: 9px;

  padding: 17px;

  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

.why-item:hover {
  transform: translateY(-3px);

  border-color: #acd7f5;

  box-shadow:
    0 10px 25px rgba(34, 83, 130, 0.09);
}


/* Icon */

.why-icon {
  width: 40px;
  height: 40px;
  min-width: 40px;

  display: flex;
  align-items: center;
  justify-content: center;

  background: #eef8ff;
  color: #087bd9;

  border-radius: 9px;

  font-size: 16px;
}

.why-item:hover .why-icon {
  background: #087bd9;
  color: #ffffff;
}


/* Text */

.why-item h3 {
  font-size: 11px;
  color: #0c2850;
  margin-bottom: 5px;
}

.why-item p {
  font-size: 9px;
  line-height: 1.55;
  color: #718198;
}


/* Highlight card */

.why-highlight {
  position: relative;

  background: linear-gradient(
    145deg,
    rgba(238, 248, 255, 0.95),
    rgba(255, 255, 255, 0.95)
  );

  border: 1px solid #d9eaf7;
  border-radius: 10px;

  padding: 30px;

  display: flex;
  flex-direction: column;
  justify-content: center;

  overflow: hidden;
}

.why-highlight::after {
  content: "";

  position: absolute;
  width: 170px;
  height: 170px;

  right: -75px;
  bottom: -75px;

  border-radius: 50%;

  border: 25px solid rgba(8, 123, 217, 0.05);
}


/* Quote */

.quote-icon {
  width: 35px;
  height: 35px;

  display: flex;
  align-items: center;
  justify-content: center;

  background: #087bd9;
  color: #fff;

  border-radius: 8px;

  font-size: 13px;

  margin-bottom: 20px;
}


/* Highlight heading */

.why-highlight h3 {
  font-size: 20px;
  line-height: 1.3;
  color: #0c2850;

  max-width: 260px;

  margin-bottom: 12px;
}

.why-highlight h3 span {
  color: #087bd9;
}

.why-highlight p {
  font-size: 10px;
  line-height: 1.7;
  color: #6d8097;

  max-width: 300px;
}


/* Bottom line */

.highlight-line {
  width: 35px;
  height: 2px;

  background: #087bd9;

  margin-top: 22px;
  margin-bottom: 10px;
}

.highlight-label {
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 1.8px;

  color: #6d8097;
}


.contact {
  padding: 75px 0;
}

/* Header */

.contact-header {
  text-align: center;
  max-width: 650px;
  margin: 0 auto 42px;
}

.contact-header h2 {
  color: #0c2850;
  font-size: 30px;
  line-height: 1.15;
  letter-spacing: -0.8px;
}

.contact-header h2 span {
  color: #087bd9;
}

.contact-header > p:last-child {
  margin-top: 10px;
  color: #718198;
  font-size: 11px;
  line-height: 1.6;
}


/* Main Grid */

.contact-grid {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 35px;
  align-items: stretch;
}


/* Contact Card */

.contact-card {
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid #e1ebf4;
  border-radius: 10px;

  padding: 12px 20px;

  box-shadow: 0 8px 25px rgba(35, 87, 132, 0.08);
}

.contact-item {
  display: flex;
  align-items: center;
  gap: 14px;

  padding: 18px 0;

  border-bottom: 1px solid #edf2f7;
}

.contact-item:last-child {
  border-bottom: none;
}

.contact-icon {
  width: 40px;
  height: 40px;
  min-width: 40px;

  display: flex;
  align-items: center;
  justify-content: center;

  background: #eef8ff;
  color: #087bd9;

  border-radius: 9px;

  font-size: 15px;
}

.contact-item small {
  display: block;

  color: #8493a5;

  font-size: 9px;
  margin-bottom: 3px;
}

.contact-item a,
.contact-item span {
  display: block;

  color: #314a68;

  font-size: 10px;
  font-weight: 600;
}

.contact-item a:hover {
  color: #087bd9;
}


/* Contact Note */

.contact-note {
  margin-top: 15px;

  display: flex;
  align-items: flex-start;
  gap: 13px;

  padding: 17px;

  border-radius: 9px;

  background: #eef8ff;
  border: 1px solid #d9ecfa;
}

.contact-note > i {
  color: #087bd9;
  font-size: 18px;
  margin-top: 2px;
}

.contact-note strong {
  color: #0c2850;
  font-size: 10px;
}

.contact-note p {
  color: #718198;
  font-size: 9px;
  line-height: 1.5;
  margin-top: 3px;
}


/* Form */

.contact-form {
  background: #ffffff;

  border: 1px solid #e1ebf4;
  border-radius: 10px;

  padding: 26px;

  box-shadow: 0 8px 25px rgba(35, 87, 132, 0.09);
}

.form-title {
  margin-bottom: 22px;
}

.form-title h3 {
  color: #0c2850;
  font-size: 16px;
  margin-bottom: 4px;
}

.form-title p {
  color: #7a8a9e;
  font-size: 9px;
}


/* Form Groups */

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 13px;
}

.form-group {
  margin-bottom: 14px;
}

.form-group label {
  display: block;

  color: #3d5571;

  font-size: 9px;
  font-weight: 600;

  margin-bottom: 6px;
}

.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;

  border: 1px solid #dce7f1;
  border-radius: 5px;

  background: #fbfdff;

  padding: 11px 12px;

  color: #425a75;

  font-family: inherit;
  font-size: 9px;

  outline: none;

  transition: 0.2s ease;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-color: #65afe7;
  background: #ffffff;

  box-shadow: 0 0 0 3px rgba(8, 123, 217, 0.06);
}

.form-group textarea {
  resize: vertical;
  min-height: 100px;
}


/* Submit */

.contact-submit {
  margin-top: 4px;

  border: none;

  cursor: pointer;

  padding: 12px 22px;
}

.contact-submit i {
  font-size: 9px;
}

.footer {
  background: #08243d;
  color: #aebfd1;

  padding-top: 55px;

  background-image:
    radial-gradient(
      circle at 85% 20%,
      rgba(8, 123, 217, 0.12),
      transparent 30%
    );
}


/* Main footer */

.footer-grid {
  display: grid;

  grid-template-columns:
    1.5fr
    1fr
    1.15fr
    1.15fr
    1.35fr;

  gap: 35px;

  padding-bottom: 45px;
}


/* Brand */

.footer-brand .brand {
  color: #ffffff;
}

.footer-brand .brand-mark {
  color: #42a8ed;
}

.footer-brand p {
  max-width: 250px;

  margin-top: 17px;

  color: #9eb2c7;

  font-size: 10px;
  line-height: 1.7;
}


/* Social icons */

.footer-socials {
  display: flex;
  gap: 8px;

  margin-top: 20px;
}

.footer-socials a {
  width: 31px;
  height: 31px;

  display: flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(255,255,255,.15);
  border-radius: 5px;

  color: #b7c8da;

  font-size: 11px;

  transition: .2s ease;
}

.footer-socials a:hover {
  background: #087bd9;
  border-color: #087bd9;
  color: #ffffff;
}


/* Footer columns */

.footer-column h4 {
  color: #ffffff;

  font-size: 11px;
  font-weight: 700;

  margin-bottom: 17px;
}

.footer-column > a {
  display: block;

  color: #9eb2c7;

  font-size: 9px;

  margin-bottom: 10px;

  transition: .2s ease;
}

.footer-column > a:hover {
  color: #ffffff;
  transform: translateX(2px);
}


/* Contact */

.footer-contact > a,
.footer-contact > div {
  display: flex;
  align-items: flex-start;

  gap: 9px;

  color: #9eb2c7;

  font-size: 9px;

  margin-bottom: 12px;
}

.footer-contact i {
  width: 14px;

  color: #48a9e9;

  font-size: 10px;

  margin-top: 2px;
}

.footer-contact a:hover {
  color: #ffffff;
}


/* Start project button */

.footer-contact .footer-contact-btn {
  display: inline-flex;

  align-items: center;

  gap: 8px;

  margin-top: 8px;

  padding: 9px 13px;

  background: #087bd9;

  border-radius: 4px;

  color: #ffffff;

  font-size: 9px;
  font-weight: 700;

  transition: .2s ease;
}

.footer-contact .footer-contact-btn:hover {
  background: #0a68b7;

  transform: translateY(-1px);
}

.footer-contact .footer-contact-btn i {
  color: #ffffff;
  width: auto;
}


/* Bottom */

.footer-bottom {
  border-top: 1px solid rgba(255,255,255,.09);
}

.footer-bottom-inner {
  min-height: 55px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 20px;

  font-size: 8px;

  color: #7f96ad;
}

.footer-legal {
  display: flex;
  align-items: center;
  gap: 8px;
}

.footer-legal a {
  color: #8ea5ba;
}

.footer-legal a:hover {
  color: #ffffff;
}

/* =========================================================
   SAP + WEB / MOBILE FOCUS
========================================================= */
.focus{padding:78px 0 72px}
.focus-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}
.focus-card{background:rgba(255,255,255,.94);border:1px solid #e2ebf4;border-radius:10px;padding:25px;box-shadow:var(--shadow);position:relative;overflow:hidden;transition:.25s}
.focus-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(25,84,145,.13)}
.focus-icon{width:48px;height:48px;border-radius:10px;display:grid;place-items:center;background:#eef8ff;color:var(--blue);font-size:20px;margin-bottom:18px}
.focus-label{font-size:9px;letter-spacing:1.7px;font-weight:800;color:var(--blue)}
.focus-card h3{font-size:17px;line-height:1.25;color:var(--navy);margin:8px 0 10px}
.focus-card p{font-size:11px;color:#6b7d94;line-height:1.65}
.focus-card ul{list-style:none;margin-top:17px;border-top:1px solid #e7eef5;padding-top:13px}
.focus-card li{font-size:10px;color:#53677f;margin:8px 0;padding-left:17px;position:relative}
.focus-card li:before{content:"✓";position:absolute;left:0;color:var(--blue);font-weight:800}

@media (max-width: 900px){
  .focus-grid{grid-template-columns:1fr 1fr}
}
@media (max-width: 700px){
  .focus{padding:60px 0}
  .focus-grid{grid-template-columns:1fr}
}


@media (max-width: 900px){
  .site-header{position:sticky}
  .nav-wrap{height:68px;gap:14px}
  .brand{min-width:0;flex:1}
  .nav-cta{display:none}
  .menu-btn{display:block;width:42px;height:42px;cursor:pointer}
  .nav{
    position:absolute;
    top:68px;
    left:12px;
    right:12px;
    height:auto;
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    background:#fff;
    border:1px solid #e2ebf4;
    border-radius:9px;
    box-shadow:0 12px 30px rgba(25,84,145,.13);
    padding:8px;
  }
  .nav.open{display:flex}
  .nav a{height:auto;padding:13px 14px;border-radius:6px;font-size:12px}
  .nav a.active:after{display:none}
  .nav a:hover{background:#f3f9ff}
  .hero{padding-top:70px}
}

/* =========================================================
   COMPLETE STICKY NAV + ACTIVE SECTION
========================================================= */
.site-header{
  position:sticky !important;
  top:0;
  z-index:1000;
}
.nav a{
  position:relative;
  text-decoration:none;
}
.nav a.active{
  color:var(--blue) !important;
  font-weight:700;
}
.nav a.active::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:4px;
  height:2px;
  border-radius:2px;
  background:currentColor;
  transform:scaleX(1);
  transform-origin:center;
}
@media (max-width:900px){
  .nav a.active::after{
    left:14px;
    right:auto;
    bottom:7px;
    width:28px;
  }
}