/* Template: physiotherapy clinic. Mood: energetic, encouraging, clear. Health-sector rules respected (no reviews/claims). */
:root{
  --font-head:"Commissioner",system-ui,sans-serif; --font-body:"Commissioner",system-ui,sans-serif;
  --bg:#F3F7F2; --surface:#FFFFFF; --surface-2:#E3EFE6; --text:#0E2A20; --muted:#4B6157; --line:#D5E4D9;
  --brand:#1C6B47; --brand-ink:#fff; --accent:#8BE0B8; --deep:#0E2A20;
  --radius:26px; --radius-sm:16px; --head-weight:800; --head-tracking:-.04em;
  --shadow:0 20px 50px -24px rgba(14,42,32,.35);
}
.eyebrow{font:800 .76rem var(--font-body);letter-spacing:.12em;color:var(--brand)}
.btn{border-radius:999px;font-weight:800}
.btn--mint{background:var(--accent);border-color:var(--accent);color:var(--deep)}
.section{padding:100px 0}
@media (max-width:700px){.section{padding:64px 0}}
.site-header{background:rgba(243,247,242,.9)}
.brand svg{color:var(--brand)}
.nav a{color:var(--text);font-weight:700}
.nav a[aria-current=page]{color:var(--brand)}

/* Hero */
.p-hero2{padding:56px 0 40px;position:relative;overflow:hidden}
.p-hero2 .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.p-hero2 h1{font-size:clamp(2.8rem,6.4vw,5.4rem);line-height:.98}
.p-hero2 .lead{font-size:1.2rem}
.blob{position:relative}
.blob img{width:100%;aspect-ratio:1/1.05;object-fit:cover;border-radius:46% 54% 40% 60% / 52% 40% 60% 48%}
.blob .chip{position:absolute;background:var(--surface);border-radius:999px;padding:10px 16px;box-shadow:var(--shadow);font-weight:800;font-size:.9rem;display:flex;align-items:center;gap:8px}
.blob .chip i{width:10px;height:10px;border-radius:50%;background:var(--brand)}
.blob .c1{left:-14px;top:18%}.blob .c2{right:-10px;bottom:16%}
.stats3{display:flex;gap:28px;flex-wrap:wrap;margin-top:28px}
.stats3 b{display:block;font:800 2.2rem/1 var(--font-head);letter-spacing:-.05em;color:var(--brand)}
.stats3 span{font-size:.85rem;color:var(--muted);font-weight:600}
@media (max-width:900px){.p-hero2 .wrap{grid-template-columns:1fr}.blob .c1{left:8px}.blob .c2{right:8px}}

