/* Vireon Site Core — shared components. Namespace: .vireon- */

/* ---------- Kicker, lede ---------- */
.vireon-kicker {
	font-family: var(--vm-font-sans);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--vm-bronze-text);
	margin: 0 0 var(--vm-s1);
}
.vireon-lede { font-size: var(--vm-body-lg); color: var(--vm-muted); max-width: 64ch; }

/* ---------- Sections (homepage and hubs) ---------- */
.vireon-section,
.vireon-principles,
.vireon-home-hero {
	--wp--style--global--content-size: var(--vm-max);
	--wp--style--global--wide-size: var(--vm-max);
	padding-inline: var(--vm-gutter);
}
.vireon-section { padding-block: var(--vm-section); }
.vireon-section > h2:first-of-type,
.vireon-section .vireon-kicker + h2 { margin-top: 0; }
.vireon-section--stone { background: var(--vm-stone); }
.vireon-section + .vireon-section:not(.vireon-section--stone) { border-top: var(--vm-rule); }
.vireon-section--stone + .vireon-section { border-top: 0; }

/* ---------- Hero ---------- */
.vireon-home-hero {
	background: var(--vm-forest);
	color: var(--vm-on-dark);
	padding-block: clamp(3rem, 2rem + 5vw, 6.5rem);
}
.vireon-home-hero__text { max-width: 44rem; }
.vireon-home-hero .vireon-kicker { color: var(--vm-on-dark-muted); }
.vireon-home-hero__title {
	color: var(--vm-white);
	font-size: var(--vm-h1);
	line-height: 1.04;
	margin: 0 0 var(--vm-s3);
}
.vireon-home-hero__title .vireon-accent { display: block; color: var(--vm-bronze-decorative); }
.vireon-home-hero__deck {
	font-size: var(--vm-body-lg);
	line-height: 1.6;
	color: var(--vm-on-dark);
	max-width: 38rem;
	margin-bottom: var(--vm-s4);
}

/* ---------- Buttons (navigation actions only) ---------- */
.vireon-buttons { display: flex; flex-wrap: wrap; gap: var(--vm-s2); }
.vireon-button {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0.625rem 1.25rem;
	border: 1px solid currentColor;
	border-radius: var(--vm-radius);
	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: none;
	transition: background-color var(--vm-motion), color var(--vm-motion);
}
.vireon-button--primary { background: var(--vm-forest); border-color: var(--vm-forest); color: var(--vm-ivory); }
.vireon-button--primary:hover { background: var(--vm-forest-700); color: var(--vm-white); }
.vireon-button--ghost { background: transparent; color: var(--vm-forest); }
.vireon-button--ghost:hover { background: var(--vm-stone); color: var(--vm-forest); }
.vireon-home-hero .vireon-button--primary { background: var(--vm-ivory); border-color: var(--vm-ivory); color: var(--vm-forest); }
.vireon-home-hero .vireon-button--primary:hover { background: var(--vm-white); color: var(--vm-forest-dark); }
.vireon-home-hero .vireon-button--ghost { color: var(--vm-ivory); border-color: rgba(241, 236, 228, 0.6); }
.vireon-home-hero .vireon-button--ghost:hover { background: var(--vm-forest-700); color: var(--vm-white); }
.vireon-home-hero :focus-visible { outline-color: var(--vm-ivory); }

