/**
 * Barabom procedure detail — premium clinical editorial presentation.
 *
 * The renderer and Core own every fact and every word. CSS supplies hierarchy,
 * responsive layout and accessible interaction states only.
 */

.brb-procedure-core-view {
	--brb-p-bg: var(--brb-color-bg);
	--brb-p-surface: var(--brb-color-surface);
	--brb-p-card: var(--brb-color-surface-strong);
	--brb-p-feature: var(--brb-color-feature);
	--brb-p-ink: var(--brb-color-text);
	--brb-p-ink-2: var(--brb-color-text-soft);
	--brb-p-muted: var(--brb-color-muted);
	--brb-p-rule: var(--brb-color-border);
	--brb-p-rule-soft: var(--brb-color-border-soft);
	--brb-p-accent: var(--brb-color-brand);
	--brb-p-accent-hover: var(--brb-color-brand-hover);
	--brb-p-accent-soft: var(--brb-color-brand-soft);
	--brb-p-notice-bg: var(--brb-color-accent-soft);
	--brb-p-measure: var(--brb-layout-prose);
	--brb-p-shell: var(--brb-layout-content);
	--brb-p-edge: var(--brb-layout-padding-mobile);
	--brb-p-section-pad: clamp(2.75rem, 6vw, 5.5rem);
	--brb-p-nav-h: 3.75rem;
	width: 100%;
	color: var(--brb-p-ink);
	background: var(--brb-p-bg);
	font-size: var(--brb-type-body);
	line-height: var(--brb-leading-body);
	word-break: keep-all;
	overflow-wrap: anywhere;
}

.site-main:has(.brb-procedure-core-view) {
	width: 100%;
	max-width: none;
	margin-inline: 0;
}

.brb-procedure-definition-bar > *,
.brb-procedure-hero-inner,
.brb-procedure-nav-list,
.brb-procedure-block > * {
	width: min(100%, var(--brb-p-shell));
	margin-inline: auto;
}

/* Hero: restrained, clinical and strongly typographic. */
.brb-procedure-hero {
	padding: clamp(3rem, 7vw, 5.5rem) var(--brb-p-edge);
	background: var(--brb-p-surface);
	border-block-end: 1px solid var(--brb-p-rule-soft);
}

/* A split rail is opt-in and therefore cannot imply media that is not there. */
.brb-procedure-hero--has-media {
	background:
		linear-gradient(90deg, transparent 0 76%, rgba(125, 36, 64, 0.04) 76% 100%),
		var(--brb-p-surface);
}

.brb-procedure-hero-inner {
	display: grid;
	gap: clamp(2rem, 5vw, 4rem);
}

.brb-procedure-hero-copy { max-width: 48rem; }

.brb-procedure-title {
	max-width: 12em;
	margin: 0;
	color: var(--brb-p-ink);
	font-family: var(--brb-font-display);
	font-size: var(--brb-type-h1);
	font-weight: var(--brb-weight-bold);
	line-height: var(--brb-leading-display);
	letter-spacing: -0.045em;
}

.brb-procedure-title-line { display: block; }
.brb-procedure-title-line:last-child { color: var(--brb-p-accent); }

.brb-procedure-title::after {
	content: "";
	display: block;
	width: 3.25rem;
	height: 2px;
	margin-block-start: 1.5rem;
	background: var(--brb-p-accent);
}

.brb-procedure-hero-lead {
	max-width: var(--brb-p-measure);
	margin: 1.5rem 0 0;
	color: var(--brb-p-ink-2);
	font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem);
	line-height: 1.8;
}

.brb-procedure-eyebrow {
	display: inline-block;
	margin-block-end: 0.75rem;
	color: var(--brb-p-accent);
	font-size: var(--brb-type-small);
	font-weight: var(--brb-weight-bold);
	letter-spacing: 0.06em;
}

