:root{
  --blue-1:#0f4b7d;
  --blue-2:#1e6fb6;
  --muted:#6b7280;
  --bg:#f7fbff;
  --card:#ffffff;
  --radius:12px;
  font-family: 'Inter', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}
*{box-sizing:border-box}
body{ margin:0; color:#082033; background:linear-gradient(180deg,var(--bg),#ffffff); -webkit-font-smoothing:antialiased; }
a{ color:inherit; text-decoration:none }
.header{ position:fixed; top:0; left:0; right:0; background:rgba(255,255,255,0.9); backdrop-filter: blur(6px); box-shadow:0 6px 18px rgba(15,75,125,0.06); z-index:80 }
.header-inner{ max-width:1100px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 20px; }
.logo{ display:flex; gap:10px; align-items:center; }
.logo .mark{ width:44px; height:44px; border-radius:10px; display:grid; place-items:center; color:white; font-weight:700; background:linear-gradient(135deg,var(--blue-1),var(--blue-2)); }
.nav{ display:flex; gap:14px; align-items:center; }
.nav a{ padding:8px 10px; border-radius:8px; color:var(--muted); font-weight:600 }
.nav a:hover{ background:rgba(30,111,182,0.06); color:var(--blue-1) }
.btn-primary{ background:var(--blue-2); color:white; padding:10px 14px; border-radius:10px; border:0; cursor:pointer; font-weight:700 }
.hero{ max-width:1100px; margin:110px auto 20px; display:grid; grid-template-columns:1fr 440px; gap:26px; align-items:center; padding:22px; }
.hero-card{ padding:26px; border-radius:14px; background:linear-gradient(180deg,#f8fbfd,white); box-shadow:0 14px 40px rgba(9,30,45,0.06); }
.kicker{ color:var(--blue-1); font-weight:700; font-size:14px }
h1{ margin:6px 0 12px; font-size:30px; color:#07243a; line-height:1.05 }
.lead{ color:var(--muted); margin-bottom:14px }
.hero-right img{ width:100%; height:100%; object-fit:cover; border-radius:12px; display:block }
.services-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; }
.card{ background:var(--card); padding:16px; border-radius:12px; box-shadow:0 8px 20px rgba(12,30,45,0.04); display:flex; flex-direction:column }
.icon{ width:54px;height:54px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(180deg,#eef7ff,#f6fbff); color:var(--blue-2); font-weight:700 }
.gallery{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px }
.gallery img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:10px; display:block }
.container{ max-width:1100px; margin:26px auto; padding:0 20px }
footer{ text-align:center; color:var(--muted); padding:20px 0; margin-top:30px }
.map{ border-radius:12px; overflow:hidden; box-shadow:0 8px 20px rgba(12,30,45,0.04); }
.book-form{ max-width:760px; margin:0 auto; background:white; padding:18px; border-radius:12px; box-shadow:0 12px 30px rgba(9,30,45,0.06) }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:12px }
input,textarea,select{ padding:10px 12px; border-radius:10px; border:1px solid #e6eef7; width:100% }
.whatsapp-float{ position:fixed; right:18px; bottom:18px; z-index:90 }
.wa-btn{ background:#25D366; color:white; border-radius:50px; padding:12px 16px; display:inline-flex; gap:8px; align-items:center; box-shadow:0 10px 30px rgba(37,211,102,0.18); text-decoration:none; font-weight:700 }
@media(max-width:980px){ .hero{ grid-template-columns:1fr; margin:90px auto 20px } .nav{ display:none } .header-inner{ padding:10px } }