/* ---------- Principles strip ---------- */
.vireon-principles { padding-block: var(--vm-s5); border-bottom: var(--vm-rule); background: var(--vm-ivory); }
.vireon-principles__list {
	list-style: none;
	margin: 0 auto;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--vm-s3);
}
.vireon-principles__list li { margin: 0; color: var(--vm-muted); font-size: 0.9375rem; line-height: 1.5; }
.vireon-principles__list strong {
	display: block;
	font-family: var(--vm-font-serif);
	font-weight: 600;
	font-size: 1.375rem;
	line-height: 1.2;
	color: var(--vm-forest);
	margin-bottom: 0.25rem;
}
@media (min-width: 600px) { .vireon-principles__list { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) {
	.vireon-principles__list { grid-template-columns: repeat(4, 1fr); gap: 0; }
	.vireon-principles__list li { padding: 0 var(--vm-s3); border-left: var(--vm-rule); }
	.vireon-principles__list li:first-child { padding-left: 0; border-left: 0; }
}

/* ---------- Cards ---------- */
.vireon-cards { list-style: none; margin: var(--vm-s4) 0 0; padding: 0; display: grid; gap: var(--vm-s2); }
.vireon-cards--grid { grid-template-columns: 1fr; }
@media (min-width: 600px) { .vireon-cards--grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .vireon-cards--grid { grid-template-columns: repeat(3, 1fr); } }
.vireon-cards--list { grid-template-columns: 1fr; gap: 0; border-top: var(--vm-rule); }
@media (min-width: 768px) { .vireon-cards--list { grid-template-columns: repeat(2, 1fr); column-gap: var(--vm-s5); } }

.vireon-card {
	position: relative;
	margin: 0;
	padding: var(--vm-s3);
	background: var(--vm-white);
	border: var(--vm-rule);
	border-radius: var(--vm-radius);
}
.vireon-cards--list .vireon-card { background: transparent; border: 0; border-bottom: var(--vm-rule); border-radius: 0; padding: var(--vm-s3) 0; }
.vireon-card__title { font-size: 1.5rem; margin: 0 0 0.375rem; }
.vireon-card__link { text-decoration: none; color: var(--vm-forest); }
.vireon-card__link::after { content: ""; position: absolute; inset: 0; }
.vireon-card__link:focus-visible { outline: none; }
.vireon-card:has(.vireon-card__link:focus-visible) { outline: var(--vm-focus); outline-offset: 2px; }
.vireon-card:hover .vireon-card__link { color: var(--vm-bronze-text); }
.vireon-card__text { margin: 0; color: var(--vm-muted); font-size: 0.9375rem; line-height: 1.55; }
.vireon-card__more { display: inline-block; margin-top: var(--vm-s2); font-size: 0.875rem; font-weight: 600; color: var(--vm-bronze-text); }
.vireon-card--pending .vireon-card__title { color: var(--vm-forest); }

/* ---------- Steps ---------- */
.vireon-steps { list-style: none; counter-reset: vireon-step; margin: var(--vm-s4) 0 0; padding: 0; display: grid; gap: var(--vm-s4); }
.vireon-steps li { counter-increment: vireon-step; margin: 0; padding-top: var(--vm-s2); border-top: 1px solid var(--vm-bronze-decorative); color: var(--vm-muted); }
.vireon-steps li::before {
	content: counter(vireon-step, decimal-leading-zero);
	display: block;
	font-family: var(--vm-font-serif);
	font-size: 1.5rem;
	color: var(--vm-bronze-text);
	margin-bottom: var(--vm-s1);
}
.vireon-steps strong { display: block; font-family: var(--vm-font-serif); font-weight: 600; font-size: 1.375rem; color: var(--vm-forest); margin-bottom: 0.25rem; }
@media (min-width: 900px) { .vireon-steps { grid-template-columns: repeat(3, 1fr); } }

/* ---------- Standard list ---------- */
.vireon-standard__list { list-style: none; padding: 0; margin: var(--vm-s4) 0; display: grid; gap: var(--vm-s3); }
.vireon-standard__list li { margin: 0; color: var(--vm-muted); }
.vireon-standard__list strong { color: var(--vm-forest); }
@media (min-width: 768px) { .vireon-standard__list { grid-template-columns: repeat(2, 1fr); column-gap: var(--vm-s5); } }
@media (min-width: 1100px) { .vireon-standard__list { grid-template-columns: repeat(3, 1fr); } }

/* ---------- Link lists ---------- */
.vireon-link-list { list-style: none; margin: var(--vm-s3) 0 0; padding: 0; border-top: var(--vm-rule); }
.vireon-link-list li { margin: 0; border-bottom: var(--vm-rule); }
.vireon-link-list a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 44px;
	padding: 0.625rem 0;
	text-decoration: none;
	font-weight: 500;
}
.vireon-link-list a::after { content: "→"; color: var(--vm-bronze-text); margin-left: var(--vm-s2); }
@media (min-width: 768px) {
	.vireon-link-list--columns { columns: 2; column-gap: var(--vm-s5); }
	.vireon-link-list--columns li { break-inside: avoid; }
}

/* ---------- Featured ---------- */
.vireon-features { list-style: none; padding: 0; margin: var(--vm-s4) 0 0; display: grid; gap: var(--vm-s2); }
.vireon-feature { position: relative; margin: 0; padding: var(--vm-s3); background: var(--vm-white); border: var(--vm-rule); border-radius: var(--vm-radius); }
.vireon-feature--lead .vireon-card__title { font-size: var(--vm-h3); }
@media (min-width: 900px) {
	.vireon-features { grid-template-columns: 1.4fr 1fr; grid-auto-rows: auto; }
	.vireon-feature--lead { grid-row: span 3; padding: var(--vm-s4); }
}

/* ---------- Information boxes ---------- */
.vireon-box {
	margin-block: var(--vm-s4);
	padding: var(--vm-s3);
	border: var(--vm-rule);
	border-left: 3px solid var(--vm-forest);
	border-radius: 0 var(--vm-radius) var(--vm-radius) 0;
	background: var(--vm-white);
}
.vireon-box > :last-child { margin-bottom: 0; }
.vireon-box__label {
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--vm-forest);
	margin: 0 0 var(--vm-s1);
}
.vireon-box--answer { background: var(--vm-success-soft); border-left-color: var(--vm-forest); }
.vireon-box--answer p { font-size: var(--vm-body-lg); }
.vireon-box--snapshot { background: var(--vm-white); }
.vireon-box--limitation { background: var(--vm-warning-soft); border-left-color: var(--vm-bronze-text); }
.vireon-box--limitation .vireon-box__label { color: var(--vm-bronze-text); }
.vireon-box--warning { background: var(--vm-warning-soft); border-left: 4px solid var(--vm-charcoal); }
.vireon-box--warning .vireon-box__label { color: var(--vm-charcoal); }
.vireon-box--neutral,
.vireon-box--questions,
.vireon-box--travel,
.vireon-box--change { background: var(--vm-stone); }
.vireon-box--disclaimer { background: var(--vm-stone); border-left-color: var(--vm-muted); font-size: 0.9375rem; }

