/* ============================================================
   SERVICE PAGES — imagery for the individual treatment pages
   Uses the site tokens: --bg --bg-alt --brand --accent --ink
   --ink-soft --line --r-lg --r-md
   ============================================================ */

.svc-media,
.svc-fig,
.svc-pair{
  --s-serif:'Cormorant Garamond',serif;
  --s-sans:'Manrope','Inter',sans-serif;
  --s-ease:cubic-bezier(.16,1,.3,1);
}

/* ---------- wide plate under the page heading ---------- */
.svc-media{
  position:relative; margin:0 0 clamp(2rem,4vh,3rem);
  border-radius:var(--r-lg,32px); overflow:hidden;
  border:1px solid var(--line);
  box-shadow:0 40px 80px -44px rgba(11,91,83,.5);
}
.svc-media img{
  display:block; width:100%; height:100%; object-fit:cover;
  aspect-ratio:21/9;
}
.svc-media figcaption{
  position:absolute; left:0; right:0; bottom:0;
  display:flex; align-items:baseline; gap:12px; flex-wrap:wrap;
  padding:clamp(1.5rem,3vw,2.4rem) clamp(1.25rem,2.5vw,2.2rem) clamp(1rem,2vw,1.5rem);
  background:linear-gradient(180deg, transparent, rgba(14,27,26,.82));
  color:#F6F3EC;
  font-family:var(--s-sans); font-size:10px; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase;
}
.svc-media figcaption b{
  font-family:var(--s-serif); font-weight:600; font-size:20px;
  letter-spacing:.01em; text-transform:none; color:#fff;
}
.svc-media figcaption span{ color:rgba(246,243,236,.72); }

/* ---------- figure inside the article ---------- */
.svc-fig{
  margin:clamp(2rem,4vh,2.8rem) 0;
  border-radius:var(--r-md,20px); overflow:hidden;
  border:1px solid var(--line); background:var(--bg-alt);
}
.svc-fig img{ display:block; width:100%; aspect-ratio:16/9; object-fit:cover; }
.svc-fig figcaption{
  padding:14px 18px;
  font-family:var(--s-sans); font-size:12px; line-height:1.7; color:var(--ink-soft);
  border-top:1px solid var(--line);
}
.svc-fig figcaption b{ color:var(--brand); font-weight:700; }

/* ---------- two images side by side ---------- */
.svc-pair{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(12px,1.5vw,20px);
  margin:clamp(2rem,4vh,2.8rem) 0;
}
.svc-pair figure{ margin:0; border-radius:var(--r-md,20px); overflow:hidden; border:1px solid var(--line); }
.svc-pair img{ display:block; width:100%; aspect-ratio:4/3; object-fit:cover; }
.svc-pair figcaption{
  padding:11px 14px; background:var(--bg-alt);
  font-family:var(--s-sans); font-size:11px; line-height:1.6; color:var(--ink-soft);
  border-top:1px solid var(--line);
}

@media (max-width:640px){
  .svc-media img{ aspect-ratio:16/10; }
  .svc-media figcaption b{ font-size:16px; }
  .svc-pair{ grid-template-columns:1fr; }
}

@media (prefers-reduced-motion:reduce){
  .svc-media,.svc-fig,.svc-pair figure{ transition:none; }
}

/* ---------- local / NAP block ---------- */
.svc-local{
  margin:1.5rem 0 0; padding:clamp(1.4rem,2.4vw,2rem);
  border:1px solid var(--line); border-radius:var(--r-md,20px);
  background:var(--bg-alt);
}
.svc-local > p{ margin:0 0 1.2rem; }
.svc-local b{ color:var(--brand); font-weight:700; }
.svc-local-facts{ list-style:none; margin:0 0 1.2rem; padding:0; }
.svc-local-facts li{
  display:grid; grid-template-columns:170px 1fr; gap:14px;
  padding:11px 0; border-top:1px solid var(--line);
}
.svc-local-facts li:last-child{ border-bottom:1px solid var(--line); }
.svc-local-facts b{
  font-family:'Manrope','Inter',sans-serif;
  font-size:9.5px; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  color:var(--brand); padding-top:3px;
}
.svc-local-facts span{ font-size:14px; line-height:1.7; color:var(--ink-soft); }
.svc-local-facts a{ color:var(--brand); font-weight:600; }
.svc-local-links{ margin:0; font-size:14px; line-height:1.8; color:var(--ink-soft); }
.svc-local-links a{ color:var(--brand); font-weight:600; }
@media (max-width:640px){
  .svc-local-facts li{ grid-template-columns:1fr; gap:3px; }
}

/* ---------- article byline ---------- */
.article-meta{
  margin:1.1rem 0 0; font-family:'Manrope','Inter',sans-serif;
  font-size:11.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-soft); line-height:1.9;
}
.article-meta a{ color:var(--brand); text-decoration:none; border-bottom:1px solid rgba(11,91,83,.3); }
.article-meta a:hover{ border-bottom-color:var(--brand); }
.inner-article-body h3{ margin-top:1.8rem; }
