body{
font-family:Arial, Helvetica, sans-serif;
margin:0;
line-height:1.6;
color:#333;
}

.container{
max-width:1100px;
margin:auto;
padding:0 20px;
}

/* NAV */

header{
background:#0b3d91;
color:white;
}

.nav{
display:flex;
justify-content:space-between;
align-items:center;
padding:16px 0;
}

.logo{
font-weight:bold;
font-size:18px;
}

nav a{
color:white;
margin-left:22px;
text-decoration:none;
font-weight:600;
}

/* HERO */

.hero{
background:linear-gradient(180deg,#f4f7ff 0%,#ffffff 100%);
padding:70px 20px 40px 20px;
text-align:center;
}

.hero-inner{
max-width:720px;
margin:auto;
}

.hero-divider{
width:60px;
height:3px;
background:#ff7a00;
margin:20px auto;
}

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

.hero-note{
font-size:14px;
margin-top:8px;
color:#555;
}

.hero-experience{
font-size:14px;
margin-top:6px;
margin-bottom:10px;
color:#444;
}

/* TRUST */

.trust-section{
padding:10px 0 20px 0;
text-align:center;
}

.trust-title{
font-size:26px;
margin-bottom:6px;
}

.trust-text{
max-width:650px;
margin:0 auto;
font-size:16px;
color:#666;
font-weight:500;
}

/* SECTIONS */

.section{
padding:55px 0;
}

.tight-section{
padding:35px 0;
}

.section-title{
text-align:center;
margin-bottom:25px;
font-size:28px;
}

/* GRID */

.grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
gap:22px;
margin-top:25px;
}

.card{
background:#f8f8f8;
padding:22px;
border-radius:8px;
box-shadow:0 3px 8px rgba(0,0,0,0.05);
}

.card {
background: #fff;
border: 1px solid #eee;
border-radius: 10px;
padding: 26px;
transition: transform .15s ease, box-shadow .15s ease;
}

.card:hover {
transform: translateY(-4px);
box-shadow: 0 10px 20px rgba(0,0,0,0.06);
}

/* BIO */

.bio-card{
text-align:center;
max-width:650px;
margin:auto;
}

.headshot{
width:200px;
height:200px;
border-radius:20px;
object-fit:cover;
margin-bottom:15px;
box-shadow:0 6px 18px rgba(0,0,0,0.12);
border:4px solid white;
}

.bio-name{
font-size:20px;
font-weight:600;
}

.bio-title{
font-size:15px;
color:#444;
}

.bio-company{
font-weight:600;
margin-top:8px;
}

.bio-address,
.bio-contact{
font-size:14px;
color:#555;
margin-top:8px;
}

/* BADGES */

.badge-container{
margin-top:20px;
}

.badge{
display:inline-block;
padding:8px 14px;
margin:6px;
border:1px solid #ddd;
border-radius:6px;
background:#fafafa;
font-size:14px;
}

/* BUTTON */

.btn-primary{
background:#ff7a00;
color:white;
padding:14px 26px;
border-radius:6px;
text-decoration:none;
display:inline-block;
margin-top:22px;
font-weight:bold;
}

/* FAQ */

.faq{
max-width:800px;
margin:auto;
}

.faq-item{
background:#f9f9f9;
padding:20px;
border-radius:6px;
margin-bottom:15px;
border:1px solid #eee;
}

/* CTA */

.cta{
background:#0b3d91;
color:white;
text-align:center;
padding:70px 20px;
}

/* FOOTER */

footer{
background:#111;
color:white;
padding:40px 20px;
margin-top:40px;
}

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

footer a{
color:white;
text-decoration:none;
}

.copyright{
text-align:center;
margin-top:20px;
opacity:0.7;
}

/* MOBILE */

@media(max-width:768px){

.nav{
flex-direction:column;
gap:10px;
}

.hero{
padding:50px 15px;
}

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

.headshot{
width:160px;
height:160px;
}

.hero h1 {
font-size: clamp(28px,4vw,38px);
}

.faq-item {
margin-bottom: 20px;
}

.faq-item h3 {
font-size: 18px;
margin-bottom: 6px;
}

.blog-post{
max-width:750px;
margin:0 auto;
font-size:18px;
line-height:1.7;
}

.blog-post h2{
margin-top:40px;
font-size:28px;
}

.blog-meta{
color:#777;
margin-bottom:30px;
font-size:14px;
}

.blog-post ul{
margin-left:20px;
margin-top:10px;
}
.blog-hero{
width:100%;
border-radius:10px;
margin:30px 0;
}
/* BLOG LAYOUT */

.blog-post{
max-width:750px;
margin:0 auto;
font-size:18px;
line-height:1.7;
}

.blog-post h2{
margin-top:40px;
font-size:28px;
}

.blog-meta{
color:#777;
margin-bottom:30px;
font-size:14px;
}

/* HERO IMAGE */

.blog-hero{
width:100%;
border-radius:10px;
margin:30px 0;
}

/* INLINE IMAGE */

.blog-inline-img{
width:100%;
max-width:500px;
display:block;
margin:40px auto;
border-radius:8px;
}
/* layout */

.container{
max-width:1100px;
margin:auto;
padding-left:1.25rem;
padding-right:1.25rem;
}

/* certificate */

.ea-certificate{
margin-top:2rem;
display:flex;
flex-direction:column;
align-items:center;
}

.certificate-thumb{
width:260px;
cursor:pointer;
border-radius:6px;
box-shadow:0 10px 25px rgba(0,0,0,.15);
}

.certificate-caption{
font-size:.9rem;
color:#666;
margin-top:.5rem;
}
@media(max-width:600px){

.hero-inner{
padding:2rem 0;
}

.certificate-thumb{
width:200px;
}

.blog-post{
padding:0 10px;
}

}
}