:root{
  --teal:#4791A7;
  --charcoal:#333333;
  --muted:#6E787D;
  --bg:#F6F8F9;
  --light:#FFFFFF;
}

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

.container{width:min(1100px,92%);margin:0 auto}

.header{position:sticky;top:0;z-index:50;background:var(--light);box-shadow:0 1px 0 rgba(0,0,0,.06)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:76px;gap:16px}
.nav{display:flex;gap:22px;align-items:center}
.nav a{color:var(--muted);text-decoration:none;font-weight:600}
.nav .btn{color:#fff;background:var(--teal);padding:.6rem 1rem;border-radius:12px}
.hamburger{display:none;background:none;border:0;font-size:28px}

.hero{position:relative;min-height:68vh;background: center/cover no-repeat var(--bg);background-image:var(--hero)}
.hero .overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05) 0%, rgba(0,0,0,.55) 100%)}
.hero-content{position:relative;z-index:1;padding:18vh 0 14vh;color:#fff;text-shadow:0 8px 28px rgba(0,0,0,.35)}
.hero h1{font-size: clamp(28px, 4vw, 56px);margin:0 0 .5rem}
.hero .sub{opacity:.95;font-weight:600;margin:0 0 1.1rem}
.cta-row{display:flex;gap:14px;flex-wrap:wrap}

.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:12px;padding:.8rem 1.1rem;font-weight:700;text-decoration:none;transition:.2s ease all;border:2px solid transparent}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--teal);color:#fff}
.btn-outline{border-color:#fff;color:#fff;background:transparent}

.services{background:#fff;padding:70px 0}
.services-inner{display:grid;grid-template-columns:1.2fr .8fr;gap:32px;align-items:center}
.services h2{margin:0 0 .4rem;font-size:clamp(22px,3vw,36px)}
.lead{color:var(--muted);margin:.25rem 0 1rem}
.pill-list{display:flex;flex-wrap:wrap;gap:10px;padding:0;margin:0}
.pill-list li{list-style:none;border:1px solid #E5EAED;border-radius:999px;padding:.4rem .8rem;color:var(--muted);background:#F9FBFC}
.services-mark img{width:70%;opacity:.12;display:block;margin-inline:auto}

.work{padding:70px 0}
.work h2{margin:0 0 18px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.grid figure{margin:0;border-radius:16px;overflow:hidden;box-shadow:0 10px 22px rgba(0,0,0,.06)}
.grid img{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:3/2}

.about{padding:56px 0}
.about-inner{display:grid;grid-template-columns:1fr;gap:24px}
.checklist{padding-left:20px}
.checklist li{margin:.4rem 0}

.contact{padding:70px 0;background:#fff}
.contact-card{background:linear-gradient(180deg,#fff, #F4F9FA);border:1px solid #E7EEF0;border-radius:18px;box-shadow:0 14px 32px rgba(0,0,0,.05);padding:28px}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0 20px}
.btn-wide{width:100%}

.footer{background:#F0F3F4;border-top:1px solid #E6EBEE}
.footer-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.muted{color:var(--muted)}

@media (max-width:920px){
  .nav{display:none}
  .hamburger{display:block}
  .nav-open .nav{display:flex;position:absolute;top:76px;left:0;right:0;background:#fff;padding:14px 18px;box-shadow:0 10px 20px rgba(0,0,0,.08);flex-direction:column}
  .services-inner{grid-template-columns:1fr}
  .grid{grid-template-columns:1fr 1fr}
  .contact-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .grid{grid-template-columns:1fr}
}