.cta-band .eyebrow{
  color:var(--nav-muted); margin-bottom:18px; display:block;
  font-weight:600; font-size:.72rem; letter-spacing:.2em; text-transform:uppercase;
}
.cta-band h2{
  color:#fff; font-weight:400; font-size:clamp(1.75rem,2.6vw,2.25rem);
  line-height:1.2; letter-spacing:-.015em; max-width:18ch; margin:0 auto;
}
.cta-band .sub{
  color:#cfd3d8; font-weight:300; margin-top:18px; max-width:46ch;
  margin-left:auto; margin-right:auto; font-size:1rem; line-height:1.55;
}
.cta-band .actions{
  margin-top:32px; display:flex; gap:24px;
  justify-content:center; align-items:center; flex-wrap:wrap;
}
.cta-band .tlink{color:#fff}
.cta-band .tlink:hover{text-decoration-color:#fff}

.page-head{ padding:24px 0 56px; text-align:center; }
.page-head .eyebrow{ font-weight:600; font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); margin-bottom:18px; }
.page-head h1{ font-family:var(--f); font-weight:600; font-size:clamp(2rem,3.2vw,2.5rem); line-height:1.1; letter-spacing:-.02em; color:var(--heading); max-width:24ch; margin:0 auto; }
.page-head .lead{ font-weight:300; font-size:1.0625rem; line-height:1.7; color:var(--body); max-width:70ch; margin:22px auto 0; text-wrap:pretty; }
.svc-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.svc-card{ background:#fff; border:1px solid var(--hairline); border-radius:var(--r-xl); padding:36px 32px 32px; display:flex; flex-direction:column; gap:18px; }
.svc-card .meta{ font-weight:600; font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); }
.svc-card h2{ font-family:var(--f); font-weight:600; font-size:1.375rem; line-height:1.15; letter-spacing:-.01em; color:var(--heading); }
.svc-card p{ font-size:.95rem; line-height:1.7; color:var(--body); font-weight:300; }
.svc-card .actions{ margin-top:auto; display:flex; flex-direction:column; gap:10px; padding-top:8px; }
.svc-card .actions .btn{ width:100%; }
.feature-box{ background:#fff; border:1px solid var(--hairline); border-radius:var(--r-xl); padding:32px 30px; display:flex; flex-direction:column; gap:14px; }
.feature-box .meta{ font-weight:600; font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); }
.feature-box .meta b{ color:var(--heading); font-weight:600; letter-spacing:.18em; }
.feature-box h2{ font-family:var(--f); font-weight:600; font-size:1.3rem; line-height:1.2; letter-spacing:-.01em; color:var(--heading); }
.feature-box h3{ font-family:var(--f); font-weight:600; font-size:.92rem; color:var(--heading); margin-top:6px; }
.feature-box p{ font-size:.94rem; line-height:1.7; color:var(--body); font-weight:300; }
.feature-box ul{ list-style:none; padding:0; display:grid; gap:8px; }
.feature-box ul li{ position:relative; padding-left:18px; font-size:.92rem; color:var(--body); line-height:1.55; font-weight:300; }
.feature-box ul li::before{ content:""; position:absolute; left:0; top:.7em; width:6px; height:1px; background:var(--wellness); }
.feature-box .actions{ margin-top:auto; padding-top:14px; display:flex; flex-direction:column; gap:10px; }
.feature-box .actions .btn{ width:100%; }
.detail-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; align-items:start; }
.detail-grid .feature-box{ padding:28px 26px; }
.detail-grid .feature-box h2{ font-size:1.2rem; }
.detail-grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.more-band{ padding:64px 0 96px; }
.more-band .label{ font-size:.72rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); text-align:center; margin-bottom:24px; }
.more-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
@media (max-width:1100px){ .svc-grid{ grid-template-columns:1fr; } .detail-grid{ grid-template-columns:repeat(2,1fr); } .more-grid{ grid-template-columns:1fr; gap:16px; } .detail-grid-2{ grid-template-columns:1fr; } }
@media (max-width:700px){ .detail-grid{ grid-template-columns:1fr; } }