/* The definition reads as an editorial deck, not an advertising banner. */
.brb-procedure-definition-bar {
	padding: 1.5rem var(--brb-p-edge);
	background: var(--brb-p-feature);
	border-block-end: 1px solid var(--brb-p-rule);
}

.brb-procedure-definition-text {
	max-width: 52rem;
	margin: 0;
	color: var(--brb-p-ink);
	font-size: 1.0625rem;
	font-weight: var(--brb-weight-medium);
	line-height: 1.75;
}

/* Native anchors remain useful with scripts off; only the strip scrolls. */
.brb-procedure-nav {
	position: sticky;
	inset-block-start: var(--brb-shell-offset, 0px);
	z-index: 20;
	padding-inline: var(--brb-p-edge);
	background: var(--brb-p-surface);
	border-block-end: 1px solid var(--brb-p-rule);
}

.brb-procedure-nav-list {
	display: flex;
	gap: 0.5rem;
	margin: 0;
	padding: 0.5rem 0;
	list-style: none;
	overflow-x: auto;
	scrollbar-width: thin;
	overscroll-behavior-inline: contain;
}

.brb-procedure-nav-item { flex: 0 0 auto; }

.brb-procedure-nav-link {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding-inline: 0.875rem;
	border: 1px solid transparent;
	border-radius: var(--brb-radius-pill);
	color: var(--brb-p-muted);
	font-size: var(--brb-type-small);
	font-weight: var(--brb-weight-medium);
	text-decoration: none;
	white-space: nowrap;
}

.brb-procedure-nav-link:hover,
.brb-procedure-nav-link:focus-visible {
	border-color: var(--brb-p-rule);
	background: var(--brb-p-card);
	color: var(--brb-p-accent);
}

/* Sections share a quiet ground. A small number of feature sections opt in. */
.brb-procedure-block {
	padding: var(--brb-p-section-pad) var(--brb-p-edge);
	background: transparent;
	scroll-margin-top: calc(var(--brb-shell-offset, 0px) + var(--brb-p-nav-h) + 0.75rem);
}

.brb-procedure-block + .brb-procedure-block > :first-child {
	padding-block-start: var(--brb-p-section-pad);
	border-block-start: 1px solid var(--brb-p-rule-soft);
}

.brb-procedure-price,
.brb-patient-blocks {
	background: var(--brb-p-surface);
}

.brb-procedure-price > :first-child,
.brb-patient-blocks > :first-child {
	border-block-start: 0 !important;
}

.brb-procedure-trust {
	background: var(--brb-p-feature);
}

/* The site-owned CTA closes the story only when its complete contract exists. */
.brb-procedure-closing {
	padding: 0 var(--brb-p-edge) var(--brb-p-section-pad);
	background: var(--brb-p-bg);
}

.brb-procedure-closing-inner {
	width: min(100%, var(--brb-p-shell));
	margin-inline: auto;
	padding: clamp(2rem, 5vw, 4rem);
	border: 1px solid var(--brb-p-rule);
	border-radius: var(--brb-radius-feature);
	background: var(--brb-p-feature);
}

.brb-procedure-closing-title {
	max-width: 20em;
	margin: 0;
	color: var(--brb-p-ink);
	font-family: var(--brb-font-display);
	font-size: var(--brb-type-h2);
	font-weight: var(--brb-weight-bold);
	line-height: var(--brb-leading-heading);
	letter-spacing: -0.035em;
}

.brb-procedure-closing-desc {
	max-width: var(--brb-p-measure);
	margin: 1rem 0 0;
	color: var(--brb-p-ink-2);
}

.brb-procedure-closing-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin-block-start: 1.5rem;
	padding: 0.6875rem 1.25rem;
	border: 1px solid var(--brb-p-accent);
	border-radius: var(--brb-radius-pill);
	background: var(--brb-p-accent);
	color: #fff;
	font-size: var(--brb-type-small);
	font-weight: var(--brb-weight-bold);
	text-decoration: none;
}