/* ---------- Tables ---------- */
.vireon-table,
.entry-content .wp-block-table { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-block: var(--vm-s4); }
.vireon-table table,
.entry-content .wp-block-table table { width: 100%; min-width: 34rem; border-collapse: collapse; font-size: 0.9375rem; background: var(--vm-white); }
.vireon-table th,
.vireon-table td,
.entry-content .wp-block-table th,
.entry-content .wp-block-table td { padding: 0.75rem 0.875rem; border: var(--vm-rule); text-align: left; vertical-align: top; }
.vireon-table thead th,
.entry-content .wp-block-table thead th { background: var(--vm-stone); color: var(--vm-forest); font-weight: 600; }
.vireon-table tbody th,
.entry-content .wp-block-table tbody th { font-weight: 600; color: var(--vm-forest); background: var(--vm-ivory); }
.vireon-table figcaption,
.entry-content .wp-block-table figcaption { font-size: var(--vm-small); color: var(--vm-muted); margin-top: var(--vm-s1); text-align: left; }
.vireon-table-hint { display: none; font-size: var(--vm-small); color: var(--vm-muted); margin: 0 0 0.25rem; }
.vireon-table.is-overflowing .vireon-table-hint,
.wp-block-table.is-overflowing .vireon-table-hint { display: block; }

/* ---------- Table of contents ---------- */
.vireon-toc { border: var(--vm-rule); border-radius: var(--vm-radius); background: var(--vm-white); padding: 0 var(--vm-s2); margin-block: var(--vm-s4); }
.vireon-toc summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; font-weight: 600; color: var(--vm-forest); }
.vireon-toc ul { margin: 0 0 var(--vm-s2); padding-left: 1.1rem; }
.vireon-toc li { margin: 0.25rem 0; }

/* ---------- Breadcrumbs ---------- */
.vireon-breadcrumbs { max-width: var(--vm-read); margin: 0 auto var(--vm-s2); font-size: var(--vm-small); color: var(--vm-muted); }
.vireon-breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.25rem 0.5rem; }
.vireon-breadcrumbs li { margin: 0; display: inline-flex; align-items: center; }
.vireon-breadcrumbs li + li::before { content: "/"; margin-right: 0.5rem; color: var(--vm-border); }
.vireon-breadcrumbs a { color: var(--vm-muted); }

/* ---------- Byline ---------- */
.vireon-byline { font-size: var(--vm-small); color: var(--vm-muted); margin-top: 0; margin-bottom: var(--vm-s4); }
.vireon-byline__author { color: var(--vm-forest); font-weight: 500; }

/* ---------- Video ---------- */
.vireon-video { margin-block: var(--vm-s4); }
.vireon-video__frame { position: relative; aspect-ratio: 16 / 9; background: var(--vm-forest-dark); border-radius: var(--vm-radius); overflow: hidden; }
.vireon-video__poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.vireon-video__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.vireon-video__play {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 64px;
	height: 64px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: rgba(248, 246, 241, 0.92);
	color: var(--vm-forest);
}
.vireon-video__play:hover { background: var(--vm-white); }
.vireon-video__caption { font-size: 0.9375rem; color: var(--vm-muted); margin-top: var(--vm-s1); }
.vireon-video__caption strong { color: var(--vm-forest); }

/* ---------- Cookie choices ---------- */
.vireon-consent {
	position: fixed;
	left: 16px;
	right: 16px;
	bottom: 16px;
	z-index: 200;
	max-width: 760px;
	margin-inline: auto;
	padding: var(--vm-s2) var(--vm-s3);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--vm-s2);
	background: var(--vm-white);
	border: var(--vm-rule);
	border-radius: 6px;
	box-shadow: 0 8px 24px rgba(23, 51, 43, 0.12);
}
.vireon-consent[hidden] { display: none; }
.vireon-consent__text { flex: 1 1 22rem; margin: 0; font-size: 0.9375rem; line-height: 1.5; color: var(--vm-charcoal); }
.vireon-consent__actions { display: flex; flex-wrap: wrap; gap: var(--vm-s1); }
.vireon-consent .vireon-button { font-size: 0.875rem; }
.vireon-footer__consent { background: none; border: 0; padding: 0; color: inherit; font: inherit; text-decoration: underline; text-decoration-color: rgba(241, 236, 228, 0.4); cursor: pointer; min-height: 36px; }
@media print { .vireon-consent { display: none !important; } }