/* assets/css/bukie96.css — Zelguora Oncology Practice Components */


.site-header {
	width: 100%;
	background-color: var(--ground);
	border-bottom: var(--rule-hairline);
	position: relative;
	z-index: 100;
	transition: padding var(--dur-moderate) var(--ease-standard),
							background-color var(--dur-moderate) var(--ease-standard);
}


.site-header--scrolled {
	background-color: var(--surface);
	box-shadow: 0 1px 0 var(--line);
}


.site-header__masthead {
	padding-block: 1.25rem 0.85rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.85rem;
	text-align: center;
	position: relative;
}


.site-header--scrolled .site-header__masthead {
	padding-block: 0.65rem 0.5rem;
	gap: 0.45rem;
}


.site-brand {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	border: none;
	outline: none;
}


.site-brand img {
	height: 3.2rem;
	width: auto;
	display: block;
	transition: transform var(--dur-rapid) var(--ease-standard);
}


.site-brand:hover img { transform: translateY(-1px); }


.site-brand:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 4px;
}


.site-header--scrolled .site-brand img { height: 2.5rem; }


.site-nav {
	width: 100%;
	max-width: var(--container-max);
	margin-inline: auto;
	display: flex;
	align-items: center;
	justify-content: center;
}


.site-nav__list {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: clamp(1.25rem, 3.5vw, 2.75rem);
	padding: 0.5rem 1rem;
	margin: 0;
	list-style: none;
}


.site-nav__link {
	font-family: var(--duha-e79);
	font-size: var(--step--1);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--ink);
	text-decoration: none;
	padding: 0.5rem 0.25rem;
	position: relative;
	display: inline-block;
	min-height: 44px;
	line-height: calc(44px - 1rem);
	transition: color var(--dur-rapid) var(--ease-standard);
}


.site-nav__link::after {
	content: "";
	position: absolute;
	bottom: 4px;
	left: 0;
	right: 0;
	height: 1px;
	background-color: transparent;
	transition: background-color var(--dur-rapid) var(--ease-standard);
}


.site-nav__link:hover { color: var(--accent); }


.site-nav__link:hover::after { background-color: var(--accent); }


.site-nav__link:active {
	color: var(--ink);
	transform: translateY(1px);
}


.site-nav__link:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}


.site-nav__link[aria-current='page'] {
	color: var(--accent);
	font-weight: 600;
}


.site-nav__link[aria-current='page']::after { background-color: var(--accent); }


.site-nav-toggle {
	display: none;
	background: transparent;
	border: 1px solid var(--line);
	color: var(--ink);
	padding: 0.5rem 0.85rem;
	font-family: var(--duha-e79);
	font-size: 0.8125rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	cursor: pointer;
	min-height: 44px;
	align-items: center;
	gap: 0.5rem;
}


.site-nav-toggle:hover {
	background-color: var(--surface);
	border-color: var(--ink);
}


.site-nav-toggle:active {
	background-color: var(--surface-2);
	transform: translateY(1px);
}


.site-nav-toggle:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}


@media (max-width: 768px) {
	.site-header__masthead {
		flex-direction: row;
		justify-content: space-between;
		padding-inline: var(--gutter);
		padding-block: 0.75rem;
	}


	.site-nav-toggle { display: inline-flex; }


	.site-nav {
		display: none;
		width: 100%;
		border-top: var(--rule-hairline);
		background-color: var(--surface);
	}


	.site-nav[data-open='true'] { display: block; }


	.site-nav__list {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		padding: 0.75rem var(--gutter);
	}


	.site-nav__link {
		padding: 0.75rem 0;
		border-bottom: 1px dashed var(--line);

		width: 100%;
	}


	.site-nav__link:last-child { border-bottom: none; }
}


/* ============================================================
	2. BUTTONS & ACTIONS
	============================================================ */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	padding: 0.75rem 1.6rem;
	font-family: var(--duha-e79);
	font-size: var(--step--1);
	font-weight: 500;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	text-decoration: none;
	min-height: 48px;
	cursor: pointer;
	border-radius: 0;
	transition: background-color var(--dur-rapid) var(--ease-standard),
							color var(--dur-rapid) var(--ease-standard),
							border-color var(--dur-rapid) var(--ease-standard),
							transform var(--dur-rapid) var(--ease-standard);
	text-align: center;
}


