/* =========================================================================
   PhysioFlexx Falkirk — Global stylesheet
   Base + layout primitives + components. Page-specific rules live in
   sections further down as templates are built.
   ========================================================================= */

/* ---- Reset / base ---------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
	margin: 0;
	background: var(--pf-bg);
	color: var(--pf-text);
	font-family: var(--pf-font-body);
	font-size: var(--pf-fs-body);
	line-height: var(--pf-lh-body);
	font-weight: var(--pf-fw-body);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

img, picture, svg, video { max-width: 100%; height: auto; display: block; }
a { color: var(--pf-link); text-decoration: none; }
a:hover { color: var(--pf-link-hover); }
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
	outline: 3px solid var(--pf-primary);
	outline-offset: 2px;
	border-radius: 4px;
}

h1, h2, h3, h4 {
	font-family: var(--pf-font-head);
	line-height: var(--pf-lh-heading);
	color: var(--pf-ink);
	margin: 0 0 0.5em;
	font-weight: var(--pf-fw-bold);
	letter-spacing: -0.01em;
}
h1 { font-size: var(--pf-fs-h1); font-weight: var(--pf-fw-extrabold); }
h2 { font-size: var(--pf-fs-h2); }
h3 { font-size: var(--pf-fs-h3); }
h4 { font-size: var(--pf-fs-h4); }
p { margin: 0 0 1em; }
ul, ol { margin: 0 0 1em; padding-left: 1.25em; }

/* ---- Accessibility helpers ------------------------------------------ */
.pf-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	background: var(--pf-primary-dark);
	color: #fff;
	padding: 0.75rem 1.25rem;
	border-radius: 0 0 var(--pf-radius-sm) 0;
	z-index: 1000;
}
.pf-skip-link:focus { left: 0; color: #fff; }
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px; overflow: hidden;
	clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ---- Layout primitives ---------------------------------------------- */
.pf-container {
	width: 100%;
	max-width: var(--pf-container);
	margin-inline: auto;
	padding-inline: var(--pf-gutter);
}
.pf-container--wide { max-width: var(--pf-container-wide); }
.pf-measure { max-width: var(--pf-measure); }

/* Decorative shapes (.pf-framed__blob, the section motifs) are deliberately
   offset past their own box, which on narrow viewports pushes them beyond the
   screen edge and gives the whole page a few pixels of horizontal scroll.
   Clipping lets the shapes still peek out while stopping them scrolling the
   page. Use clip, not hidden: hidden makes these scroll containers, which
   breaks the sticky header, .pf-sticky-rail and .pf-about__gallery.

   .pf-main is the catch-all. Clipping only .pf-section and .pf-hero missed the
   bespoke hero sections (.pf-flexx-hero, .pf-detail-hero, .pf-pagehero), which
   carry their own framed media and so overflowed on every inner page. Keeping
   the section-level rule as well scopes the clip tightly where the class is
   used, so a future full-bleed child inside one section cannot be clipped by
   an ancestor further up than necessary. */
.pf-main { overflow-x: clip; }
.pf-section { padding-block: var(--pf-section-y); overflow-x: clip; }
.pf-section--tint { background: var(--pf-blue-tint); }
.pf-section--warm { background: var(--pf-bg-warm); }
.pf-section--dark { background: var(--pf-cta-band); color: #fff; }
.pf-section--dark h1, .pf-section--dark h2, .pf-section--dark h3 { color: #fff; }

.pf-eyebrow {
	font-family: var(--pf-font-head);
	font-weight: var(--pf-fw-semibold);
	font-size: var(--pf-fs-eyebrow);
	letter-spacing: var(--pf-tracking-caps);
	text-transform: uppercase;
	color: var(--pf-primary);
	margin: 0 0 var(--pf-space-3);
	display: inline-block;
}
.pf-section--dark .pf-eyebrow { color: var(--pf-primary-soft); }

/* ---- Buttons / pills ------------------------------------------------- */
.pf-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	font-family: var(--pf-font-head);
	font-weight: var(--pf-fw-semibold);
	font-size: 1rem;
	line-height: 1;
	padding: 0.9rem 1.6rem;
	border-radius: var(--pf-radius-pill);
	border: 2px solid transparent;
	cursor: pointer;
	transition: transform var(--pf-dur) var(--pf-ease),
		background var(--pf-dur) var(--pf-ease),
		color var(--pf-dur) var(--pf-ease),
		border-color var(--pf-dur) var(--pf-ease);
	min-height: 48px; /* touch target */
}
.pf-btn:hover { transform: translateY(-1px); }
.pf-btn--primary { background: var(--pf-primary); color: #fff; }
.pf-btn--primary:hover { background: var(--pf-primary-dark); color: #fff; }
.pf-btn--outline { background: transparent; color: var(--pf-primary); border-color: var(--pf-primary); }
.pf-btn--outline:hover { background: var(--pf-primary); color: #fff; }
.pf-btn--on-dark { background: #fff; color: var(--pf-primary-dark); }
.pf-btn--on-dark:hover { background: var(--pf-blue-tint); color: var(--pf-primary-dark); }
.pf-btn--ghost-on-dark { background: transparent; color: #fff; border-color: rgba(255,255,255,0.6); }
.pf-btn--ghost-on-dark:hover { background: rgba(255,255,255,0.12); color: #fff; }

/* ---- Cards ----------------------------------------------------------- */
.pf-card {
	background: #fff;
	border: 1px solid var(--pf-line);
	border-radius: var(--pf-radius);
	box-shadow: var(--pf-shadow-card);
	padding: var(--pf-space-6);
}

/* ---- Prose (legal + article body) ----------------------------------- */
.pf-prose { font-size: var(--pf-fs-body); }
.pf-prose h2 { margin-top: 1.6em; }
.pf-prose h3 { margin-top: 1.4em; }
.pf-prose a { text-decoration: underline; text-underline-offset: 2px; }

/* =========================================================================
   GLOBAL CHROME — top bar, header, nav, CTA band, footer, sticky bar, modal
   ========================================================================= */

/* ---- Icons + stars --------------------------------------------------- */
.pf-icon { flex: none; }
.pf-stars { display: inline-flex; gap: 2px; }
.pf-star { color: var(--pf-line); }
.pf-star.is-on { color: var(--pf-star); }
.pf-star .pf-star__svg { fill: currentColor; stroke: none; }
.pf-dotspine { display: inline-grid; grid-template-columns: repeat(3, 6px); gap: 4px; width: max-content; }
.pf-dotspine span { width: 6px; height: 6px; border-radius: 50%; background: var(--pf-accent); }
.pf-dotspine span:nth-child(2) { transform: translateY(5px); }
.pf-dotspine span:nth-child(3) { transform: translateY(10px); }
.pf-dotspine--sm { grid-template-columns: repeat(3, 4px); gap: 3px; }
.pf-dotspine--sm span { width: 4px; height: 4px; }
.pf-dotspine--sm span:nth-child(2) { transform: translateY(3px); }
.pf-dotspine--sm span:nth-child(3) { transform: translateY(6px); }
.pf-dotspine--light span { background: rgba(255,255,255,0.55); }

.pf-btn--full { width: 100%; }
.pf-btn--sm { padding: 0.6rem 1.1rem; min-height: 40px; font-size: 0.9rem; }

/* ---- Top bar --------------------------------------------------------- */
.pf-topbar { background: var(--pf-primary-dark); color: #fff; font-size: 0.85rem; }
.pf-topbar__inner { display: flex; align-items: center; justify-content: space-between; min-height: 40px; gap: 1rem; }
.pf-topbar__contact { display: flex; gap: 1.5rem; align-items: center; min-width: 0; }
.pf-topbar__link { color: rgba(255,255,255,0.92); display: inline-flex; align-items: center; gap: 0.4rem; min-width: 0; }
.pf-topbar__link span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-topbar__link:hover { color: #fff; }
.pf-topbar__ico { opacity: 0.8; }
.pf-topbar__message { margin: 0; display: inline-flex; align-items: center; gap: 0.55rem; color: rgba(255,255,255,0.92); font-weight: 600; }
.pf-topbar__message .pf-dotspine span { background: var(--pf-primary-soft); }

/* ---- Header ---------------------------------------------------------- */
.pf-header {
	position: sticky; top: 0; z-index: var(--pf-z-header);
	background: #fff; border-bottom: 1px solid var(--pf-line);
	transition: box-shadow var(--pf-dur) var(--pf-ease);
}
.pf-header.is-scrolled { box-shadow: var(--pf-shadow); }
.pf-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 80px; }
/* Full-width header + top bar (content spans the viewport, not the 1200px container). */
.pf-header .pf-container, .pf-topbar .pf-container { max-width: none; padding-inline: clamp(1.25rem, 3.5vw, 3rem); }

.pf-logo { display: inline-flex; align-items: baseline; gap: 0.4rem; font-family: var(--pf-font-head); line-height: 1; }
.pf-logo__name { font-weight: 800; font-size: 1.4rem; color: var(--pf-primary); letter-spacing: -0.02em; }
.pf-logo__place { font-weight: 700; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.22em; color: var(--pf-accent); }
.pf-logo--footer .pf-logo__name { color: #fff; }
.pf-logo--footer .pf-logo__place { color: var(--pf-primary-soft); }

.pf-nav { display: flex; align-items: center; gap: 1.75rem; }
.pf-nav__list { display: flex; align-items: center; gap: 1.5rem; list-style: none; margin: 0; padding: 0; }
.pf-nav__list a { font-family: var(--pf-font-head); font-weight: 500; font-size: 0.98rem; color: var(--pf-ink); padding: 0.35rem 0; position: relative; white-space: nowrap; }
.pf-nav__list a:hover, .pf-nav__list a[aria-current="page"] { color: var(--pf-primary); }
.pf-nav__list a[aria-current="page"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: var(--pf-primary); border-radius: 2px; }
.pf-nav__cta { display: flex; }
/* Compact, single-line Book button in the header (avoids the squished wrap). */
.pf-nav__cta .pf-btn { padding: 0.58rem 1.3rem; min-height: 44px; font-size: 0.95rem; font-weight: 600; white-space: nowrap; }

/* Burger (hidden on desktop) */
.pf-burger { display: none; background: none; border: 0; cursor: pointer; padding: 0.5rem; width: 48px; height: 48px; }
.pf-burger__box { position: relative; display: block; width: 26px; height: 2px; margin: 0 auto; }
.pf-burger__line, .pf-burger__line::before, .pf-burger__line::after { content: ""; position: absolute; left: 0; width: 26px; height: 2px; background: var(--pf-ink); border-radius: 2px; transition: transform var(--pf-dur) var(--pf-ease), opacity var(--pf-dur); }
.pf-burger__line { top: 0; }
.pf-burger__line::before { top: -8px; }
.pf-burger__line::after { top: 8px; }
.pf-nav-open .pf-burger__line { background: transparent; }
.pf-nav-open .pf-burger__line::before { transform: translateY(8px) rotate(45deg); }
.pf-nav-open .pf-burger__line::after { transform: translateY(-8px) rotate(-45deg); }

/* ---- CTA band -------------------------------------------------------- */
.pf-cta-band { position: relative; overflow: hidden; }
.pf-cta-band__inner { display: flex; align-items: center; justify-content: space-between; gap: 2.5rem; flex-wrap: wrap; position: relative; z-index: 1; }
.pf-cta-band__text { max-width: 40rem; }
.pf-cta-band__text h2 { font-size: clamp(1.6rem, 1rem + 2.4vw, 2.4rem); margin-bottom: 0.35em; }
.pf-cta-band__sub { color: rgba(255,255,255,0.82); font-size: 1.05rem; margin: 0; }
.pf-cta-band__actions { display: flex; gap: 0.9rem; flex-wrap: wrap; }
.pf-cta-band__motif { position: absolute; right: -60px; top: -60px; width: 340px; height: 340px; border-radius: 50%; background: radial-gradient(circle at 30% 30%, rgba(143,176,198,0.18), transparent 62%); pointer-events: none; }
.pf-cta-band .pf-dotspine { margin-bottom: 1rem; }

/* ---- Footer ---------------------------------------------------------- */
.pf-footer { padding-top: var(--pf-section-y); }
.pf-footer__grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: 2.5rem; padding-bottom: var(--pf-space-7); }
.pf-footer__logo { display: inline-block; max-width: 210px; }
.pf-footer__logo img { display: block; width: 100%; height: auto; }
.pf-footer__about { color: rgba(255,255,255,0.75); font-size: 0.95rem; margin-top: 1rem; }
.pf-footer__credential { display: inline-flex; align-items: center; gap: 0.5rem; color: #fff; font-weight: 600; margin-top: 1rem; font-size: 0.9rem; }
.pf-footer__credential .pf-icon { color: var(--pf-primary-soft); }
.pf-footer__accreds { list-style: none; padding: 0; margin: 1rem 0 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.pf-footer__accreds li { font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(255,255,255,0.8); border: 1px solid rgba(255,255,255,0.25); border-radius: var(--pf-radius-pill); padding: 0.25rem 0.7rem; }
.pf-footer__heading { color: #fff; font-size: 0.95rem; text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 1rem; }
.pf-footer__col ul, .pf-footer__contact ul { list-style: none; padding: 0; margin: 0; }
.pf-footer__col li { margin-bottom: 0.6rem; }
.pf-footer a:not(.pf-btn) { color: rgba(255,255,255,0.8); }
.pf-footer a:not(.pf-btn):hover { color: #fff; }
.pf-footer__contact p { margin: 0 0 0.5rem; }
.pf-footer__address { font-style: normal; color: rgba(255,255,255,0.75); font-size: 0.92rem; margin-top: 0.5rem; }
.pf-footer__book { margin-top: 1.25rem; }
.pf-footer__bar { border-top: 1px solid rgba(255,255,255,0.15); }
.pf-footer__bar-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-block: 1.25rem; flex-wrap: wrap; }
.pf-footer__copy { margin: 0; color: rgba(255,255,255,0.7); font-size: 0.85rem; }
.pf-footer__legal { list-style: none; display: flex; gap: 1.25rem; margin: 0; padding: 0; flex-wrap: wrap; }
.pf-footer__legal a { font-size: 0.85rem; }

/* ---- Mobile sticky Book bar (mobile only) ---------------------------- */
.pf-sticky-bar { display: none; }
.pf-sticky-bar__btn { flex: 1; }

/* ---- Booking modal --------------------------------------------------- */
.pf-modal { position: fixed; inset: 0; z-index: var(--pf-z-popup); display: flex; align-items: center; justify-content: center; padding: 1rem; }
.pf-modal[hidden] { display: none; }
.pf-modal__overlay { position: absolute; inset: 0; background: rgba(16,29,44,0.55); backdrop-filter: blur(2px); }
.pf-modal__dialog { position: relative; background: #fff; border-radius: var(--pf-radius-lg); width: min(720px, 100%); max-height: 90vh; overflow: auto; box-shadow: var(--pf-shadow-lg); }
.pf-modal__close { position: absolute; top: 0.5rem; right: 0.75rem; background: none; border: 0; font-size: 2rem; line-height: 1; color: var(--pf-ink-soft); cursor: pointer; z-index: 2; }
.pf-modal__body { padding: 2.5rem 1.5rem 1.5rem; }
.pf-modal__body iframe { width: 100%; min-height: 70vh; border: 0; }
body.pf-modal-open { overflow: hidden; }

/* =========================================================================
   RESPONSIVE — collapse nav + show sticky bar
   ========================================================================= */
@media (max-width: 900px) {
	.pf-header__inner { min-height: 66px; }
	.pf-burger { display: block; order: 3; }
	.pf-nav {
		position: absolute; left: 0; right: 0; top: 100%;
		flex-direction: column; align-items: stretch; gap: 0;
		background: #fff; border-bottom: 1px solid var(--pf-line);
		box-shadow: var(--pf-shadow); padding: 0.5rem 0 1.25rem;
		max-height: 0; overflow: hidden; visibility: hidden;
		transition: max-height var(--pf-dur) var(--pf-ease), visibility var(--pf-dur);
	}
	.pf-nav-open .pf-nav { max-height: 90vh; visibility: visible; overflow: auto; }
	.pf-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
	.pf-nav__list a { display: block; padding: 0.9rem var(--pf-gutter); border-bottom: 1px solid var(--pf-line); }
	.pf-nav__list a[aria-current="page"]::after { display: none; }
	.pf-nav__cta { padding: 1rem var(--pf-gutter) 0; }
	.pf-nav__cta .pf-btn { width: 100%; }

	.pf-topbar__contact { gap: 1rem; }
	.pf-topbar__message { display: none; }

	.pf-footer__grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
	.pf-footer__brand { grid-column: 1 / -1; }

	/* Sticky Book bar on small screens */
	.pf-sticky-bar {
		display: flex; gap: 0.6rem; position: fixed; left: 0; right: 0; bottom: 0;
		z-index: var(--pf-z-sticky-bar); padding: 0.6rem var(--pf-gutter);
		background: rgba(255,255,255,0.97); border-top: 1px solid var(--pf-line);
		box-shadow: 0 -6px 20px rgba(16,62,95,0.08); backdrop-filter: blur(6px);
	}
	.pf-sticky-bar__btn--call {
		display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
		min-height: 48px; padding: 0.5rem 1rem; line-height: 1;
		font-family: var(--pf-font-head); font-weight: 600; font-size: 0.95rem;
		border-radius: var(--pf-radius-pill);
		background: #fff; color: var(--pf-primary); border: 2px solid var(--pf-primary);
	}
	.pf-sticky-bar__btn--call:hover { background: var(--pf-primary); color: #fff; }
	.pf-sticky-bar__btn--call svg { flex: none; }
	body { padding-bottom: 72px; } /* room for the sticky bar */
}

@media (max-width: 540px) {
	.pf-footer__grid { grid-template-columns: 1fr; }
	.pf-cta-band__actions { width: 100%; }
	.pf-cta-band__actions .pf-btn { flex: 1; }
}

/* =========================================================================
   HOME + shared section components
   ========================================================================= */

/* ---- Section heads --------------------------------------------------- */
.pf-section-head { margin-bottom: var(--pf-space-7); }
.pf-section-head--center { text-align: center; max-width: 44rem; margin-inline: auto; }
.pf-section-head h2 { font-size: clamp(1.6rem, 1.1rem + 1.8vw, 2.2rem); margin-bottom: 0.4em; }
.pf-section-head__intro { color: var(--pf-ink-soft); font-size: 1.06rem; margin: 0; }
.pf-section--dark .pf-section-head__intro { color: rgba(255,255,255,0.8); }

/* ---- Icon chip ------------------------------------------------------- */
.pf-icon-chip {
	display: inline-flex; align-items: center; justify-content: center;
	width: 54px; height: 54px; border-radius: var(--pf-radius-chip);
	background: var(--pf-blue-tint); color: var(--pf-primary);
	margin-bottom: var(--pf-space-4);
}

/* ---- Text link (arrow) ---------------------------------------------- */
.pf-textlink { display: inline-flex; align-items: center; gap: 0.4rem; font-family: var(--pf-font-head); font-weight: 600; font-size: 0.95rem; color: var(--pf-primary); }
.pf-textlink__arrow, .pf-textlink svg { transition: transform var(--pf-dur) var(--pf-ease); }
.pf-textlink:hover svg { transform: translateX(3px); }

/* ---- Framed media (slate blob + dots) ------------------------------- */
.pf-framed { position: relative; }
.pf-framed__media { position: relative; z-index: 1; border-radius: var(--pf-radius-lg); overflow: hidden; aspect-ratio: 4 / 3; box-shadow: var(--pf-shadow); }
.pf-framed__img, .pf-framed__media img { width: 100%; height: 100%; object-fit: cover; }
.pf-framed__blob { position: absolute; z-index: 0; width: 68%; height: 74%; right: -6%; bottom: -8%; background: var(--pf-accent); opacity: 0.14; border-radius: 44% 56% 52% 48% / 52% 44% 56% 48%; }
.pf-framed__dots { position: absolute; z-index: 2; top: -12px; left: -12px; }
.pf-framed__dots .pf-dotspine span { width: 8px; height: 8px; }
.pf-framed--hero .pf-framed__media { aspect-ratio: 4 / 5; }

/* Hero video: fills the same frame as the still, cropped to centre. The poster
   (the hero image) paints first, so the LCP element is unchanged. */
.pf-framed__media--video { background: var(--pf-blue-tint); }
.pf-framed__video { display: block; width: 100%; height: 100%; object-fit: cover; }
/* Pause/play control - WCAG 2.2.2, as the loop runs longer than 5s. Revealed
   by JS, and hidden without it because without JS it cannot work. */
.pf-framed__videobtn {
	position: absolute; z-index: 2; right: 0.75rem; bottom: 0.75rem;
	display: inline-flex; align-items: center; gap: 0.4rem;
	padding: 0.4rem 0.75rem; border: 0; border-radius: 999px; cursor: pointer;
	font: inherit; font-size: 0.8125rem; line-height: 1.2;
	background: rgba(255, 255, 255, 0.92); color: var(--pf-primary);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.24);
}
.pf-framed__videobtn:hover { background: #fff; }
.pf-framed__videobtn:focus-visible { outline: 3px solid var(--pf-accent); outline-offset: 2px; }
.pf-framed__videobtn[hidden] { display: none; }

/* Placeholder box */
.pf-media__placeholder {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.75rem;
	width: 100%; height: 100%; min-height: 260px; aspect-ratio: 4 / 3;
	background: linear-gradient(140deg, var(--pf-blue-tint), #dde8f0);
	color: var(--pf-primary-mid); border-radius: inherit;
}
.pf-media__placeholder .pf-dotspine span { width: 10px; height: 10px; background: var(--pf-primary-soft); }
.pf-media__placeholder-label { font-family: var(--pf-font-head); font-size: 0.8rem; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.75; }

/* ---- Hero ------------------------------------------------------------ */
/* Clipped for the same reason as .pf-section: the hero carries its own framed
   blob, which overhangs on narrow viewports. */
.pf-hero { padding-block: clamp(2.5rem, 1.5rem + 4vw, 5rem); background: linear-gradient(180deg, #fff 0%, var(--pf-bg-light) 100%); overflow-x: clip; }
.pf-hero__inner { display: grid; grid-template-columns: 60fr 40fr; gap: clamp(2rem, 1rem + 4vw, 4.5rem); align-items: center; }
.pf-hero__eyebrow { display: inline-flex; align-items: center; gap: 0.6rem; }
.pf-hero__title { font-size: var(--pf-fs-display); line-height: 1.08; margin-bottom: 0.5em; }
.pf-hero__sub { font-size: 1.15rem; color: var(--pf-ink-soft); max-width: 34rem; margin-bottom: 1.75rem; }
.pf-hero__actions { display: flex; flex-wrap: wrap; gap: 0.9rem; margin-bottom: 1.75rem; }
.pf-hero__trust { display: inline-flex; align-items: center; gap: 0.6rem; font-size: 0.95rem; color: var(--pf-ink-soft); margin: 0 0 0.6rem; }
.pf-hero__trust-badge { font-family: var(--pf-font-head); font-weight: 800; font-size: 0.75rem; letter-spacing: 0.03em; color: #fff; background: var(--pf-primary-dark); padding: 0.28rem 0.6rem; border-radius: 5px; }
.pf-hero__reviews { display: inline-flex; align-items: center; gap: 0.6rem; margin: 0; font-size: 0.95rem; }
.pf-hero__reviews a { font-weight: 600; }

/* ---- Why / trust cards ---------------------------------------------- */
.pf-why__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--pf-space-5); }
.pf-why__card { background: #fff; border: 1px solid var(--pf-line); border-radius: var(--pf-radius); padding: var(--pf-space-6); box-shadow: var(--pf-shadow-card); }
.pf-why__card h3 { font-size: 1.2rem; margin-bottom: 0.4em; }
.pf-why__card p { color: var(--pf-ink-soft); margin: 0; font-size: 0.98rem; }

/* ---- About strip ----------------------------------------------------- */
.pf-about-strip__inner { display: grid; grid-template-columns: 0.95fr 1.05fr; gap: clamp(2rem, 1rem + 4vw, 4.5rem); align-items: center; }
.pf-about-strip__text h2 { font-size: clamp(1.7rem, 1.1rem + 2vw, 2.3rem); }
.pf-about-strip__text p { color: var(--pf-ink-soft); }
.pf-checklist { list-style: none; padding: 0; margin: 1.5rem 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0.7rem 1.25rem; }
.pf-checklist li { display: flex; align-items: flex-start; gap: 0.55rem; font-weight: 600; color: var(--pf-ink); font-size: 0.96rem; }
.pf-checklist .pf-icon { color: var(--pf-primary); margin-top: 2px; }

/* ---- Services grid --------------------------------------------------- */
.pf-services__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--pf-space-5); }
.pf-svc-card { background: #fff; border: 1px solid var(--pf-line); border-radius: var(--pf-radius); padding: var(--pf-space-6); box-shadow: var(--pf-shadow-card); transition: transform var(--pf-dur) var(--pf-ease), box-shadow var(--pf-dur) var(--pf-ease); display: flex; flex-direction: column; }
.pf-svc-card:hover { transform: translateY(-4px); box-shadow: var(--pf-shadow); }
.pf-svc-card__title { font-size: 1.2rem; margin-bottom: 0.4em; }
.pf-svc-card__title a { color: var(--pf-ink); }
.pf-svc-card__title a:hover { color: var(--pf-primary); }
.pf-svc-card__text { color: var(--pf-ink-soft); font-size: 0.96rem; flex: 1; margin-bottom: 1.1rem; }

/* ---- Team ------------------------------------------------------------ */
.pf-team__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--pf-space-6); }
.pf-team-card { display: grid; grid-template-columns: 0.8fr 1.2fr; background: #fff; border: 1px solid var(--pf-line); border-radius: var(--pf-radius-lg); overflow: hidden; box-shadow: var(--pf-shadow-card); }
.pf-team-card__photo { position: relative; min-height: 240px; }
.pf-team-card__photo img, .pf-team-card__photo .pf-media__placeholder { width: 100%; height: 100%; object-fit: cover; aspect-ratio: auto; border-radius: 0; }
.pf-team-card__body { padding: var(--pf-space-6); }
.pf-team-card__name { font-size: 1.3rem; margin-bottom: 0.15em; }
.pf-team-card__role { color: var(--pf-primary); font-weight: 600; font-size: 0.92rem; margin-bottom: 0.75rem; }
.pf-team-card__text { color: var(--pf-ink-soft); font-size: 0.95rem; margin-bottom: 1.1rem; }
.pf-team-card__actions { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }

/* ---- Reviews (dark) -------------------------------------------------- */
.pf-reviews { position: relative; overflow: hidden; }
.pf-reviews__motif { position: absolute; left: -80px; bottom: -80px; width: 320px; height: 320px; border-radius: 50%; background: radial-gradient(circle at 60% 40%, rgba(143,176,198,0.16), transparent 60%); }
.pf-reviews__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--pf-space-5); position: relative; z-index: 1; }
/* Third-party reviews widget. min-height reserves space so the lazily loaded
   widget does not shift the page as it paints. */
.pf-reviews__embed { position: relative; z-index: 1; min-height: 320px; }
.pf-review-card { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.14); border-radius: var(--pf-radius); padding: var(--pf-space-6); margin: 0; }
.pf-review-card__title { font-family: var(--pf-font-head); font-weight: 700; color: #fff; margin: 0.75rem 0 0.5rem; }
.pf-review-card__quote { margin: 0 0 1.25rem; color: rgba(255,255,255,0.85); font-size: 0.98rem; border: 0; padding: 0; }
.pf-review-card__cite { display: flex; align-items: center; gap: 0.5rem; }
.pf-review-card__name { font-weight: 700; color: #fff; }
.pf-review-card__source { font-size: 0.85rem; color: var(--pf-primary-soft); }
.pf-review-card__source::before { content: "· "; }

/* ---- FAQ accordion --------------------------------------------------- */
.pf-faq__inner { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: clamp(2rem, 1rem + 3vw, 4rem); align-items: start; }
.pf-faq__intro { color: var(--pf-ink-soft); margin-bottom: 1.5rem; }
.pf-accordion { display: flex; flex-direction: column; gap: 0.75rem; }
.pf-accordion__item { background: #fff; border: 1px solid var(--pf-line); border-radius: var(--pf-radius); overflow: hidden; }
.pf-accordion__h { margin: 0; font-size: 1rem; }
.pf-accordion__trigger { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1rem; text-align: left; background: none; border: 0; cursor: pointer; padding: 1.1rem 1.25rem; font-family: var(--pf-font-head); font-weight: 600; font-size: 1.02rem; color: var(--pf-ink); }
.pf-accordion__icon { position: relative; flex: none; width: 20px; height: 20px; }
.pf-accordion__icon::before, .pf-accordion__icon::after { content: ""; position: absolute; background: var(--pf-primary); border-radius: 2px; transition: transform var(--pf-dur) var(--pf-ease), opacity var(--pf-dur); }
.pf-accordion__icon::before { top: 9px; left: 2px; width: 16px; height: 2px; }
.pf-accordion__icon::after { left: 9px; top: 2px; width: 2px; height: 16px; }
.pf-accordion__trigger[aria-expanded="true"] .pf-accordion__icon::after { opacity: 0; transform: rotate(90deg); }
.pf-accordion__panel { padding: 0 1.25rem 1.25rem; }
.pf-accordion__panel .pf-prose { color: var(--pf-ink-soft); }
.pf-accordion__panel .pf-prose p:last-child { margin-bottom: 0; }

/* =========================================================================
   HOME responsive
   ========================================================================= */
@media (max-width: 980px) {
	.pf-hero__inner { grid-template-columns: 1fr; }
	.pf-hero__media { order: -1; max-width: 340px; margin-inline: auto; }
	.pf-why__grid, .pf-services__grid, .pf-reviews__grid { grid-template-columns: repeat(2, 1fr); }
	.pf-about-strip__inner { grid-template-columns: 1fr; }
	.pf-about-strip__media { max-width: 520px; }
	.pf-team__grid { grid-template-columns: 1fr; }
	.pf-faq__inner { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	.pf-why__grid, .pf-services__grid, .pf-reviews__grid { grid-template-columns: 1fr; }
	.pf-checklist { grid-template-columns: 1fr; }
	.pf-team-card { grid-template-columns: 1fr; }
	.pf-hero__actions .pf-btn { flex: 1; }
}

/* =========================================================================
   PAGE HERO + DETAIL/HUB COMPONENTS (services, conditions, inner pages)
   ========================================================================= */

/* ---- Page hero ------------------------------------------------------- */
.pf-pagehero { padding-block: clamp(2.5rem, 1.5rem + 3vw, 4.5rem); }
.pf-pagehero__inner { max-width: 52rem; }
.pf-pagehero__eyebrow { display: inline-flex; align-items: center; gap: 0.6rem; }
.pf-pagehero__title { font-size: clamp(2rem, 1.3rem + 2.6vw, 3rem); margin-bottom: 0.35em; }
.pf-pagehero__intro { font-size: 1.15rem; color: var(--pf-ink-soft); margin: 0; }

/* ---- Zig-zag rows (services hub) ------------------------------------ */
.pf-zz { display: block; }
.pf-zz__row { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 1rem + 4vw, 4.5rem); align-items: center; }
.pf-zz__row + .pf-zz__row { margin-top: clamp(3rem, 2rem + 3vw, 5rem); }
.pf-zz__row--reverse .pf-zz__media { order: 2; }
.pf-zz__title { font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2rem); margin-bottom: 0.4em; }
.pf-zz__intro { color: var(--pf-ink-soft); margin-bottom: 1.25rem; }
.pf-services-hub__foot { margin-top: clamp(3rem, 2rem + 3vw, 5rem); }

/* ---- Tag list (inline checks) --------------------------------------- */
.pf-taglist { list-style: none; padding: 0; margin: 0 0 1.5rem; display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; }
.pf-taglist li { display: inline-flex; align-items: center; gap: 0.45rem; font-weight: 600; font-size: 0.92rem; color: var(--pf-ink); }
.pf-taglist .pf-icon { color: var(--pf-primary); }

/* ---- Icon chip small ------------------------------------------------ */
.pf-icon-chip--sm { width: 44px; height: 44px; margin-bottom: 0; }

/* ---- Detail hero (service/condition) -------------------------------- */
.pf-detail-hero { padding-block: clamp(2.5rem, 1.5rem + 3vw, 4rem); }
.pf-detail-hero__inner { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(2rem, 1rem + 4vw, 4rem); align-items: center; }
.pf-detail-hero__text h1 { font-size: clamp(1.9rem, 1.3rem + 2.4vw, 2.8rem); }
.pf-detail-hero__intro { font-size: 1.1rem; color: var(--pf-ink-soft); margin-bottom: 1.5rem; }
.pf-detail-hero__actions { display: flex; flex-wrap: wrap; gap: 0.8rem; }

/* ---- Highlights strip ----------------------------------------------- */
.pf-highlights { background: #fff; border-bottom: 1px solid var(--pf-line); }
.pf-highlights__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--pf-space-5); padding-block: var(--pf-space-6); }
.pf-highlight { display: flex; gap: 0.9rem; align-items: flex-start; }
.pf-highlight h3 { font-size: 1.05rem; margin-bottom: 0.2em; }
.pf-highlight p { margin: 0; color: var(--pf-ink-soft); font-size: 0.92rem; }

/* ---- Detail: article + sticky sidebar ------------------------------- */
.pf-detail__grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: clamp(2rem, 1rem + 3vw, 3.5rem); align-items: start; }
.pf-detail__main { font-size: 1.02rem; }
.pf-detail__main > h2 { font-size: 1.5rem; }
.pf-sticky-rail { position: sticky; top: 108px; display: flex; flex-direction: column; gap: 1.25rem; }

/* Bullets with brand dot */
.pf-bullets { list-style: none; padding: 0; margin: 0 0 1.25rem; display: grid; gap: 0.6rem; }
.pf-bullets li { position: relative; padding-left: 1.6rem; }
.pf-bullets li::before { content: ""; position: absolute; left: 0; top: 0.55em; width: 8px; height: 8px; border-radius: 50%; background: var(--pf-primary); }

/* Article figure */
.pf-article-figure { margin: 1.75rem 0; }
.pf-article-figure img, .pf-article-figure .pf-media__placeholder { border-radius: var(--pf-radius-lg); width: 100%; }
.pf-article-figure figcaption { font-size: 0.85rem; color: var(--pf-ink-soft); margin-top: 0.5rem; }

/* Callouts */
.pf-callout { border-radius: var(--pf-radius); padding: 1.25rem 1.5rem; margin: 1.75rem 0; border: 1px solid; }
.pf-callout h3 { font-size: 1.1rem; margin-bottom: 0.5em; }
.pf-callout--info { background: var(--pf-blue-tint); border-color: #cfe0ec; }
.pf-callout--info h3 { color: var(--pf-primary-dark); }
.pf-callout--warning { background: var(--pf-flag-bg); border-color: #f0d5cd; }
.pf-callout--warning h3 { color: var(--pf-flag-ink); }
.pf-callout--warning .pf-bullets li::before { background: var(--pf-flag-ink); }

/* Packages */
.pf-packages { display: grid; gap: 0.75rem; margin: 1rem 0 1.5rem; }
.pf-package { display: flex; align-items: baseline; gap: 1rem; background: #fff; border: 1px solid var(--pf-line); border-radius: var(--pf-radius-sm); padding: 0.9rem 1.25rem; }
.pf-package__label { font-weight: 600; flex: 1; }
.pf-package__price { font-family: var(--pf-font-head); font-weight: 800; color: var(--pf-primary); font-size: 1.15rem; }
.pf-package__ps { color: var(--pf-ink-soft); font-size: 0.85rem; }

/* Booking card + info panel */
.pf-book-card { background: #fff; border: 1px solid var(--pf-line); border-radius: var(--pf-radius); box-shadow: var(--pf-shadow); padding: var(--pf-space-6); }
.pf-book-card__h { font-size: 1.2rem; margin-bottom: 0.5rem; }
.pf-book-card__note { color: var(--pf-ink-soft); font-size: 0.92rem; margin-bottom: 1rem; }
.pf-book-card .pf-btn { margin-bottom: 0.75rem; }
.pf-book-card__call { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 600; font-size: 0.95rem; }
.pf-info-panel { background: var(--pf-blue-tint); border-radius: var(--pf-radius); padding: var(--pf-space-6); }
.pf-info-panel h3 { font-size: 1.05rem; margin-bottom: 0.75rem; }
.pf-info-panel ul { list-style: none; padding: 0; margin: 0 0 0.75rem; display: grid; gap: 0.4rem; }
.pf-info-panel p { margin: 0; color: var(--pf-ink-soft); font-size: 0.92rem; }

/* Safety note */
.pf-safety { display: flex; gap: 1rem; align-items: flex-start; background: var(--pf-bg-warm); border: 1px solid var(--pf-line); border-left: 4px solid var(--pf-accent); border-radius: var(--pf-radius-sm); padding: 1.25rem 1.5rem; }
.pf-safety__icon { color: var(--pf-accent); flex: none; }
.pf-safety p { margin: 0; font-size: 0.95rem; color: var(--pf-ink-soft); }

@media (max-width: 900px) {
	.pf-zz__row { grid-template-columns: 1fr; }
	.pf-zz__row--reverse .pf-zz__media { order: 0; }
	.pf-zz__media { max-width: 520px; }
	.pf-detail-hero__inner { grid-template-columns: 1fr; }
	.pf-detail-hero__media { order: -1; max-width: 520px; }
	.pf-highlights__grid { grid-template-columns: 1fr; gap: 1.25rem; }
	.pf-detail__grid { grid-template-columns: 1fr; }
	.pf-sticky-rail { position: static; }
}

/* =========================================================================
   CONDITIONS — hub + single
   ========================================================================= */

/* ---- Body map -------------------------------------------------------- */
.pf-bodymap { display: block; }
.pf-bodymap__figure { fill: #E7EDF2; stroke: #9DB8CC; stroke-width: 1.5; }
.pf-bodymap__zone { fill: var(--pf-accent); opacity: 0.28; }
.pf-bodymap__ring { fill: none; stroke: var(--pf-accent); stroke-width: 2; opacity: 0.85; }
.pf-bodymap-card { display: inline-flex; align-items: center; justify-content: center; background: #fff; border: 1px solid var(--pf-line); border-radius: var(--pf-radius-lg); box-shadow: var(--pf-shadow); padding: 1.5rem 2.5rem; }

/* ---- Chips (region filter/jump) ------------------------------------- */
.pf-chips { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-bottom: var(--pf-space-7); }
.pf-chip { display: inline-flex; align-items: center; padding: 0.5rem 1.1rem; border-radius: var(--pf-radius-pill); background: #fff; border: 1px solid var(--pf-line); font-family: var(--pf-font-head); font-weight: 600; font-size: 0.9rem; color: var(--pf-ink); }
.pf-chip:hover, .pf-chip.is-active { background: var(--pf-primary); color: #fff; border-color: var(--pf-primary); }

/* ---- Conditions grid + card ----------------------------------------- */
.pf-condhub__group { scroll-margin-top: 120px; }
.pf-condhub__group + .pf-condhub__group { margin-top: var(--pf-space-8); }
.pf-condhub__region { font-size: 1.4rem; margin-bottom: var(--pf-space-5); padding-bottom: 0.5rem; border-bottom: 2px solid var(--pf-line); }
.pf-cond-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--pf-space-5); }
.pf-cond-card { background: #fff; border: 1px solid var(--pf-line); border-radius: var(--pf-radius); box-shadow: var(--pf-shadow-card); transition: transform var(--pf-dur) var(--pf-ease), box-shadow var(--pf-dur) var(--pf-ease); }
.pf-cond-card:hover { transform: translateY(-4px); box-shadow: var(--pf-shadow); }
.pf-cond-card__link { display: flex; gap: 1rem; padding: var(--pf-space-5); align-items: flex-start; }
.pf-cond-card__map { flex: none; width: 78px; background: var(--pf-blue-tint); border-radius: var(--pf-radius-sm); padding: 0.5rem; }
.pf-cond-card__body { display: flex; flex-direction: column; gap: 0.35rem; }
.pf-cond-card__title { font-family: var(--pf-font-head); font-weight: 700; font-size: 1.1rem; color: var(--pf-ink); }
.pf-cond-card:hover .pf-cond-card__title { color: var(--pf-primary); }
.pf-cond-card__text { color: var(--pf-ink-soft); font-size: 0.92rem; }
.pf-cond-card .pf-textlink { margin-top: 0.25rem; }
.pf-condhub__foot { margin-top: var(--pf-space-8); }

/* ---- Condition banner ----------------------------------------------- */
.pf-cond-banner { padding-block: clamp(2.5rem, 1.5rem + 3vw, 4rem); }
.pf-cond-banner__inner { display: grid; grid-template-columns: 1.4fr 0.6fr; gap: clamp(2rem, 1rem + 3vw, 3.5rem); align-items: center; }
.pf-cond-banner__text h1 { font-size: clamp(1.9rem, 1.3rem + 2.4vw, 2.8rem); }
.pf-cond-banner__intro { font-size: 1.1rem; color: var(--pf-ink-soft); margin-bottom: 1.25rem; }
.pf-cond-banner__map { display: flex; justify-content: center; }

/* ---- Reviewed-by byline --------------------------------------------- */
.pf-byline--inline { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; align-items: center; }
.pf-byline--inline .pf-byline__person { font-size: 0.9rem; }
.pf-byline__label { color: var(--pf-ink-soft); margin-right: 0.35rem; }
.pf-byline__person a { font-weight: 700; }
.pf-byline__role { display: block; font-size: 0.8rem; color: var(--pf-ink-soft); }
.pf-byline--inline .pf-byline__role { display: inline; margin-left: 0.35rem; }
.pf-byline--panel { display: flex; flex-direction: column; gap: 0.75rem; }
.pf-byline__h { font-size: 1.05rem; margin-bottom: 0.25rem; }
.pf-byline--panel .pf-byline__person { display: block; }
.pf-byline__date { font-size: 0.82rem; color: var(--pf-ink-soft); margin: 0.5rem 0 0; }
.pf-byline-panel { background: #fff; border: 1px solid var(--pf-line); border-radius: var(--pf-radius); padding: var(--pf-space-6); }

/* ---- At a glance ---------------------------------------------------- */
.pf-glance { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.75rem; margin: 0 0 2rem; }
.pf-glance__item { background: var(--pf-bg-warm); border-radius: var(--pf-radius-sm); padding: 0.85rem 1.1rem; }
.pf-glance__label { display: block; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--pf-ink-soft); margin-bottom: 0.2rem; }
.pf-glance__value { font-family: var(--pf-font-head); font-weight: 700; color: var(--pf-ink); }

/* ---- Symptoms / causes two-col -------------------------------------- */
.pf-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 1rem + 2vw, 3rem); margin: 1.5rem 0 2rem; }
.pf-two-col h2 { font-size: 1.3rem; }

/* ---- How we help ---------------------------------------------------- */
.pf-help { display: grid; gap: 1.25rem; margin: 1rem 0 2rem; }
.pf-help__item { display: flex; gap: 1rem; align-items: flex-start; }
.pf-help__item h3 { font-size: 1.1rem; margin-bottom: 0.25em; }
.pf-help__item p { margin: 0; color: var(--pf-ink-soft); }
.pf-cond__intro { font-size: 1.06rem; margin-bottom: 1.5rem; }
.pf-redflag { margin-top: 2rem; }

@media (max-width: 900px) {
	.pf-cond-grid { grid-template-columns: 1fr; }
	.pf-cond-banner__inner { grid-template-columns: 1fr; }
	.pf-cond-banner__map { order: -1; }
	.pf-two-col { grid-template-columns: 1fr; }
	.pf-glance { grid-template-columns: 1fr; }
}
@media (min-width: 901px) and (max-width: 1100px) {
	.pf-cond-grid { grid-template-columns: repeat(2, 1fr); }
}

/* =========================================================================
   INNER PAGES — About, Team, Fees, FAQ, Contact, Flexx
   ========================================================================= */

/* ---- About ----------------------------------------------------------- */
.pf-about__inner { display: grid; grid-template-columns: 1.3fr 0.7fr; gap: clamp(2rem, 1rem + 3vw, 3.5rem); align-items: start; }
.pf-about__inner--solo { display: block; }
.pf-about__inner--solo .pf-about__prose { max-width: var(--pf-measure); }
.pf-about__prose h2 { font-size: 1.5rem; margin-top: 1.6em; }
.pf-about__prose h2:first-child { margin-top: 0; }
.pf-about__gallery { display: grid; gap: 1rem; position: sticky; top: 108px; }
.pf-about__gallery-item img, .pf-about__gallery-item .pf-media__placeholder { border-radius: var(--pf-radius); aspect-ratio: 4/3; width: 100%; object-fit: cover; }

/* ---- Timeline -------------------------------------------------------- */
.pf-timeline { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.5rem; max-width: 46rem; }
.pf-timeline__item { display: grid; grid-template-columns: 130px 1fr; gap: 1.5rem; position: relative; padding-left: 1.25rem; border-left: 2px solid var(--pf-line); }
.pf-timeline__item::before { content: ""; position: absolute; left: -7px; top: 4px; width: 12px; height: 12px; border-radius: 50%; background: var(--pf-primary); border: 3px solid #fff; }
.pf-timeline__label { font-family: var(--pf-font-head); font-weight: 700; color: var(--pf-primary); }
.pf-timeline__body h3 { font-size: 1.15rem; margin-bottom: 0.25em; }
.pf-timeline__body p { margin: 0; color: var(--pf-ink-soft); }

/* ---- Numbered process ------------------------------------------------ */
.pf-process__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--pf-space-5); }
.pf-process__step { position: relative; }
.pf-process__n { font-family: var(--pf-font-head); font-weight: 800; font-size: 2.5rem; color: var(--pf-accent); display: block; line-height: 1; margin-bottom: 0.5rem; }
.pf-process__step h3 { font-size: 1.15rem; margin-bottom: 0.35em; }
.pf-process__step p { color: var(--pf-ink-soft); margin: 0; font-size: 0.95rem; }

/* ---- Pull-quote band ------------------------------------------------- */
.pf-quote-band { background: var(--pf-accent); color: #fff; padding-block: clamp(3rem, 2rem + 3vw, 5rem); }
.pf-quote-band__inner { max-width: 48rem; margin-inline: auto; text-align: center; position: relative; }
.pf-quote-band__mark { font-family: var(--pf-font-head); font-size: 5rem; line-height: 0.5; opacity: 0.35; display: block; }
.pf-quote-band blockquote { font-family: var(--pf-font-head); font-weight: 700; font-size: clamp(1.4rem, 1rem + 1.6vw, 2rem); margin: 1rem 0; border: 0; padding: 0; }
.pf-quote-band cite { font-style: normal; opacity: 0.85; }

/* ---- Team profiles --------------------------------------------------- */
.pf-profile { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: clamp(2rem, 1rem + 3vw, 4rem); align-items: center; }
.pf-profile + .pf-profile { margin-top: clamp(3rem, 2rem + 3vw, 5rem); padding-top: clamp(3rem, 2rem + 3vw, 5rem); border-top: 1px solid var(--pf-line); }
.pf-profile--reverse { grid-template-columns: 1.2fr 0.8fr; } /* keep the photo in the same-width column both ways */
.pf-profile--reverse .pf-profile__media { order: 2; }
.pf-profile__name { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.2rem); margin-bottom: 0.1em; }
.pf-profile__role { color: var(--pf-primary); font-weight: 600; margin-bottom: 1rem; }
.pf-profile__meta { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin: 1.5rem 0; }
.pf-profile__block h3 { font-size: 1rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--pf-ink-soft); margin-bottom: 0.6rem; }
.pf-profile__hcpc { font-size: 0.88rem; color: var(--pf-ink-soft); }

/* ---- Fees ------------------------------------------------------------ */
.pf-fees__grid { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: clamp(2rem, 1rem + 3vw, 3.5rem); align-items: start; }
.pf-fees__main h2 { font-size: 1.5rem; margin-top: 1.8em; }
.pf-fees__main h2:first-child { margin-top: 0; }
.pf-checklist--wide { grid-template-columns: 1fr 1fr; }
.pf-fees-table, .pf-timetable, .pf-hours { width: 100%; border-collapse: collapse; margin: 1rem 0 1.5rem; }
.pf-fees-table th, .pf-fees-table td, .pf-timetable th, .pf-timetable td { text-align: left; padding: 0.85rem 1rem; border-bottom: 1px solid var(--pf-line); }
.pf-fees-table thead th, .pf-timetable thead th { font-family: var(--pf-font-head); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--pf-ink-soft); background: var(--pf-bg-warm); }
.pf-fees-table tbody tr:hover, .pf-timetable tbody tr:hover { background: var(--pf-bg-light); }
.pf-fees__aside .pf-callout { margin-top: 0; }
.pf-fees__aside .pf-hero__trust-badge { margin-top: 0.5rem; }

/* ---- Hours table ----------------------------------------------------- */
.pf-hours th { text-align: left; font-weight: 600; padding: 0.4rem 1rem 0.4rem 0; }
.pf-hours td { padding: 0.4rem 0; color: var(--pf-ink-soft); text-align: right; }
.pf-contact__hours-note { font-size: 0.85rem; color: var(--pf-ink-soft); }

/* ---- FAQ page -------------------------------------------------------- */
.pf-faqpage__inner { max-width: 52rem; }
.pf-faqpage__group + .pf-faqpage__group { margin-top: var(--pf-space-7); }
.pf-faqpage__cat { font-size: 1.3rem; margin-bottom: var(--pf-space-4); scroll-margin-top: 120px; }

/* ---- Contact --------------------------------------------------------- */
.pf-contact__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 1rem + 3vw, 3.5rem); align-items: start; }
.pf-contact__address { font-style: normal; font-size: 1.05rem; margin-bottom: 1rem; }
.pf-contact__lines { list-style: none; padding: 0; margin: 0 0 1.5rem; display: grid; gap: 0.6rem; }
.pf-contact__lines li { display: flex; align-items: center; gap: 0.6rem; }
.pf-contact__lines .pf-icon { color: var(--pf-primary); }
.pf-contact__details h3 { font-size: 1.1rem; margin-top: 1.5rem; }
.pf-contact__map { margin-top: var(--pf-space-6); }
.pf-contact__map iframe { width: 100%; min-height: 360px; border: 0; border-radius: var(--pf-radius-lg); }
.pf-contact__safety { margin-top: var(--pf-space-6); }

/* ---- Form ------------------------------------------------------------ */
.pf-form { display: grid; gap: 1rem; }
.pf-field { display: grid; gap: 0.35rem; }
.pf-field span { font-weight: 600; font-size: 0.9rem; }
.pf-field input, .pf-field textarea { width: 100%; padding: 0.75rem 0.9rem; border: 1px solid var(--pf-line); border-radius: var(--pf-radius-sm); font: inherit; background: #fff; }
.pf-field input:focus, .pf-field textarea:focus { border-color: var(--pf-primary); }
.pf-form__hp { position: absolute; left: -9999px; }
.pf-form__consent { font-size: 0.8rem; color: var(--pf-ink-soft); margin: 0; }
.pf-form__success { background: #eaf5ec; border: 1px solid #bfe0c6; color: #256b36; padding: 0.85rem 1rem; border-radius: var(--pf-radius-sm); }

/* ---- Flexx Studio ---------------------------------------------------- */
.pf-flexx-hero { padding-block: clamp(2.5rem, 1.5rem + 4vw, 5rem); background: linear-gradient(180deg, var(--pf-blue-tint) 0%, #fff 100%); }
.pf-flexx-hero__inner { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(2rem, 1rem + 4vw, 4rem); align-items: center; }
.pf-flexx-hero__text h1 { font-size: var(--pf-fs-display); }
.pf-flexx-hero__sub { font-size: 1.15rem; color: var(--pf-ink-soft); margin-bottom: 1.75rem; }
.pf-timetable__note { color: var(--pf-ink-soft); font-size: 0.92rem; }

@media (max-width: 900px) {
	.pf-about__inner, .pf-fees__grid, .pf-contact__grid, .pf-flexx-hero__inner { grid-template-columns: 1fr; }
	.pf-about__gallery { position: static; grid-template-columns: repeat(3, 1fr); }
	.pf-flexx-hero__media { order: -1; max-width: 520px; }
	.pf-process__grid { grid-template-columns: repeat(2, 1fr); }
	.pf-profile { grid-template-columns: 1fr; }
	.pf-profile--reverse .pf-profile__media { order: 0; }
	.pf-profile__media { max-width: 420px; }
	.pf-timeline__item { grid-template-columns: 100px 1fr; gap: 1rem; }
}
@media (max-width: 560px) {
	.pf-process__grid, .pf-profile__meta, .pf-checklist--wide, .pf-about__gallery { grid-template-columns: 1fr; }
	.pf-fees-table, .pf-timetable { font-size: 0.9rem; }
}

/* ---- Breadcrumbs (rounded pill per step) ----------------------------- */
.pf-breadcrumbs { font-size: 0.82rem; padding: 0.85rem 0; }
.pf-breadcrumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 0.3rem; margin: 0; padding: 0; align-items: center; }
.pf-breadcrumbs li { display: inline-flex; align-items: center; gap: 0.3rem; }
/* Chevron between steps. */
.pf-breadcrumbs li:not(:last-child)::after { content: ""; width: 6px; height: 6px; border-right: 1.5px solid var(--pf-primary-soft); border-bottom: 1.5px solid var(--pf-primary-soft); transform: rotate(-45deg); margin: 0 0.15rem; }
/* Each step is a pill. */
.pf-breadcrumbs a,
.pf-breadcrumbs li[aria-current="page"] { display: inline-flex; align-items: center; padding: 0.32rem 0.8rem; border-radius: var(--pf-radius-pill); line-height: 1; font-family: var(--pf-font-head); font-weight: 500; }
.pf-breadcrumbs a { background: var(--pf-blue-tint); color: var(--pf-primary); transition: background var(--pf-dur) var(--pf-ease), color var(--pf-dur) var(--pf-ease); }
.pf-breadcrumbs a:hover { background: var(--pf-primary); color: #fff; }
.pf-breadcrumbs li[aria-current="page"] { background: var(--pf-primary); color: #fff; }

/* ---- Contact form error banner --------------------------------------- */
.pf-form__error { background: var(--pf-flag-bg); border: 1px solid #e6c3bb; color: var(--pf-flag-ink); padding: 0.85rem 1rem; border-radius: var(--pf-radius-sm); }

/* ---- Consent-gated map ----------------------------------------------- */
.pf-map { position: relative; }
.pf-map__consent { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.6rem; width: 100%; min-height: 260px; padding: 2rem 1.5rem; text-align: center; background: var(--pf-blue-tint); border: 1px dashed var(--pf-primary-soft); border-radius: var(--pf-radius); cursor: pointer; color: var(--pf-ink); }
.pf-map__consent:hover { background: #dfeaf2; }
.pf-map__consent-title { font-family: var(--pf-font-head); font-weight: 700; font-size: 1.05rem; }
.pf-map__consent-note { font-size: 0.85rem; color: var(--pf-ink-soft); max-width: 42ch; }
.pf-map iframe { display: block; width: 100%; min-height: 320px; border: 0; border-radius: var(--pf-radius); }

/* ---- Team member profile (single) ------------------------------------ */
.pf-detail-hero__role { font-family: var(--pf-font-head); font-weight: 700; color: var(--pf-primary); margin: 0 0 0.75rem; }
.pf-detail__lead { color: var(--pf-ink-soft); }
.pf-linklist { list-style: none; margin: 0.5rem 0 0; padding: 0; display: grid; gap: 0.5rem; }
.pf-linklist a { display: inline-flex; align-items: center; gap: 0.5rem; color: var(--pf-link); font-weight: 600; }
.pf-linklist a:hover { color: var(--pf-link-hover); }

/* ---- Team hub: condensed overview + CTA to full bio ------------------ */
.pf-profile__blurb { color: var(--pf-ink-soft); font-size: 1.08rem; line-height: 1.65; margin: 0.75rem 0 0; }
.pf-profile__creds { margin-top: 1.1rem; }
.pf-profile__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.5rem; }

/* ====================================================================
   BLOG / ARTICLES
   Listing grid, article cards, editorial single, author card, per-bio
   "latest articles" loop. Reuses the detail-hero + detail__grid shells.
   ==================================================================== */

/* ---- Article grid ---------------------------------------------------- */
.pf-blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--pf-space-5); }
.pf-blog-grid--2 { grid-template-columns: repeat(2, 1fr); }

/* ---- Article card ---------------------------------------------------- */
.pf-article-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--pf-line); border-radius: var(--pf-radius); box-shadow: var(--pf-shadow-card); overflow: hidden; transition: transform var(--pf-dur) var(--pf-ease), box-shadow var(--pf-dur) var(--pf-ease); }
.pf-article-card:hover { transform: translateY(-4px); box-shadow: var(--pf-shadow); }
.pf-article-card__media { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--pf-blue-tint); }
.pf-article-card__img, .pf-article-card__media .pf-media__placeholder { width: 100%; height: 100%; object-fit: cover; }
.pf-article-card__topic { position: absolute; left: 0.75rem; top: 0.75rem; background: rgba(255,255,255,0.94); color: var(--pf-primary-dark); font-family: var(--pf-font-head); font-weight: 600; font-size: 0.7rem; letter-spacing: 0.03em; text-transform: uppercase; padding: 0.3rem 0.65rem; border-radius: var(--pf-radius-pill); }
.pf-article-card__body { display: flex; flex-direction: column; gap: 0.55rem; padding: var(--pf-space-5); flex: 1; }
.pf-article-card__title { font-size: 1.15rem; line-height: 1.32; margin: 0; }
.pf-article-card__title a { color: var(--pf-ink); }
.pf-article-card:hover .pf-article-card__title a { color: var(--pf-primary); }
.pf-article-card__text { color: var(--pf-ink-soft); font-size: 0.95rem; margin: 0; flex: 1; }
.pf-article-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin-top: 0.35rem; padding-top: 0.75rem; border-top: 1px solid var(--pf-line); }
.pf-article-card__byline { font-size: 0.82rem; color: var(--pf-ink-soft); }
.pf-article-card__more { font-size: 0.88rem; }

/* ---- Post meta line -------------------------------------------------- */
.pf-post-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.75rem; font-size: 0.82rem; color: var(--pf-ink-soft); margin: 0 0 0.15rem; }
.pf-post-meta__topic { font-family: var(--pf-font-head); font-weight: 600; color: var(--pf-primary); text-transform: uppercase; letter-spacing: 0.03em; font-size: 0.74rem; }
.pf-post-meta__upd::before, .pf-post-meta__read::before { content: "\00B7"; margin-right: 0.75rem; color: var(--pf-primary-soft); }

/* ---- Single article: hero meta sits under the standfirst ------------- */
.pf-detail-hero .pf-post-meta { margin: 0.35rem 0 1rem; }
.pf-detail-hero .pf-byline--inline { margin-bottom: 1.25rem; }
.pf-article-body > h2:first-child, .pf-article-body > h3:first-child { margin-top: 0; }
.pf-article-faq-h { margin-top: 2.5rem; }

/* ---- Key takeaways box ----------------------------------------------- */
.pf-takeaways { background: var(--pf-blue-tint); border: 1px solid #cfe0ec; border-radius: var(--pf-radius); padding: var(--pf-space-6); margin: 0 0 2rem; }
.pf-takeaways__h { font-size: 1.15rem; margin: 0 0 0.85rem; color: var(--pf-primary-dark); }
.pf-takeaways ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
.pf-takeaways li { display: flex; gap: 0.6rem; align-items: flex-start; font-weight: 500; line-height: 1.5; }
.pf-takeaways li .pf-icon { color: var(--pf-primary); flex: none; margin-top: 0.15rem; }

/* ---- Pull quote ------------------------------------------------------ */
.pf-pullquote { margin: 2rem 0; padding: 0.25rem 0 0.25rem 1.5rem; border-left: 4px solid var(--pf-accent); }
.pf-pullquote p { font-family: var(--pf-font-head); font-weight: 600; font-size: 1.3rem; line-height: 1.5; color: var(--pf-primary-dark); margin: 0; }
.pf-pullquote cite { display: block; margin-top: 0.6rem; font-style: normal; font-size: 0.9rem; color: var(--pf-ink-soft); }

/* ---- Inline booking prompt (CRO) ------------------------------------- */
.pf-inline-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 1.5rem; background: var(--pf-cta-band); color: #fff; border-radius: var(--pf-radius-lg); padding: var(--pf-space-6); margin: 2rem 0; }
.pf-inline-cta__text { flex: 1 1 55%; }
.pf-inline-cta h3 { color: #fff; margin: 0 0 0.3rem; font-size: 1.25rem; }
.pf-inline-cta p { margin: 0; color: rgba(255,255,255,0.85); }

/* ---- Author card (article sidebar) ----------------------------------- */
.pf-authorcard { background: #fff; border: 1px solid var(--pf-line); border-radius: var(--pf-radius); padding: var(--pf-space-6); box-shadow: var(--pf-shadow-card); }
.pf-authorcard__eyebrow { font-family: var(--pf-font-head); font-weight: 600; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--pf-ink-soft); margin: 0 0 0.85rem; }
.pf-authorcard__head { display: flex; align-items: center; gap: 0.85rem; }
.pf-authorcard__photo { width: 60px; height: 60px; border-radius: 50%; overflow: hidden; flex: none; background: var(--pf-blue-tint); }
.pf-authorcard__img, .pf-authorcard__photo .pf-media__placeholder { width: 100%; height: 100%; object-fit: cover; }
.pf-authorcard__photo .pf-media__placeholder-label { display: none; }
.pf-authorcard__name { display: block; font-family: var(--pf-font-head); font-weight: 700; color: var(--pf-ink); }
.pf-authorcard__name:hover { color: var(--pf-primary); }
.pf-authorcard__role { display: block; font-size: 0.85rem; color: var(--pf-primary); font-weight: 600; margin-top: 0.1rem; }
.pf-authorcard__blurb { font-size: 0.9rem; color: var(--pf-ink-soft); margin: 0.85rem 0; line-height: 1.6; }

/* ---- Related links --------------------------------------------------- */
.pf-linklist--tight { gap: 0.35rem; }
.pf-related { margin-top: 2.5rem; }

/* ---- "Latest articles" loop on a clinician bio ----------------------- */
.pf-latest-articles { margin-top: clamp(2rem, 1.5rem + 2vw, 3rem); padding-top: 2rem; border-top: 1px solid var(--pf-line); }
.pf-latest-articles__head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.pf-latest-articles__head h2 { margin: 0; }

/* ---- Pagination ------------------------------------------------------ */
.pf-blog__foot { margin-top: var(--pf-space-7); }
.pf-blog-empty { background: var(--pf-bg-warm); border: 1px solid var(--pf-line); border-radius: var(--pf-radius); padding: var(--pf-space-6); text-align: center; color: var(--pf-ink-soft); }
.pf-pagination { margin-top: var(--pf-space-7); }
.pf-pagination .nav-links { display: flex; flex-wrap: wrap; gap: 0.4rem; justify-content: center; }
.pf-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; padding: 0 0.75rem; border-radius: var(--pf-radius-sm); border: 1px solid var(--pf-line); background: #fff; font-family: var(--pf-font-head); font-weight: 600; color: var(--pf-ink); }
.pf-pagination .page-numbers.current { background: var(--pf-primary); border-color: var(--pf-primary); color: #fff; }
.pf-pagination a.page-numbers:hover { border-color: var(--pf-primary); color: var(--pf-primary); }
.pf-pagination .page-numbers.dots { border-color: transparent; background: transparent; }

/* ---- Blog responsive ------------------------------------------------- */
@media (max-width: 900px) {
	.pf-blog-grid, .pf-blog-grid--2 { grid-template-columns: repeat(2, 1fr); }
	.pf-inline-cta { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 560px) {
	.pf-blog-grid, .pf-blog-grid--2 { grid-template-columns: 1fr; }
	.pf-latest-articles__head { flex-direction: column; align-items: flex-start; gap: 0.4rem; }
}