:root{
  --navy:#0b2a4a;
  --navy-2:#123a63;
  --orange:#f47a20;
  --light:#f4f7fa;
  --text:#1f2d3d;
  --muted:#6b7785;
  --white:#fff;
  --shadow:0 10px 30px rgba(11,42,74,.10);
  --shadow-hover:0 18px 42px rgba(11,42,74,.18);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:#fff}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{width:min(1180px,92%);margin:auto}
.topbar{background:var(--navy);color:#fff;font-size:13px}
.topbar .container{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:8px 0}
.topbar-right{display:flex;gap:18px;align-items:center}
.navbar{background:#fff;position:sticky;top:0;z-index:30;border-bottom:1px solid #e5e9ef}
.navbar .container{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 0}
.logo{width:210px;object-fit:contain}
.nav{display:flex;gap:26px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.nav a{font-size:14px;font-weight:700;color:var(--navy);display:flex;flex-direction:column;align-items:center;gap:5px;position:relative;padding:4px 0;transition:color .25s ease,transform .25s ease}
.nav a i{font-size:20px;transition:transform .25s ease;color:var(--navy)}
.nav a:hover{color:var(--orange);transform:translateY(-1px)}
.nav a:hover i{transform:translateY(-2px) scale(1.08);color:var(--orange)}
.nav a.active:after,.nav a:hover:after{content:"";position:absolute;left:0;right:0;bottom:-13px;height:3px;background:var(--orange)}

/* Hero carousel */
.hero{min-height:460px;position:relative;color:#fff;display:flex;align-items:center;overflow:hidden;background:var(--navy)}
.hero-slides,.hero-slide,.hero-overlay{position:absolute;inset:0}
.hero-slide{background-position:center;background-size:cover;opacity:0;transform:scale(1.04);transition:opacity 1s ease,transform 5.8s ease}
.hero-slide.active{opacity:1;transform:scale(1)}
.hero-overlay{background:linear-gradient(90deg,rgba(7,31,56,.90),rgba(7,31,56,.52) 48%,rgba(7,31,56,.18));z-index:1}
.hero .container{position:relative;z-index:2;display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}
.hero h1{font-size:56px;line-height:1.02;margin:0 0 16px;max-width:680px;text-transform:uppercase}
.hero h1 span{color:var(--orange)}
.hero p{font-size:20px;max-width:650px;line-height:1.5}
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--orange);color:#fff;padding:14px 22px;border-radius:6px;font-weight:700;margin-top:10px;transition:transform .25s ease,box-shadow .25s ease,background .25s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(244,122,32,.24);background:#e96e14}
.hero-points{display:grid;gap:18px;justify-content:end}
.hero-point{display:flex;gap:12px;align-items:center;font-weight:700;opacity:.38;transform:translateX(24px);transition:opacity .45s ease,transform .45s ease,color .45s ease}
.hero-point i{font-size:28px;transition:transform .45s ease}
.hero-point.active{opacity:1;transform:translateX(0);color:#fff}
.hero-point.active i{transform:scale(1.12);color:var(--orange)}
.hero-dots{position:absolute;left:50%;bottom:18px;z-index:4;display:flex;gap:9px;transform:translateX(-50%)}
.hero-dot{width:9px;height:9px;border-radius:50%;border:0;background:rgba(255,255,255,.45);padding:0;cursor:pointer;transition:width .25s ease,background .25s ease}
.hero-dot.active{width:28px;border-radius:20px;background:var(--orange)}

.section{padding:70px 0}
.section.alt{background:var(--light)}
.eyebrow{letter-spacing:4px;text-transform:uppercase;color:var(--navy);font-size:12px;font-weight:700;text-align:center}
.section-title{text-align:center;color:var(--navy);font-size:38px;margin:10px 0 14px}
.section-lead{text-align:center;color:var(--muted);max-width:760px;margin:0 auto 35px;line-height:1.6}
.cards{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.card{background:#fff;border:1px solid #e8edf2;border-radius:10px;padding:24px;box-shadow:var(--shadow);min-height:180px;position:relative;overflow:hidden;transition:transform .32s ease,box-shadow .32s ease,border-color .32s ease,background .32s ease}
.card:before,.service-card:before,.diff:before{content:"";position:absolute;inset:auto 0 0 0;height:3px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .32s ease}
.card i{font-size:38px;color:var(--navy);margin-bottom:18px;transition:transform .32s ease,color .32s ease}
.card h3{color:var(--navy);margin:0 0 8px;font-size:20px}
.card p{margin:0;color:var(--muted);line-height:1.45}
@media(hover:hover) and (pointer:fine){
  .card:hover,.service-card:hover,.diff:hover{transform:translateY(-8px);box-shadow:var(--shadow-hover);border-color:#cfdbe5;background:#fbfdff}
  .card:hover:before,.service-card:hover:before,.diff:hover:before{transform:scaleX(1)}
  .card:hover i{transform:translateY(-4px) scale(1.12);color:var(--orange)}
  .service-card:hover .service-icon{transform:rotate(-3deg) scale(1.08);background:var(--navy);color:#fff}
  .diff:hover i{transform:translateY(-4px) scale(1.12);color:var(--orange)}
}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}
.photo{border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}
.photo img{width:100%;height:100%;object-fit:cover}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:24px}
.stat{background:#fff;border-left:4px solid var(--orange);padding:18px;box-shadow:var(--shadow)}
.stat strong{display:block;font-size:28px;color:var(--navy)}
.projects{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.project{border:1px solid #e3e8ee;border-radius:10px;overflow:hidden;background:#fff;box-shadow:var(--shadow);transition:transform .28s ease,box-shadow .28s ease}
.project:hover{transform:translateY(-5px);box-shadow:var(--shadow-hover)}
.project img{height:180px;width:100%;object-fit:cover;transition:transform .45s ease}
.project:hover img{transform:scale(1.035)}
.project .p{padding:14px}
.project h4{margin:0 0 4px;color:var(--navy)}
.cta{background:linear-gradient(90deg,rgba(8,37,67,.96),rgba(8,37,67,.90)),url('https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?auto=format&fit=crop&w=1800&q=80') center/cover;color:#fff;padding:44px 0}
.cta .container{display:flex;justify-content:space-between;align-items:center;gap:30px}
.cta h2{font-size:36px;margin:0}.cta h2 span{color:var(--orange)}
.footer{background:#082542;color:#fff;padding:42px 0 20px}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:30px}
.footer h4{margin:0 0 14px}.footer p,.footer a{font-size:14px;color:#d7e0e8;line-height:1.7}
.footer .footer-logo{width:230px;height:auto;object-fit:contain;margin-bottom:12px}
.copy{border-top:1px solid rgba(255,255,255,.15);margin-top:28px;padding-top:16px;font-size:12px;color:#c8d2dc}

.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.service-card{display:grid;grid-template-columns:72px 1fr;gap:18px;align-items:start;background:#fff;border:1px solid #e6ebf0;border-radius:10px;padding:22px;box-shadow:var(--shadow);position:relative;overflow:hidden;transition:transform .32s ease,box-shadow .32s ease,border-color .32s ease,background .32s ease}
.service-icon{width:64px;height:64px;border-radius:10px;background:#eff4f8;display:flex;align-items:center;justify-content:center;color:var(--navy);font-size:30px;transition:transform .32s ease,background .32s ease,color .32s ease}
.service-card h3{margin:0 0 8px;color:var(--navy)}
.service-card p{margin:0;color:var(--muted);line-height:1.5}
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;position:relative}
.process:before{content:"";position:absolute;left:10%;right:10%;top:45px;height:2px;background:#d5dfe8;z-index:0;transform:scaleX(0);transform-origin:left;transition:transform 1.6s ease .25s}
.process.is-visible:before{transform:scaleX(1)}
.step{background:#fff;border-radius:10px;padding:24px;border:1px solid #e7ebef;text-align:center;box-shadow:var(--shadow);position:relative;z-index:1;opacity:0;transform:translateY(28px) scale(.97);transition:opacity .55s ease,transform .55s ease,box-shadow .3s ease}
.process.is-visible .step{opacity:1;transform:translateY(0) scale(1)}
.process.is-visible .step:nth-child(1){transition-delay:.15s}
.process.is-visible .step:nth-child(2){transition-delay:.38s}
.process.is-visible .step:nth-child(3){transition-delay:.61s}
.process.is-visible .step:nth-child(4){transition-delay:.84s}
.step:hover{box-shadow:var(--shadow-hover);transform:translateY(-5px)}
.step .num{width:42px;height:42px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#dce4ea;color:var(--navy);font-weight:700;margin-bottom:10px;transition:background .3s ease,color .3s ease,transform .3s ease}
.process.is-visible .step .num{animation:pulseNum 1.2s ease both}
.process.is-visible .step:nth-child(2) .num{animation-delay:.35s}
.process.is-visible .step:nth-child(3) .num{animation-delay:.58s}
.process.is-visible .step:nth-child(4) .num{animation-delay:.81s}
@keyframes pulseNum{0%{transform:scale(.7);background:#dce4ea}55%{transform:scale(1.16);background:var(--orange);color:#fff}100%{transform:scale(1);background:#dce4ea;color:var(--navy)}}
.about-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.about-card{background:#fff;border:1px solid #e5eaef;border-radius:10px;padding:24px;box-shadow:var(--shadow)}
.about-card i{font-size:34px;color:var(--navy);margin-bottom:15px}
.about-card h3{margin:0 0 10px;color:var(--navy)}
.values{padding-left:18px;margin:0}.values li{margin:8px 0}
.diff-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.diff{background:#fff;border-radius:10px;padding:24px;border:1px solid #e5eaef;box-shadow:var(--shadow);position:relative;overflow:hidden;transition:transform .32s ease,box-shadow .32s ease,border-color .32s ease,background .32s ease}
.diff i{font-size:32px;color:var(--navy);margin-bottom:12px;transition:transform .32s ease,color .32s ease}.diff h4{margin:0 0 8px;color:var(--navy)}
.subhero{min-height:330px;background:linear-gradient(90deg,rgba(7,31,56,.9),rgba(7,31,56,.20)),url('https://images.unsplash.com/photo-1504307651254-35680f356dfd?auto=format&fit=crop&w=1800&q=80') center/cover;color:#fff;display:flex;align-items:center}
.subhero h1{font-size:52px;margin:0 0 10px}.subhero h1 span{color:var(--orange)}.subhero p{font-size:20px;max-width:650px}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}
.reveal.is-visible{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
  .hero-slide{transform:none!important}
  .hero-point,.step,.reveal{opacity:1!important;transform:none!important}
  .process:before{transform:scaleX(1)!important}
}
@media(max-width:1000px){.nav{gap:14px}.cards{grid-template-columns:repeat(2,1fr)}.projects{grid-template-columns:repeat(2,1fr)}.service-grid{grid-template-columns:repeat(2,1fr)}.diff-grid{grid-template-columns:repeat(2,1fr)}.hero .container,.grid-2{grid-template-columns:1fr}.hero-points{justify-content:start}.hero h1{font-size:44px}.footer-grid{grid-template-columns:repeat(2,1fr)}.process:before{display:none}}
@media(max-width:700px){.topbar-right{display:none}.navbar .container{align-items:flex-start;flex-direction:column}.logo{width:160px}.nav{display:grid;grid-template-columns:repeat(4,1fr);width:100%}.nav a{font-size:11px}.nav a i{font-size:16px}.hero{min-height:590px}.hero h1{font-size:38px}.section{padding:50px 0}.cards,.projects,.service-grid,.process,.about-cards,.diff-grid,.footer-grid{grid-template-columns:1fr}.cta .container{flex-direction:column;align-items:flex-start}.section-title{font-size:30px}.subhero h1{font-size:40px}.hero-points{grid-template-columns:1fr 1fr;justify-content:stretch}.hero-dot{height:8px}.service-card{grid-template-columns:60px 1fr}.service-icon{width:54px;height:54px;font-size:25px}}