.btn--primary {
	background-color: var(--accent);
	color: var(--accent-ink);
	border: 1px solid var(--accent);
}


.btn--primary:hover {
	background-color: #934e4d;
	border-color: #934e4d;
	color: var(--accent-ink);
}


.btn--primary:active {
	background-color: #7d3f3e;
	border-color: #7d3f3e;
	transform: translateY(1px);
}


.btn--primary:focus-visible {
	outline: 2px solid var(--ink);
	outline-offset: 3px;
}


.btn--secondary {
	background-color: transparent;
	color: var(--ink);
	border: 1px solid var(--line);
}


.btn--secondary:hover {
	background-color: var(--surface);
	border-color: var(--ink);
	color: var(--ink);
}


.btn--secondary:active {
	background-color: var(--surface-2);
	transform: translateY(1px);
}


.btn--secondary:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 3px;
}


.btn--text {
	background: transparent;
	border: none;
	color: var(--ink);
	padding: 0.5rem 0.25rem;
	text-decoration: underline;
	text-underline-offset: 3px;
	min-height: 44px;
}


.btn--text:hover { color: var(--accent); }


.btn--text:active { transform: translateY(1px); }


.btn--text:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}


.scroll-spine {
	position: fixed;
	right: clamp(0.75rem, 2vw, 1.75rem);

	top: 50%;
	transform: translateY(-50%);
	width: 2px;
	height: clamp(140px, 28vh, 260px);
	background-color: var(--surface-2);
	z-index: 90;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	pointer-events: auto;
}


.scroll-spine__fill {

	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 0%;
	background-color: var(--accent);
	pointer-events: none;
}


.scroll-spine__node {
	width: 8px;
	height: 8px;
	background-color: var(--surface-2);
	border: 1px solid var(--line);
	position: relative;
	z-index: 2;
	cursor: pointer;
	transition: background-color var(--dur-rapid) var(--ease-standard),
							transform var(--dur-rapid) var(--ease-standard);
	display: block;
	text-decoration: none;
}


.scroll-spine__node:hover {
	background-color: var(--accent);
	transform: scale(1.4);
}


.scroll-spine__node:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}


.scroll-spine__node--active {
	background-color: var(--accent);
	border-color: var(--accent);
}


.exchange-block {
	padding-block: clamp(3rem, 6vw, 5rem);
	border-bottom: var(--rule-hairline);
	position: relative;
}


.exchange-block:last-of-type { border-bottom: none; }


.exchange-prompt {
	background-color: var(--surface);
	border-left: 3px solid var(--line);
	padding: clamp(1.25rem, 2.5vw, 1.75rem);
	margin-bottom: clamp(1.75rem, 3.5vw, 2.75rem);
}


.exchange-prompt__label {
	font-family: var(--duha-e79);
	font-size: var(--step--1);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--ink-soft);
	margin-bottom: 0.5rem;
}


.exchange-prompt__quote {
	font-family: var(--duha-28f);
	font-size: var(--duha-d17);
	font-style: italic;
	font-weight: 500;
	color: var(--ink);
	line-height: 1.35;
	max-width: var(--measure-prose);
}


.exchange-reply {
	padding-left: clamp(0.75rem, 2vw, 1.5rem);
	border-left: 1px dashed var(--line);
}


.exchange-reply__label {
	font-family: var(--duha-e79);
	font-size: var(--step--1);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--accent);
	margin-bottom: 0.75rem;
	font-weight: 600;
}


.exchange-reply__heading {
	font-family: var(--duha-28f);
	font-size: var(--duha-b22);
	font-weight: 600;
	margin-bottom: 1.25rem;
	line-height: 1.2;
}


.exchange-reply__body {
	font-size: var(--duha-b22);
	line-height: 1.65;
	color: var(--ink);
	max-width: var(--measure-prose);
}


.exchange-reply__figure {
	margin-top: clamp(2rem, 4vw, 3rem);
	border: 1px solid var(--line);
	background-color: var(--surface);
}


.exchange-reply__figure img {
	width: 100%;
	height: auto;
	display: block;
}


.exchange-reply__caption {
	font-family: var(--duha-e79);
	font-size: var(--step--1);
	color: var(--ink-soft);
	padding: 0.75rem 1rem;
	border-top: 1px solid var(--line);
	background-color: var(--surface);
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.5rem;
}


