:root{--brand-bg:#343f42;--brand-blue:#39aaa0;--brand-yellow:#FFD700;--white:#ffffff;}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:'Poppins',system-ui,Arial,sans-serif;background:var(--brand-bg);color:var(--brand-blue);}
.header{width:100%;padding:24px 20px;display:flex;justify-content:center;position:fixed;top:0;left:0;z-index:50}
.header nav{display:flex;gap:36px}
.header nav a{color:var(--brand-yellow);text-decoration:none;font-weight:600;letter-spacing:2px}
.hero{height:100vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::before{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.6) 75%);z-index:1}
.hero img, .hero-content{min-height:100%}
.hero-content{position:relative;z-index:2;text-align:center;padding:0 20px;max-width:1100px}
.hero h1{font-size:6vw;color:var(--brand-blue);margin-bottom:6px;line-height:0.9}
.hero .sub{color:var(--brand-yellow);font-size:2.2vw;margin-bottom:48px}
.hero .tag{color:var(--white);font-size:4vw;max-width:900px;margin:0 auto}
.section{padding:100px 20px;min-height:60vh}
.section.charcoal{background:var(--brand-bg);color:var(--white)}
.section h2{color:var(--brand-blue);text-align:center;font-size:2.4rem;margin-bottom:18px}
.section .content{max-width:1000px;margin:0 auto;color:var(--white);line-height:1.8;font-size:1.05rem}
.services{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;margin-top:22px}
.service h3{color:var(--brand-blue);margin-bottom:6px}
.service p{color:var(--white)}
.contact-wrap{max-width:900px;margin:0 auto;display:flex;gap:40px;align-items:flex-start;flex-wrap:wrap}
.contact-form{flex:1;min-width:320px}
.contact-details{flex:1;min-width:240px;color:var(--white)}
input,textarea{width:100%;padding:12px;border-radius:6px;border:1px solid rgba(255,255,255,0.08);background:transparent;color:var(--white);margin-bottom:10px}
button.send{padding:12px 18px;border-radius:6px;border:2px solid var(--brand-blue);background:transparent;color:var(--brand-blue);cursor:pointer;font-weight:700}
button.send:hover{box-shadow:0 0 18px var(--brand-blue);background:var(--brand-blue);color:var(--brand-bg)}
footer{padding:30px 20px;text-align:center;color:var(--brand-yellow)}
@media(max-width:800px){.hero h1{font-size:10vw} .hero .tag{font-size:6vw} .header nav{gap:18px} .hero .sub{font-size:3.4vw} .contact-wrap{flex-direction:column}}