:root{
  --bg:#0b4e57; /* deep teal */
  --bg-dark:#093f46;
  --text:#f7fbfc;
  --muted:#cfe3e7;
  --card:#0f5f69;
  --accent:#ffffff;
  --shadow: 0 10px 30px rgba(0,0,0,0.25);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text);}

.container{width:100%;max-width:1060px;margin:0 auto;padding:0 20px}

.site-header{position:sticky;top:0;background:linear-gradient(180deg, rgba(0,0,0,0.35), rgba(0,0,0,0));backdrop-filter:saturate(140%) blur(6px);z-index:10}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.logo{
  height:220px;          /* giant desktop size */
  width:auto;
  display:block;
  margin:40px auto 20px auto;  /* centers + adds top/bottom space */
  filter:drop-shadow(0 10px 25px rgba(0,0,0,0.35));
  border-radius:20px;
  transition: all 0.3s ease;
}

@media (max-width:768px){
  .logo{
    height:160px;        /* still large on tablets */
    margin:30px auto 16px auto;
  }
}

@media (max-width:480px){
  .logo{
    height:120px;        /* mobile fit */
    margin:20px auto 12px auto;
  }
}




.nav a{color:var(--text);text-decoration:none;margin-left:18px;opacity:.9}
.nav a:hover{opacity:1}
.nav .cta-link{padding:8px 14px;border:1px solid rgba(255,255,255,.22);border-radius:12px}

.hero{padding:96px 0 64px;background: radial-gradient(1200px 600px at 20% 10%, var(--bg-dark), transparent)}
.hero-inner{max-width:900px}
.hero h1{font-weight:800;letter-spacing:-0.02em;line-height:1.05;margin:0 0 12px;font-size:48px}
.sub{opacity:.9;font-weight:400;font-size:18px;margin:0 0 28px}

.cta-row{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-block;padding:12px 16px;border-radius:14px;text-decoration:none;transition:transform .05s ease,opacity .2s ease;border:1px solid rgba(255,255,255,.2)}
.btn:hover{transform:translateY(-1px)}
.btn.primary{background:var(--accent);color:#0b3a40;border:none}
.btn.ghost{background:transparent;color:var(--text)}

.section{padding:56px 0}
.section.muted{background:rgba(255,255,255,0.04)}
.section h2{margin:0 0 10px;font-size:28px}
.section-sub{opacity:.85;margin:0 0 22px}

.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{background:#0d5660;border:1px solid rgba(255,255,255,.08);padding:18px;border-radius:16px;box-shadow:var(--shadow)}
.card h3{margin:0 0 10px;font-size:18px}
.card p{margin:0;opacity:.92}

.why-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.why-list li{background:#0d5660;border:1px solid rgba(255,255,255,.08);padding:14px;border-radius:14px}
.why-list span{font-weight:600}

.contact{text-align:center}
.contact p{opacity:.9}

.site-footer{padding:20px 0;border-top:1px solid rgba(255,255,255,.1)}
.foot{display:flex;justify-content:space-between;opacity:.8;font-size:14px}

@media (max-width: 840px){
  .grid{grid-template-columns:1fr 1fr}
  .hero h1{font-size:38px}
}
@media (max-width: 560px){
  .grid{grid-template-columns:1fr}
  .hero h1{font-size:32px}
  .cta-row{flex-direction:column;align-items:flex-start}
}