*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'Montserrat',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#071a8c;color:#fff}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.container{width:min(1180px,calc(100% - 2rem));margin-inline:auto}

.site-header{position:sticky;top:0;z-index:1000;backdrop-filter:blur(16px);background:rgba(7,26,140,.82);border-bottom:1px solid rgba(255,255,255,.1)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:1rem 0}
.brand img{height:46px;width:auto}
.nav-menu{display:flex;align-items:center;gap:1.4rem;font-weight:700}
.nav-menu a{color:rgba(255,255,255,.88);transition:.2s}
.nav-menu a:hover{color:#ffee00}
.nav-cta{padding:.8rem 1rem;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.06)}
.nav-toggle{display:none;background:none;border:none;color:#fff;font-size:1.8rem}

.hero{position:relative;overflow:hidden;border-bottom:1px solid rgba(255,255,255,.1);background:
radial-gradient(circle at 90% 15%,rgba(255,238,0,.15),transparent 24%),
radial-gradient(circle at 10% 15%,rgba(255,255,255,.08),transparent 18%),
#071a8c}
.hero-grid{display:grid;gap:3rem;align-items:center;padding:4.5rem 0 5rem;grid-template-columns:1.05fr .95fr}
.eyebrow{display:inline-flex;padding:.65rem 1rem;border-radius:999px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.06);font-size:.84rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#fff}
.eyebrow.dark{background:rgba(7,26,140,.08);border-color:rgba(7,26,140,.14);color:#071a8c}
.hero h1{font-size:clamp(2.5rem,7vw,5.2rem);line-height:1.02;margin:1rem 0 0;font-weight:900;letter-spacing:-.04em;max-width:13ch}
.hero h1 span{color:#ffee00}
.hero p{max-width:58ch;color:rgba(255,255,255,.8);font-size:1.08rem;line-height:1.9;margin-top:1.3rem}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2rem}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:1.15rem;padding:1rem 1.4rem;font-weight:900;transition:.22s ease;min-height:56px}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:#ffee00;color:#071a8c;box-shadow:0 16px 40px rgba(255,238,0,.28)}
.btn-secondary{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.05);color:#fff}
.btn-dark{background:#071a8c;color:#fff}
.btn-outline-dark{border:2px solid #071a8c;color:#071a8c}
.btn-outline-dark:hover{background:#071a8c;color:#fff}
.hero-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:2rem}
.hero-points div,.service-card,.why-card,.project{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05)}
.hero-points div{padding:1rem 1.1rem;border-radius:1.25rem;color:rgba(255,255,255,.86);font-size:.95rem;font-weight:600}
.hero-visual{position:relative}
.visual-main,.visual-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}
.visual-main{border-radius:2rem;padding:1rem;box-shadow:0 28px 60px rgba(0,0,0,.25)}
.visual-main img{border-radius:1.3rem;background:#fff}
.visual-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.85rem;margin-top:.85rem}
.visual-card{border-radius:1rem;padding:.45rem}
.visual-card img{border-radius:.8rem;background:#fff;height:100%;width:100%;object-fit:cover}

.section{padding:5rem 0}
.section-alt{background:#06146f;border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:2rem;margin-bottom:2rem}
.section-head.stack{display:block}
.section-head h2{margin:.7rem 0 0;font-size:clamp(2rem,5vw,3.5rem);line-height:1.05;font-weight:900;letter-spacing:-.03em;max-width:14ch}
.section-head p{max-width:46ch;color:rgba(255,255,255,.75);line-height:1.8}
.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}
.service-card{border-radius:1.6rem;padding:1.6rem;transition:.22s}
.service-card:hover{transform:translateY(-4px);border-color:rgba(255,238,0,.4)}
.service-card h3{margin:.2rem 0 0;font-size:1.45rem;font-weight:800}
.service-card p{margin:.8rem 0 0;color:rgba(255,255,255,.75);line-height:1.8}
.service-card::before{content:'';display:block;width:64px;height:8px;border-radius:999px;background:#ffee00;margin-bottom:1rem}

.project{padding:1.2rem;border-radius:1.9rem;margin-top:1.2rem}
.project-head{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.project-head h3{margin:0;font-size:1.8rem;font-weight:900}
.project-head span{color:rgba(255,255,255,.65)}
.project-badge{padding:.7rem 1rem;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:#ffee00;font-size:.85rem;font-weight:800}
.project-grid{display:grid;gap:1rem}
.project-grid.three{grid-template-columns:repeat(3,1fr)}
.project-grid.two{grid-template-columns:repeat(2,1fr)}
.project-grid figure{margin:0;padding:.55rem;border-radius:1.3rem;background:#fff;overflow:hidden}
.project-grid img{width:100%;height:100%;object-fit:cover;border-radius:.95rem}

.why-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:2rem;align-items:start}
.why-copy,.why-card{border-radius:1.8rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1)}
.why-copy{padding:2rem}
.why-copy h2{margin:.7rem 0 0;font-size:clamp(2rem,5vw,3.2rem);line-height:1.08;font-weight:900;letter-spacing:-.03em}
.why-copy p{margin-top:1rem;color:rgba(255,255,255,.75);line-height:1.9;font-size:1.05rem}
.why-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.why-card{padding:1.4rem}
.why-card h3{margin:.1rem 0;font-size:1.2rem}
.why-card p{margin:.6rem 0 0;color:rgba(255,255,255,.75);line-height:1.75}

.cta-box{display:grid;grid-template-columns:1.15fr .85fr;gap:2rem;align-items:center;border-radius:2.2rem;padding:2.2rem 2rem;background:#ffee00;color:#071a8c;box-shadow:0 18px 80px rgba(255,238,0,.18)}
.cta-box h2{margin:.7rem 0 0;font-size:clamp(2rem,5vw,3.2rem);line-height:1.08;font-weight:900;letter-spacing:-.03em}
.cta-box p{margin-top:1rem;color:rgba(7,26,140,.8);line-height:1.8}
.cta-actions{display:flex;flex-direction:column;gap:1rem;align-items:flex-end}
.cta-actions .btn{width:min(100%,360px)}
.socials{display:flex;gap:1rem;flex-wrap:wrap}
.socials a{font-weight:800;color:#071a8c;padding:.3rem 0;border-bottom:2px solid transparent}
.socials a:hover{border-color:#071a8c}

.site-footer{border-top:1px solid rgba(255,255,255,.08);padding:1.4rem 0 2rem}
.footer-content{display:flex;justify-content:space-between;gap:1rem;align-items:center}
.footer-content img{height:46px;width:auto}
.footer-links{display:flex;gap:1rem 1.4rem;flex-wrap:wrap;color:rgba(255,255,255,.78);font-weight:700}
.footer-links a:hover{color:#ffee00}

@media (max-width: 980px){
  .hero-grid,.why-grid,.cta-box{grid-template-columns:1fr}
  .service-grid,.project-grid.three,.why-cards{grid-template-columns:repeat(2,1fr)}
  .section-head{display:block}
  .section-head p{margin-top:1rem}
  .cta-actions{align-items:flex-start}
}
@media (max-width: 760px){
  .container{width:min(100% - 1.2rem,1180px)}
  .nav-toggle{display:block}
  .nav-menu{position:absolute;left:0;right:0;top:100%;display:none;flex-direction:column;align-items:flex-start;padding:1rem;background:rgba(7,26,140,.98);border-bottom:1px solid rgba(255,255,255,.1)}
  .nav-menu.open{display:flex}
  .hero{padding-top:.3rem}
  .hero-points,.service-grid,.project-grid.three,.project-grid.two,.why-cards{grid-template-columns:1fr}
  .visual-row{grid-template-columns:repeat(3,1fr)}
  .project-head,.footer-content{display:block}
  .project-badge{display:inline-flex;margin-top:.8rem}
  .footer-links{margin-top:1rem}
  .brand img,.footer-content img{height:40px}
}
