*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:'Poppins',sans-serif;
color:#111;
}

nav{
position:absolute;
top:0;
left:0;
width:100%;
display:flex;
justify-content:space-between;
align-items:center;
padding:28px 8%;
background:transparent;
box-shadow:none;
z-index:1000;
}

.logo img{
height:54px;
}

nav ul{
display:flex;
gap:35px;
list-style:none;
}

nav a{
text-decoration:none;
color:#ffffff;
font-weight:500;
}

.cta-btn{
background:#C89B4B;
padding:12px 24px;
border-radius:50px;
}

.hero{
background:
linear-gradient(
135deg,
#071B36 0%,
#0B1F3A 60%,
#10284D 100%
);
color:white;
padding:120px 8%;
}

.hero-proof{
display:flex;
gap:20px;
margin-top:25px;
margin-bottom:35px;
flex-wrap:wrap;
}

.hero-proof span{
font-size:15px;
font-weight:500;
color:#EAEAEA;
}

.hero-container{
display:flex;
align-items:center;
justify-content:space-between;
gap:80px;
max-width:1400px;
margin:auto;
}

.hero h1{
font-size:64px;
line-height:1.15;
margin-bottom:25px;
}

.hero p{
font-size:22px;
line-height:1.7;
max-width:650px;
opacity:.9;
}

.badge{
background:#C89B4B;
padding:8px 20px;
border-radius:50px;
display:inline-block;
margin-bottom:20px;
color:#0B1F3A;
font-weight:600;
}

.hero-buttons{
margin-top:40px;
display:flex;
gap:20px;
}

.blueprint-card{
background:white;
color:#0B1F3A;
padding:35px;
border-radius:24px;
width:380px;
box-shadow:0 20px 50px rgba(0,0,0,.15);
}

.blueprint-card h3{
text-align:center;
margin-bottom:25px;
font-size:28px;
}

.step{
padding:14px 18px;
background:#F6F7FA;
border-radius:12px;
margin-bottom:12px;
font-weight:500;
}

.arrow{
text-align:center;
font-size:28px;
margin:12px 0;
color:#C89B4B;
font-weight:700;
}

.plan-box{
background:#FFF5E4;
padding:18px;
border-radius:14px;
text-align:center;
font-weight:600;
}

.result-box{
background:#C89B4B;
color:#0B1F3A;
padding:18px;
border-radius:14px;
text-align:center;
font-weight:700;
margin-top:10px;
}

.trust-bar{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
padding:40px 8%;
background:white;
box-shadow:0 5px 20px rgba(0,0,0,.05);
}

.trust-item{
text-align:center;
}

.trust-item h3{
font-size:32px;
color:#0B1F3A;
margin-bottom:8px;
}

.trust-item p{
color:#666;
font-size:15px;
}

.gold-btn{
background:#C89B4B;
color:#0B1F3A;
padding:15px 35px;
border-radius:50px;
text-decoration:none;
font-weight:600;
}

.outline-btn{
border:2px solid white;
padding:15px 35px;
border-radius:50px;
color:white;
text-decoration:none;
}

.services,
.audit,
.why,
.contact{
padding:100px 8%;
}

.services h2,
.audit h2,
.why h2,
.contact h2{
text-align:center;
margin-bottom:50px;
font-size:42px;
color:#0B1F3A;
}

.service-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:25px;
}

.card{
background:white;
padding:35px;
border-radius:20px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
transition:.3s;
}

.card:hover{
transform:translateY(-8px);
}

.audit{
background:#F8F9FB;
text-align:center;
}

.audit-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
max-width:900px;
margin:40px auto;
gap:20px;
}

.why-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:25px;
text-align:center;
}

.contact{
background:#0B1F3A;
color:white;
text-align:center;
padding:120px 8%;
}

.contact p{
margin:25px 0;
font-size:20px;
}

.contact .gold-btn{
display:inline-block;
margin-top:20px;
}

.contact h2{
color:white;
}

footer{
padding:30px;
background:#081527;
color:white;
text-align:center;
}

/* ================= ABOUT PAGE ================= */

.about-story{
padding:100px 8%;
background:#ffffff;
}

.story-container{
max-width:1200px;
margin:0 auto;
display:grid;
grid-template-columns:1.2fr 0.8fr;
gap:80px;
align-items:center;
}

.story-left{
flex:1.2;
}

.story-right{
flex:0.8;
display:flex;
justify-content:center;
}

.story-right{
display:flex;
justify-content:center;
align-items:flex-start;
}

.story-right .blueprint-card{
position:sticky;
top:120px;
}

.about-story h2{
font-size:46px;
line-height:1.2;
color:#0B1F3A;
margin-bottom:30px;
}

.about-story p{
font-size:18px;
line-height:1.9;
color:#555;
margin-bottom:20px;
max-width:700px;
}

/* ABOUT HERO */

.about-hero{
background:linear-gradient(
135deg,
#071B36 0%,
#0B1F3A 60%,
#10284D 100%
);
padding:180px 0 140px;
position:relative;
overflow:hidden;
}

.about-hero .hero-container{
width:100%;
max-width:1400px;
margin:0 auto;
padding:0 40px;
display:flex;
justify-content:flex-start;
align-items:center;
position:relative;
z-index:2;
}

.about-hero h1{
font-size:76px;
font-weight:700;
letter-spacing:-2px;
line-height:1.08;
color:#fff;
max-width:760px;
margin:25px 0;
}

.about-hero p{
font-size:21px;
line-height:1.9;
color:rgba(255,255,255,.82);
max-width:650px;
}