.brb-procedure-closing-cta:visited { color: #fff; }

.brb-procedure-closing-cta:hover,
.brb-procedure-closing-cta:focus-visible {
	border-color: var(--brb-p-accent-hover);
	background: var(--brb-p-accent-hover);
	color: #fff;
}

.brb-procedure-section-head {
	margin-block-end: clamp(1.5rem, 4vw, 2.5rem);
}

.brb-procedure-block-title,
.brb-patient-heading,
.brb-patient-card-group-title {
	max-width: 20em;
	margin: 0;
	color: var(--brb-p-ink);
	font-family: var(--brb-font-display);
	font-size: var(--brb-type-h2);
	font-weight: var(--brb-weight-bold);
	line-height: var(--brb-leading-heading);
	letter-spacing: -0.035em;
}

.brb-procedure-section-intro {
	max-width: var(--brb-p-measure);
	margin: 0.75rem 0 0;
	color: var(--brb-p-muted);
	font-size: 1rem;
	line-height: 1.75;
}

.brb-procedure-lead,
.brb-procedure-note,
.brb-procedure-summary-line {
	max-width: var(--brb-p-measure);
	margin: 0 0 1rem;
}

.brb-procedure-lead,
.brb-procedure-summary-line {
	color: var(--brb-p-ink-2);
	font-size: 1.0625rem;
	line-height: 1.8;
}

.brb-procedure-hero + .brb-procedure-block .brb-procedure-lead {
	color: var(--brb-p-ink);
	font-size: 1.1875rem;
}

.brb-procedure-note {
	padding: 0.75rem 0 0.75rem 1.125rem;
	border-inline-start: 3px solid var(--brb-color-accent);
	color: var(--brb-p-ink-2);
	font-size: var(--brb-type-small);
	line-height: 1.75;
}

.brb-procedure-lead:last-child,
.brb-procedure-note:last-child { margin-block-end: 0; }

.brb-procedure-list,
.brb-procedure-course {
	display: grid;
	gap: 0.75rem;
	max-width: var(--brb-p-measure);
	margin: 0;
	padding-inline-start: 1.375rem;
}

.brb-procedure-list + .brb-procedure-list,
.brb-procedure-course + .brb-procedure-list,
.brb-procedure-list + .brb-procedure-note,
.brb-procedure-course + .brb-procedure-note,
.brb-procedure-layer-box + .brb-procedure-list,
.brb-procedure-cards + .brb-procedure-list {
	margin-block-start: 1.25rem;
}

.brb-procedure-item {
	padding-inline-start: 0.25rem;
	color: var(--brb-p-ink-2);
	line-height: 1.75;
}

.brb-procedure-item::marker {
	color: var(--brb-p-accent);
	font-weight: var(--brb-weight-bold);
}

/* Reusable cards stack at 390px and expand only when their prose has room. */
.brb-procedure-cards,
.brb-procedure-layers,
.brb-procedure-advice-list {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--brb-space-grid);
	margin: 0;
	padding: 0;
	list-style: none;
}

.brb-procedure-card {
	padding: var(--brb-space-card);
	border-block-start: 1px solid var(--brb-p-rule);
	background: transparent;
}

.brb-procedure-summary .brb-procedure-card,
.brb-procedure-shot-design .brb-procedure-card,
.brb-procedure-care-cards .brb-procedure-card {
	border: 1px solid var(--brb-p-rule-soft);
	border-radius: var(--brb-radius-card);
	background: var(--brb-p-card);
}

.brb-procedure-card-title {
	margin: 0 0 0.5rem;
	color: var(--brb-p-ink);
	font-size: 1.0625rem;
	font-weight: var(--brb-weight-bold);
	line-height: 1.45;
}

.brb-procedure-card-text {
	margin: 0;
	color: var(--brb-p-ink-2);
	font-size: var(--brb-type-small);
	line-height: 1.7;
}

