:root{
  --navy:#082d4d;
  --navy-2:#0f3b61;
  --text:#111111;
  --muted:#6b7280;
  --light:#f3f4f6;
  --card:#f2f2f2;
  --line:#c7c7c7;
  --footer:#d9d6cf;
  --max:1600px;
}

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  font-family:Arial, Helvetica, sans-serif;
  color:var(--text);
  background:#ffffff;
}

img{
  max-width:100%;
  display:block;
}

a{
  text-decoration:none;
  color:inherit;
}

.container{
  width:min(92%, var(--max));
  margin:auto;
}

/* Top bar */
.topbar{
  background:var(--navy);
  color:#ffffff;
  position:sticky;
  top:0;
  z-index:1000;
  box-shadow:0 2px 8px rgba(0,0,0,0.08);
}

.topbar .container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:68px;
  gap:20px;
}

.brand{
  font-size:34px;
  font-weight:800;
  letter-spacing:0.2px;
}

.nav-links{
  display:flex;
  gap:22px;
  align-items:center;
  flex-wrap:wrap;
  font-size:15px;
  opacity:0.95;
}

.nav-links a{
  transition:opacity 0.2s ease;
}

.nav-links a:hover{
  opacity:0.8;
}

/* Hero */
.hero{
  position:relative;
  min-height:860px;
  color:#ffffff;
  background:
    linear-gradient(
      90deg,
      rgba(5,18,33,0.78) 0%,
      rgba(5,18,33,0.62) 28%,
      rgba(5,18,33,0.28) 52%,
      rgba(5,18,33,0.10) 72%,
      rgba(5,18,33,0.04) 100%
    ),
    url("../images/hero.png") center center / cover no-repeat;
  overflow:hidden;
}

.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(
      to right,
      rgba(0,0,0,0.22) 0%,
      rgba(0,0,0,0.12) 30%,
      rgba(0,0,0,0.04) 55%,
      rgba(0,0,0,0.00) 100%
    );
  z-index:1;
  pointer-events:none;
}

.hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(
      to top,
      rgba(8,45,77,0.18) 0%,
      rgba(8,45,77,0.05) 35%,
      rgba(8,45,77,0.00) 100%
    );
  z-index:1;
  pointer-events:none;
}

.blueprint{
  position:absolute;
  right:0;
  top:0;
  width:48%;
  height:38%;
  opacity:0.10;
  background-image:
    linear-gradient(rgba(255,255,255,0.75) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.75) 1px, transparent 1px);
  background-size:42px 42px, 42px 42px;
  mask-image:linear-gradient(to left, rgba(0,0,0,0.9), rgba(0,0,0,0.08));
  pointer-events:none;
  z-index:1;
}

.hero-inner{
  position:relative;
  z-index:2;
  padding:125px 0 85px;
}

.hero-content{
  max-width:620px;
  padding-left:52px;
}

.hero h1{
  font-size:76px;
  line-height:0.95;
  margin:0 0 22px;
  font-weight:800;
  letter-spacing:-1.8px;
  max-width:1200px;
  text-shadow:0 4px 18px rgba(0,0,0,0.22);
  white-space:nowrap;
}

.hero-divider{
  width:46%;
  max-width:420px;
  height:3px;
  background:linear-gradient(to right, #3e6f96, rgba(62,111,150,0.15));
  margin:18px 0 30px;
  border-radius:2px;
}

.hero-services{
  font-family:"Courier New", Courier, monospace;
  font-size:20px;
  line-height:1.45;
  letter-spacing:0.2px;
  max-width:460px;
  color:rgba(255,255,255,0.92);
  text-shadow:0 2px 10px rgba(0,0,0,0.20);
}

/* Shared sections */
.section-title{
  font-size:64px;
  line-height:1.02;
  font-weight:800;
  margin:0 0 14px;
  letter-spacing:-1.4px;
  color:#111111;
  text-align:left;
}

.section-subtitle{
  font-family:"Courier New", Courier, monospace;
  font-size:18px;
  line-height:1.5;
  color:#5b6470;
  margin:0 0 36px;
  text-align:left;
}

.thin-line{
  width:180px;
  height:2px;
  background:#365676;
  margin:0 0 28px;
}

.mono{
  font-family:"Courier New", Courier, monospace;
  font-size:24px;
  line-height:1.48;
  letter-spacing:0.2px;
}

/* Footer */
footer{
  background:var(--footer);
  padding:42px 0 56px;
}

.footer-grid{
  display:grid;
  grid-template-columns:1fr 1.3fr;
  gap:60px;
  align-items:start;
  font-family:"Courier New", Courier, monospace;
  font-size:22px;
  line-height:1.45;
}

.footer-left,
.footer-right{
  white-space:pre-line;
}

.footer-right a{
  text-decoration:underline;
}

/* Responsive */
@media (max-width:1400px){
  .hero h1{
    font-size:66px;
  }

  .section-title{
    font-size:58px;
  }
}

@media (max-width:1200px){
  .hero h1{
    font-size:64px;
  }

  .hero-content{
    max-width:640px;
    padding-left:42px;
  }

  .hero-services{
    font-size:18px;
  }
}

@media (max-width:1100px){
  .footer-grid{
    grid-template-columns:1fr 1fr;
  }

  .mono{
    font-size:20px;
  }
}

@media (max-width:768px){
  .topbar .container{
    flex-direction:column;
    align-items:flex-start;
    padding:14px 0;
  }

  .brand{
    font-size:28px;
  }

  .nav-links{
    gap:14px;
    font-size:14px;
  }

  .hero{
    min-height:620px;
    background:
      linear-gradient(
        180deg,
        rgba(5,18,33,0.72) 0%,
        rgba(5,18,33,0.52) 35%,
        rgba(5,18,33,0.30) 100%
      ),
      url("../images/hero.png") center center / cover no-repeat;
  }

  .blueprint{
    display:none;
  }

  .hero-inner{
    padding:110px 0 60px;
  }

  .hero-content{
    max-width:100%;
    padding:0 24px;
  }

  .hero h1{
    font-size:46px;
    line-height:1.02;
    letter-spacing:-1px;
  }

  .hero-divider{
    width:160px;
    margin:16px 0 24px;
  }

  .hero-services{
    font-size:16px;
    line-height:1.5;
  }

  .section-title{
    font-size:42px;
  }

  .mono,
  .footer-grid{
    font-size:18px;
  }

  .footer-grid{
    grid-template-columns:1fr;
  }
}