.section-badge{
display:inline-block;
padding:8px 20px;
background:#C89B4B;
color:#0B1F3A;
border-radius:50px;
font-weight:600;
font-size:14px;
letter-spacing:.5px;
}

.btn-primary{
display:inline-block;
padding:16px 34px;
background:#C89B4B;
color:#0B1F3A;
text-decoration:none;
border-radius:50px;
font-weight:600;
}

.btn-outline{
display:inline-block;
padding:16px 34px;
border:2px solid rgba(255,255,255,.35);
color:#fff;
text-decoration:none;
border-radius:50px;
font-weight:600;
}

.hero-buttons{
display:flex;
gap:18px;
margin-top:40px;
}

.hero-pattern{
position:absolute;
right:-200px;
top:-100px;
width:900px;
height:900px;
opacity:.08;
background:
radial-gradient(circle,#fff 2px,transparent 2px);
background-size:32px 32px;
border-radius:50%;
}
.site-footer{
    background:#081527;
    padding:80px 0 0;
}

.footer-container{
    width:1200px;
    max-width:90%;
    margin:0 auto;
}

.footer-top{
    display:grid;
    grid-template-columns:32% 18% 22% 28%;
    gap:40px;
    padding-bottom:60px;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.footer-logo{
    height:44px;
    margin-bottom:20px;
}

.footer-tagline{
    font-size:14px;
    line-height:1.8;
    color:rgba(255,255,255,.6);
    max-width:320px;
    margin-bottom:24px;
}

.footer-contact{
    display:flex;
    flex-direction:column;
    gap:12px;
    margin-bottom:24px;
}

.footer-contact-item{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:14px;
    color:rgba(255,255,255,.7);
}

.footer-contact-item i,
.footer-contact-item svg{
    width:16px;
    height:16px;
    color:#C89B4B;
    stroke-width:1.75;
    flex-shrink:0;
}

.footer-contact-item a{
    color:rgba(255,255,255,.7);
    text-decoration:none;
}

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

.footer-social{
    display:flex;
    gap:12px;
}

.footer-social a{
    display:flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    border-radius:50%;
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.1);
    transition:.25s;
}

.footer-social a:hover{
    background:#C89B4B;
    border-color:#C89B4B;
}

.footer-social i,
.footer-social svg{
    width:16px;
    height:16px;
    color:#ffffff;
    stroke-width:1.75;
}

.footer-links h4,
.footer-trust h4,
.footer-cta h4{
    font-size:14px;
    color:#ffffff;
    margin-bottom:22px;
    font-weight:600;
}

.footer-links{
    display:flex;
    flex-direction:column;
}

.footer-links a{
    font-size:14px;
    color:rgba(255,255,255,.6);
    text-decoration:none;
    margin-bottom:14px;
    transition:.2s;
}

.footer-links a:hover{
    color:#C89B4B;
}

.footer-trust{
    display:flex;
    flex-direction:column;
}

.footer-stat{
    margin-bottom:18px;
}

.footer-stat strong{
    display:block;
    font-size:20px;
    color:#C89B4B;
}

.footer-stat span{
    font-size:13px;
    color:rgba(255,255,255,.5);
}

.footer-cta p{
    font-size:14px;
    color:rgba(255,255,255,.6);
    line-height:1.7;
    margin-bottom:20px;
}

.gold-btn.full-width{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:48px;
}

.footer-bottom{
    padding:28px 0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:16px;
}

.footer-copyright{
    font-size:13px;
    color:rgba(255,255,255,.5);
}

.footer-legal{
    display:flex;
    gap:24px;
}

.footer-legal a{
    font-size:13px;
    color:rgba(255,255,255,.5);
    text-decoration:none;
}

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

.footer-disclaimer{
    font-size:12px;
    color:rgba(255,255,255,.35);
    max-width:100%;
    flex-basis:100%;
    line-height:1.6;
}
.nav-toggle{
    display:none;
    flex-direction:column;
    gap:5px;
    background:none;
    border:none;
    cursor:pointer;
    z-index:1001;
}

.nav-toggle span{
    width:26px;
    height:2px;
    background:#ffffff;
    display:block;
}

@media (max-width: 900px){

    nav{
        padding:20px 6%;
    }

    nav ul{
        position:fixed;
        top:0;
        right:-100%;
        width:70%;
        max-width:320px;
        height:100vh;
        background:#0B1F3A;
        flex-direction:column;
        justify-content:flex-start;
        align-items:flex-start;
        padding:100px 30px;
        gap:24px;
        transition:right .35s ease;
        z-index:1000;
    }

    nav ul.nav-open{
        right:0;
    }

    nav .cta-btn{
        display:none;
    }

    .nav-toggle{
        display:flex;
    }

}
@media (max-width: 900px){

    .footer-top{
        grid-template-columns:1fr;
        gap:40px;
    }

    .footer-bottom{
        flex-direction:column;
        align-items:flex-start;
        text-align:left;
    }

    .footer-legal{
        gap:16px;
    }

}

@media (max-width: 600px){

    .hero-buttons,
    .cta-buttons{
        flex-direction:column;
        width:100%;
    }

    .hero-buttons a,
    .cta-buttons a{
        width:100%;
        text-align:center;
    }

}

@media (max-width: 600px){

    h1{ font-size:28px; line-height:1.3; }
    h2{ font-size:24px; line-height:1.3; }
    h3{ font-size:18px; }

    body{
        font-size:15px;
        line-height:1.65;
    }

}
