/* ==========================================================================
   UpPlus v2 — the design system of the Oct 2026 redesign.

   The home page introduced it (its styles are still inline in index.php);
   every inner page redesigned since links this file instead, through
   app/Views/v2/head.php. Everything is scoped under .v2 so it cannot reach
   the shared header and footer, which carry their own styles.

   Pieces: tokens, type, buttons, sections, the dissolving-photo hero, an
   editorial split, a dark band with chips, anatomy cards, a trust band, FAQ
   and the booking section.
   ========================================================================== */

.v2 {
    --teal: #23A39F;
    --teal-deep: #0F7C78;      /* white on this is ~4.9:1; brand teal is 3.1:1 */
    --teal-deeper: #0B605D;
    --ink: #14342F;
    --muted: #55696A;
    --mint: #EEF7F6;
    --sand: #FAF8F4;
    --line: #DCE9E7;
    --lime: #A9DE5F;
    color: var(--ink);
    font-family: "DM Sans", system-ui, sans-serif;
    font-size: 17px;
    line-height: 1.65;
    background: var(--mint);
}
.v2 *, .v2 *::before, .v2 *::after { box-sizing: border-box; }
.v2 img { max-width: 100%; display: block; }
.v2 svg { width: 1em; height: 1em; flex: none; }
.v2 p { margin: 0 0 1em; }
.v2 h1, .v2 h2, .v2 h3 {
    font-family: "Archivo", sans-serif;
    color: var(--ink);
    letter-spacing: -0.015em;
    line-height: 1.14;
    margin: 0;
    text-transform: none;
}
/* The theme forces "main h2" sizes with !important; these win it back. */
.v2 h2.v2-h2 { font-size: clamp(1.7rem, 4.2vw, 2.4rem) !important; font-weight: 800; margin-bottom: 12px; }
.v2 h3 { font-size: 1.2rem !important; font-weight: 700; }

.v2-wrap { max-width: 1160px; margin: 0 auto; padding: 0 16px; }
.v2-section { padding: 56px 0; background: #fff; }
.v2-section--mint { background: var(--mint); }
.v2-section--sand { background: var(--sand); }

.v2-kicker {
    display: inline-block;
    margin-bottom: 12px;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--teal-deep);
}
.v2-intro { color: var(--muted); max-width: 660px; margin-bottom: 28px; font-size: 1.05rem; }
.v2 a { color: var(--teal-deep); }
/* A plain link inside a sentence is underlined, so it is not told apart by
   colour alone (WCAG 1.4.1; Lighthouse "link-in-text-block"). Buttons and
   other classed links are left alone. */
.v2 p a:not([class]) { text-decoration: underline; text-underline-offset: 3px; }