.brb-procedure-card-number,
.brb-procedure-step-number {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.75rem;
	height: 1.75rem;
	margin-block-end: 0.75rem;
	border-radius: var(--brb-radius-pill);
	background: var(--brb-p-accent-soft);
	color: var(--brb-p-accent);
	font-size: 0.8125rem;
	font-weight: var(--brb-weight-bold);
}

/* Doctor notes are pull quotes rather than speech bubbles or decorated cards. */
.brb-procedure-advice {
	max-width: var(--brb-p-measure);
	margin-block-start: 1.75rem;
	padding: 0.375rem 0 0.375rem clamp(1.25rem, 4vw, 2rem);
	border-inline-start: 3px solid var(--brb-p-accent);
	background: transparent;
}

.brb-procedure-advice-label {
	display: block;
	margin-block-end: 0.625rem;
	color: var(--brb-p-accent);
	font-size: var(--brb-type-small);
	font-weight: var(--brb-weight-bold);
	letter-spacing: 0.06em;
}

.brb-procedure-advice-title {
	margin: 0 0 0.5rem;
	color: var(--brb-p-ink);
	font-size: var(--brb-type-h3);
	line-height: var(--brb-leading-heading);
}

.brb-procedure-advice-text {
	margin: 0;
	color: var(--brb-p-ink-2);
	font-size: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem);
	line-height: 1.8;
}

.brb-procedure-hero .brb-procedure-advice {
	margin-block-start: 0;
	align-self: end;
}

/* Patient explanation preserves stored order and lets paragraphs breathe. */
.brb-patient-blocks {
	display: grid;
	gap: clamp(2rem, 6vw, 4rem);
}

.brb-patient-block {
	width: min(100%, var(--brb-p-measure));
	margin-inline: auto;
}

.brb-patient-block--heading {
	padding-block-start: 0.5rem;
}

.brb-patient-paragraph,
.brb-patient-card-text,
.brb-patient-image-caption {
	margin: 0;
	color: var(--brb-p-ink-2);
	line-height: 1.8;
}

.brb-patient-paragraph { font-size: 1.0625rem; }

.brb-patient-block--image {
	display: grid;
	gap: 0.75rem;
}

.brb-patient-block--image-wide { width: min(100%, var(--brb-p-shell)); }

.brb-patient-image {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--brb-radius-feature);
}

.brb-patient-image-caption {
	color: var(--brb-p-muted);
	font-size: var(--brb-type-small);
}

.brb-patient-block--card-group {
	display: grid;
	gap: 1.5rem;
}

.brb-patient-cards {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--brb-space-grid);
	margin: 0;
	padding: 0;
	list-style: none;
}

.brb-patient-card {
	padding: var(--brb-space-card);
	border: 1px solid var(--brb-p-rule);
	border-radius: var(--brb-radius-card);
	background: var(--brb-p-card);
}

.brb-patient-card-title {
	margin: 0 0 0.5rem;
	color: var(--brb-p-ink);
	font-size: 1.0625rem;
}

.brb-patient-block--doctor-note { margin-block: 0; }

/* Suitability uses semantic edge treatments, not alarming warning fills. */
.brb-procedure-fit-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--brb-space-grid);
}

.brb-procedure-fit {
	padding: var(--brb-space-card);
	border: 1px solid var(--brb-p-rule);
	border-block-start-width: 4px;
	border-radius: var(--brb-radius-card);
	background: var(--brb-p-card);
}

.brb-procedure-fit-good { border-block-start-color: var(--brb-color-accent); }
.brb-procedure-fit-alternative { border-block-start-color: var(--brb-p-accent); }

.brb-procedure-fit-title {
	margin: 0 0 1rem;
	color: var(--brb-p-ink);
	font-size: var(--brb-type-h3);
	line-height: var(--brb-leading-heading);
}