.ledger-table-wrap {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--line);
	background-color: var(--surface);
	margin-block: 2rem;
}


.ledger-table {
	width: 100%;
	border-collapse: collapse;
	text-align: left;
	font-size: var(--duha-b22);
}


.ledger-table th {
	background-color: var(--surface-2);
	color: var(--ink);
	font-family: var(--duha-e79);
	font-size: var(--step--1);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	padding: 0.85rem 1.15rem;
	border-bottom: 1px solid var(--line);
	border-right: 1px solid var(--line);
}


.ledger-table th:last-child { border-right: none; }


.ledger-table td {
	padding: 0.95rem 1.15rem;
	border-bottom: 1px solid var(--line);
	border-right: 1px solid var(--line);
	color: var(--ink);
	vertical-align: top;
}


.ledger-table td:last-child { border-right: none; }


.ledger-table tr:last-child td { border-bottom: none; }


.ledger-table tr:hover td { background-color: rgba(237, 230, 228, 0.4); }


/* ============================================================
	6. FORMS & ERROR STATES
	============================================================ */
.inquiry-form {
	background-color: var(--surface);
	border: 1px solid var(--line);
	padding: clamp(1.5rem, 3.5vw, 2.5rem);
}


.form-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.25rem;
}


@media (max-width: 640px) {
	.form-grid { grid-template-columns: minmax(0, 1fr); }
}


.form-group {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}


.form-group--full { grid-column: 1 / -1; }


.form-label {
	font-family: var(--duha-e79);
	font-size: var(--step--1);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--ink);
	display: flex;
	justify-content: space-between;
	align-items: baseline;
}


.form-label__note {
	font-size: 0.75rem;
	color: var(--ink-soft);
	text-transform: none;
	letter-spacing: 0;
}


.form-input,
.form-select,
.form-textarea {
	width: 100%;
	background-color: var(--ground);
	border: 1px solid var(--line);
	border-radius: 0;
	padding: 0.75rem 0.95rem;
	color: var(--ink);
	font-family: var(--duha-744);
	font-size: var(--duha-b22);
	min-height: 46px;
	transition: border-color var(--dur-rapid) var(--ease-standard),
							background-color var(--dur-rapid) var(--ease-standard);
}


.form-textarea {
	min-height: 110px;
	resize: vertical;
}


.form-input:hover,
.form-select:hover,
.form-textarea:hover { border-color: var(--ink-soft); }


.form-input:focus,
.form-select:focus,
.form-textarea:focus {
	outline: 2px solid var(--accent);
	outline-offset: 1px;
	background-color: #fffdfd;
}


.form-input[aria-invalid='true'],
.form-textarea[aria-invalid='true'] {
	border-color: #9e2a2b;
	background-color: #fdf5f5;
}


.form-error {
	font-family: var(--duha-e79);
	font-size: 0.75rem;
	color: #8c2324;
	margin-top: 0.25rem;
	display: none;
}


.form-error[data-visible='true'] { display: block; }


.form-checkbox-label {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	cursor: pointer;
	font-size: var(--duha-b22);
	line-height: 1.45;
	color: var(--ink);
}


.form-checkbox {
	appearance: none;
	-webkit-appearance: none;
	width: 20px;
	height: 20px;
	border: 1px solid var(--line);
	background-color: var(--ground);
	border-radius: 0;
	flex-shrink: 0;
	margin-top: 0.15rem;
	cursor: pointer;
	display: grid;
	place-content: center;
	transition: border-color var(--dur-rapid) var(--ease-standard),
							background-color var(--dur-rapid) var(--ease-standard);
}


.form-checkbox:hover { border-color: var(--ink); }


.form-checkbox:checked {
	background-color: var(--accent);
	border-color: var(--accent);
}


.form-checkbox:checked::before {
	content: "";
	width: 10px;
	height: 6px;
	border-left: 2px solid var(--accent-ink);
	border-bottom: 2px solid var(--accent-ink);
	transform: rotate(-45deg) translate(1px, -1px);
}


.form-checkbox:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}


.form-status {
	margin-top: 1.5rem;
	padding: 1rem 1.25rem;
	border: 1px solid var(--line);
	font-family: var(--duha-e79);
	font-size: var(--step--1);
	display: none;
}