/* Buttons: one solid, one outline; equal widths side by side on phones. */
.v2-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.v2-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 52px; padding: 0 26px; border-radius: 10px;
    font-weight: 700; font-size: 1.02rem; text-decoration: none; white-space: nowrap;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
    flex: 1 1 150px;
}
.v2-btn--solid { background: var(--teal-deep); color: #fff !important; border: 2px solid var(--teal-deep); }
.v2-btn--solid:hover { background: var(--teal-deeper); border-color: var(--teal-deeper); }
.v2-btn--line { background: #fff; color: var(--teal-deep) !important; border: 2px solid var(--line); }
.v2-btn--line:hover { border-color: var(--teal-deep); }
.v2 a:focus-visible, .v2 summary:focus-visible, .v2 button:focus-visible { outline: 3px solid var(--lime); outline-offset: 3px; }
@media (min-width: 640px) { .v2-btn { flex: 0 0 auto; } }
@media (max-width: 420px) { .v2-btn { padding: 0 14px; gap: 6px; } }

/* ── Breadcrumb ── */
.v2-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; list-style: none; margin: -8px 0 6px; padding: 0; font-size: .88rem; color: var(--muted); }
.v2-crumbs li + li::before { content: "/"; margin-right: 6px; color: var(--line); }
.v2-crumbs a { color: var(--muted); text-decoration: none; display: inline-flex; min-height: 44px; align-items: center; }
.v2-crumbs a:hover { color: var(--teal-deep); text-decoration: underline; }

/* ── Hero: the photo dissolves into a blurred, tinted copy of itself ── */
.v2-hero { position: relative; overflow: hidden; isolation: isolate; padding: 28px 0 40px; background: var(--mint); }
.v2-hero-bg {
    position: absolute; inset: -60px; z-index: -2;
    background-size: cover; background-position: center;
    filter: blur(38px) saturate(1.25); opacity: .85; transform: scale(1.1);
}
.v2-hero::before {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background:
        radial-gradient(120% 90% at 0% 0%, rgba(246,251,250,.97) 0%, rgba(246,251,250,.9) 45%, rgba(246,251,250,.55) 75%, rgba(35,163,159,.18) 100%),
        linear-gradient(180deg, rgba(255,255,255,0) 70%, #fff 100%);
}
.v2-hero-grid { display: grid; gap: 24px; }
.v2-hero h1 { font-size: clamp(2rem, 6.4vw, 3.3rem); font-weight: 800; margin-bottom: 14px; }
.v2-hero h1 em { font-style: normal; color: var(--teal-deep); }
.v2-lead { font-size: 1.1rem; color: #33504C; max-width: 560px; margin-bottom: 20px; }
.v2-hero-photo { margin: 0 -16px; }
.v2-hero-photo img {
    width: 100%; height: 320px; object-fit: cover;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 78%, transparent 100%);
            mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 78%, transparent 100%);
}
.v2-rating { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px; min-height: 44px; margin-bottom: 18px; color: var(--ink) !important; text-decoration: none; font-weight: 600; }
.v2-rating .v2-stars { display: inline-flex; gap: 2px; color: #F5A623; font-size: 1.1rem; }
.v2-rating span.v2-rating-count { color: var(--muted); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }

/* ── Editorial split: a large statement beside the body text ── */
.v2-split { display: grid; gap: 22px; }
.v2-statement {
    font-family: "Archivo", sans-serif; font-weight: 800; letter-spacing: -0.02em;
    font-size: clamp(1.5rem, 3.6vw, 2.2rem); line-height: 1.18; color: var(--ink);
}
.v2-statement em { font-style: normal; color: var(--teal-deep); }
.v2-split-body h2 { margin-bottom: 10px; }
.v2-split-body p { color: #33504C; }
.v2-split + .v2-split { margin-top: 44px; padding-top: 44px; border-top: 1px solid var(--line); }

/* ── Dark band with chips, and a photo dissolving into it ── */
.v2-band { position: relative; overflow: hidden; isolation: isolate; background: var(--ink); color: #DCEBE8; }
.v2-band .v2-kicker { color: var(--lime); }
.v2 .v2-band h2.v2-h2 { color: #fff; }
.v2-band p { color: #CFE3E0; }
.v2-band-photo { position: relative; margin: 0 -16px 8px; }
.v2-band-photo img {
    width: 100%; height: 260px; object-fit: cover; opacity: .9;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 20%, #000 70%, transparent 100%);
            mask-image: linear-gradient(180deg, transparent 0%, #000 20%, #000 70%, transparent 100%);
}
.v2-chips { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 20px 0 0; padding: 0; }
.v2-chips li {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 9px 14px; border-radius: 99px;
    background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14);
    color: #fff; font-weight: 600; font-size: .95rem;
}
.v2-chips svg { color: var(--lime); }

/* ── Anatomy cards ── */
.v2-cards { display: grid; gap: 14px; }
.v2-card {
    position: relative; isolation: isolate; overflow: hidden;
    display: flex; flex-direction: column; justify-content: flex-end;
    min-height: 190px; padding: 22px;
    border-radius: 18px; background: #fff; border: 1px solid var(--line);
    color: var(--ink) !important; text-decoration: none;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.v2-card::before {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background: var(--art, none) no-repeat right 6% center / auto 112%;
    opacity: .45;
    -webkit-mask-image: linear-gradient(90deg, transparent 22%, #000 75%);
            mask-image: linear-gradient(90deg, transparent 22%, #000 75%);
    transition: opacity .25s ease, transform .4s ease;
}
a.v2-card:hover { border-color: var(--teal); box-shadow: 0 12px 30px -14px rgba(20,52,47,.3); transform: translateY(-2px); }
a.v2-card:hover::before { opacity: .75; transform: scale(1.04); }
.v2-card h3 { max-width: 72%; margin-bottom: 6px; text-shadow: 0 0 12px #fff, 0 0 4px #fff; }
.v2-card p { max-width: 70%; margin: 0; font-size: .95rem; color: var(--muted); text-shadow: 0 0 10px #fff; }
.v2-card-more { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; font-size: .9rem; font-weight: 700; color: var(--teal-deep); }

/* ── Trust band ── */
.v2-trust { display: grid; gap: 22px; align-items: center; padding: 28px 22px; border-radius: 20px; background: #fff; border: 1px solid var(--line); }
.v2-trust-logo { width: 150px; height: auto; }
.v2-faces { display: flex; align-items: center; }
.v2-faces img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; object-position: center 25%; border: 3px solid #fff; box-shadow: 0 4px 12px rgba(20,52,47,.15); }
.v2-faces img + img { margin-left: -14px; }
.v2-faces a { margin-left: 14px; font-weight: 700; text-decoration: none; display: inline-flex; min-height: 44px; align-items: center; }

/* ── FAQ ── */
.v2-faq { max-width: 820px; }
.v2-faq details { border-bottom: 1px solid var(--line); }
.v2-faq summary {
    display: flex; justify-content: space-between; align-items: center; gap: 16px;
    min-height: 60px; padding: 16px 0; cursor: pointer; list-style: none;
    font-family: "Archivo", sans-serif; font-weight: 700; font-size: 1.08rem;
}
.v2-faq summary::-webkit-details-marker { display: none; }
.v2-faq summary::after { content: "+"; font-size: 1.6rem; font-weight: 500; color: var(--teal-deep); line-height: 1; }
.v2-faq details[open] summary::after { content: "\2212"; }
.v2-faq details p { color: var(--muted); padding-bottom: 16px; margin: 0; }

/* ── Booking ── */
.v2-book .v2-wrap { max-width: 860px; }
.v2-book { scroll-margin-top: 150px; }

@media (min-width: 640px) {
    .v2-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 992px) {
    .v2 { font-size: 18px; }
    .v2-section { padding: 88px 0; }
    .v2-hero { min-height: 560px; display: flex; align-items: center; padding: 40px 0 72px; }
    .v2-hero-grid { grid-template-columns: minmax(0, 560px); width: 100%; }
    .v2-hero-photo { position: absolute; top: 0; right: 0; bottom: 0; width: 56%; margin: 0; }
    .v2-hero-photo img {
        height: 100%;
        -webkit-mask-image: linear-gradient(90deg, transparent 0%, transparent 6%, #000 46%), linear-gradient(180deg, #000 82%, transparent 100%);
        -webkit-mask-composite: source-in;
                mask-image: linear-gradient(90deg, transparent 0%, transparent 6%, #000 46%), linear-gradient(180deg, #000 82%, transparent 100%);
                mask-composite: intersect;
    }
    .v2-split { grid-template-columns: 5fr 7fr; gap: 64px; align-items: start; }
    .v2-band-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
    .v2-band-photo { margin: 0; }
    .v2-band-photo img {
        height: 420px; border-radius: 0;
        -webkit-mask-image: radial-gradient(75% 75% at 50% 50%, #000 55%, transparent 100%);
                mask-image: radial-gradient(75% 75% at 50% 50%, #000 55%, transparent 100%);
    }
    .v2-cards { grid-template-columns: repeat(3, 1fr); }
    .v2-trust { grid-template-columns: auto 1fr auto; padding: 32px 40px; gap: 40px; }
}
/* From 1200px the header is fixed and the theme pads <main> by 175px, more
   than the header; the hero runs up behind it instead, as on the home page. */
@media (min-width: 1200px) {
    html body main.v2.v2 { padding-top: 0; }
    .v2 .v2-hero { padding-top: 205px; min-height: 735px; }
    /* A render is shown whole, so it must start below the fixed header
       rather than run up behind it the way a dissolving photo does. */
    .v2 .v2-hero--art .v2-hero-photo { top: 170px; bottom: 30px; }
}
@media (prefers-reduced-motion: reduce) {
    .v2-card, .v2-card::before { transition: none; }
    a.v2-card:hover, a.v2-card:hover::before { transform: none; }
}

/* ── Body text from the content files ── */
.v2-prose p, .v2-prose li { color: #33504C; }
.v2-prose ul, .v2-prose ol { padding-left: 1.2em; margin: 0 0 1em; }
.v2-prose li { margin-bottom: .45em; }
.v2-prose a { font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.v2-prose strong { color: var(--ink); }
.v2-lead p { margin: 0; }

/* ── Numbered section rows: heading beside body ── */
.v2-row { padding: 36px 0; border-top: 1px solid var(--line); scroll-margin-top: 150px; }
.v2-row:first-child { border-top: 0; padding-top: 0; }
.v2-row-head { margin-bottom: 14px; }
.v2-num { display: block; font-family: "Archivo", sans-serif; font-weight: 800; font-size: 1rem; color: var(--teal-deep); letter-spacing: .04em; margin-bottom: 6px; }
.v2 h2.v2-h2--sm { font-size: clamp(1.25rem, 3vw, 1.6rem) !important; }
#faq { scroll-margin-top: 150px; }

/* ── Jump links in the dark band ── */
.v2-chips--links a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 99px; color: #fff; text-decoration: none; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); font-weight: 600; font-size: .95rem; }
.v2-chips--links a:hover { background: rgba(255,255,255,.14); border-color: var(--lime); }
.v2-chips--links a svg { color: var(--lime); }
.v2-chips--links li { padding: 0; background: none; border: 0; }

/* ── Anatomy hero: the render shown whole on a soft glow, not cropped ── */
.v2-hero--art { background: radial-gradient(60% 70% at 78% 50%, rgba(35,163,159,.16) 0%, rgba(238,247,246,0) 70%), var(--mint); }
.v2-hero--art::before { display: none; }
.v2-hero--art .v2-hero-photo { margin: 0; display: flex; justify-content: center; }
.v2-hero--art .v2-hero-photo img { width: auto; max-width: 100%; height: 300px; object-fit: contain; -webkit-mask-image: none; mask-image: none; filter: drop-shadow(0 24px 40px rgba(20,52,47,.18)); }

.v2-trust-text { margin: 6px 0 0; color: var(--muted); }

@media (min-width: 992px) {
    .v2-row { display: grid; grid-template-columns: 4fr 8fr; gap: 56px; padding: 48px 0; }
    .v2-row-head { position: sticky; top: 170px; align-self: start; margin: 0; }
    .v2-hero--art .v2-hero-photo { position: absolute; top: 6%; bottom: 6%; right: 6%; width: 40%; align-items: center; }
    .v2-hero--art .v2-hero-photo img { height: 100%; max-height: 640px; }
}

/* ── Photo galleries, tables and spec lists inside section bodies ── */
.v2-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin: 18px 0; }
.v2-fig { margin: 0; }
.v2-fig img { width: 100%; height: auto; aspect-ratio: 5 / 3; object-fit: cover; border-radius: 14px; }
.v2-fig figcaption { margin-top: 6px; font-size: .88rem; color: var(--muted); }
.v2-prose table { width: 100%; border-collapse: collapse; margin: 0 0 1em; font-size: .95rem; }
.v2-prose th, .v2-prose td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.v2-prose th { color: var(--ink); background: var(--mint); }
.v2-prose dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 18px; margin: 0 0 1em; }
.v2-prose dt { font-weight: 700; color: var(--ink); }
.v2-prose dd { margin: 0; color: #33504C; }
.v2-prose h3 { margin: 22px 0 8px; font-size: 1.12rem !important; }
.v2-prose .post-keyfacts h2 { margin: 22px 0 8px; font-size: 1.12rem !important; } /* was an h3, see blog_detail.php */
@media (max-width: 575px) { .v2-prose dl { grid-template-columns: 1fr; } .v2-prose dd { margin-bottom: 8px; } }

/* ==========================================================================
   Conditions pages (phase 3)
   ========================================================================== */
.v2-section--tight { padding: 28px 0; }
.v2-fine p { margin: 0 0 6px; font-size: .9rem; color: var(--muted); }
.v2-fine a { color: var(--teal-deep); }

/* Dark band with a call to action on the right. */
.v2-band-cta { display: grid; gap: 20px; align-items: center; }
.v2-btn--lime { background: var(--lime); border-color: var(--lime); color: var(--ink) !important; }
.v2-btn--lime:hover { background: #bfe783; border-color: #bfe783; }
.v2-btn--ghost { background: transparent; border: 2px solid rgba(255,255,255,.35); color: #fff !important; }
.v2-btn--ghost:hover { border-color: #fff; }

/* Two or three panels side by side. */
.v2-duo { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.v2-panel { padding: 24px; border-radius: 18px; background: #fff; border: 1px solid var(--line); }
.v2-panel h2 { margin-bottom: 14px; }
.v2-panel--dark { background: var(--ink); border-color: var(--ink); }
.v2 .v2-panel--dark h2.v2-h2 { color: #fff; }
.v2-ticks, .v2-numbered { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.v2-ticks li { display: flex; gap: 10px; align-items: flex-start; color: #33504C; }
.v2-ticks svg { color: var(--teal-deep); font-size: 1.1rem; margin-top: 4px; }
.v2-numbered { counter-reset: n; }
.v2-numbered li { position: relative; padding-left: 40px; color: #DCEBE8; counter-increment: n; min-height: 28px; }
.v2-numbered li::before { content: counter(n); position: absolute; left: 0; top: 0; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--lime); color: var(--ink); font-weight: 800; font-size: .85rem; }

.v2-note { display: flex; gap: 12px; align-items: flex-start; margin: 22px 0 0; padding: 16px 18px; border-radius: 14px; background: #fff; border: 1px solid var(--line); color: var(--muted); font-size: .95rem; }
.v2-note svg { color: #C27A1A; font-size: 1.25rem; margin-top: 2px; }
.v2-note--draft { margin: 0 0 14px; background: #FFF6E5; border-color: #F2D9A8; color: #6B4A12; }

/* Symptom checklist. */
.v2-checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.v2-checks li { display: flex; gap: 12px; align-items: flex-start; padding: 16px 18px; border-radius: 14px; background: var(--mint); border: 1px solid var(--line); }
.v2-checks svg { flex: none; width: 26px; height: 26px; padding: 5px; border-radius: 50%; background: var(--teal-deep); color: #fff; }
.v2-checks span { padding-top: 2px; }

/* Plain bullets with brand dots. */
.v2-dots { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.v2-dots li { position: relative; padding-left: 22px; color: #33504C; }
.v2-dots li::before { content: ""; position: absolute; left: 2px; top: .62em; width: 9px; height: 9px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 4px rgba(35,163,159,.15); }

/* Treatment timeline on the dark band. */
.v2-timeline { list-style: none; margin: 26px 0 0; padding: 0; display: grid; gap: 0; counter-reset: t; }
.v2-timeline li { position: relative; padding: 0 0 22px 56px; counter-increment: t; }
.v2-timeline li::before { content: counter(t); position: absolute; left: 0; top: 0; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--lime); color: var(--ink); font-family: "Archivo", sans-serif; font-weight: 800; }
.v2-timeline li::after { content: ""; position: absolute; left: 17px; top: 40px; bottom: 4px; width: 2px; background: rgba(255,255,255,.18); }
.v2-timeline li:last-child::after { display: none; }
.v2-timeline span { display: block; padding-top: 6px; color: #fff; font-weight: 500; }

/* Recovery time. */
.v2-time { display: flex; gap: 16px; align-items: flex-start; padding: 22px; margin-bottom: 36px; border-radius: 18px; background: #fff; border: 1px solid var(--line); }
.v2-time svg { flex: none; font-size: 1.8rem; color: var(--teal-deep); }
.v2-time b { font-family: "Archivo", sans-serif; font-size: 1.1rem; }
.v2-time p { margin: 4px 0 0; color: #33504C; }

/* "See a doctor first" callout. */
.v2-callout { display: flex; gap: 16px; align-items: flex-start; padding: 24px; border-radius: 18px; background: #FFF6E5; border: 1px solid #F2D9A8; }
.v2-callout > svg { flex: none; font-size: 1.8rem; color: #C27A1A; margin-top: 2px; }
.v2 .v2-callout h2.v2-h2 { color: #6B4A12; }
.v2-callout ul { margin: 6px 0 10px; padding-left: 1.1em; color: #5A3E10; }
.v2-callout p { margin: 0; color: #6B5A3A; font-size: .95rem; }

/* Heading above the booking form. */
.v2-book-head { text-align: center; margin-bottom: 8px; }
.v2-book-head p { color: var(--muted); max-width: 640px; margin: 0 auto; }

/* Article cards. */
.v2-posts { display: grid; gap: 14px; }
.v2-post { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: 18px; background: #fff; border: 1px solid var(--line); color: var(--ink) !important; text-decoration: none; transition: border-color .15s ease, box-shadow .15s ease; }
.v2-post:hover { border-color: var(--teal); box-shadow: 0 12px 30px -14px rgba(20,52,47,.3); }
.v2-post img { width: 100%; height: auto; aspect-ratio: 5 / 3; object-fit: cover; border-radius: 12px; }
.v2-post-title { font-family: "Archivo", sans-serif; font-weight: 700; font-size: 1.08rem; line-height: 1.3; }

/* Area chips with a small anatomy thumbnail. */
.v2-areas { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.v2-areas a { display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 6px 16px 6px 8px; border-radius: 99px; background: #fff; border: 1px solid var(--line); color: var(--ink); font-weight: 600; text-decoration: none; }
.v2-areas a:hover { border-color: var(--teal); }
.v2-areas img { width: 40px; height: 40px; object-fit: contain; border-radius: 50%; background: var(--mint); padding: 3px; }

.v2-card--short { min-height: 140px; }
.v2-back { margin: 20px 0 0; }
.v2-back a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-weight: 700; text-decoration: none; }

@media (min-width: 640px) {
    .v2-checks { grid-template-columns: repeat(2, 1fr); }
    .v2-posts { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 992px) {
    .v2-cards--4 { grid-template-columns: repeat(4, 1fr); }
    .v2-band-cta { grid-template-columns: 1fr auto; gap: 40px; }
    .v2-duo { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
    .v2-checks { grid-template-columns: repeat(3, 1fr); }
    .v2-split .v2-dots { padding-top: 6px; }
}

/* ==========================================================================
   Team and about (phase 4)
   ========================================================================== */

/* Person cards: the portrait fills the card and dissolves into a blurred,
   darkened copy of itself; the details sit on the person's own colours.
   Same design as the home page's "Meet your physios". */
.v2-people { display: grid; gap: 22px; }
.v2-person {
    position: relative; display: block; isolation: isolate; overflow: hidden;
    aspect-ratio: 4 / 5.4; min-height: 450px; border-radius: 26px;
    background: var(--ink); color: #fff !important; text-decoration: none;
    box-shadow: 0 34px 60px -38px rgba(20,52,47,.75);
    transition: box-shadow .35s ease, transform .35s ease;
}
.v2-person:hover { transform: translateY(-4px); box-shadow: 0 40px 70px -36px rgba(20,52,47,.85), 0 0 0 1px rgba(169,222,95,.45); }
.v2-person-glow { position: absolute; inset: -50px; z-index: -3; background-size: cover; background-position: center 30%; filter: blur(36px) saturate(1.45) brightness(.6); transform: scale(1.15); }
.v2-person-glow--plain { filter: none; transform: none; inset: 0; background: radial-gradient(120% 80% at 30% 10%, #2DB8B3 0%, var(--teal-deep) 45%, var(--ink) 100%); }
.v2-person-photo {
    position: absolute; inset: 0 0 auto 0; z-index: -2; width: 100%; height: 82%;
    object-fit: cover; object-position: center 20%;
    -webkit-mask-image: linear-gradient(180deg, #000 52%, transparent 100%);
            mask-image: linear-gradient(180deg, #000 52%, transparent 100%);
    transition: transform .7s cubic-bezier(.2,.7,.2,1);
}
.v2-person:hover .v2-person-photo { transform: scale(1.05); }
.v2-person-initials { position: absolute; inset: 0 0 34% 0; z-index: -2; display: grid; place-items: center; font-family: "Archivo", sans-serif; font-weight: 800; font-size: 5rem; letter-spacing: .02em; color: rgba(255,255,255,.9); }
.v2-person::after {
    content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background:
        linear-gradient(180deg, rgba(12,38,35,0) 48%, rgba(12,38,35,.6) 70%, rgba(10,32,30,.94) 100%),
        radial-gradient(90% 45% at 50% 105%, rgba(35,163,159,.45), transparent 70%);
}
.v2-person-body { position: absolute; left: 0; right: 0; bottom: 0; padding: 22px 22px 20px; }
.v2-person-role { margin: 0 0 4px; color: var(--lime); font-size: .76rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.v2 .v2-person h2, .v2 .v2-person h3 { margin: 0 0 10px; color: #fff; font-size: 1.55rem; font-weight: 800; line-height: 1.15; }
.v2-person-pills { display: flex; flex-wrap: nowrap; gap: 5px; overflow: hidden; list-style: none; margin: -2px 0 0; padding: 0; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
.v2 .v2-person-pills li { flex: none; padding: 3px 9px; border-radius: 99px; font-size: 11.5px !important; font-weight: 600; line-height: 1.4 !important; color: rgba(255,255,255,.92); background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18); }
.v2-person-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.16); }
.v2-person-meta { margin: 0; font-size: .84rem; line-height: 1.4; color: rgba(255,255,255,.78); }
.v2-person-go { flex: none; display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--lime); color: var(--ink); transition: transform .3s ease; }
.v2-person-go svg { width: 18px; height: 18px; }
.v2-person:hover .v2-person-go { transform: translateX(4px); }
/* On a phone the cards become a swipeable row: one card and a peek of the
   next, sized for the screen. */
@media (max-width: 639px) {
    .v2-people {
        grid-auto-flow: column; grid-auto-columns: 74%; gap: 14px;
        overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
        margin: 0 -16px; padding: 4px 16px 18px; scroll-padding: 0 16px; scrollbar-width: none;
    }
    .v2-people::-webkit-scrollbar { display: none; }
    .v2-person { min-height: 0; aspect-ratio: 4 / 5.2; border-radius: 22px; scroll-snap-align: start; }
    .v2-person:hover { transform: none; }
    .v2-person-body { padding: 16px 16px 14px; }
    .v2 .v2-person h2, .v2 .v2-person h3 { font-size: 1.18rem; margin-bottom: 8px; }
    .v2-person-role { font-size: .66rem; }
    .v2-person-foot { margin-top: 10px; padding-top: 8px; }
    .v2-person-meta { font-size: .76rem; }
    .v2-person-go { width: 38px; height: 38px; }
    .v2-person-initials { font-size: 3.6rem; }
}
@media (prefers-reduced-motion: reduce) {
    .v2-person, .v2-person-photo, .v2-person-go { transition: none; }
    .v2-person:hover, .v2-person:hover .v2-person-photo, .v2-person:hover .v2-person-go { transform: none; }
}

/* No photo yet: initials on the brand gradient, sized like a photo. */
.v2-initials {
    display: grid; place-items: center; height: 124px;
    background: radial-gradient(120% 90% at 20% 10%, #2DB8B3 0%, var(--teal-deep) 55%, var(--teal-deeper) 100%);
    color: #fff; font-family: "Archivo", sans-serif; font-weight: 800; font-size: 2.2rem; letter-spacing: .02em;
}
.v2-profile-photo .v2-initials { width: 88px; height: 88px; border-radius: 50%; font-size: 1.9rem; border: 4px solid #fff; box-shadow: 0 10px 26px -10px rgba(20,52,47,.4); }

/* Light tag chips: a set of labels the reader scans for their own problem. */
.v2-tags { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.v2-tags a, .v2-tags span {
    display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px;
    border-radius: 99px; background: var(--mint); border: 1px solid var(--line);
    color: var(--ink); font-weight: 600; font-size: .94rem; text-decoration: none;
}
.v2-tags a { color: var(--teal-deep); }
.v2-tags a:hover { border-color: var(--teal); background: #fff; }

/* Profile hero: a round portrait beside the name on a phone, a tall
   portrait beside the text from 992px. */
.v2-profile-grid { display: grid; grid-template-columns: 88px 1fr; gap: 6px 16px; align-items: center; }
.v2-profile-photo { margin: 0; grid-row: 1; grid-column: 1; }
.v2-profile-photo img { display: block; width: 88px; height: 88px; border-radius: 50%; object-fit: cover; object-position: center 22%; border: 4px solid #fff; box-shadow: 0 10px 26px -10px rgba(20,52,47,.4); }
.v2-profile-head { grid-row: 1; grid-column: 2; min-width: 0; }
.v2-profile-head .v2-kicker { margin-bottom: 4px; }
.v2 .v2-profile-head h1 { margin-bottom: 0; font-size: clamp(1.75rem, 6.4vw, 3.3rem); }
.v2-profile-body { grid-column: 1 / -1; margin-top: 12px; }
.v2-reg { font-size: .95rem; color: #33504C; margin-bottom: 8px; }
.v2-reg strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.v2-reg a { color: var(--teal-deep); text-decoration: underline; text-underline-offset: 2px; }

/* Bio: collapsed paragraphs open with the button below. */
.v2-bio .hidden-content { display: none; }
.v2-bio.is-open .hidden-content { display: block; }
.v2-bio-toggle { margin-top: 6px; cursor: pointer; }
.v2-aside h2 { margin-bottom: 14px; }
.v2-aside + .v2-aside { margin-top: 28px; }
.v2-aside p { color: #33504C; font-size: .98rem; }

/* About: the photo beside Anand's copy. */
.v2-photo { margin: 0; }
.v2-photo img { display: block; width: 100%; height: auto; max-height: 520px; object-fit: cover; border-radius: 22px; box-shadow: 0 24px 50px -28px rgba(20,52,47,.5); }
.v2-panel h3 { font-size: 1.2rem; margin-bottom: 8px; }
.v2-panel--dark h3 { color: #fff; }
.v2-panel--dark p { color: #CFE3E0; }
.v2-panel p { margin: 0; }
.v2-panel-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--mint); color: var(--teal-deep); margin-bottom: 14px; }
.v2-panel--dark .v2-panel-icon { background: rgba(255,255,255,.08); color: var(--lime); }
.v2-panel-icon svg { width: 24px; height: 24px; }

@media (min-width: 640px) {
    .v2-people { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 992px) {
    .v2-people { grid-template-columns: repeat(3, 1fr); }
    .v2-profile-grid { grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: 0 56px; width: 100%; }
    .v2-profile-photo { grid-row: 1 / span 2; align-self: center; }
    .v2-profile-photo img, .v2-profile-photo .v2-initials { width: 100%; height: auto; aspect-ratio: 4 / 4.8; border-radius: 26px; border-width: 6px; }
    .v2-profile-photo .v2-initials { font-size: 6rem; }
    .v2-profile-head { align-self: end; }
    .v2-profile-body { grid-column: 2; align-self: start; margin-top: 16px; }
    .v2-about-grid { display: grid; grid-template-columns: 5fr 6fr; gap: 64px; align-items: center; }
}
/* A checklist sharing a row with its heading stays one column. */
.v2 .v2-checks--stack { grid-template-columns: 1fr; }

/* ==========================================================================
   Locations and suburbs (phase 5)
   ========================================================================== */

/* Address card beside a map. */
.v2-visit { display: grid; gap: 16px; }
.v2-info { padding: 24px; border-radius: 20px; background: #fff; border: 1px solid var(--line); }
.v2-info h2, .v2-info h3 { margin-bottom: 12px; }
.v2 .v2-info h3 { font-size: 1.35rem; }
.v2-info-sub { margin: -6px 0 12px; color: var(--muted); font-size: .95rem; }
.v2-pill { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px; padding: 6px 14px; border-radius: 99px; background: var(--mint); color: var(--teal-deep); font-weight: 700; font-size: .92rem; }
.v2-pill svg { width: 16px; height: 16px; }
.v2-info-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.v2-info-rows li { display: grid; grid-template-columns: 22px 1fr; gap: 12px; align-items: start; color: #33504C; font-size: .98rem; line-height: 1.55; }
.v2-info-rows svg { width: 20px; height: 20px; margin-top: 3px; color: var(--teal-deep); }
.v2-info-rows a { color: var(--teal-deep); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.v2-info-rows strong { color: var(--ink); }
.v2-info-rows small { color: var(--muted); font-size: .88rem; }
.v2-info .v2-btns { margin-top: 20px; }
.v2-map { border-radius: 20px; overflow: hidden; border: 1px solid var(--line); background: var(--mint); min-height: 280px; }
.v2-map iframe { display: block; width: 100%; height: 100%; min-height: 280px; border: 0; }
.v2-visit + .v2-visit { margin-top: 28px; }

/* Partner-practice notice. */
.v2-partner { margin: 0 0 18px; padding: 14px 16px; border-radius: 14px; background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--lime); font-size: .98rem; color: #33504C; max-width: 620px; }
.v2-partner strong { color: var(--ink); }

/* Suburb chips with the drive time. */
.v2-suburbs { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 18px; }
.v2-suburbs a { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 52px; padding: 0 18px; border-radius: 14px; background: #fff; border: 1px solid var(--line); color: var(--ink); font-family: "Archivo", sans-serif; font-weight: 700; text-decoration: none; transition: border-color .15s ease, box-shadow .15s ease; }
.v2-suburbs a:hover { border-color: var(--teal); box-shadow: 0 10px 24px -14px rgba(20,52,47,.35); color: var(--teal-deep); }
.v2-suburbs span { font-family: "DM Sans", sans-serif; font-weight: 500; font-size: .88rem; color: var(--muted); white-space: nowrap; }

/* A practitioner who books through a partner practice. */
.v2-bookers { display: grid; gap: 12px; }
.v2-booker { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; border-radius: 16px; background: #fff; border: 1px solid var(--line); }
.v2-booker strong { display: block; font-family: "Archivo", sans-serif; font-size: 1.1rem; }
.v2-booker a.v2-booker-profile { display: inline-flex; min-height: 44px; align-items: center; font-weight: 600; color: var(--teal-deep); }

/* Panel lists. */
.v2-panel ul:not(.v2-dots) { margin: 0; padding-left: 1.1em; }
.v2-panel li { margin-bottom: 8px; color: #33504C; }
.v2-panel--dark li { color: #CFE3E0; }
.v2-panel--dark a { color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.v2-panel a { font-weight: 600; }

@media (min-width: 480px) { .v2-suburbs { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 768px) { .v2-suburbs { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 992px) {
    .v2-visit { grid-template-columns: 5fr 7fr; gap: 24px; align-items: stretch; }
    .v2-map, .v2-map iframe { min-height: 380px; }
    .v2-suburbs { grid-template-columns: repeat(4, 1fr); gap: 12px; }
}
.v2-visit-others a { flex-direction: column; align-items: flex-start; justify-content: center; gap: 2px; padding: 12px 18px; }
.v2-visit-others span { white-space: normal; }

/* ==========================================================================
   Blog (phase 6)
   ========================================================================== */

/* A hero with no photo beside it: just the heading block. */
.v2 .v2-hero--plain { min-height: 0; display: block; padding-bottom: 40px; }
.v2-hero--plain .v2-lead { max-width: 680px; }
.v2-date { display: block; font-size: .85rem; color: var(--muted); font-weight: 600; letter-spacing: .02em; }

/* The newest post, large. */
.v2-feature { display: grid; gap: 0; margin-top: 18px; border-radius: 22px; overflow: hidden; background: #fff; border: 1px solid var(--line); color: var(--ink) !important; text-decoration: none; box-shadow: 0 24px 50px -32px rgba(20,52,47,.45); transition: border-color .15s ease, box-shadow .15s ease; }
.v2-feature:hover { border-color: var(--teal); box-shadow: 0 28px 56px -30px rgba(20,52,47,.55); }
.v2-feature-img { display: block; overflow: hidden; background: var(--mint); }
.v2-feature-img img { display: block; width: 100%; height: 220px; object-fit: cover; transition: transform .5s ease; }
.v2-feature:hover .v2-feature-img img { transform: scale(1.03); }
.v2-feature-body { display: flex; flex-direction: column; gap: 8px; padding: 20px 20px 22px; }
.v2-feature-body .v2-kicker { margin: 0; }
.v2 .v2-feature h2 { font-size: clamp(1.35rem, 4.4vw, 2rem); line-height: 1.2; margin: 0; }

.v2 h3.v2-post-title { font-size: 1.08rem; margin: 0; }
.v2-post .v2-date { margin-top: 2px; }
.v2-pager { margin-top: 28px; }
.v2-pager ul { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0; }
.v2-pager a { display: inline-grid; place-items: center; min-width: 44px; min-height: 44px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--line); background: #fff; font-weight: 700; text-decoration: none; }
.v2-pager .active a { background: var(--teal-deep); border-color: var(--teal-deep); color: #fff; }

/* Article. */
.v2-read > * { max-width: 860px; }
.v2 .v2-hero--post h1 { font-size: clamp(1.8rem, 5.6vw, 3rem); line-height: 1.15; }
.v2-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 4px 0 0; font-size: .95rem; color: var(--muted); font-weight: 600; }
.v2-meta span + span::before { content: "·"; margin-right: 18px; color: var(--teal); }
.v2 .v2-section--article { padding-top: 32px; }
.v2-article-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 36px; }
.v2-article { min-width: 0; }
.v2-article-cover { margin: 0 0 28px; }
.v2-article-cover img { display: block; width: 100%; height: auto; max-height: 620px; object-fit: contain; border-radius: 20px; background: var(--mint); }
.v2-article-body { font-size: 1.04rem; }
.v2-article-body img { max-width: 100%; height: auto; border-radius: 14px; }
.v2-article-body h2 { margin: 34px 0 12px; font-size: clamp(1.3rem, 3.4vw, 1.7rem) !important; line-height: 1.25; }
.v2-article-body h3 { margin: 26px 0 10px; }
.v2-article-body h2:first-child, .v2-article-body p:first-child { margin-top: 0; }
.v2-article-body iframe, .v2-article-body video { max-width: 100%; }
.v2-article-body table { display: block; overflow-x: auto; }
.v2-article-body blockquote { margin: 1.4em 0; padding: 14px 18px; border-left: 4px solid var(--teal); background: var(--mint); border-radius: 0 12px 12px 0; }
.v2-article-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; margin: 34px 0 0; padding: 20px 22px; border-radius: 18px; background: var(--ink); color: #CFE3E0; }
.v2-article-cta strong { display: block; color: #fff; font-family: "Archivo", sans-serif; font-size: 1.12rem; }
.v2-article-cta .v2-btn--solid { background: var(--lime); border-color: var(--lime); color: var(--ink) !important; }
.v2-sources { margin-top: 34px; padding-top: 24px; border-top: 1px solid var(--line); }
.v2-sources ol { padding-left: 1.2em; margin: 0; font-size: .8rem; line-height: 1.5; color: var(--muted); } /* smaller, Anand 5 Oct 2026 */
.v2-sources li { margin-bottom: 5px; overflow-wrap: anywhere; }
.v2-sources a { text-decoration: underline; text-underline-offset: 3px; }

/* The share / recent-posts sidebar, in v2 colours. */
.v2 .art-side { display: grid; gap: 18px; }
.v2 .art-side__block { padding: 20px; border-radius: 18px; background: #fff; border: 1px solid var(--line); box-shadow: none; }
.v2 .art-side__title { font-family: "Archivo", sans-serif; font-size: 1.05rem !important; color: var(--ink); margin: 0 0 12px; }
.v2 .art-side__cta { background: var(--mint); }
/* custom.css wrote this card white-on-dark-teal; on the mint it was unreadable. */
.v2 .art-side__cta p { color: var(--ink); font-size: .95rem; line-height: 1.55; }
.v2 .art-side__cta .art-side__book { background: var(--teal-deep); color: #fff !important; border-radius: 12px; font-weight: 700; }
.v2 .art-side__cta .art-side__book:hover { background: var(--teal-deeper); }
.v2 .art-side__cta .art-side__call { color: var(--teal-deep) !important; font-weight: 700; }

@media (min-width: 640px) {
    .v2-posts--grid { grid-template-columns: repeat(2, 1fr); }
    .v2-feature-img img { height: 300px; }
}
@media (min-width: 992px) {
    .v2-feature { grid-template-columns: 7fr 5fr; align-items: stretch; }
    .v2-feature-img img { height: 100%; min-height: 360px; }
    .v2-feature-body { justify-content: center; padding: 36px 40px; gap: 12px; }
    .v2-posts--grid { grid-template-columns: repeat(3, 1fr); }
    .v2-article-grid { grid-template-columns: minmax(0, 1fr) 320px; gap: 56px; align-items: start; }
    .v2-article-side { position: sticky; top: 120px; }
}
@media (min-width: 1200px) {
    .v2 .v2-hero--plain { padding-bottom: 56px; }
    .v2-article-side { top: 190px; }
}

/* ==========================================================================
   Contact, health funds, payment options, policies (phase 7)
   ========================================================================== */

.v2-small { font-size: .9rem; color: var(--muted); }
.v2-gap { margin-top: 40px !important; }
.v2-badge { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 12px; padding: 6px 14px; border-radius: 99px; background: #fff; border: 1px solid var(--line); color: var(--teal-deep); font-weight: 700; font-size: .9rem; }
.v2-badge svg { width: 16px; height: 16px; }
.v2-badge--network { background: var(--teal-deep); border-color: var(--teal-deep); color: #fff; }
.v2-badge--network svg { color: var(--lime); }

/* Fund tiles. */
.v2-funds { display: grid; grid-template-columns: 1fr; gap: 12px; margin-top: 16px; }
.v2-fund { display: flex; flex-direction: column; justify-content: center; gap: 4px; min-height: 76px; padding: 14px 18px; border-radius: 16px; background: #fff; border: 1px solid var(--line); color: var(--ink) !important; text-decoration: none; transition: border-color .15s ease, box-shadow .15s ease; }
.v2-fund:hover { border-color: var(--teal); box-shadow: 0 12px 26px -16px rgba(20,52,47,.4); }
.v2-fund strong { font-family: "Archivo", sans-serif; font-size: 1.08rem; }
.v2-fund span { display: inline-flex; align-items: center; gap: 6px; font-size: .88rem; color: var(--muted); }
.v2-fund span svg { width: 15px; height: 15px; flex: none; }
.v2-fund.is-network { border-color: rgba(15,124,120,.35); background: linear-gradient(180deg, #fff, #F3FAF9); }
.v2-fund.is-network span { color: var(--teal-deep); font-weight: 600; }
.v2-funds--network .v2-fund { min-height: 96px; }

/* Tables inside documents. */
.v2-table { overflow-x: auto; margin: 6px 0 14px; border: 1px solid var(--line); border-radius: 14px; }
.v2 .v2-table table { width: 100%; min-width: 440px; margin: 0; border-collapse: collapse; }
.v2-table th, .v2-table td { padding: 12px 14px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.v2-table tr:last-child td { border-bottom: 0; }
.v2-table-detail { display: block; font-size: .88rem; color: var(--muted); margin-top: 2px; }
.v2-table-fee { font-family: "Archivo", sans-serif; font-weight: 800; color: var(--teal-deep); white-space: nowrap; }
.v2-table code { font-size: .85rem; background: var(--mint); padding: 1px 6px; border-radius: 6px; color: var(--ink); }

/* Sidebar cards. */
.v2-side-card { padding: 20px; border-radius: 18px; background: #fff; border: 1px solid var(--line); margin-bottom: 18px; }
.v2 .v2-side-card h2 { font-size: 1.1rem !important; margin: 0 0 8px; }
.v2-side-card p { font-size: .95rem; color: #33504C; }
.v2-side-card .v2-btn { width: 100%; margin-top: 8px; }
.v2-side-card--dark { background: var(--ink); border-color: var(--ink); }
.v2 .v2-side-card--dark h2 { color: #fff; }
.v2-side-card--dark p { color: #CFE3E0; }
.v2-article-side .v2-back { display: flex; flex-direction: column; gap: 0; margin: 0; }

/* Contents list for long documents. */
.v2-toc { padding: 20px; border-radius: 18px; background: #fff; border: 1px solid var(--line); margin-bottom: 18px; }
.v2 .v2-toc h2 { font-size: 1rem !important; margin: 0 0 8px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.v2-toc ol { list-style: none; margin: 0; padding: 0; }
.v2-toc a { display: flex; align-items: center; min-height: 44px; padding: 4px 0; color: var(--ink); text-decoration: none; font-size: .94rem; line-height: 1.35; border-bottom: 1px solid var(--line); }
.v2-toc li:last-child a { border-bottom: 0; }
.v2-toc a:hover { color: var(--teal-deep); }
.v2-toc-h3 a { padding-left: 14px; font-size: .9rem; color: var(--muted); }
.v2-doc h2, .v2-doc h3 { scroll-margin-top: 150px; }
.v2 .v2-doc h3 { font-size: 1.15rem !important; margin: 26px 0 8px; }
.v2-callout-note { padding: 14px 18px; border-radius: 14px; background: var(--mint); border-left: 4px solid var(--teal); }

/* Payment-card pictures. */
.v2-cards-img { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.v2-cards-img img { width: auto; max-width: 100%; height: 64px; object-fit: contain; border-radius: 8px; }
.v2-dots--tight { margin: 0 0 1em; gap: 6px; }
.v2-logos { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 32px; margin-top: 16px; }
.v2-logos img { width: auto; max-width: 150px; height: 56px; object-fit: contain; filter: grayscale(1); opacity: .75; }

/* Contact. */
.v2-contact { display: grid; gap: 16px; }
.v2-big { display: inline-block; font-family: "Archivo", sans-serif; font-weight: 800; font-size: 1.25rem; color: var(--teal-deep); text-decoration: none; overflow-wrap: anywhere; min-height: 44px; padding-top: 6px; }
.v2-hours { width: 100%; font-size: .95rem; }
.v2-hours td { padding: 6px 0; vertical-align: top; color: #33504C; }
.v2-hours td:first-child { font-weight: 700; color: var(--ink); padding-right: 14px; white-space: nowrap; }
.v2-ai { display: grid; gap: 22px; margin-top: 24px; padding: 26px; border-radius: 22px; background: var(--ink); color: #CFE3E0; }
.v2 .v2-ai h2.v2-h2 { color: #fff; }
.v2-ai .v2-badge { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.16); color: var(--lime); }
.v2-ai .v2-small { color: #A9C4C0; margin-top: 12px; }
.v2-ai .v2-checks li { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.1); color: #DCEBE8; }
.v2-careers { display: grid; gap: 28px; }
.v2-form { display: grid; grid-template-columns: 1fr; gap: 14px; margin-top: 18px; }
.v2-form label { display: block; margin-bottom: 4px; font-weight: 600; font-size: .92rem; }
.v2 .v2-form .form-control { width: 100%; min-height: 48px; padding: 10px 14px; border-radius: 12px; border: 1px solid var(--line); background: #fff; font: inherit; font-size: 1rem; color: var(--ink); }
.v2 .v2-form textarea.form-control { min-height: 110px; }
.v2 .v2-form .form-control:focus { outline: none; border-color: var(--teal); box-shadow: 0 0 0 3px rgba(35,163,159,.18); }
.v2-form .help-block { font-size: .85rem; color: #B42318; }
.v2-form .has-error .form-control { border-color: #D92D20; }
#msgSubmit.hidden { display: none; }
#msgSubmit { font-size: 1rem !important; margin: 0; }

@media (min-width: 480px) { .v2-funds { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 640px) {
    .v2-form { grid-template-columns: 1fr 1fr; }
    .v2-form-wide { grid-column: 1 / -1; }
    .v2-contact { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 992px) {
    .v2-funds { grid-template-columns: repeat(4, 1fr); }
    .v2-funds--network { grid-template-columns: repeat(3, 1fr); }
    .v2-contact { grid-template-columns: repeat(4, 1fr); }
    .v2-ai { grid-template-columns: 1fr 1fr; align-items: center; padding: 36px 40px; }
    .v2-careers { grid-template-columns: 5fr 7fr; gap: 56px; align-items: start; }
    .v2-careers .v2-photo { position: sticky; top: 190px; }
}
.v2-hours td { display: block; padding: 0; }
.v2-hours tr + tr td:first-child { margin-top: 10px; }

/* ==========================================================================
   Booking, offer, languages, partners, referral, confirmation (phase 8)
   ========================================================================== */

.v2 .v2-h3, .v2 h3.v2-h3 { font-size: 1.2rem !important; margin: 0 0 10px; }
.v2-panel--dark .v2-h3 { color: #fff; }
.v2-gap-sm { margin-top: 14px !important; }
.v2-ticks-inline { display: flex; flex-wrap: wrap; gap: 8px 20px; list-style: none; margin: 4px 0 0; padding: 0; font-weight: 600; font-size: .95rem; }
.v2-ticks-inline li { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; }
.v2-ticks-inline svg { width: 18px; height: 18px; color: var(--teal-deep); flex: none; }
.v2 .v2-book--first { padding-top: 24px; }
.v2-book-alt { margin: 18px auto 0; max-width: 720px; text-align: center; color: var(--muted); font-size: .95rem; }

/* $49 offer. */
.v2-offer { display: grid; gap: 22px; align-items: center; }
.v2-offer-card { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 24px; border-radius: 22px; background: var(--ink); color: #CFE3E0; text-align: center; box-shadow: 0 24px 50px -30px rgba(20,52,47,.6); }
.v2-offer-card img { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; object-position: center 22%; border: 4px solid rgba(255,255,255,.15); margin-bottom: 6px; }
.v2-offer-price { font-family: "Archivo", sans-serif; font-weight: 800; font-size: 3rem; line-height: 1; color: var(--lime); }
.v2-offer-price s { font-size: 1.3rem; color: #8FB1AC; font-weight: 600; margin-left: 6px; }
.v2-offer-what a { color: #fff; font-weight: 700; }
.v2-was { color: var(--muted); font-weight: 600; margin-left: 6px; font-size: .9em; }

/* Languages. */
.v2-langs { display: grid; gap: 16px; }
.v2-lang { padding: 22px; border-radius: 18px; background: #fff; border: 1px solid var(--line); }
.v2 .v2-lang h2 { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px; font-size: 1.4rem !important; margin: 0 0 10px; }
.v2-lang h2 span { font-family: "DM Sans", sans-serif; font-size: .85rem; font-weight: 600; color: var(--muted); }
.v2-lang ul { list-style: none; margin: 0; padding: 0; }
.v2-lang a { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 52px; padding: 8px 0; border-top: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.v2-lang a:hover { color: var(--teal-deep); }
.v2-lang small { display: block; color: var(--muted); font-size: .85rem; }
.v2-lang svg { color: var(--teal-deep); flex: none; }

/* Partners. */
.v2-partner-grid { display: grid; gap: 14px; }
.v2-partner-card { display: flex; flex-direction: column; gap: 8px; padding: 20px; border-radius: 18px; background: #fff; border: 1px solid var(--line); }
.v2-partner-plate { display: grid; place-items: center; height: 84px; border-radius: 12px; background: var(--sand); }
.v2-partner-plate img { max-width: 170px; max-height: 56px; width: auto; height: auto; object-fit: contain; }
.v2-partner-plate--dark { background: #14342F; }
.v2 .v2-partner-card h2, .v2 .v2-partner-card h3 { font-size: 1.1rem !important; margin: 4px 0 0; }
.v2-partner-card p { margin: 0; font-size: .95rem; color: #33504C; }

/* Referral. */
.v2-contact-chip { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 12px 16px; border-radius: 16px; background: #fff; border: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.v2-contact-chip:hover { border-color: var(--teal); }
.v2-contact-chip .v2-panel-icon { margin: 0; flex: none; width: 40px; height: 40px; }
.v2-contact-chip small { display: block; color: var(--muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; }
.v2-contact-chip strong { display: block; overflow-wrap: anywhere; color: var(--teal-deep); }
.v2-form--refer { display: block; margin: 0; }
.v2-fieldset { border: 0; margin: 0 0 22px; padding: 0; min-width: 0; }
.v2-legend { font-family: "Archivo", sans-serif; font-weight: 800; font-size: 1.15rem; margin-bottom: 12px; }
.v2-form-row { display: grid; gap: 14px; }
.v2-form--refer .form-group { margin-bottom: 14px; }
.v2-form--refer label { display: block; margin-bottom: 4px; font-weight: 600; font-size: .92rem; }
.v2 .v2-form--refer .form-control { width: 100%; min-height: 48px; padding: 10px 14px; border-radius: 12px; border: 1px solid var(--line); background: #fff; font: inherit; font-size: 1rem; color: var(--ink); }
.v2 .v2-form--refer textarea.form-control { min-height: 140px; }
.v2 .v2-form--refer .form-control:focus { outline: none; border-color: var(--teal); box-shadow: 0 0 0 3px rgba(35,163,159,.18); }
.v2-hint { margin-top: 4px; font-size: .85rem; color: var(--muted); }
.v2-req { color: #B42318; }
.v2-pot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.v2-alert { margin-bottom: 18px; padding: 14px 16px; border-radius: 14px; font-size: .97rem; }
.v2-alert.is-ok { background: #ECFDF3; border: 1px solid #ABEFC6; color: #054F31; }
.v2-alert.is-bad { background: #FEF3F2; border: 1px solid #FECDCA; color: #7A271A; }
.v2-side-list { margin: 0; padding-left: 1.1em; color: #CFE3E0; font-size: .95rem; }
.v2-side-list li { margin-bottom: 8px; }

/* Booking confirmed. */
.v2-done-card { max-width: 640px; margin: 0 auto; padding: 32px 24px; border-radius: 24px; background: #fff; border: 1px solid var(--line); text-align: center; box-shadow: 0 24px 50px -30px rgba(20,52,47,.4); }
.v2-done-tick { display: inline-grid; place-items: center; width: 72px; height: 72px; margin-bottom: 14px; border-radius: 50%; background: var(--teal-deep); color: #fff; }
.v2-done-tick svg { width: 34px; height: 34px; }
.v2-done-card .v2-lead { margin-left: auto; margin-right: auto; }
.v2-done-card .v2-ticks-inline, .v2-done-card .v2-btns { justify-content: center; margin-top: 16px; }

@media (min-width: 640px) {
    .v2-form-row { grid-template-columns: 1fr 1fr; }
    .v2-langs, .v2-partner-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 992px) {
    .v2-offer { grid-template-columns: minmax(0, 1fr) 320px; gap: 48px; }
    .v2-partner-grid { grid-template-columns: repeat(3, 1fr); }
    .v2-langs { grid-template-columns: repeat(3, 1fr); }
}
.v2-ticks-inline a, .v2-link-row a, .v2-offer-what a { display: inline-flex; align-items: center; min-height: 44px; }

/* Profile header, dark: the blurred portrait is tinted deep teal so the
   name, registration and languages read as white text, the same look as the
   practitioner cards. Asked for on 4 Oct 2026 — the dark text was hard to
   read over the blurred photo. */
.v2 .v2-profile { background: var(--ink); color: #fff; }
.v2 .v2-profile .v2-hero-bg { filter: blur(40px) saturate(1.4) brightness(.55); opacity: 1; }
.v2 .v2-profile::before {
    background:
        radial-gradient(90% 70% at 85% 10%, rgba(35,163,159,.35), transparent 70%),
        linear-gradient(180deg, rgba(10,32,30,.55) 0%, rgba(10,32,30,.78) 100%);
}
.v2 .v2-profile h1 { color: #fff; }
.v2 .v2-profile .v2-kicker { color: var(--lime); }
.v2 .v2-profile .v2-crumbs, .v2 .v2-profile .v2-crumbs a { color: rgba(255,255,255,.75); }
.v2 .v2-profile .v2-crumbs li + li::before { color: rgba(255,255,255,.35); }
.v2 .v2-profile .v2-reg { color: rgba(255,255,255,.92); font-size: 1.08rem; line-height: 1.6; margin-bottom: 10px; }
.v2 .v2-profile .v2-reg strong { color: #fff; }
.v2 .v2-profile .v2-reg a { color: var(--lime); }
.v2 .v2-profile .v2-btn--solid { background: var(--lime); border-color: var(--lime); color: var(--ink) !important; }
.v2 .v2-profile .v2-btn--solid:hover { background: #bfe783; border-color: #bfe783; }
.v2 .v2-profile .v2-btn--line { background: transparent; border-color: rgba(255,255,255,.45); color: #fff !important; }
.v2 .v2-profile .v2-btn--line:hover { border-color: #fff; }
.v2 .v2-profile .v2-profile-photo img { border-color: rgba(255,255,255,.18); box-shadow: 0 30px 60px -28px rgba(0,0,0,.6); }
@media (min-width: 992px) { .v2 .v2-profile .v2-reg { font-size: 1.15rem; } }

/* Profile story (below the dark header): an editorial column — drop cap,
   a larger opening paragraph, the rest folded behind "Read the full story" —
   beside a dark "at a glance" card with the special interests and languages.
   The card comes first on a phone and stays in view beside the story from
   992px. */
.v2 .v2-about-person { background: var(--sand); }
.v2-story { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
.v2-glance {
    position: relative; overflow: hidden; isolation: isolate;
    padding: 24px 22px 22px; border-radius: 24px; background: var(--ink); color: #DCEBE8;
    box-shadow: 0 30px 60px -36px rgba(20,52,47,.7);
}
.v2-glance::before {
    content: ""; position: absolute; z-index: -1; top: -35%; right: -30%; width: 80%; aspect-ratio: 1;
    border-radius: 50%; background: radial-gradient(circle, rgba(35,163,159,.5), transparent 65%);
}
.v2-glance-kicker { margin: 0 0 4px; color: var(--lime); font-size: .74rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.v2 .v2-glance h2 { margin: 18px 0 8px; color: #fff; font-size: 1.05rem !important; font-weight: 700; }
.v2 .v2-glance .v2-glance-kicker + h2 { margin-top: 6px; }
.v2-glance-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; list-style: none; margin: 0; padding: 0; }
.v2-glance-list li { border-bottom: 1px solid rgba(255,255,255,.1); min-width: 0; }
.v2-glance-list a, .v2-glance-list li > span { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 46px; color: #fff; text-decoration: none; font-size: .93rem; font-weight: 600; line-height: 1.3; }
.v2-glance-list li > span { color: rgba(255,255,255,.72); }
.v2-glance-list svg { width: 16px; height: 16px; flex: none; color: var(--lime); transition: transform .2s ease; }
.v2-glance-list a:hover { color: var(--lime); }
.v2-glance-list a:hover svg { transform: translateX(3px); }
.v2-glance-langs { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.v2-glance-langs li { padding: 7px 14px; border-radius: 99px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); color: #fff; font-size: .9rem; font-weight: 600; }
.v2-glance-langs a { color: #fff; }
.v2-glance-more { margin: 4px 0 0; }
.v2-glance-more a { display: inline-flex; align-items: center; min-height: 44px; color: var(--lime); font-size: .9rem; font-weight: 600; }
.v2-glance-book { width: 100%; margin-top: 16px; }

.v2-story-body { min-width: 0; max-width: 700px; }
.v2-story-body .v2-bio p:first-of-type { font-size: 1.2rem; line-height: 1.6; color: var(--ink); }
.v2-story-body .v2-bio p:first-of-type::first-letter {
    float: left; margin: 6px 12px 0 0; font-family: "Archivo", sans-serif; font-weight: 800;
    font-size: 3.6em; line-height: .82; color: var(--teal-deep);
}
.v2 .v2-story-body .v2-bio h2 { font-size: clamp(1.3rem, 3.4vw, 1.6rem) !important; margin: 0 0 14px; }
.v2-bio.has-more:not(.is-open) { position: relative; }
.v2-bio.has-more:not(.is-open)::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 80px; background: linear-gradient(180deg, rgba(250,248,244,0), var(--sand)); pointer-events: none; }
.v2 .v2-bio-toggle {
    display: inline-flex; align-items: center; gap: 10px; min-height: 50px; margin-top: 12px; padding: 0 22px;
    border-radius: 99px; border: 1px solid var(--line); background: #fff; color: var(--teal-deep);
    font: inherit; font-weight: 700; font-size: .98rem; cursor: pointer;
    box-shadow: 0 12px 26px -18px rgba(20,52,47,.45); transition: border-color .15s ease;
}
.v2 .v2-bio-toggle:hover { border-color: var(--teal); }
.v2-bio-toggle svg { width: 18px; height: 18px; transition: transform .25s ease; }
.v2-bio-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }

@media (min-width: 992px) {
    .v2-story { grid-template-columns: minmax(0, 1fr) 380px; gap: 64px; align-items: start; }
    .v2-story .v2-glance { order: 2; position: sticky; top: 190px; padding: 30px 28px 26px; }
    .v2-story .v2-story-body { order: 1; }
    .v2-story-body .v2-bio p:first-of-type { font-size: 1.3rem; }
}
@media (prefers-reduced-motion: reduce) { .v2-glance-list svg, .v2-bio-toggle svg { transition: none; } }

/* Profile portrait, Oct 2026: no framed rectangle. An arch-topped window
   that dissolves into the dark header at its foot, with a teal glow behind
   it and a thin outline of the same arch set just off the photo. On a phone
   it stays a round avatar, ringed with the brand gradient. */
.v2 .v2-profile .v2-profile-photo { position: relative; isolation: isolate; }
.v2 .v2-profile .v2-profile-photo img,
.v2 .v2-profile .v2-profile-photo .v2-initials {
    border: 0;
    box-shadow: 0 0 0 3px rgba(10,32,30,.9), 0 0 0 5px rgba(169,222,95,.85), 0 14px 30px -12px rgba(0,0,0,.6);
}
@media (min-width: 992px) {
    .v2 .v2-profile .v2-profile-photo { padding: 18px 18px 0; }
    .v2 .v2-profile .v2-profile-photo::before {
        content: ""; position: absolute; z-index: -2; left: 50%; top: 42%; width: 120%; aspect-ratio: 1;
        transform: translate(-50%, -50%); border-radius: 50%;
        background: radial-gradient(circle, rgba(35,163,159,.55) 0%, rgba(35,163,159,.18) 45%, transparent 70%);
    }
    .v2 .v2-profile .v2-profile-photo::after {
        content: ""; position: absolute; z-index: -1; inset: 0 0 18% 0;
        border: 1px solid rgba(255,255,255,.22); border-bottom: 0; border-radius: 999px 999px 0 0;
        -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent 100%);
                mask-image: linear-gradient(180deg, #000 55%, transparent 100%);
    }
    .v2 .v2-profile .v2-profile-photo img,
    .v2 .v2-profile .v2-profile-photo .v2-initials {
        aspect-ratio: 4 / 5; border-radius: 999px 999px 28px 28px; box-shadow: none;
        -webkit-mask-image: linear-gradient(180deg, #000 68%, transparent 100%);
                mask-image: linear-gradient(180deg, #000 68%, transparent 100%);
    }
}

/* ==========================================================================
   About page, premium pass (Oct 2026): dark header with the shopfront in a
   dissolving arch, a strip of facts, the story in the editorial style and
   mission / vision / approach as glass cards on a dark band.
   ========================================================================== */

/* A dark hero, the same treatment as the practitioner profiles. */
.v2 .v2-hero--dark { background: var(--ink); color: #fff; }
.v2 .v2-hero--dark .v2-hero-bg { filter: blur(40px) saturate(1.4) brightness(.55); opacity: 1; }
.v2 .v2-hero--dark::before {
    background:
        radial-gradient(90% 70% at 85% 10%, rgba(35,163,159,.35), transparent 70%),
        linear-gradient(180deg, rgba(10,32,30,.55) 0%, rgba(10,32,30,.8) 100%);
}
.v2 .v2-hero--dark h1 { color: #fff; }
.v2 .v2-hero--dark .v2-kicker { color: var(--lime); }
.v2 .v2-hero--dark .v2-lead { color: rgba(255,255,255,.88); font-size: 1.18rem; }
.v2 .v2-hero--dark .v2-crumbs, .v2 .v2-hero--dark .v2-crumbs a { color: rgba(255,255,255,.75); }
.v2 .v2-hero--dark .v2-crumbs li + li::before { color: rgba(255,255,255,.35); }
.v2 .v2-hero--dark .v2-rating { color: #fff !important; }
.v2 .v2-hero--dark .v2-rating span.v2-rating-count { color: rgba(255,255,255,.75); }
.v2 .v2-hero--dark .v2-btn--solid { background: var(--lime); border-color: var(--lime); color: var(--ink) !important; }
.v2 .v2-hero--dark .v2-btn--solid:hover { background: #bfe783; border-color: #bfe783; }
.v2 .v2-hero--dark .v2-btn--line { background: transparent; border-color: rgba(255,255,255,.45); color: #fff !important; }
.v2 .v2-hero--dark .v2-btn--line:hover { border-color: #fff; }
.v2-about-hero-grid { display: grid; gap: 28px; align-items: center; }

/* The dissolving arch: a photo with an arched top that fades out at its
   foot, a glow behind it and a thin outline of the same arch. */
.v2-arch { position: relative; isolation: isolate; margin: 0 auto; width: 100%; max-width: 420px; padding: 16px 16px 0; }
.v2-arch::before {
    content: ""; position: absolute; z-index: -2; left: 50%; top: 42%; width: 118%; aspect-ratio: 1;
    transform: translate(-50%, -50%); border-radius: 50%;
    background: radial-gradient(circle, rgba(35,163,159,.32) 0%, rgba(35,163,159,.1) 45%, transparent 70%);
}
.v2-arch::after {
    content: ""; position: absolute; z-index: -1; inset: 0 0 18% 0; border: 1px solid rgba(15,124,120,.28); border-bottom: 0;
    border-radius: 999px 999px 0 0;
    -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent 100%); mask-image: linear-gradient(180deg, #000 55%, transparent 100%);
}
.v2-arch img {
    display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 30%;
    border-radius: 999px 999px 28px 28px;
    -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent 100%); mask-image: linear-gradient(180deg, #000 70%, transparent 100%);
}
.v2-arch--dark::before { background: radial-gradient(circle, rgba(35,163,159,.55) 0%, rgba(35,163,159,.18) 45%, transparent 70%); }
.v2-arch--dark::after { border-color: rgba(255,255,255,.22); }
.v2-about-hero .v2-arch { max-width: 300px; }

/* Facts strip, straddling the hero's foot. */
.v2-facts { position: relative; z-index: 2; margin-top: -34px; }
.v2-facts ul {
    display: grid; grid-template-columns: 1fr 1fr; list-style: none; margin: 0; padding: 8px;
    border-radius: 22px; background: #fff; border: 1px solid var(--line);
    box-shadow: 0 30px 60px -34px rgba(20,52,47,.45);
}
.v2-facts li { display: flex; flex-direction: column; gap: 2px; padding: 14px 14px; }
.v2-facts li + li { border-left: 1px solid var(--line); }
.v2-facts li:nth-child(3) { border-left: 0; }
.v2-facts li:nth-child(n+3) { border-top: 1px solid var(--line); }
.v2-facts strong { font-family: "Archivo", sans-serif; font-weight: 800; font-size: 1.9rem; line-height: 1; color: var(--teal-deep); }
.v2-facts-star { font-size: .7em; color: #F5A623; margin-left: 4px; vertical-align: .15em; }
.v2-facts span:not(.v2-facts-star) { font-size: .86rem; color: var(--muted); line-height: 1.35; }

/* Editorial prose: a drop cap and a larger opening paragraph. */
.v2-editorial > p:first-child { font-size: 1.16rem; color: var(--ink); }
.v2-editorial > p:first-child::first-letter {
    float: left; margin: 6px 12px 0 0; font-family: "Archivo", sans-serif; font-weight: 800;
    font-size: 3.6em; line-height: .82; color: var(--teal-deep);
}

/* Mission / vision / approach as glass cards on the dark band. */
.v2-pillar-grid { display: grid; gap: 16px; margin-top: 22px; }
.v2-pillar {
    position: relative; overflow: hidden; padding: 26px 24px 24px; border-radius: 22px;
    background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12);
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.v2-pillar .v2-panel-icon { background: rgba(169,222,95,.12); color: var(--lime); }
.v2 .v2-pillar h3 { color: #fff; font-size: 1.25rem; margin-bottom: 8px; }
.v2-pillar p { margin: 0; color: #CFE3E0; font-size: .98rem; }
.v2-pillars::before { content: ""; position: absolute; z-index: -1; left: -10%; bottom: -40%; width: 60%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(35,163,159,.35), transparent 65%); }

@media (min-width: 640px) {
    .v2-facts ul { grid-template-columns: repeat(4, 1fr); padding: 10px; }
    .v2-facts li:nth-child(3) { border-left: 1px solid var(--line); }
    .v2-facts li:nth-child(n+3) { border-top: 0; }
    .v2-facts li { padding: 18px 20px; }
}
@media (min-width: 992px) {
    .v2-about-hero-grid { grid-template-columns: minmax(0, 1fr) 400px; gap: 56px; width: 100%; }
    .v2-about-hero .v2-arch { max-width: 400px; }
    .v2 .v2-about-hero { padding-bottom: 96px; }
    .v2-pillar-grid { grid-template-columns: repeat(3, 1fr); gap: 20px; }
    .v2-editorial > p:first-child { font-size: 1.25rem; }
}

/* No outline round the arch (4 Oct 2026: it read as a cheap frame). In its
   place a soft lime glow drifts behind the arch's upper corner, beside the
   teal glow already there, so the photo looks lit rather than bordered. */
@media (min-width: 992px) {
    .v2 .v2-profile .v2-profile-photo::after {
        inset: auto; border: 0; -webkit-mask-image: none; mask-image: none;
        top: -4%; right: -10%; width: 58%; aspect-ratio: 1; border-radius: 50%;
        background: radial-gradient(circle, rgba(169,222,95,.32) 0%, rgba(169,222,95,.1) 40%, transparent 70%);
        filter: blur(4px);
    }
}
.v2-arch::after {
    inset: auto; border: 0; -webkit-mask-image: none; mask-image: none;
    top: -4%; right: -10%; width: 58%; aspect-ratio: 1; border-radius: 50%;
    background: radial-gradient(circle, rgba(169,222,95,.3) 0%, rgba(169,222,95,.08) 40%, transparent 70%);
    filter: blur(4px);
}

/* Languages in the profile header as glass pills. */
.v2-hero-langs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 4px 0 18px; }
.v2-hero-langs-label { font-size: .74rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--lime); margin-right: 2px; }
.v2-hero-langs ul { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.v2 .v2-hero-langs li {
    display: inline-flex; align-items: center; gap: 7px; padding: 6px 14px 6px 12px; border-radius: 99px;
    background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    color: #fff; font-size: .92rem; font-weight: 600; line-height: 1.3;
}
.v2 .v2-hero-langs li::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 3px rgba(169,222,95,.2); }

/* Portraits, 4 Oct 2026 (Anand: the arch looked dated): a rounded square
   whose edges feather into the background instead of a hard border or an
   arch. The teal and lime glows behind stay. Applies to the profile header
   from 992px and to the about-page story photo; on a phone the profile
   avatar is a small rounded square with a soft shadow, no ring. */
.v2 .v2-profile .v2-profile-photo img,
.v2 .v2-profile .v2-profile-photo .v2-initials { border-radius: 22px; box-shadow: 0 16px 34px -14px rgba(0,0,0,.6); }
@media (min-width: 992px) {
    .v2 .v2-profile .v2-profile-photo img,
    .v2 .v2-profile .v2-profile-photo .v2-initials {
        aspect-ratio: 1 / 1.1; border-radius: 30px; box-shadow: none;
        -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%), linear-gradient(180deg, transparent 0, #000 8%, #000 88%, transparent 100%);
        -webkit-mask-composite: source-in;
                mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%), linear-gradient(180deg, transparent 0, #000 8%, #000 88%, transparent 100%);
                mask-composite: intersect;
    }
    .v2 .v2-profile .v2-profile-photo { padding: 0; }
}
.v2-arch img {
    aspect-ratio: 1 / 1.1; border-radius: 30px;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%), linear-gradient(180deg, transparent 0, #000 8%, #000 88%, transparent 100%);
    -webkit-mask-composite: source-in;
            mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%), linear-gradient(180deg, transparent 0, #000 8%, #000 88%, transparent 100%);
            mask-composite: intersect;
}
.v2-arch { padding: 0; }

/* Profile header, light (4 Oct 2026, Anand: light background, the photo in a
   circle). Undoes the dark treatment above: the blurred portrait sits under
   the site's usual pale wash, text goes back to ink, and the portrait is a
   circle on a soft teal-and-lime halo with a white rim. */
.v2 .v2-profile { background: var(--mint); color: var(--ink); }
.v2 .v2-profile .v2-hero-bg { filter: blur(38px) saturate(1.25); opacity: .85; }
.v2 .v2-profile::before {
    background:
        radial-gradient(120% 90% at 0% 0%, rgba(246,251,250,.97) 0%, rgba(246,251,250,.9) 45%, rgba(246,251,250,.62) 75%, rgba(35,163,159,.18) 100%),
        linear-gradient(180deg, rgba(255,255,255,0) 70%, #fff 100%);
}
.v2 .v2-profile h1 { color: var(--ink); }
.v2 .v2-profile .v2-kicker { color: var(--teal-deep); }
.v2 .v2-profile .v2-crumbs, .v2 .v2-profile .v2-crumbs a { color: var(--muted); }
.v2 .v2-profile .v2-crumbs li + li::before { color: var(--line); }
.v2 .v2-profile .v2-reg { color: #33504C; }
.v2 .v2-profile .v2-reg strong { color: var(--ink); }
.v2 .v2-profile .v2-hero-langs-label { color: var(--teal-deep); }
.v2 .v2-profile .v2-hero-langs li { background: rgba(255,255,255,.75); border-color: var(--line); color: var(--ink); }
.v2 .v2-profile .v2-hero-langs li::before { background: var(--teal); box-shadow: 0 0 0 3px rgba(35,163,159,.18); }
.v2 .v2-profile .v2-btn--solid { background: var(--teal-deep); border-color: var(--teal-deep); color: #fff !important; }
.v2 .v2-profile .v2-btn--solid:hover { background: var(--teal-deeper); border-color: var(--teal-deeper); }
.v2 .v2-profile .v2-btn--line { background: #fff; border-color: var(--line); color: var(--teal-deep) !important; }
.v2 .v2-profile .v2-btn--line:hover { border-color: var(--teal-deep); }

/* The circle. */
.v2 .v2-profile .v2-profile-photo img,
.v2 .v2-profile .v2-profile-photo .v2-initials {
    border-radius: 50% !important; aspect-ratio: 1; object-fit: cover; object-position: center 22%;
    -webkit-mask-image: none !important; mask-image: none !important;
    box-shadow: 0 0 0 4px #fff, 0 16px 34px -14px rgba(20,52,47,.45);
}
@media (min-width: 992px) {
    .v2 .v2-profile .v2-profile-photo { padding: 28px; }
    .v2 .v2-profile .v2-profile-photo img,
    .v2 .v2-profile .v2-profile-photo .v2-initials {
        width: 100%; height: auto;
        box-shadow: 0 0 0 10px rgba(255,255,255,.85), 0 0 0 11px rgba(15,124,120,.12), 0 40px 70px -34px rgba(20,52,47,.55);
    }
    .v2 .v2-profile .v2-profile-photo::before {
        width: 125%; top: 50%;
        background: radial-gradient(circle, rgba(35,163,159,.32) 0%, rgba(35,163,159,.12) 45%, transparent 70%);
    }
    .v2 .v2-profile .v2-profile-photo::after {
        top: 0; right: -4%; width: 48%;
        background: radial-gradient(circle, rgba(169,222,95,.42) 0%, rgba(169,222,95,.14) 40%, transparent 70%);
    }
}
/* Language pills without the dot (Anand, 4 Oct 2026). */
.v2 .v2-hero-langs li::before, .v2 .v2-profile .v2-hero-langs li::before { content: none; display: none; }
.v2 .v2-hero-langs li { padding: 6px 14px; }
/* Smaller language pills (Anand, 4 Oct 2026). */
.v2 .v2-hero-langs { gap: 6px 8px; }
.v2 .v2-hero-langs ul { gap: 6px; }
.v2 .v2-hero-langs li { padding: 3px 11px; font-size: .8rem !important; font-weight: 600; line-height: 1.5 !important; }

/* Careers page. */
.v2-work { display: grid; gap: 14px; margin-top: 18px; }
.v2-work-item { padding: 22px; border-radius: 18px; background: var(--sand); border: 1px solid var(--line); }
.v2-work-n { display: grid; place-items: center; width: 36px; height: 36px; margin-bottom: 12px; border-radius: 10px; background: var(--teal-deep); color: #fff; }
.v2-work-n svg { width: 18px; height: 18px; }
.v2 .v2-work-item h3 { font-size: 1.12rem; margin: 0 0 6px; }
.v2-work-item p { margin: 0; color: #33504C; font-size: .97rem; }
.v2-steps { display: grid; gap: 14px; list-style: none; margin: 18px 0 0; padding: 0; counter-reset: s; }
.v2-steps li { position: relative; padding: 20px 20px 20px 70px; border-radius: 18px; background: #fff; border: 1px solid var(--line); counter-increment: s; }
.v2-steps li::before { content: counter(s); position: absolute; left: 20px; top: 18px; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--lime); color: var(--ink); font-family: "Archivo", sans-serif; font-weight: 800; }
.v2-steps strong { display: block; font-family: "Archivo", sans-serif; font-size: 1.08rem; color: var(--ink); margin-bottom: 2px; }
.v2-steps span { color: #33504C; font-size: .97rem; }
@media (min-width: 640px) { .v2-work { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 992px) {
    .v2-work { grid-template-columns: repeat(3, 1fr); gap: 18px; }
    .v2-steps { grid-template-columns: repeat(3, 1fr); gap: 18px; }
    .v2-apply-side { position: sticky; top: 190px; }
}

/* Blog: the five newest posts as a slider. Native scroll-snap, so it swipes
   with or without the script; arrows and dots underneath. */
.v2-slider { margin-top: 18px; }
.v2-slider-track {
    display: grid; grid-auto-flow: column; grid-auto-columns: 100%; gap: 16px;
    overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
    scrollbar-width: none; padding-bottom: 6px;
}
.v2-slider-track::-webkit-scrollbar { display: none; }
.v2 .v2-slide { margin-top: 0; scroll-snap-align: start; }
.v2-slider-ui { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 14px; }
.v2-slider-btn { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line); background: #fff; color: var(--teal-deep); cursor: pointer; }
.v2-slider-btn:hover { border-color: var(--teal); }
.v2-slider-btn svg { width: 18px; height: 18px; }
.v2-slider-dots { display: flex; }
.v2-slider-dot { position: relative; width: 26px; height: 44px; border: 0; background: none; cursor: pointer; padding: 0; }
.v2-slider-dot::before { content: ""; position: absolute; left: 50%; top: 50%; width: 9px; height: 9px; transform: translate(-50%, -50%); border-radius: 99px; background: rgba(15,124,120,.25); transition: width .25s ease, background .25s ease; }
.v2-slider-dot.is-on::before { width: 22px; background: var(--teal-deep); }
@media (prefers-reduced-motion: reduce) { .v2-slider-dot::before { transition: none; } }

/* Email addresses stay on one line (rule in header.php); these boxes size the
   text to fit instead. */
.v2-contact-chip strong { font-size: clamp(.92rem, 1.15vw + .5rem, 1.05rem); }
.v2-big[href^="mailto:"] { font-size: clamp(1rem, 1.2vw + .55rem, 1.25rem); }

/* Accessibility pass, 5 Oct 2026: the dates in the sidebar's recent posts
   were #6d8280 on white (4.2:1); the muted ink passes. */
.v2 .art-recent__date { color: var(--muted); }
.v2-cover-credit { margin: 8px 2px 0; font-size: .8rem; line-height: 1.45; color: var(--muted); }
.v2-cover-credit a { color: var(--muted); text-decoration: underline; }

/* Weekly opening hours (v2/week_hours.php), from the admin's Working Hours. */
.v2-week { width: 100%; border-collapse: collapse; font-size: .95rem; margin-top: 4px; }
.v2-week th, .v2-week td { padding: 8px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.v2-week th { font-weight: 600; color: var(--ink); white-space: nowrap; }
.v2-week td { color: #33504C; text-align: right; }
.v2-week tr.is-closed td { color: var(--muted); }
.v2-week tr.is-today { background: var(--mint); }
.v2-week tr.is-today th, .v2-week tr.is-today td { color: var(--teal-deeper); font-weight: 700; }
.v2-week-today { display: inline-block; margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: var(--teal-deep); color: #fff; font-size: .72rem; font-weight: 700; vertical-align: 1px; }
.v2-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* Narrow cards (the Contact page's four-across row on desktop): one line per day. */
.v2-panel .v2-week { font-size: .86rem; }
.v2-panel .v2-week th, .v2-panel .v2-week td { padding: 7px 4px; }
.v2-week td { white-space: nowrap; }