/* Body map */
.pain{background:var(--deep);color:#E7F2EC;border-radius:36px;padding:48px;display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center}
.pain h2{color:#fff}
.pain .lead{color:#A9C4B6}
.body{position:relative;max-width:300px;margin:0 auto}
.body svg{width:100%;height:auto;display:block}
.body .fig{fill:#1E4535;stroke:#2F5E49;stroke-width:2}
.spot{position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;border:0;background:transparent;cursor:pointer;display:grid;place-items:center;padding:0}
.spot::before{content:"";width:18px;height:18px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 rgba(139,224,184,.6);animation:ping 2s infinite}
.spot[aria-pressed=true]::before{background:#fff;box-shadow:0 0 0 6px rgba(139,224,184,.5);animation:none}
.spot:focus-visible{outline:3px solid #fff;outline-offset:2px}
@keyframes ping{70%{box-shadow:0 0 0 14px rgba(139,224,184,0)}100%{box-shadow:0 0 0 0 rgba(139,224,184,0)}}
.pain-info{background:#163A2C;border-radius:var(--radius);padding:28px;min-height:360px}
.pain-info h3{color:#fff;font-size:1.7rem;margin-bottom:.3em}
.pain-info .k{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 18px}
.pain-info .k span{background:rgba(139,224,184,.14);color:var(--accent);border-radius:999px;padding:.35em .9em;font-weight:700;font-size:.85rem}
.pain-info h4{color:#fff;font-size:.95rem;margin:16px 0 6px}
.pain-info ul{margin:0;padding-left:1.1em;color:#C9DDD2}
.pain-info .note{font-size:.8rem;color:#8FAE9F;margin-top:16px}
@media (max-width:900px){.pain{grid-template-columns:1fr;padding:28px}}
@media (prefers-reduced-motion:reduce){.spot::before{animation:none}}

/* Treatments + prices */
.tx{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tx div{background:var(--surface);border-radius:var(--radius);padding:26px;border:1px solid var(--line)}
.tx h3{font-size:1.2rem}
.tx p{color:var(--muted);margin:0 0 14px;font-size:.95rem}
.tx b{font:800 1.6rem var(--font-head);color:var(--brand);letter-spacing:-.03em}
.tx small{color:var(--muted);font-weight:600}
@media (max-width:900px){.tx{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.tx{grid-template-columns:1fr}}

/* First visit */
.fv{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:f}
.fv div{counter-increment:f;background:var(--surface-2);border-radius:var(--radius);padding:24px}
.fv div::before{content:counter(f);display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--brand);color:#fff;font-weight:800;margin-bottom:14px}
.fv p{color:var(--muted);margin:0;font-size:.95rem}
@media (max-width:860px){.fv{grid-template-columns:1fr 1fr}}

/* Team */
.team3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.team3 div{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:24px;display:grid;grid-template-columns:64px 1fr;gap:16px;align-items:center}
.team3 .av{width:64px;height:64px;border-radius:50%;background:var(--surface-2);display:grid;place-items:center;font:800 1.4rem var(--font-head);color:var(--brand)}
.team3 small{display:block;color:var(--muted)}
@media (max-width:860px){.team3{grid-template-columns:1fr}}

/* Page head */
.page-head{padding:72px 0 48px}
.page-head h1{font-size:clamp(2.4rem,5.4vw,4.2rem);max-width:16ch}

/* Package calculator */
.pkg{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:32px;padding:40px}
.pkg input[type=range]{width:100%;accent-color:var(--brand)}
.pkg .n{font:800 3rem/1 var(--font-head);letter-spacing:-.05em}
.pkg-out{background:var(--deep);color:#E7F2EC;border-radius:var(--radius);padding:28px}
.pkg-out b{display:block;font:800 2.6rem/1 var(--font-head);color:#fff;letter-spacing:-.04em}
.pkg-out .save{display:inline-block;margin-top:12px;background:var(--accent);color:var(--deep);border-radius:999px;padding:.35em .9em;font-weight:800}
.plist{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:8px 28px}
@media (max-width:860px){.pkg{grid-template-columns:1fr;padding:24px}}

/* Booking */
.pb{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,1fr);gap:28px;align-items:start;padding-bottom:100px}
.pb .card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px;margin-bottom:18px}
.pb .card h2{font-size:1.25rem;margin-bottom:14px}
.areas2{display:flex;flex-wrap:wrap;gap:8px}
.areas2 label{cursor:pointer}
.areas2 input{position:absolute;opacity:0}
.areas2 span{display:inline-block;border:1.5px solid var(--line);border-radius:999px;padding:.5em 1em;font-weight:700;font-size:.92rem;background:var(--surface)}
.areas2 label:has(input:checked) span{background:var(--brand);border-color:var(--brand);color:#fff}
.areas2 label:has(input:focus-visible) span{outline:3px solid var(--brand);outline-offset:2px}
.pbsum{position:sticky;top:92px;background:var(--deep);color:#E7F2EC;border-radius:var(--radius);padding:28px}
.pbsum .when{font:800 1.5rem var(--font-head);color:#fff;margin:.2em 0}
.pbsum .form{grid-template-columns:1fr;margin-top:14px}
.pbsum .form label{color:#E7F2EC}
.pbsum .btn{width:100%}
.pbdone{display:none}.pbdone.show{display:block}
@media (max-width:960px){.pb{grid-template-columns:1fr}.pbsum{position:static}}

.site-footer{background:var(--deep)}
.site-footer h2{text-transform:none;letter-spacing:-.01em;font-size:1.1rem}
