
:root{
  --brand:#0b3a5d;
  --accent:#1c7fc2;
  --ink:#1b2733;
  --bg:#ffffff;
  --muted:#5a7184;
  --card:#f4f7f9;
  --radius:14px;
  --shadow:0 10px 30px rgba(9,34,53,.15);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--accent);text-decoration:none}
.container{max-width:1100px;margin:0 auto;padding:0 20px}
.nav{
  position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #e7eef3
}
.nav .inner{display:flex;align-items:center;justify-content:space-between;padding:10px 0}
.brand{display:flex;align-items:center;gap:12px}
.brand img{height:38px}
.brand .title{font-weight:800;color:var(--brand);letter-spacing:.2px}
.cta{display:inline-flex;align-items:center;gap:10px;background:var(--accent);color:#fff;padding:12px 18px;border-radius:999px;box-shadow:var(--shadow);font-weight:700}
.hero{
  position:relative;min-height:72vh;display:grid;place-items:center;text-align:center;color:#fff;
  background:url("./assets/img/hero.jpg") center/cover no-repeat
}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.55))}
.hero .content{position:relative;z-index:1;padding:30px}
.hero h1{font-size:clamp(32px,5vw,56px);margin:0 0 12px}
.hero p{font-size:clamp(16px,2.2vw,22px);margin:0 0 26px;opacity:.95}
.btn{display:inline-block;border:2px solid #fff;padding:12px 18px;border-radius:12px;color:#fff;font-weight:700}
.section{padding:70px 0}
.grid{display:grid;gap:24px}
.services{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:var(--card);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.card h3{margin:0 0 8px}
.badge{display:inline-block;background:#e7f3ff;color:#0b3a5d;font-weight:700;padding:6px 10px;border-radius:999px;font-size:12px;margin-bottom:8px}
.two-col{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));align-items:center}
ul.check{padding-left:0;list-style:none;margin:0}
ul.check li{margin:10px 0;padding-left:28px;position:relative}
ul.check li::before{content:"✓";position:absolute;left:0;top:0;color:var(--accent);font-weight:900}
.ba-wrap{position:relative;max-width:900px;margin:0 auto}
.ba{position:relative;overflow:hidden;border-radius:16px;box-shadow:var(--shadow)}
.ba img{display:block;width:100%;height:auto}
.ba .after{position:absolute;inset:0;width:50%;overflow:hidden;border-right:2px solid #fff}
.ba .after img{position:absolute;left:0;top:0;height:100%;width:200%}
.ba .handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:58px;height:58px;border-radius:50%;background:rgba(27,39,51,.9);display:grid;place-items:center;color:#fff;font-weight:900;box-shadow:var(--shadow);cursor:ew-resize
}
.gallery{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.contact{background:linear-gradient(180deg,#f8fbfe,#eef5fb);border-top:1px solid #e6eef6}
.info{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.info .dot{font-weight:800;color:var(--brand)}
.footer{padding:26px 0;color:#4c5b68;border-top:1px solid #e6eef6;background:#fafcfe;text-align:center}
.small{font-size:12px;color:#6a7a87}
.tel{white-space:nowrap}
