*,
*::before,
*::after{
 box-sizing:border-box;
}

html, body{
 width:100%;
 overflow-x:hidden;
}

body{
 margin:0;
 font-family:'Segoe UI', Arial, sans-serif;
 background:#0b1220;
 color:#ffffff;
 scroll-behavior:smooth;
}

/* REVEAL */
.reveal{
 opacity:0;
 transform:translateY(30px);
 transition:opacity .8s ease, transform .8s ease;
}
.reveal.active{
 opacity:1;
 transform:translateY(0);
}

/* HEADER */
header{
 background:#ffffff;
 padding:35px 50px;
 border-bottom:1px solid #e6e6e6;
 position:fixed;
 top:0;
 left:0;
 width:100%;
 max-width:100vw;
 z-index:100;
 transition:transform .35s ease;
}
header.hide{
 transform:translateY(-120%);
}

body.has-header{
 padding-top:160px;
}

.nav{
 display:flex;
 justify-content:space-between;
 align-items:center;
 max-width:1400px;
 margin:0 auto;
}
.logo{height:120px}

nav{
 display:flex;
 flex-wrap:wrap;
}
nav a{
 color:#0f1f35;
 margin:0 18px;
 text-decoration:none;
 font-weight:600;
 font-size:17px;
 position:relative;
 white-space:nowrap;
}
nav a::after{
 content:'';
 position:absolute;
 left:0; bottom:-6px;
 width:0; height:3px;
 background:#d6a21f;
 transition:.3s;
}
nav a:hover::after{width:100%}

/* HERO */
.hero{
 padding:100px 20px 220px;
 text-align:center;
 background:
 linear-gradient(180deg,rgba(11,18,32,.85),rgba(11,18,32,.95)),
 url('https://images.unsplash.com/photo-1601584115197-04ecc0da31d7?auto=format&fit=crop&w=2000&q=80');
 background-size:cover;
 background-position:center;
 max-width:100%;
 overflow:hidden;
}
.hero h1{
 font-size:42px;
 max-width:1000px;
 margin:0 auto 26px;
}
.hero p{
 max-width:780px;
 margin:0 auto 40px;
 color:#d7def0;
 font-size:18px;
 line-height:1.6;
}

/* BUTTON */
.btn{
 background:linear-gradient(135deg,#d6a21f,#ffd978);
 color:#0b1220;
 padding:16px 38px;
 border-radius:999px;
 text-decoration:none;
 font-weight:700;
 display:inline-block;
 font-size:17px;
 box-shadow:0 10px 30px rgba(214,162,31,.35);
 transition:.25s;
}
.btn:hover{
 transform:translateY(-3px);
 box-shadow:0 18px 40px rgba(214,162,31,.45);
}

/* STATS */
.stats{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
 gap:30px;
 margin-top:140px;
 max-width:1200px;
 margin-left:auto;
 margin-right:auto;
}
.stat{
 background:rgba(255,255,255,.06);
 padding:32px;
 border-radius:20px;
 border:1px solid rgba(255,255,255,.12);
 backdrop-filter:blur(6px);
 transition:transform .3s ease, box-shadow .3s ease, background .3s ease;
}
.stat:hover{
 transform:translateY(-14px);
 background:rgba(255,255,255,.1);
 box-shadow:0 25px 55px rgba(0,0,0,.4);
}
.stat h3{
 font-size:38px;
 color:#ffd978;
 margin:0;
}
.stat p{
 margin-top:10px;
 color:#cdd6eb;
}

/* SECTIONS */
.container{
 max-width:1200px;
 margin:auto;
 padding:100px 20px;
 overflow:hidden;
}
.section-title{
 text-align:center;
 font-size:36px;
 margin-bottom:60px;
}

/* SERVICES */
.grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
 gap:45px;
}
.service{
 background:#ffffff;
 color:#0f1f35;
 padding:55px;
 border-radius:22px;
 box-shadow:0 20px 45px rgba(0,0,0,.35);
 border-top:6px solid #d6a21f;
 transition:.35s ease;
}
.service:hover{
 transform:translateY(-8px);
}
.service h3{
 font-size:26px;
 margin-bottom:20px;
}
.service p{
 font-size:16px;
 line-height:1.75;
 color:#3f4f6a;
}

/* CTA */
.cta{
 background:linear-gradient(135deg,#0f1f35,#14294f);
 padding:120px 20px;
 text-align:center;
 overflow:hidden;
}
.cta h2{
 font-size:40px;
 margin-bottom:20px;
}
.cta p{
 font-size:19px;
 color:#d7def0;
 margin-bottom:35px;
}

/* FOOTER */
footer{
 background:#0b1220;
 padding:40px 20px;
 text-align:center;
 color:#b9c7e6;
 font-size:15px;
 overflow:hidden;
}


/* Premium reveal animation */
.reveal{
 opacity:0;
 transform:translateY(28px);
 transition:opacity .9s ease, transform .9s cubic-bezier(.22,.61,.36,1);
}
.reveal.active{
 opacity:1;
 transform:none;
}

/* Mobile polish */
@media (max-width: 768px){
 h1{font-size:38px}
 h2{font-size:30px}
 .hero{padding:80px 20px}
 .container{padding:80px 20px}
 nav a{margin-left:16px}
}