.brb-procedure-fit .brb-procedure-list { max-width: none; }

/* Comparison remains a semantic table; only its own viewport scrolls on mobile. */
.brb-procedure-comparison-scroll {
	max-width: 100%;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	border: 1px solid var(--brb-p-rule);
	border-radius: var(--brb-radius-card);
	background: var(--brb-p-card);
	scrollbar-width: thin;
}

.brb-procedure-comparison-table {
	width: 100%;
	min-width: 38rem;
	border-collapse: separate;
	border-spacing: 0;
}

.brb-procedure-comparison-table th,
.brb-procedure-comparison-table td {
	padding: 0.875rem 1rem;
	border-block-end: 1px solid var(--brb-p-rule-soft);
	text-align: start;
	vertical-align: top;
	font-size: var(--brb-type-small);
	line-height: 1.65;
}

.brb-procedure-comparison-table thead th {
	background: var(--brb-p-feature);
	color: var(--brb-p-ink);
	font-weight: var(--brb-weight-bold);
}

.brb-procedure-comparison-criterion {
	position: sticky;
	inset-inline-start: 0;
	z-index: 1;
	min-width: 7.5rem;
	background: var(--brb-p-surface);
	color: var(--brb-p-ink-2);
	font-weight: var(--brb-weight-medium);
	white-space: nowrap;
}

thead .brb-procedure-comparison-criterion { z-index: 2; background: var(--brb-p-feature); }
.brb-procedure-comparison-cell { color: var(--brb-p-ink-2); }

.brb-procedure-comparison-focus {
	background: var(--brb-p-accent-soft);
	color: var(--brb-p-accent);
	font-weight: var(--brb-weight-bold);
}

.brb-procedure-comparison-table tr:last-child th,
.brb-procedure-comparison-table tr:last-child td { border-block-end: 0; }

/* Mechanism and course retain diagram/sequence semantics with quiet surfaces. */
.brb-procedure-layer-box {
	margin-block-start: 1rem;
	padding: var(--brb-space-card);
	border: 1px solid var(--brb-p-rule);
	border-radius: var(--brb-radius-feature);
	background: var(--brb-p-card);
}

.brb-procedure-layer-title {
	margin: 0 0 1rem;
	color: var(--brb-p-ink);
	font-size: 1.125rem;
}

.brb-procedure-layers { gap: 0.375rem; }

.brb-procedure-layer {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.25rem 1rem;
	padding: 0.75rem 1rem;
	border: 1px solid var(--brb-p-rule-soft);
	border-radius: var(--brb-radius-small);
	background: var(--brb-p-surface);
}

.brb-procedure-layer-target {
	border-color: var(--brb-p-accent);
	background: var(--brb-p-accent-soft);
}

.brb-procedure-layer-name { color: var(--brb-p-ink); font-weight: var(--brb-weight-bold); }
.brb-procedure-layer-note { color: var(--brb-p-muted); font-size: var(--brb-type-small); }

