:root{
  --bg:#0b3c49;
  --accent:#1fa3a3;
  --text:#102a33;
  --muted:#4b5b6b;
  --card:#ffffff;
  --soft:#f2f6f7;
  --radius:18px;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);line-height:1.6;background:white}
a{color:inherit}
.container{max-width:1100px;margin:0 auto;padding:0 22px}
.nav{position:sticky;top:0;background:rgba(255,255,255,.9);backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid #e7edf3;z-index:20}
.navInner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{font-weight:750;letter-spacing:.2px}
.menu{display:flex;gap:18px;align-items:center}
.menu a{text-decoration:none;color:var(--muted);font-weight:600}
.menu a:hover{color:var(--text)}
.btn{display:inline-block;padding:10px 14px;border-radius:999px;text-decoration:none;font-weight:700}
.btn.primary{background:var(--accent);color:white}
.btn.ghost{border:1px solid #dbe6ef;color:var(--text)}
.hero{background:linear-gradient(120deg,var(--bg),#0f5665);color:white;padding:64px 0}
.heroGrid{display:grid;grid-template-columns:1.2fr .8fr;gap:26px;align-items:center}
.hero h1{font-size:44px;line-height:1.1;margin:0 0 12px}
.hero p{color:rgba(255,255,255,.92);margin:0 0 14px}
.hero .kicker{display:inline-block;background:rgba(255,255,255,.12);padding:6px 10px;border-radius:999px;font-weight:700;margin-bottom:12px}
.heroCard{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);padding:16px;border-radius:var(--radius)}
.heroCard img{width:100%;border-radius:14px;display:block}
.section{padding:56px 0}
.section.soft{background:var(--soft)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.card{background:var(--card);border:1px solid #e7edf3;border-radius:var(--radius);padding:18px;box-shadow:0 8px 18px rgba(13,40,50,.06)}
.card h3{margin:0 0 8px}
.sub{color:var(--muted)}
.badge{display:inline-block;background:#eef7f7;color:#0d5d5d;border:1px solid #cfe8e8;padding:5px 10px;border-radius:999px;font-weight:700;font-size:12px}
.projectThumb{width:100%;border-radius:14px;display:block;margin:10px 0}
.list{margin:10px 0 0;padding-left:18px}
.footer{background:var(--bg);color:white;padding:34px 0}
.footer p{margin:0;color:rgba(255,255,255,.9)}
.small{font-size:13px;color:var(--muted)}
.form input,.form select,.form textarea{width:100%;padding:11px 12px;border-radius:12px;border:1px solid #dbe6ef;background:white;font:inherit}
.form textarea{min-height:120px}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:860px){
  .heroGrid{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr}
  .hero h1{font-size:36px}
  .menu{gap:12px;flex-wrap:wrap;justify-content:flex-end}
}