/* ==========================================================================
   Accessibility toolbar — native replacement for the OneTap widget.
   Effects are scoped to page content (.site-header/.site-main/.site-footer)
   so the toolbar UI itself always stays readable.
   ========================================================================== */

/* ---------- Floating trigger button (fixed to the bottom-right corner,
   out of the way of the header CTA / mobile hamburger and page content) ---- */
.a11y-fab {
	position: fixed; right: 20px; bottom: 20px; top: auto;
	z-index: 900;
	width: 52px; height: 52px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: #3b5bdb; color: #fff; border: 0; cursor: pointer;
	box-shadow: 0 8px 22px -6px rgba(15, 23, 74, 0.55);
	transition: background 0.2s var(--ease), transform 0.2s var(--ease), box-shadow 0.2s var(--ease);
}
.a11y-fab:hover { background: #2f49b8; transform: scale(1.06); box-shadow: 0 10px 26px -6px rgba(15, 23, 74, 0.6); }
.a11y-fab:focus-visible { outline: 3px solid #3b5bdb; outline-offset: 3px; }
.a11y-fab svg { width: 28px; height: 28px; display: block; }
.a11y.is-open ~ .a11y-fab, .a11y-fab.is-hidden { opacity: 0; pointer-events: none; }

@media (max-width: 600px) {
	.a11y-fab { right: 14px; bottom: 14px; width: 48px; height: 48px; }
	.a11y-fab svg { width: 26px; height: 26px; }
}

/* ---------- Panel / drawer ---------- */
.a11y[hidden] { display: none; }
.a11y { position: fixed; inset: 0; z-index: 1000; }
.a11y__backdrop { position: absolute; inset: 0; background: rgba(15,11,9,0.45); opacity: 0; transition: opacity 0.3s ease; }
.a11y.is-open .a11y__backdrop { opacity: 1; }
.a11y__drawer {
	position: absolute; top: 0; right: 0; height: 100%;
	width: min(380px, 92vw);
	background: #fff; color: #241f1c;
	box-shadow: -24px 0 60px -30px rgba(0,0,0,0.5);
	display: flex; flex-direction: column;
	transform: translateX(100%); transition: transform 0.35s cubic-bezier(0.22,1,0.36,1);
	font-family: "Inter", system-ui, sans-serif;
}
.a11y.is-open .a11y__drawer { transform: translateX(0); }

.a11y__head { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; background: #b01f1b; color: #fff; }
.a11y__title { font-size: 18px; font-weight: 700; margin: 0; display: flex; align-items: center; gap: 8px; }
.a11y__title-icon { font-size: 20px; }
.a11y__close { background: rgba(255,255,255,0.15); border: 0; color: #fff; width: 34px; height: 34px; border-radius: 8px; font-size: 22px; line-height: 1; cursor: pointer; }
.a11y__close:hover { background: rgba(255,255,255,0.3); }

.a11y__body { padding: 16px 20px 8px; overflow-y: auto; flex: 1; }
.a11y__group-title { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #9a8f83; margin: 14px 2px 8px; }
.a11y__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

.a11y-box {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
	min-height: 92px; padding: 12px 8px; text-align: center;
	background: #faf6ef; border: 2px solid transparent; border-radius: 12px;
	color: #241f1c; font-size: 12.5px; font-weight: 600; cursor: pointer;
	transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
.a11y-box:hover { background: #f2ebdf; }
.a11y-box:focus-visible { outline: 3px solid #b01f1b; outline-offset: 2px; }
.a11y-box__icon { font-size: 22px; line-height: 1; color: #b01f1b; }
.a11y-box__label { line-height: 1.25; }
.a11y-box[aria-pressed="true"] { background: #fff; border-color: #b01f1b; box-shadow: 0 6px 18px -10px rgba(176,31,27,0.6); }

.a11y-box__dots { display: flex; gap: 4px; height: 6px; }
.a11y-box__dots i { width: 6px; height: 6px; border-radius: 50%; background: #d8cfc2; display: inline-block; }
.a11y-box__dots i.on { background: #b01f1b; }

.a11y__foot { padding: 14px 20px 20px; border-top: 1px solid rgba(36,31,28,0.1); }
.a11y__reset { width: 100%; padding: 12px; border-radius: 999px; border: 1.5px solid rgba(36,31,28,0.22); background: #fff; color: #241f1c; font-weight: 600; cursor: pointer; }
.a11y__reset:hover { background: #241f1c; color: #fff; border-color: #241f1c; }

/* ==========================================================================
   EFFECTS — applied via classes on <html>, scoped to content containers.
   ========================================================================== */
:root { --a11y-fs: 1; }
html { font-size: calc(100% * var(--a11y-fs, 1)); }

/* Line height */
.a11y-lh-on :is(.site-main, .site-footer) :is(p, li, dd, dt, blockquote, .prose, .menu-item__desc) {
	line-height: var(--a11y-lh, 1.9) !important;
}
/* Letter spacing */
.a11y-ls-on :is(.site-header, .site-main, .site-footer) :is(p, li, a, span, h1, h2, h3, h4) {
	letter-spacing: var(--a11y-ls, 0.08em) !important;
}
/* Readable font */
.a11y-readable :is(.site-header, .site-main, .site-footer),
.a11y-readable :is(.site-header, .site-main, .site-footer) * {
	font-family: Verdana, Tahoma, "Segoe UI", Arial, sans-serif !important;
	letter-spacing: 0.01em;
}

/* High contrast */
.a11y-contrast-high :is(.site-header, .site-main, .site-footer),
.a11y-contrast-high :is(.site-header, .site-main, .site-footer) *:not(.brand__logo) {
	background-color: #000 !important; background-image: none !important;
	color: #fff !important; border-color: #fff !important; text-shadow: none !important; box-shadow: none !important;
}
.a11y-contrast-high :is(.site-main, .site-footer) a { color: #ffe600 !important; text-decoration: underline !important; }
.a11y-contrast-high .btn { border: 2px solid #fff !important; }

/* Light / high-readability contrast */
.a11y-contrast-light :is(.site-header, .site-main, .site-footer),
.a11y-contrast-light :is(.site-header, .site-main, .site-footer) *:not(.brand__logo) {
	background-color: #fff !important; background-image: none !important;
	color: #111 !important; text-shadow: none !important;
}
.a11y-contrast-light :is(.site-main, .site-footer) a { color: #0a58ca !important; text-decoration: underline !important; }

/* Grayscale */
.a11y-grayscale .site-header,
.a11y-grayscale .site-main,
.a11y-grayscale .site-footer { filter: grayscale(1) !important; }

/* Highlight links */
.a11y-links :is(.site-main, .site-footer) a {
	outline: 2px solid #b01f1b !important; outline-offset: 2px;
	text-decoration: underline !important; text-underline-offset: 3px;
	background: rgba(176,31,27,0.08) !important;
}

/* Hide images */
.a11y-hideimg :is(.site-header, .site-main, .site-footer) img { visibility: hidden !important; }
.a11y-hideimg .hero__media,
.a11y-hideimg .feature-banner { background: #e9e3d8 !important; }
.a11y-hideimg .hero__media img { display: none !important; }

/* Big cursor */
.a11y-cursor, .a11y-cursor * {
	cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M8 4l30 18-14 3-6 15z' fill='%23fff' stroke='%23000' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 6 4, auto !important;
}

/* Stop animations */
.a11y-noanim *, .a11y-noanim *::before, .a11y-noanim *::after {
	animation: none !important; transition: none !important; scroll-behavior: auto !important;
}

/* Center text */
.a11y-align :is(.site-main, .site-footer) :is(p, li, h1, h2, h3, h4, blockquote, .prose, .page-hero__title) {
	text-align: center !important;
}

/* Font weight (bolder text) */
.a11y-bold :is(.site-header, .site-main, .site-footer) :is(p, li, a, span, dd, dt, blockquote, button, h1, h2, h3, h4) {
	font-weight: 700 !important;
}

/* Highlight content — outline the block under the pointer */
.a11y-highlight :is(.site-main, .site-footer) :is(p, li, h1, h2, h3, h4, blockquote, figure, article, .menu-item):hover {
	outline: 3px solid #3b5bdb !important; outline-offset: 3px;
	background: rgba(59, 91, 219, 0.06) !important;
}

/* Reading guide line + reading mask — follow the cursor (set via --a11y-cursor-y).
   pointer-events:none so they never block clicks; below the panel (z 1000) and the
   FAB (z 900) so those stay bright. */
.a11y-readline-el, .a11y-readmask-el { display: none; position: fixed; left: 0; right: 0; pointer-events: none; }
.a11y-readline-el {
	top: var(--a11y-cursor-y, 50%); height: 4px; transform: translateY(-50%);
	background: #b01f1b; box-shadow: 0 0 0 1px rgba(255,255,255,0.7); z-index: 860;
}
.a11y-readmask-el {
	top: var(--a11y-cursor-y, 50%); height: 130px; transform: translateY(-50%);
	box-shadow: 0 0 0 100vmax rgba(0,0,0,0.62); border-radius: 4px; z-index: 850;
}
html.a11y-readline .a11y-readline-el { display: block; }
html.a11y-readmask .a11y-readmask-el { display: block; }

@media (max-width: 480px) {
	.a11y__drawer { width: 100vw; }
}