.form-status--success {
	display: block;
	background-color: #f2f7f3;
	border-color: #4a7c59;
	color: #24442e;
}


.form-status--error {
	display: block;
	background-color: #fdf5f5;
	border-color: #9e2a2b;
	color: #6d1b1c;
}


.site-footer {
	width: 100%;
	background-color: var(--surface);
	border-top: var(--rule-hairline);
	padding-block: clamp(3rem, 6vw, 4.5rem) 2.5rem;
	margin-top: auto;
}


.site-footer__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 2rem;
}


.site-footer__brand {
	display: inline-block;
	margin-bottom: 0.5rem;
}


.site-footer__brand img {
	height: 3.6rem;
	width: auto;
	margin-inline: auto;
}


.site-footer__nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: clamp(1rem, 2.5vw, 2rem);
	list-style: none;
	padding: 0;
	margin: 0;
}


.site-footer__nav a {
	font-family: var(--duha-e79);
	font-size: var(--step--1);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--ink);
	text-decoration: none;
	padding: 0.35rem 0.5rem;
	min-height: 44px;
	line-height: calc(44px - 0.7rem);
	display: inline-block;
}


.site-footer__nav a:hover {
	color: var(--accent);
	text-decoration: underline;
}


.site-footer__nav a:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}


.site-footer__facts {
	border-top: 1px dashed var(--line);
	border-bottom: 1px dashed var(--line);
	padding-block: 1.5rem;
	width: 100%;
	max-width: 72ch;
	font-family: var(--duha-e79);
	font-size: var(--step--1);
	color: var(--ink-soft);
	line-height: 1.8;
}


.site-footer__facts p + p { margin-top: 0.4rem; }


.site-footer__legal-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1.25rem;
	font-family: var(--duha-e79);
	font-size: 0.75rem;
	color: var(--ink-soft);
	list-style: none;
	padding: 0;
	margin: 0;
}


.site-footer__legal-row a,
.site-footer__legal-row button {
	color: var(--ink-soft);
	text-decoration: underline;
	text-underline-offset: 2px;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding-block: 0.5rem;
}


@media (pointer: coarse) {
	.site-footer__legal-row a,
	.site-footer__legal-row button {
		min-height: 44px;
		padding-block: 0.65rem;
	}
}


.site-footer__legal-row a:hover { color: var(--accent); }


.site-footer__legal-row a:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}


.consent-banner {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: var(--ground);
	border-top: 2px solid var(--line);
	padding: 0.85rem var(--gutter);
	z-index: 9998;
	box-shadow: 0 -4px 16px rgba(43, 40, 39, 0.08);
	display: none;
}


.consent-banner[data-visible='true'] { display: block; }


.consent-banner__inner {
	max-width: var(--container-max);
	margin-inline: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	flex-wrap: wrap;
}


.consent-banner__text {
	font-family: var(--duha-744);
	font-size: var(--duha-b22);
	line-height: 1.4;
	color: var(--ink);
	margin: 0;
	max-width: 60ch;
}


.consent-banner__text a {
	color: var(--accent);
	font-weight: 500;
}


.consent-banner__actions {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-shrink: 0;
}


.consent-banner__btn {
	font-family: var(--duha-e79);
	font-size: 0.8125rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	padding: 0.55rem 1.15rem;
	min-height: 44px;
	cursor: pointer;
	border-radius: 0;
	transition: background-color var(--dur-rapid) var(--ease-standard),
							color var(--dur-rapid) var(--ease-standard),
							border-color var(--dur-rapid) var(--ease-standard),
							transform var(--dur-rapid) var(--ease-standard);
}


.consent-banner__btn--accept {
	background-color: var(--accent);
	color: var(--accent-ink);
	border: 1px solid var(--accent);
}