.brb-procedure-steps {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.brb-procedure-step {
	position: relative;
	padding: 0 0 1.75rem 2.75rem;
}

.brb-procedure-step:not(:last-child)::before {
	content: "";
	position: absolute;
	inset: 1.75rem auto 0 0.8125rem;
	width: 1px;
	background: var(--brb-p-rule);
}

.brb-procedure-step-number {
	position: absolute;
	inset: 0 auto auto 0;
}

.brb-procedure-step-title {
	margin: 0 0 0.375rem;
	color: var(--brb-p-ink);
	font-size: 1.0625rem;
}

.brb-procedure-step-text {
	margin: 0;
	color: var(--brb-p-ink-2);
	font-size: var(--brb-type-small);
	line-height: 1.75;
}

/* Cautions are readable after-care guidance, not a wall of warning boxes. */
.brb-procedure-caution .brb-procedure-note { background: transparent; }
.brb-procedure-caution .brb-procedure-lead { margin-block-end: 1.5rem; }
.brb-procedure-care-cards { gap: 0; }
.brb-procedure-care-cards .brb-procedure-card { border-width: 1px 0 0; border-radius: 0; }

/* FAQ keeps native details/summary and a 44px-plus disclosure target. */
.brb-procedure-faq-list {
	display: grid;
	gap: 0;
	max-width: var(--brb-p-measure);
}

.brb-procedure-faq-item {
	border-block-start: 1px solid var(--brb-p-rule);
	background: transparent;
}

.brb-procedure-faq-item:last-child { border-block-end: 1px solid var(--brb-p-rule); }

.brb-procedure-faq-question {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 56px;
	padding: 1rem 3rem 1rem 0;
	color: var(--brb-p-ink);
	font-size: 1.0625rem;
	font-weight: var(--brb-weight-bold);
	line-height: 1.6;
	cursor: pointer;
	list-style: none;
}

.brb-procedure-faq-question::-webkit-details-marker { display: none; }

.brb-procedure-faq-question::before,
.brb-procedure-faq-question::after {
	content: "";
	position: absolute;
	inset-block-start: 50%;
	inset-inline-end: 0.625rem;
	width: 0.875rem;
	height: 2px;
	background: var(--brb-p-accent);
}

.brb-procedure-faq-question::after {
	transform: rotate(90deg);
}

.brb-procedure-faq-item[open] .brb-procedure-faq-question::after { transform: rotate(0); }

.brb-procedure-faq-answer {
	max-width: 38rem;
	margin: 0;
	padding: 0 2.5rem 1.5rem 0;
	color: var(--brb-p-ink-2);
	font-size: 1rem;
	line-height: 1.8;
}

/* Price is one comparison panel with explicit offer hierarchy and honest notes. */
.brb-procedure-price-panel {
	border: 1px solid var(--brb-p-rule);
	border-radius: var(--brb-radius-feature);
	background: var(--brb-p-card);
	box-shadow: var(--brb-shadow-card);
	overflow: hidden;
}

.brb-procedure-price-list {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	margin: 0;
	padding: 0;
	list-style: none;
}

.brb-procedure-price-item {
	display: grid;
	gap: 1rem;
	padding: clamp(1.25rem, 4vw, 2rem);
}

.brb-procedure-price-item + .brb-procedure-price-item { border-block-start: 1px solid var(--brb-p-rule); }

.brb-procedure-price-label {
	color: var(--brb-p-ink);
	font-size: 1.0625rem;
	font-weight: var(--brb-weight-bold);
	line-height: 1.5;
}

.brb-procedure-price-values {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.625rem 1.25rem;
}

.brb-procedure-price-event,
.brb-procedure-price-regular {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
}

.brb-procedure-price-kind {
	color: var(--brb-p-muted);
	font-size: var(--brb-type-small);
	font-weight: var(--brb-weight-medium);
}

.brb-procedure-price-event .brb-procedure-price-kind {
	padding: 0.125rem 0.5rem;
	border-radius: var(--brb-radius-pill);
	background: var(--brb-p-accent-soft);
	color: var(--brb-p-accent);
}

.brb-procedure-price-event .brb-procedure-price-amount {
	color: var(--brb-p-accent);
	font-size: clamp(1.625rem, 6vw, 2.25rem);
	font-weight: var(--brb-weight-bold);
	line-height: 1.25;
	letter-spacing: -0.025em;
}

.brb-procedure-price-regular .brb-procedure-price-amount {
	color: var(--brb-p-ink-2);
	font-size: 1rem;
	font-weight: var(--brb-weight-medium);
}

.brb-procedure-price-conditions,
.brb-procedure-price-notice {
	max-width: none;
	margin: 0;
	background: var(--brb-p-notice-bg);
	color: var(--brb-p-ink-2);
	font-size: var(--brb-type-small);
	line-height: 1.75;
}

.brb-procedure-price-conditions {
	display: grid;
	gap: 0.5rem;
	padding: 1.25rem 1.5rem 0 2.75rem;
	border-block-start: 1px solid var(--brb-p-rule);
}

.brb-procedure-price-conditions .brb-procedure-item {
	color: var(--brb-p-ink-2);
	font-size: var(--brb-type-small);
}

.brb-procedure-price-notice { padding: 0.75rem 1.5rem 0; }

.brb-procedure-price-list + .brb-procedure-price-notice {
	padding-block-start: 1.25rem;
	border-block-start: 1px solid var(--brb-p-rule);
}

.brb-procedure-price-conditions:last-child,
.brb-procedure-price-notice:last-child { padding-block-end: 1.25rem; }

.brb-procedure-trust-card {
	max-width: var(--brb-p-measure);
	padding: 0;
	border: 0;
	background: transparent;
}

.brb-procedure-trust-text {
	margin: 0.75rem 0 0;
	color: var(--brb-p-ink-2);
	font-size: 1.0625rem;
	line-height: 1.8;
}

.brb-procedure-trust-credit {
	margin: 1.25rem 0 0;
	padding-block-start: 1rem;
	border-block-start: 1px solid var(--brb-p-rule);
	color: var(--brb-p-muted);
	font-size: var(--brb-type-small);
	line-height: 1.7;
}

.brb-procedure-core-view :focus-visible {
	outline: 3px solid var(--brb-color-focus);
	outline-offset: 3px;
	border-radius: var(--brb-radius-small);
}

@media (min-width: 30rem) {
	.brb-patient-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 48rem) {
	.brb-procedure-core-view { --brb-p-edge: var(--brb-layout-padding-desktop); }

	.brb-procedure-cards,
	.brb-procedure-fit-grid,
	.brb-procedure-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.brb-procedure-step {
		padding: var(--brb-space-card);
		border-block-start: 1px solid var(--brb-p-rule);
	}

	.brb-procedure-step::before { display: none; }

	.brb-procedure-step-number {
		position: static;
	}

	.brb-procedure-price-item {
		grid-template-columns: minmax(10rem, 0.75fr) minmax(0, 1.25fr);
		align-items: baseline;
	}
}

@media (min-width: 64rem) {
	.brb-procedure-hero--has-media .brb-procedure-hero-inner {
		grid-template-columns: minmax(0, 1.2fr) minmax(18rem, 0.8fr);
		align-items: end;
	}

	.brb-procedure-summary .brb-procedure-cards,
	.brb-procedure-shot-design .brb-procedure-cards {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.brb-procedure-care-cards {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.brb-procedure-care-cards .brb-procedure-card {
		border-width: 1px 0 0;
	}

	.brb-procedure-comparison-table { min-width: 0; }
}

@media (min-width: 80rem) {
	.brb-procedure-hero--has-media {
		background: linear-gradient(90deg, var(--brb-p-surface) 0 70%, var(--brb-p-feature) 70% 100%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.brb-procedure-core-view *,
	.brb-procedure-core-view *::before,
	.brb-procedure-core-view *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Related diary navigation sits outside the Core view but shares its vocabulary. */
.brb-related-diaries {
	margin-block-start: 2rem;
	padding-block-start: 1.5rem;
	border-block-start: 1px solid var(--brb-color-border);
}

.brb-related-diaries h2 {
	margin: 0 0 0.75rem;
	font-size: 1.0625rem;
}

.brb-related-diaries ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.brb-related-diaries a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0.5rem 1rem;
	border: 1px solid var(--brb-color-border);
	border-radius: var(--brb-radius-pill);
	color: inherit;
	text-decoration: none;
}

.brb-related-diaries a:hover,
.brb-related-diaries a:focus-visible {
	border-color: var(--brb-color-brand);
	color: var(--brb-color-brand);
}