/* =========================================================
   Service detail pages — mascot-led redesign.
   Loads AFTER style.css. Warm theme; Bricolage + DM Sans
   must be linked in the template head.
   ========================================================= */

/* ---------- Hero: copy + per-service mascot scene ---------- */
.svc-hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#ffffff 0%,#faf8f5 100%);border-bottom:1px solid #efe9e1}
.svc-hero__inner{max-width:1180px;margin:0 auto;padding:40px 40px 52px;display:grid;grid-template-columns:1.02fr .98fr;gap:40px;align-items:center}
.svc-back{display:inline-block;color:#2563eb;text-decoration:none;font-weight:600;font-size:.9rem;margin-bottom:24px}
.svc-back:hover{text-decoration:underline}
.svc-hero__eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;font-weight:700;color:#2563eb;margin:0 0 14px}
.svc-hero__title{font-family:'Bricolage Grotesque','DM Sans',sans-serif;font-size:clamp(2.5rem,5vw,4rem);font-weight:700;line-height:1.03;letter-spacing:-.025em;color:#18130e;margin:0 0 18px}
.svc-hero__sub{font-size:1.18rem;line-height:1.6;color:#3d342c;max-width:34ch;margin:0}
.svc-hero__actions{display:flex;gap:14px 22px;flex-wrap:wrap;align-items:center;margin-top:30px}
.svc-hero__link{font-weight:700;color:#2563eb;text-decoration:none}
.svc-hero__link:hover{text-decoration:underline}
.svc-hero__art{position:relative;display:flex;justify-content:center;align-items:center;min-height:330px}
.svc-hero__art::before{content:"";position:absolute;width:80%;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at 55% 45%,rgba(37,99,235,.20),rgba(124,58,237,.12) 48%,rgba(20,184,166,.07) 70%,transparent 76%)}
.svc-hero__art img{position:relative;width:100%;max-width:560px;height:auto;filter:drop-shadow(0 24px 40px rgba(24,19,14,.16))}
@media(max-width:900px){
  .svc-hero__inner{grid-template-columns:1fr;gap:6px;padding:28px 20px 32px}
  .svc-hero__sub{max-width:none}
  .svc-hero__art{min-height:0;margin-top:10px}
  .svc-hero__art img{max-width:380px}
}

/* ---------- Band: text + a mascot pose filling the side ---------- */
.svc-band__inner{max-width:1180px;margin:0 auto;padding:0 40px;display:grid;grid-template-columns:1.4fr .6fr;gap:48px;align-items:center}
.svc-band__art{display:flex;justify-content:center}
.svc-band__art img{width:100%;max-width:300px;height:auto;filter:drop-shadow(0 16px 28px rgba(24,19,14,.14))}
@media(max-width:820px){
  .svc-band__inner{grid-template-columns:1fr;padding:0 20px}
  .svc-band__art{display:none}
}
/* large mascot variant — display at native resolution (no upscaling) */
.svc-band--lg .svc-band__inner{grid-template-columns:minmax(0,1fr) minmax(0,420px)}
.svc-band--lg .svc-band__art img{max-width:400px}
/* mobile: the --lg variant above is higher-specificity than the max-width:820px
   single-column rule, so it re-imposed 2 columns on phones and collapsed the text
   column to 0 (one word per line). Re-assert single column with matching specificity,
   placed AFTER the --lg rule so source order wins. */
@media(max-width:820px){
  .svc-band--lg .svc-band__inner{grid-template-columns:1fr}
}

/* ---------- Closing CTA: waving mascot + invitation ---------- */
.svc-cta{padding:8px 40px 64px}
.svc-cta__inner{max-width:1180px;margin:0 auto}
.svc-invite{display:grid;grid-template-columns:.72fr 1.28fr;align-items:stretch;background:#fff;border:1px solid #e8e2da;border-radius:24px;overflow:hidden;box-shadow:0 14px 40px rgba(0,0,0,.06)}
.svc-invite__photo{position:relative;min-height:340px}
.svc-invite__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 22%}
.svc-invite__eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.78rem;font-weight:700;color:#2563eb;margin:0 0 12px}
.svc-invite__title{font-family:'Bricolage Grotesque','DM Sans',sans-serif;font-weight:700;font-size:clamp(1.7rem,2.9vw,2.4rem);line-height:1.08;letter-spacing:-.02em;color:#18130e;margin:0}
.svc-invite__title em{font-style:normal;color:#2563eb}
.svc-invite__body{padding:clamp(2.2rem,3.5vw,3.4rem)}
.svc-invite__body>p{color:#3d342c;line-height:1.7;font-size:1.06rem;margin:1rem 0 1.7rem;max-width:52ch}
.svc-invite__actions{display:flex;align-items:center;gap:1rem 1.6rem;flex-wrap:wrap}
.svc-invite__tel{color:#6b5c52;font-size:.98rem;text-decoration:none;border-bottom:1px solid #e8e2da;padding-bottom:2px;transition:color .2s,border-color .2s}
.svc-invite__tel:hover{color:#2563eb;border-color:#93c5fd}
.svc-invite__sign{display:flex;align-items:center;gap:.8rem;margin-top:1.8rem}
.svc-invite__sign i{width:34px;height:1px;background:#2563eb;flex:none}
.svc-invite__sign b{font-weight:700;font-size:1.1rem;color:#18130e}
.svc-invite__sign small{font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:#6b5c52}
@media(max-width:820px){
  .svc-cta{padding:8px 20px 48px}
  .svc-invite{grid-template-columns:1fr}
  .svc-invite__photo{min-height:260px}
  .svc-invite__body{padding:26px 22px 30px}
}