/* ── Media components — service pages (consistent set) ─────── */
.media-feature{ display:grid; grid-template-columns:1.04fr .96fr; gap:52px; align-items:center; }
.media-feature .shot{ border-radius:var(--r-xl); overflow:hidden; aspect-ratio:4/3; background:#1c1f22; box-shadow:var(--shadow-product); }
.media-feature .shot img{ width:100%; height:100%; object-fit:cover; display:block; }
.media-feature .copy .eyebrow{ font-weight:600; font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); margin-bottom:16px; }
.media-feature .copy h2{ font-family:var(--f); font-weight:600; font-size:clamp(1.5rem,2.2vw,1.875rem); line-height:1.15; letter-spacing:-.015em; color:var(--heading); }
.media-feature .copy p{ font-size:1.0625rem; line-height:1.7; color:var(--body); font-weight:300; margin-top:16px; }
.media-feature .copy ul{ list-style:none; padding:0; margin-top:22px; display:grid; gap:11px; }
.media-feature .copy ul li{ position:relative; padding-left:22px; font-size:.98rem; color:var(--body); font-weight:300; line-height:1.5; }
.media-feature .copy ul li::before{ content:""; position:absolute; left:0; top:.62em; width:9px; height:1px; background:var(--wellness); }
.media-feature .copy .actions{ margin-top:26px; display:flex; gap:14px; flex-wrap:wrap; }

.media-banner{ position:relative; border-radius:var(--r-xl); overflow:hidden; aspect-ratio:21/8; background:#1c1f22; box-shadow:var(--shadow-product); }
.media-banner img{ width:100%; height:100%; object-fit:cover; display:block; }
.media-banner .cap{ position:absolute; left:0; right:0; bottom:0; padding:30px 34px; color:#fff; background:linear-gradient(to top, rgba(18,22,26,.82), rgba(18,22,26,.18) 60%, rgba(18,22,26,0)); }
.media-banner .cap .k{ font-weight:600; font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.7); display:block; margin-bottom:8px; }
.media-banner .cap p{ font-size:1.0625rem; line-height:1.5; font-weight:300; max-width:46ch; margin:0; }
.media-banner .cap p b{ font-weight:600; }

@media (max-width:900px){
  .media-feature{ grid-template-columns:1fr; gap:28px; }
  .media-banner{ aspect-ratio:16/10; }
  .media-banner .cap{ padding:22px 22px; }
}

/* ── Photo-topped service cards ─────────────────────────────── */
.svc-card{ padding:0; gap:0; overflow:hidden; transition:transform .25s, box-shadow .25s; }
.svc-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-product); }
.svc-card .photo{ aspect-ratio:16/10; overflow:hidden; background:#222; }
.svc-card .photo img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .55s; }
.svc-card:hover .photo img{ transform:scale(1.04); }
.svc-card .body{ padding:32px 32px 34px; display:flex; flex-direction:column; gap:18px; flex:1; }
.svc-card .body .actions{ margin-top:auto; }

/* ── Services batch fixes (whole-card link · outline buttons · no dividers) ── */

/* #3 — drop the global section->section hairline (brand.css: section + section
   { border-top }). Section padding keeps the vertical rhythm. */
section + section{ border-top:0; }

/* #4 — keep the eyebrow centred above the H1. */
.page-head .eyebrow{ text-align:center; max-width:none; margin-left:auto; margin-right:auto; }

/* #2 — outline "Learn more" buttons; wellness lane accent fills on hover. */
.btn-ghost{ background:transparent; color:var(--heading); border:1px solid var(--border); }
.btn-ghost:hover{ background:var(--wellness-light); border-color:var(--wellness); color:var(--wellness-text); }

/* #1 — whole service card clickable via a stretched link. Real inner links
   (e.g. "Book a free call") sit above it; the "Learn more" span sits beneath
   so clicking it follows the card link. */
.svc-card{ position:relative; cursor:pointer; }
.svc-card .svc-card-link{ position:absolute; inset:0; z-index:1; border-radius:inherit; }
.svc-card .svc-card-link:focus-visible{ outline:2px solid var(--wellness); outline-offset:3px; }
.svc-card .actions a{ position:relative; z-index:2; }

/* ── Foot CTA — three actions on the dark band (consultation / garden / contact) ── */
.svc-foot-cta .btn{ min-height:48px; padding-left:1.25rem; padding-right:1.25rem; }
/* Primary = CTA orange (the band is dark, so the brand orange leads). */
.cta-band .btn-cta{ background:var(--cta); color:#fff; }
.cta-band .btn-cta:hover{ background:var(--cta-hover); }
/* Ghost needs a light outline to read on the dark band. */
.cta-band .btn-ghost{ background:transparent; color:#fff; border-color:rgba(255,255,255,.5); }
.cta-band .btn-ghost:hover{ background:rgba(255,255,255,.1); border-color:#fff; color:#fff; }
@media (max-width:600px){
  .svc-foot-cta{ flex-direction:column; gap:12px; }
  .svc-foot-cta .btn{ width:100%; }
}