/* ============================================================
   TEKTON DEMO SYSTEM - physio skin
   Shared skin for every page in this demo (homepage + subpages).
   Copied verbatim from the homepage's inline <style> skin block.
   Loaded AFTER base.css so these tokens set the palette, fonts
   and weights; base.css provides all structure and components.
   ============================================================ */
:root{
  --brand:#2e5744; --brand-deep:#182e23; --brand-soft:#e6efe7;
  --accent:#3f7a5c; --accent-deep:#2e5744; --accent-soft:#e6efe7;
  --paper:#fdfcf9; --paper-2:#f4f1e9; --ink:#1f3229; --muted:#59685f; --line:#e4e0d4;
  --font-display:"Bricolage Grotesque",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --font-text:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --wt-head:600; --wt-h1:700; --radius:14px; --radius-sm:8px;
}

/* ------------------------------------------------------------
   Subpage hero add-on (NOT in base.css, added here per the skin).
   base.css scopes .quick-answer, .cta-row and .tel-link to the
   homepage .hero. The condition pages, the blog index and the
   articles place those same elements inside the compact .page-hero,
   so mirror that treatment here to keep every subpage hero on-system.
   ------------------------------------------------------------ */
.page-hero .quick-answer{font-size:var(--step-1);margin-top:var(--space-4);max-width:52ch}
.page-hero .cta-row{display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:center;margin-top:var(--space-5)}
.page-hero .tel-link{font-weight:600;color:var(--brand)}