.consent-banner__btn--accept:hover { background-color: #934e4d; }


.consent-banner__btn--accept:active { transform: translateY(1px); }


.consent-banner__btn--decline {
	background-color: var(--surface);
	color: var(--ink);
	border: 1px solid var(--line);
}


.consent-banner__btn--decline:hover { background-color: var(--surface-2); }


.consent-banner__btn--decline:active { transform: translateY(1px); }


@media (max-width: 640px) {
	.consent-banner { padding-block: 0.75rem; }
	.consent-banner__actions {
		width: 100%;
		justify-content: stretch;
	}
	.consent-banner__btn {
		flex: 1;
		text-align: center;
	}
}


.chat-launcher {
	position: fixed;
	bottom: 1.5rem;
	right: 1.5rem;
	z-index: 9990;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	background-color: var(--surface);
	color: var(--ink);
	border: 1px solid var(--line);
	padding: 0.65rem 1rem;
	font-family: var(--duha-e79);
	font-size: var(--step--1);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	cursor: pointer;
	border-radius: 0;
	box-shadow: 0 4px 12px rgba(43, 40, 39, 0.08);
	min-height: 44px;
	transition: background-color var(--dur-rapid) var(--ease-standard),
							border-color var(--dur-rapid) var(--ease-standard),
							transform var(--dur-rapid) var(--ease-standard),
							bottom var(--dur-moderate) var(--ease-standard);
}


.chat-launcher:hover {
	background-color: var(--surface-2);
	border-color: var(--ink);
	color: var(--ink);
}


.chat-launcher:active {
	transform: translateY(1px);
	background-color: var(--ground);
}


.chat-launcher:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}


.chat-launcher[data-shifted='true'] { bottom: calc(4.5rem + 15px); }


.chat-launcher__badge {
	background-color: var(--accent);
	color: var(--accent-ink);
	font-size: 0.75rem;
	padding: 0.1rem 0.4rem;
	min-width: 18px;
	text-align: center;
	font-weight: 600;
}


.chat-panel {
	position: fixed;
	bottom: 5rem;
	right: 1.5rem;
	width: min(380px, calc(100vw - 3rem));
	max-height: min(540px, calc(100vh - 7rem));
	background-color: var(--ground);
	border: 1px solid var(--line);
	box-shadow: 0 8px 24px rgba(43, 40, 39, 0.15);
	z-index: 9995;
	display: none;
	flex-direction: column;
	border-radius: 0;
}


.chat-panel[data-open='true'] { display: flex; }


.chat-panel__header {
	padding: 0.85rem 1rem;
	background-color: var(--surface);
	border-bottom: 1px solid var(--line);
	display: flex;
	align-items: center;
	justify-content: space-between;
}


.chat-panel__title {
	font-family: var(--duha-28f);
	font-size: 1.05rem;
	font-weight: 600;
	margin: 0;
}


.chat-panel__close {
	background: transparent;
	border: none;
	color: var(--ink);
	cursor: pointer;
	padding: 0.35rem;
	min-height: 44px;
	min-width: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
}


.chat-panel__close:hover { color: var(--accent); }


.chat-panel__close:active { transform: translateY(1px); }


.chat-panel__close:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}


.chat-panel__messages {
	flex: 1;
	overflow-y: auto;
	padding: 1rem;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	background-color: var(--ground);
	min-height: 220px;
}


.chat-bubble {
	max-width: 82%;
	padding: 0.65rem 0.85rem;
	font-size: var(--step--1);
	line-height: 1.45;
}


.chat-bubble--agent {
	align-self: flex-start;
	background-color: var(--surface);
	border: 1px solid var(--line);
	color: var(--ink);
}


.chat-bubble--user {
	align-self: flex-end;
	background-color: var(--accent);
	color: var(--accent-ink);
	border: 1px solid var(--accent);
}


.chat-panel__form {
	padding: 0.85rem;
	background-color: var(--surface);
	border-top: 1px solid var(--line);
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}


.chat-panel__input-row {
	display: flex;
	gap: 0.5rem;
}


.chat-panel__input {
	flex: 1;
	background-color: var(--ground);
	border: 1px solid var(--line);
	padding: 0.55rem 0.75rem;
	font-family: var(--duha-744);
	font-size: var(--step--1);
	color: var(--ink);
	border-radius: 0;
	min-height: 44px;
}


.chat-panel__send {
	background-color: var(--accent);
	color: var(--accent-ink);
	border: 1px solid var(--accent);
	padding: 0.55rem 1rem;
	font-family: var(--duha-e79);
	font-size: var(--step--1);
	text-transform: uppercase;
	cursor: pointer;
	min-height: 44px;
}


.chat-panel__send:hover { background-color: #934e4d; }


.chat-panel__send:active { transform: translateY(1px); }


@media (max-width: 480px) {
	.chat-panel {
		right: 0.5rem;
		left: 0.5rem;
		width: auto;
		bottom: 4.5rem;
	}
}