/* =============================================
   SERVICES PAGE — css/services.css
============================================= */

/* hero with image overlay */
.svc-hero { padding: 0 !important; min-height: 460px; display:flex; flex-direction:column; justify-content:flex-end; }
.svc-hero-img {
  position:absolute; inset:0; z-index:0;
}
.svc-hero-img img { width:100%; height:100%; object-fit:cover; object-position:top; }
.svc-hero-img::after { content:''; position:absolute; inset:0; background:rgba(11,22,50,.72); }
.svc-hero .page-hero-bc,
.svc-hero h1,
.svc-hero p { position:relative; z-index:1; }
.svc-hero h1,
.svc-hero p,
.svc-hero .page-hero-bc { padding:0 48px; }
.svc-hero h1 { padding-bottom:10px; }
.svc-hero p  { padding-bottom:72px; }
@media(max-width:600px){
  .svc-hero h1,
  .svc-hero p,
  .svc-hero .page-hero-bc { padding-left:20px; padding-right:20px; }
}

/* ── TABS ── */
.svc-tabs {
  display: flex; justify-content:center; gap:10px; flex-wrap:wrap; margin-bottom:52px;
}
.tab-btn {
  font-family:'Barlow Condensed',sans-serif; font-size:.9rem; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase;
  padding:11px 26px; border-radius:100px;
  border:2px solid var(--border); background:var(--white); color:var(--tmid);
  cursor:pointer; transition:all .22s;
}
.tab-btn:hover { border-color:var(--navy); color:var(--navy); }
.tab-btn.active { background:var(--navy); color:#fff; border-color:var(--navy); }

/* ── PANEL INTRO ── */
.panel-intro {
  display:grid; grid-template-columns:1fr 1.1fr; gap:60px; align-items:center;
  margin-bottom:56px; padding:52px;
  background:var(--white); border-radius:var(--r-lg); border:1px solid var(--border);
}
.pi-img { border-radius:var(--r-md); overflow:hidden; height:300px; }
.pi-img img { width:100%; height:100%; object-fit:cover; }
.pi-copy h2 { font-size:clamp(1.9rem,3.5vw,2.8rem); font-weight:900; color:var(--navy); margin-bottom:14px; }
.pi-copy p  { font-size:.97rem; line-height:1.8; color:var(--tmid); font-weight:300; }

/* ── SERVICE CARDS GRID ── */
.svc-cards-grid { grid-template-columns:repeat(3,1fr) !important; gap:22px; }
.svc-panel { grid-template-columns:1fr; }

/* ── RESPONSIVE ── */
@media(max-width:960px){
  .panel-intro { grid-template-columns:1fr; gap:28px; padding:28px; }
  .pi-img { height:220px; }
  .svc-cards-grid { grid-template-columns:1fr 1fr !important; }
}
@media(max-width:600px){
  .svc-cards-grid { grid-template-columns:1fr !important; }
  .svc-tabs { gap:7px; }
  .tab-btn { padding:9px 16px; font-size:.82rem; }
}

.pad-section { padding:96px 0; }