/*
 * RogIQ sections — shared by every design. Cards, icons, lists, FAQ, tabs, pricing, steps, blog, contact, map, post and bio layouts.
 * Colors, sizes and spacing come from presets only; in-between tones are color-mix() of presets. Icon glyphs are at the end.
 */

/* ---------- Tones: base defaults; Alt and Feature schemes override (Feature tones live in layout.css) ---------- */
:root {
	--rogiq-heading: var(--rogiq-ink);
	--rogiq-small: var(--wp--preset--color--contrast-alt);
	--rogiq-divider: var(--wp--preset--color--border);
	--rogiq-raised: color-mix(in srgb, var(--wp--preset--color--base-alt) 45%, var(--wp--preset--color--base));
	--rogiq-accent: var(--wp--preset--color--accent);
}
.is-style-alt {
	--rogiq-divider: color-mix(in srgb, var(--wp--preset--color--border) 85%, var(--wp--preset--color--contrast-alt));
	--rogiq-raised: var(--wp--preset--color--base);
}
.is-style-feature { --rogiq-heading: var(--wp--preset--color--primary-contrast); }

.rogiq-muted,
p.rogiq-muted,
.is-style-feature p.rogiq-muted { color: var(--rogiq-small); font-size: var(--wp--preset--font-size--small); }

.rogiq-media img { border-radius: var(--wp--custom--radius--card, 22px); }
.rogiq-sticky { position: sticky; top: var(--wp--preset--spacing--60); align-self: flex-start; }
@media (max-width: 781px), (max-height: 40rem) { .rogiq-sticky { position: static; } }

/* ---------- Cards ---------- */
.rogiq-card {
	position: relative;
	padding: var(--wp--preset--spacing--50);
	border-radius: var(--wp--custom--radius--card, 22px);
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	box-shadow: var(--wp--preset--shadow--card);
	transition: box-shadow var(--wp--custom--transition--base, 0.4s ease), transform var(--wp--custom--transition--base, 0.4s ease);
}
.rogiq-card:not(.is-style-feature) {
	--rogiq-heading: var(--rogiq-ink);
	--rogiq-small: var(--wp--preset--color--contrast-alt);
	--rogiq-divider: var(--wp--preset--color--border);
	--rogiq-raised: color-mix(in srgb, var(--wp--preset--color--base-alt) 45%, var(--wp--preset--color--base));
	--rogiq-accent: var(--wp--preset--color--accent);
}
.rogiq-card.is-style-feature { background-color: var(--wp--preset--color--primary); color: var(--rogiq-body); }
.rogiq-card:hover { box-shadow: var(--wp--preset--shadow--card-hover); transform: translateY(-4px); }
.rogiq-form-card:hover { box-shadow: var(--wp--preset--shadow--card); transform: none; }

/* ---------- Icon tiles: add rogiq-icon + rogiq-i-<name> to a card or item Group ---------- */
.rogiq-icon { position: relative; --rogiq-tile: 64px; --rogiq-glyph: 30px; --rogiq-inset: 0px; }
.rogiq-card.rogiq-icon { --rogiq-inset: var(--wp--preset--spacing--50); }
.rogiq-icon::before {
	content: '';
	display: block;
	box-sizing: border-box;
	width: var(--rogiq-tile);
	height: var(--rogiq-tile);
	margin-bottom: var(--wp--preset--spacing--30);
	border: 1px solid var(--rogiq-accent);
	border-radius: var(--wp--custom--radius--sm, 12px);
	background: var(--rogiq-raised);
}
.rogiq-icon::after {
	content: '';
	position: absolute;
	top: calc(var(--rogiq-inset-y, var(--rogiq-inset)) + (var(--rogiq-tile) - var(--rogiq-glyph)) / 2);
	left: calc(var(--rogiq-inset) + (var(--rogiq-tile) - var(--rogiq-glyph)) / 2);
	width: var(--rogiq-glyph);
	height: var(--rogiq-glyph);
	background: var(--rogiq-accent);
	-webkit-mask: var(--rogiq-glyph-img) center / contain no-repeat;
	        mask: var(--rogiq-glyph-img) center / contain no-repeat;
}
.rogiq-card.rogiq-icon > h3 { margin-top: var(--wp--preset--spacing--30); font-size: var(--wp--preset--font-size--x-large); }

/* Icon beside text (feature list items, contact details) */

.rogiq-contact-item {
	display: grid;
	grid-template-columns: var(--rogiq-tile) minmax(0, 1fr);
	column-gap: var(--wp--preset--spacing--30);
	align-items: start;
}
.rogiq-contact-item { --rogiq-tile: 44px; --rogiq-glyph: 22px; --rogiq-inset-y: var(--wp--preset--spacing--40); }

.rogiq-contact-item::before { grid-row: 1 / span 2; margin: 0; }

.rogiq-contact-item > * { grid-column: 2; margin: 0; }

.rogiq-contact-item > * + * { margin-top: 4px; }

/* ---------- Text helpers ---------- */
p.rogiq-link-arrow a,
a.rogiq-link-arrow:not(:has(svg)) {
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	font-weight: 500;
	color: var(--rogiq-heading);
	text-decoration: none;
}
p.rogiq-link-arrow a::after,
a.rogiq-link-arrow:not(:has(svg))::after {
	content: '';
	width: 28px;
	height: 18px;
	flex-shrink: 0;
	background: currentColor;
	-webkit-mask: var(--rogiq-arrow) center / contain no-repeat;
	        mask: var(--rogiq-arrow) center / contain no-repeat;
	transition: transform var(--wp--custom--transition--fast, 0.2s ease);
}
p.rogiq-link-arrow a:hover::after,
a.rogiq-link-arrow:not(:has(svg)):hover::after,
.rogiq-card:hover a.rogiq-link-arrow:not(:has(svg))::after { transform: translateX(4px); }
p.rogiq-link-arrow a:hover,
a.rogiq-link-arrow:not(:has(svg)):hover,
.rogiq-card:hover a.rogiq-link-arrow:not(:has(svg)) { text-decoration: underline; text-underline-offset: 4px; }

p.rogiq-back a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	color: var(--rogiq-small);
	text-decoration: none;
}
p.rogiq-back a::before {
	content: '';
	width: 16px;
	height: 16px;
	background: currentColor;
	-webkit-mask: var(--rogiq-chevron-left) center / contain no-repeat;
	        mask: var(--rogiq-chevron-left) center / contain no-repeat;
	transition: transform var(--wp--custom--transition--fast, 0.2s ease);
}
p.rogiq-back a:hover { color: var(--rogiq-heading); }
p.rogiq-back a:hover::before { transform: translateX(-3px); }

/* Check / cross lists */
.rogiq-list-check, .is-style-check,
.rogiq-list-cross, .is-style-cross { padding: 0; list-style: none; }
:is(.rogiq-list-check, .is-style-check, .rogiq-list-cross, .is-style-cross) li { position: relative; padding-left: 32px; }
:is(.rogiq-list-check, .is-style-check, .rogiq-list-cross, .is-style-cross) li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.2em;
	box-sizing: border-box;
	width: 20px;
	height: 20px;
	border: 1.5px solid var(--rogiq-accent);
	border-radius: var(--wp--custom--radius--round, 50%);
}
:is(.rogiq-list-check, .is-style-check, .rogiq-list-cross, .is-style-cross) li::after {
	content: '';
	position: absolute;
	left: 5px;
	top: calc(0.2em + 5px);
	width: 10px;
	height: 10px;
	background: var(--rogiq-accent);
	-webkit-mask: var(--rogiq-mark-check) center / contain no-repeat;
	        mask: var(--rogiq-mark-check) center / contain no-repeat;
}
:is(.rogiq-list-cross, .is-style-cross) li { color: var(--rogiq-small); }
:is(.rogiq-list-cross, .is-style-cross) li::before { border-color: var(--rogiq-small); }
.is-style-feature .rogiq-list-check li { color: var(--rogiq-heading); }
:is(.rogiq-list-cross, .is-style-cross) li::after { background: var(--rogiq-small); -webkit-mask-image: var(--rogiq-mark-cross); mask-image: var(--rogiq-mark-cross); }

/* ---------- Media Fit: photo beside text (columns.rogiq-media-fit) ----------
   Desktop: the photo stretches to the text column's height plus a small
   overhang top and bottom. It never gets taller than it is wide; past that
   it stays square and sticks while the longer text scrolls by.
   It also never gets flatter than 4:3 (short text then centres on it). */
@media (min-width: 782px) {
	.rogiq-media-fit.wp-block-columns { align-items: stretch; }
	.rogiq-media-fit > .wp-block-column:has(> .rogiq-media) {
		align-self: stretch;
		container-type: inline-size;
	}
	.rogiq-media-fit > .wp-block-column:has(> .rogiq-media) > .rogiq-media {
		position: sticky;
		top: var(--wp--preset--spacing--60);
		margin-block: calc(-1 * var(--wp--preset--spacing--30));
		height: calc(100% + 2 * var(--wp--preset--spacing--30));
		min-height: 75cqw;
		max-height: 100cqw;
	}
	.rogiq-media-fit > .wp-block-column:has(> .rogiq-media) > .rogiq-media img {
		width: 100%;
		height: 100%;
		aspect-ratio: auto !important;
		object-fit: cover;
	}
}
@media (max-width: 781px) { .rogiq-media-fit .rogiq-media img { aspect-ratio: 4 / 3 !important; } }

/* ---------- FAQ (core Details) ---------- */
.rogiq-faq-list { border-top: 1px solid var(--rogiq-divider); }
.rogiq-qa { border-bottom: 1px solid var(--rogiq-divider); }
.rogiq-qa > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--40);
	padding: var(--wp--preset--spacing--40) 0;
	list-style: none;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--x-large);
	line-height: 1.35;
	color: var(--rogiq-ink);
	cursor: pointer;
}
.rogiq-qa > summary::-webkit-details-marker { display: none; }
.rogiq-qa > summary::after {
	content: '';
	flex-shrink: 0;
	box-sizing: border-box;
	width: 36px;
	height: 36px;
	border: 1.5px solid var(--rogiq-divider);
	border-radius: var(--rogiq-icon-toggle-radius, 50%);
	color: var(--rogiq-ink);
	background-image: linear-gradient(currentColor, currentColor), linear-gradient(currentColor, currentColor);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 12px 1.5px, 1.5px 12px;
	transition: background-color var(--wp--custom--transition--fast, 0.2s ease), border-color var(--wp--custom--transition--fast, 0.2s ease);
}
.rogiq-qa > summary:hover::after { border-color: var(--wp--preset--color--primary); }
.rogiq-qa[open] > summary::after {
	border-color: var(--wp--preset--color--primary);
	background-color: var(--wp--preset--color--primary);
	background-size: 12px 1.5px, 0 0;
	color: var(--wp--preset--color--base);
}
.rogiq-qa > summary:focus-visible { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 4px; border-radius: 4px; }
.rogiq-qa > p { max-width: 42rem; margin: 0 0 var(--wp--preset--spacing--30); }
.rogiq-qa > p:last-child { margin-bottom: var(--wp--preset--spacing--40); }
@media (max-width: 781px) { .rogiq-qa > summary { font-size: var(--wp--preset--font-size--large); } }

/* ---------- Contact details + form slot ---------- */
.rogiq-form-slot {
	padding: var(--wp--preset--spacing--50);
	border: 1.5px dashed var(--rogiq-divider);
	border-radius: var(--wp--custom--radius--sm, 12px);
	color: var(--rogiq-small);
	text-align: center;
}
.rogiq-contact-item { padding-top: var(--wp--preset--spacing--40); border-top: 1px solid var(--rogiq-divider); }
.rogiq-contact-item p.rogiq-contact-label { font-size: var(--wp--preset--font-size--small); color: var(--rogiq-small); }
.rogiq-contact-item p.rogiq-contact-value { color: var(--rogiq-heading); }
.rogiq-contact-item a { text-decoration: none; }
.rogiq-contact-item a:hover { text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Forms (rogiq/form block: Gravity Forms, RogIQ Forms or any inline form) ---------- */
.rogiq-form { --rogiq-input-border: color-mix(in srgb, var(--wp--preset--color--border) 70%, var(--wp--preset--color--contrast-alt)); margin-top: var(--wp--preset--spacing--50); }
.rogiq-form label,
.rogiq-form legend,
.rogiq-form .gfield_label { font-size: var(--wp--preset--font-size--small); font-weight: 500; color: var(--rogiq-heading); }
/* Checkbox / consent / choice labels follow the page text colour (Gravity Forms paints them its own navy, invisible on dark presets). */
.rogiq-form .gform-theme--framework .gfield .gform-field-label--type-inline,
.rogiq-form .gform-theme--framework .gfield .gform-field-label--type-inline .gform-field-label__text { color: inherit; }
.rogiq-form input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="hidden"], [type="file"]),
.rogiq-form select,
.rogiq-form textarea {
	box-sizing: border-box;
	width: 100%;
	min-height: 52px;
	padding: 0.85rem 1rem;
	border: 1px solid var(--rogiq-input-border);
	border-radius: var(--wp--custom--radius--sm, 12px);
	background: var(--rogiq-raised);
	color: var(--rogiq-heading);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	transition: border-color var(--wp--custom--transition--fast, 0.2s ease), box-shadow var(--wp--custom--transition--fast, 0.2s ease);
}
.rogiq-form textarea { min-height: 140px; resize: vertical; }
.rogiq-form input:focus,
.rogiq-form select:focus,
.rogiq-form textarea:focus { outline: none; border-color: var(--wp--preset--color--accent); box-shadow: 0 0 0 3px var(--rogiq-raised), 0 0 0 4px var(--wp--preset--color--accent); }
.rogiq-form input[type="submit"],
.rogiq-form button[type="submit"],
.rogiq-form .gform_button {
	min-height: 44px;
	padding: 0.7rem 1.4rem;
	border: 1.5px solid var(--wp--preset--color--primary);
	border-radius: var(--wp--custom--radius--button, var(--wp--custom--radius--pill, 999px));
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary-contrast);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: filter var(--wp--custom--transition--fast, 0.2s ease);
}
.rogiq-form input[type="submit"]:hover,
.rogiq-form button[type="submit"]:hover,
.rogiq-form .gform_button:hover { filter: brightness(0.9); }
.rogiq-form .gform_wrapper .gform_fields { row-gap: var(--wp--preset--spacing--40); column-gap: var(--wp--preset--spacing--40); }
.rogiq-form .gform_wrapper .gform_footer { margin-top: var(--wp--preset--spacing--40); padding: 0; }
.rogiq-form iframe { width: 100%; border: 0; }

/* ---------- Location Map ---------- */
.rogiq-map-embed iframe { display: block; width: 100%; height: 100%; border: 0; }

/* ---------- Pagination (blog lists) ---------- */
.rogiq-pagination { margin-top: var(--wp--preset--spacing--60); gap: var(--wp--preset--spacing--20); font-size: var(--wp--preset--font-size--small); font-weight: 600; }
.rogiq-pagination .page-numbers {
	display: inline-grid;
	place-items: center;
	box-sizing: border-box;
	width: 44px;
	height: 44px;
	border: 1.5px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--round, 50%);
	color: var(--rogiq-ink);
	text-decoration: none;
}
.rogiq-pagination .page-numbers.current { border-color: var(--wp--preset--color--primary); background: var(--wp--preset--color--primary); color: var(--wp--preset--color--base); }
.rogiq-pagination a { color: var(--rogiq-ink); }
/* Hover / keyboard focus: numbers pick up the primary border + a light tint; Previous / Next turn primary and underline */
.rogiq-pagination :is(a.page-numbers, .wp-block-query-pagination-previous, .wp-block-query-pagination-next) { transition: color var(--wp--custom--transition--fast, 0.2s ease), background-color var(--wp--custom--transition--fast, 0.2s ease), border-color var(--wp--custom--transition--fast, 0.2s ease); }
.rogiq-pagination a.page-numbers:is(:hover, :focus-visible) { border-color: var(--wp--preset--color--primary); background: color-mix(in srgb, var(--wp--preset--color--primary) 10%, var(--wp--preset--color--base)); color: var(--wp--preset--color--primary); }
.rogiq-pagination :is(.wp-block-query-pagination-previous, .wp-block-query-pagination-next) { text-decoration: none; }
.rogiq-pagination :is(.wp-block-query-pagination-previous, .wp-block-query-pagination-next):is(:hover, :focus-visible) { color: var(--wp--preset--color--primary); text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Single post ---------- */
.rogiq-post-head { text-align: center; }
.rogiq-post-head .wp-block-post-title { font-size: var(--wp--preset--font-size--huge); line-height: 1.02; }
.rogiq-post-image { max-width: 64rem; margin-inline: auto !important; }
.rogiq-post-image img { border-radius: var(--wp--custom--radius--card, 22px); }
/* Article text. Size, rhythm and heading styles are tokens (prose-*); without them the old large-text look stays. */
.rogiq-prose { font-size: var(--wp--custom--prose-size, var(--wp--preset--font-size--large)); line-height: var(--wp--custom--prose-line, 1.8); }
.rogiq-prose > * + * { margin-top: var(--wp--custom--prose-gap, var(--wp--preset--spacing--40)); }
.rogiq-prose > :first-child { margin-top: 0; }
.rogiq-prose h2 { margin-top: var(--wp--custom--prose-title-top, var(--wp--preset--spacing--60)); font-size: var(--wp--custom--prose-title-size, calc(var(--wp--preset--font-size--xx-large) * 0.78)); line-height: var(--wp--custom--prose-title-line, var(--wp--custom--line-height--tight, 1.2)); }
.rogiq-prose h3 { margin-top: var(--wp--custom--prose-subhead-top, var(--wp--preset--spacing--50)); font-family: var(--wp--custom--prose-subhead-font, var(--wp--preset--font-family--heading)); font-size: var(--wp--custom--prose-subhead-size, var(--wp--preset--font-size--x-large)); font-weight: var(--wp--custom--prose-subhead-weight, 600); line-height: var(--wp--custom--prose-subhead-line, var(--wp--custom--line-height--tight, 1.2)); }
.rogiq-prose > h2 + * { margin-top: var(--wp--custom--prose-title-gap, var(--wp--custom--prose-gap, var(--wp--preset--spacing--40))); }
.rogiq-prose > h3 + * { margin-top: var(--wp--custom--prose-subhead-gap, var(--wp--custom--prose-gap, var(--wp--preset--spacing--40))); }
.rogiq-prose a { color: var(--rogiq-ink); text-decoration: underline; text-decoration-color: var(--wp--preset--color--accent); text-underline-offset: 4px; }
.rogiq-prose li + li { margin-top: var(--wp--preset--spacing--20); }
.rogiq-prose li::marker { color: var(--wp--preset--color--accent); }
.rogiq-prose .wp-block-quote {
	margin-block: var(--wp--preset--spacing--50);
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
	border-left: 3px solid var(--wp--preset--color--accent);
	border-radius: 0 var(--wp--custom--radius--sm, 12px) var(--wp--custom--radius--sm, 12px) 0;
	background: var(--rogiq-raised);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--x-large);
	line-height: 1.5;
	color: var(--rogiq-ink);
}
.rogiq-prose .wp-block-quote p { margin: 0; }

/* ---------- Team member bio ---------- */
p.rogiq-bio-role { margin-top: var(--wp--preset--spacing--20); font-size: var(--wp--preset--font-size--large); font-weight: 500; color: var(--rogiq-small); }
.rogiq-bio-body { max-width: var(--wp--custom--bio-text-width, none); margin-top: var(--wp--custom--bio-text-gap, var(--wp--preset--spacing--50)); font-size: var(--wp--custom--bio-text-size, var(--wp--preset--font-size--large)); line-height: 1.75; }
.rogiq-bio-body > * + * { margin-top: var(--wp--preset--spacing--30); }
.rogiq-bio-body h3 { margin-top: var(--wp--preset--spacing--60); font-size: var(--wp--preset--font-size--x-large); font-weight: 600; }
/* Credentials timeline: a List with the class rogiq-timeline; each item is "Label<br><strong>Detail</strong>" */
.rogiq-timeline { position: relative; margin-top: var(--wp--preset--spacing--40); padding: 0; list-style: none; font-size: var(--wp--preset--font-size--small); color: var(--rogiq-small); }
.rogiq-timeline::before { content: ''; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 1.5px; background: var(--rogiq-divider); }
.rogiq-timeline li { position: relative; padding: 0 0 var(--wp--preset--spacing--40) var(--wp--preset--spacing--50); }
.rogiq-timeline li:last-child { padding-bottom: 0; }
.rogiq-timeline li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 5px;
	box-sizing: border-box;
	width: 16px;
	height: 16px;
	border: 1.5px solid var(--wp--preset--color--accent);
	border-radius: var(--wp--custom--radius--round, 50%);
	background: var(--wp--preset--color--base-alt);
}
.rogiq-timeline strong { display: block; font-size: var(--wp--preset--font-size--medium); font-weight: 500; color: var(--rogiq-ink); }

@media (prefers-reduced-motion: reduce) {
	.rogiq-card, p.rogiq-link-arrow a::after, a.rogiq-link-arrow:not(:has(svg))::after, p.rogiq-back a::before { transition: none; }
	.rogiq-card:hover { transform: none; }
}

/* ---------- Glyphs (masks, so they take the scheme's accent color). Icons: add rogiq-i-<name> next to rogiq-icon. ---------- */
:root {
	--rogiq-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 18' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M1 9h25M18 1l8 8-8 8%22/%3E%3C/svg%3E");
	--rogiq-chevron-left: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M15 5l-7 7 7 7%22/%3E%3C/svg%3E");
	--rogiq-info: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%2210%22/%3E%3Cpath d=%22M12 11v6M12 7.5v.5%22/%3E%3C/svg%3E");
	--rogiq-mark-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M2 5.5l2.5 2.5L8.5 3%22/%3E%3C/svg%3E");
	--rogiq-mark-cross: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M2 2l6 6M8 2l-6 6%22/%3E%3C/svg%3E");
}
.rogiq-i-clock { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%229%22/%3E%3Cpath d=%22M12 7v5l3 2%22/%3E%3C/svg%3E"); }
.rogiq-i-heart { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12 21s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 11c0 5.6-7 10-7 10z%22/%3E%3C/svg%3E"); }
.rogiq-i-chat { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M4 5h16v11H9l-5 4z%22/%3E%3Cpath d=%22M8 9.5h8M8 12.5h5%22/%3E%3C/svg%3E"); }
.rogiq-i-card { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x=%223%22 y=%225%22 width=%2218%22 height=%2214%22 rx=%222%22/%3E%3Cpath d=%22M3 10h18M7 15h4%22/%3E%3C/svg%3E"); }
.rogiq-i-pulse { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M4 12h3l3-7 4 14 3-7h3%22/%3E%3C/svg%3E"); }
.rogiq-i-home { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M3 21h18M5 21V10l7-5 7 5v11%22/%3E%3Cpath d=%22M10 21v-6h4v6%22/%3E%3C/svg%3E"); }
.rogiq-i-stopwatch { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M9 3h6M12 3v4%22/%3E%3Ccircle cx=%2212%22 cy=%2214%22 r=%227%22/%3E%3Cpath d=%22M12 11v3h2.5%22/%3E%3C/svg%3E"); }
.rogiq-i-trend { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M4 18l5-6 4 3 7-9%22/%3E%3Cpath d=%22M15 6h5v5%22/%3E%3C/svg%3E"); }
.rogiq-i-plus { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12 3v18M3 12h18%22/%3E%3C/svg%3E"); }
.rogiq-i-shield-plus { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12 3l8 4v5c0 4.5-3.4 8.3-8 9-4.6-.7-8-4.5-8-9V7z%22/%3E%3Cpath d=%22M9 12h6M12 9v6%22/%3E%3C/svg%3E"); }
.rogiq-i-shield-check { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12 3l8 4v5c0 4.5-3.4 8.3-8 9-4.6-.7-8-4.5-8-9V7z%22/%3E%3Cpath d=%22M9 12l2 2 4-4%22/%3E%3C/svg%3E"); }
.rogiq-i-list { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M4 7h16M4 12h10M4 17h6%22/%3E%3C/svg%3E"); }
.rogiq-i-dollar { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M12 3v18M16.5 7.5c0-1.7-2-3-4.5-3s-4.5 1.3-4.5 3 2 2.6 4.5 3 4.5 1.4 4.5 3.3-2 3-4.5 3-4.5-1.3-4.5-3%22/%3E%3C/svg%3E"); }
.rogiq-i-video { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x=%223%22 y=%225%22 width=%2213%22 height=%2212%22 rx=%222%22/%3E%3Cpath d=%22M16 10l5-3v10l-5-3%22/%3E%3C/svg%3E"); }
.rogiq-i-pill { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x=%224%22 y=%229%22 width=%2216%22 height=%226%22 rx=%223%22/%3E%3Cpath d=%22M12 9v6%22/%3E%3C/svg%3E"); }
.rogiq-i-flask { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M9 3h6M10 3v6l-5 9a2 2 0 0 0 1.8 3h10.4a2 2 0 0 0 1.8-3l-5-9V3%22/%3E%3Cpath d=%22M7.5 15h9%22/%3E%3C/svg%3E"); }
.rogiq-i-image { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x=%223%22 y=%224%22 width=%2218%22 height=%2214%22 rx=%222%22/%3E%3Cpath d=%22M7 14l3-4 3 3 2-2 2 3%22/%3E%3C/svg%3E"); }
.rogiq-i-fax { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M7 8V3h10v5%22/%3E%3Crect x=%223%22 y=%228%22 width=%2218%22 height=%229%22 rx=%222%22/%3E%3Cpath d=%22M7 14h10v7H7z%22/%3E%3C/svg%3E"); }

/* ---------- Tints: light washes of primary for table rows and icon tiles ---------- */
:root {
	--rogiq-tint-soft: color-mix(in srgb, var(--wp--preset--color--primary) 7%, var(--wp--preset--color--base));
	--rogiq-tint: color-mix(in srgb, var(--wp--preset--color--primary) 14%, var(--wp--preset--color--base));
	--rogiq-tint-rule: color-mix(in srgb, var(--wp--preset--color--primary) 26%, var(--wp--preset--color--base));
	--rogiq-arrow-out: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E");
	--rogiq-mark-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round'%3E%3Cpath d='M5 1.5v7M1.5 5h7'/%3E%3C/svg%3E");
}

/* ---------- Page Banner: inset photo with a dark wash and a centered title ---------- */
.rogiq-banner.wp-block-cover {
	width: auto;
	max-width: var(--wp--custom--site-width, none);
	/* Edges line up with the page padding (same as the sections below); wider screens cap at the site width.
	   In a template (location, service) the banner's parent has no padding … */
	margin-inline: max(var(--wp--preset--spacing--50), (100% - var(--wp--custom--site-width, 100%)) / 2) !important;
	border-radius: 0 0 var(--wp--custom--radius--panel, 32px) var(--wp--custom--radius--panel, 32px);
	overflow: hidden;
}
/* … in page content the parent already has the root padding, so take it off (phones go edge to edge below) */
@media (min-width: 782px) {
	.has-global-padding > .rogiq-banner.wp-block-cover {
		margin-inline: max(var(--wp--preset--spacing--50) - var(--wp--style--root--padding-left, 0px), (100% - var(--wp--custom--site-width, 100%)) / 2) !important;
	}
}
@media (max-width: 781px) {
	.rogiq-banner.wp-block-cover {
		/* edge to edge whatever the parent's padding (page content or a template) */
		margin-inline: calc(50% - 50vw) !important;
		max-width: none;
		min-height: var(--wp--custom--banner-height-mobile, 325px) !important;
	}
}
.rogiq-banner :is(h1, .rogiq-banner-title) { margin: 0; color: var(--wp--preset--color--primary-contrast); }
/* One banner title size, whichever block makes it: page banners use a Heading, single service / location banners a
   Post Title (whose theme default is xx-large, which made those titles 40px instead of 60px) */
.rogiq-banner.wp-block-cover :is(h1, .rogiq-banner-title) { font-size: var(--wp--custom--banner-title-size, var(--wp--preset--font-size--huge)); line-height: var(--wp--custom--line-height--tight, 1.2); }
/* Banner label: looks like the page title, but the page's real H1 is further down (e.g. Resources / category pages) */
.rogiq-banner .rogiq-banner-title { font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--preset--font-size--huge); line-height: var(--wp--custom--line-height--tight, 1.2); }

/* ---------- Small outbound link ("Visit location ↗") ---------- */
p.rogiq-link-out a,
a.rogiq-link-out {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	font-size: var(--wp--custom--link-out-size, var(--wp--preset--font-size--small));
	font-weight: var(--wp--custom--link-out-weight, inherit);
	color: var(--wp--preset--color--accent);
	text-decoration: none;
}
p.rogiq-link-out a::after,
a.rogiq-link-out::after {
	content: '';
	width: 0.9em;
	height: 0.9em;
	background: currentColor;
	-webkit-mask: var(--rogiq-arrow-out) center / contain no-repeat;
	        mask: var(--rogiq-arrow-out) center / contain no-repeat;
}
p.rogiq-link-out a:hover,
a.rogiq-link-out:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Intro split: text beside a photo. Column shares are tokens (intro-text / intro-media); the gap takes the rest.
   Shares follow the photo, not the position, so the photo can sit on either side. ---------- */
@media (min-width: 782px) {
	.rogiq-intro-split { justify-content: space-between; }
	.rogiq-intro-split > .wp-block-column:not(:has(> figure.wp-block-image)) { flex-basis: var(--wp--custom--intro-text, 50%) !important; }
	.rogiq-intro-split > .wp-block-column:has(> figure.wp-block-image) { flex-basis: var(--wp--custom--intro-media, 50%) !important; }
}

/* ---------- Photo layout (Columns block → Photo layout panel, assets/photo-layout.js) ----------
   Two columns, one of them just a photo. Phones stack them photo first (each design sets that); "Text first" puts
   the photo after the text, "Hide photo" drops it on tablets and phones and gives the text the full width.
   body + doubled class: beats any design's own stacking rule. */
@media (max-width: 781px) {
	body .wp-block-columns.rogiq-stack-text-first > .wp-block-column:has(> figure.wp-block-image:only-child) { order: 1; }
}
@media (max-width: 1024px) {
	body .wp-block-columns.rogiq-stack-hide-photo > .wp-block-column:has(> figure.wp-block-image:only-child) { display: none; }
	body .wp-block-columns.rogiq-stack-hide-photo > .wp-block-column:not(:has(> figure.wp-block-image:only-child)) { flex-basis: 100% !important; }
}

/* ---------- Space under the page banner (token banner-gap; unset = the usual section spacing) ---------- */
.rogiq-banner + :is(.wp-block-group.alignfull, .wp-block-post-content) { margin-block-start: var(--wp--custom--banner-gap-margin, revert-layer) !important; }
.rogiq-banner + .wp-block-group.alignfull,
.rogiq-banner + .wp-block-post-content > .wp-block-group.alignfull:first-child { padding-top: var(--wp--custom--banner-gap, revert-layer) !important; }

/* ---------- CTA band: centred message + two buttons. Text width, line height and button width are tokens ---------- */
.rogiq-cta-band > h2 { max-width: var(--wp--custom--cta-text-width, var(--wp--style--global--content-size)) !important; line-height: var(--wp--custom--cta-line, inherit); }
.rogiq-cta-band .wp-block-button__link { min-width: var(--wp--custom--cta-button-width, 0); justify-content: center; }

/* ---------- Section intro: heading + short intro above a section's content (rogiq-section-intro / rogiq-section-head) ---------- */
:is(.rogiq-section-intro, .rogiq-section-head) p { max-width: var(--wp--custom--section-intro-width, none); }
/* Archive intro: the term's description (Posts > Categories) when it has one, else the fallback line after it */
.rogiq-section-intro .wp-block-term-description + .rogiq-term-fallback { display: none; }
.rogiq-section-intro .wp-block-term-description > p { margin-block: 0; }
.rogiq-section-intro .wp-block-term-description > p + p { margin-block-start: var(--wp--style--block-gap); }
:is(.rogiq-section-intro, .rogiq-section-head) + * { margin-block-start: var(--wp--custom--section-intro-gap, var(--wp--style--block-gap)) !important; }

/* ---------- Divided Columns: columns separated by vertical rules ---------- */
.rogiq-columns-divided > .rogiq-divided { margin-block-start: var(--wp--custom--divided-top, var(--wp--preset--spacing--50)); }
/* Column width / gap / max width are design tokens: with divided-column set, the row is exactly
   n columns + their gaps, centred (so 4 columns run wider than 3). Without them columns share the row. */
.rogiq-divided > .wp-block-column { padding-inline: var(--wp--custom--divided-gap, var(--wp--preset--spacing--30)); }
@media (min-width: 782px) {
	.rogiq-divided { justify-content: center; }
	.is-layout-constrained > .rogiq-divided.alignwide { max-width: var(--wp--custom--divided-max, var(--wp--style--global--wide-size)); }
	.rogiq-divided > .wp-block-column {
		box-sizing: content-box;
		flex: 0 1 var(--wp--custom--divided-column, 100%) !important;
		padding-block: var(--wp--custom--divided-gap-y, 0px);
	}
	.rogiq-divided > .wp-block-column:first-child { padding-left: 0; }
	.rogiq-divided > .wp-block-column:last-child { padding-right: 0; }
}
.rogiq-divided > .wp-block-column + .wp-block-column { border-left: 1px solid var(--rogiq-divider); }
.rogiq-divided h3 { font-size: var(--wp--preset--font-size--x-large); margin-bottom: var(--wp--preset--spacing--20); }
.rogiq-divided p { margin-block: 0 var(--wp--preset--spacing--20); }
.rogiq-divided p.rogiq-meta { font-size: var(--wp--preset--font-size--small); color: var(--rogiq-ink); }
@media (max-width: 781px) {
	.rogiq-divided > .wp-block-column + .wp-block-column { border-left: 0; border-top: 1px solid var(--rogiq-divider); padding-top: var(--wp--preset--spacing--40); }
	.rogiq-divided > .wp-block-column { padding-inline: 0; }
}
/* Tablets: four divided columns go 2 × 2 (rule between the pairs and between the rows); three stay in a row */
@media (min-width: 782px) and (max-width: 1024px) {
	.rogiq-divided:has(> .wp-block-column:nth-child(4):last-child) { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
	.rogiq-divided:has(> .wp-block-column:nth-child(4):last-child) > .wp-block-column:nth-child(odd) { border-left: 0; padding-left: 0; }
	.rogiq-divided:has(> .wp-block-column:nth-child(4):last-child) > .wp-block-column:nth-child(even) { padding-right: 0; }
	.rogiq-divided:has(> .wp-block-column:nth-child(4):last-child) > .wp-block-column:nth-child(n+3) { border-top: 1px solid var(--rogiq-divider); padding-top: var(--wp--custom--divided-gap-y, var(--wp--preset--spacing--40)); }
	.rogiq-divided:has(> .wp-block-column:nth-child(4):last-child) > .wp-block-column:nth-child(-n+2) { padding-bottom: var(--wp--custom--divided-gap-y, var(--wp--preset--spacing--40)); }
}

/* ---------- Plus list (List block style "Plus"): bold title + line per item ---------- */
ul.is-style-plus { padding: 0; list-style: none; display: grid; gap: var(--wp--preset--spacing--30); }
ul.is-style-plus li { position: relative; padding-left: 36px; }
ul.is-style-plus li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.15em;
	box-sizing: border-box;
	width: 22px;
	height: 22px;
	border: 1px solid var(--rogiq-accent);
	border-radius: var(--wp--custom--radius--sm, 12px);
	background: var(--rogiq-tint);
}
ul.is-style-plus li::after {
	content: '';
	position: absolute;
	left: 5px;
	top: calc(0.15em + 5px);
	width: 12px;
	height: 12px;
	background: var(--rogiq-accent);
	-webkit-mask: var(--rogiq-mark-plus) center / contain no-repeat;
	        mask: var(--rogiq-mark-plus) center / contain no-repeat;
}
ul.is-style-plus li strong { display: block; color: var(--rogiq-ink); }
ul.is-style-plus.rogiq-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--wp--preset--spacing--60); }
@media (max-width: 781px) { ul.is-style-plus.rogiq-cols-2 { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Comparison table (Table block style "Comparison") ---------- */
.wp-block-table.is-style-comparison { overflow-x: auto; container-type: inline-size; }
.wp-block-table.is-style-comparison table {
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--rogiq-tint-rule);
	border-radius: var(--wp--custom--radius--card, 22px);
	font-size: var(--wp--preset--font-size--small);
}
/* Rounded frame: the corner cells carry the curve (overflow: hidden on the table would stop the sticky column below) */
.wp-block-table.is-style-comparison :is(thead, tbody:first-child) tr:first-child > :first-child { border-top-left-radius: calc(var(--wp--custom--radius--card, 22px) - 1px); }
.wp-block-table.is-style-comparison :is(thead, tbody:first-child) tr:first-child > :last-child { border-top-right-radius: calc(var(--wp--custom--radius--card, 22px) - 1px); }
.wp-block-table.is-style-comparison :is(tbody, tfoot):last-child tr:last-child > :first-child { border-bottom-left-radius: calc(var(--wp--custom--radius--card, 22px) - 1px); }
.wp-block-table.is-style-comparison :is(tbody, tfoot):last-child tr:last-child > :last-child { border-bottom-right-radius: calc(var(--wp--custom--radius--card, 22px) - 1px); }
.wp-block-table.is-style-comparison :is(th, td) {
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	border: 0;
	border-right: 1px solid var(--rogiq-tint-rule);
	border-bottom: 1px solid var(--rogiq-tint-rule);
	text-align: left;
	vertical-align: top;
}
.wp-block-table.is-style-comparison :is(th, td):last-child { border-right: 0; }
.wp-block-table.is-style-comparison tbody tr:last-child td { border-bottom: 0; }
.wp-block-table.is-style-comparison thead th {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary-contrast);
	font-weight: 700;
	border-bottom: 0;
}
.wp-block-table.is-style-comparison thead { border: 0; }
/* Header dividers: a darker shade of the header colour */
.wp-block-table.is-style-comparison thead th { border-right-color: color-mix(in srgb, var(--wp--preset--color--primary) 80%, var(--wp--preset--color--contrast)); }
/* Body rows striped across every column: odd rows tinted, even rows plain */
.wp-block-table.is-style-comparison tbody td { background: var(--wp--preset--color--base); }
.wp-block-table.is-style-comparison tbody tr:nth-child(odd) td { background: var(--rogiq-tint-soft); }
/* Phones: readable columns that scroll sideways under a sticky first column (the row labels). Each column fits beside
   the labels with the next one peeking in, so it reads as swipeable. Tokens: comparison-label, comparison-col-min / -max. */
@media (max-width: 781px) {
	/* the frame sits on the scrolling box, so its rounded corners stay put while the table scrolls inside */
	.wp-block-table.is-style-comparison { border: 1px solid var(--rogiq-tint-rule); border-radius: var(--wp--custom--radius--card, 22px); }
	.wp-block-table.is-style-comparison table { width: max-content; min-width: 100%; border: 0; border-radius: 0; }
	.wp-block-table.is-style-comparison :is(th, td) { border-radius: 0 !important; }
	.wp-block-table.is-style-comparison :is(th, td) {
		box-sizing: border-box;
		width: clamp(var(--wp--custom--comparison-col-min, 11rem), calc(100cqw - var(--wp--custom--comparison-label, 7.5rem) - 2rem), var(--wp--custom--comparison-col-max, 18rem));
	}
	.wp-block-table.is-style-comparison :is(th, td):first-child {
		position: sticky;
		left: 0;
		z-index: 1;
		width: var(--wp--custom--comparison-label, 7.5rem);
		box-shadow: 6px 0 8px -6px color-mix(in srgb, var(--wp--preset--color--contrast) 35%, transparent);
	}
}

/* ---------- Photo Mosaic: gallery in masonry columns (class rogiq-mosaic) ----------
   Follows the Gallery's own settings: Columns (columns-N, 3 when unset), Aspect ratio (set on each image by core),
   Resolution, Randomize. "Crop images to fit" on (is-cropped) = core's cropped grid instead of masonry. */
.wp-block-gallery.rogiq-mosaic:not(.is-cropped) { display: block; columns: 3; column-gap: var(--wp--preset--spacing--30); }
.wp-block-gallery.rogiq-mosaic.columns-1:not(.is-cropped) { columns: 1; }
.wp-block-gallery.rogiq-mosaic.columns-2:not(.is-cropped) { columns: 2; }
.wp-block-gallery.rogiq-mosaic.columns-3:not(.is-cropped) { columns: 3; }
.wp-block-gallery.rogiq-mosaic.columns-4:not(.is-cropped) { columns: 4; }
.wp-block-gallery.rogiq-mosaic.columns-5:not(.is-cropped) { columns: 5; }
.wp-block-gallery.rogiq-mosaic.columns-6:not(.is-cropped) { columns: 6; }
.wp-block-gallery.rogiq-mosaic.columns-7:not(.is-cropped) { columns: 7; }
.wp-block-gallery.rogiq-mosaic.columns-8:not(.is-cropped) { columns: 8; }
.wp-block-gallery.rogiq-mosaic:not(.is-cropped) > .wp-block-image {
	display: block;
	width: 100% !important;
	margin: 0 0 var(--wp--preset--spacing--30) !important;
	break-inside: avoid;
}
.wp-block-gallery.rogiq-mosaic:not(.is-cropped) img { width: 100%; height: auto !important; }
.wp-block-gallery.rogiq-mosaic img { border-radius: var(--wp--custom--radius--sm, 12px); }
.wp-block-gallery.rogiq-mosaic.is-cropped { gap: var(--wp--preset--spacing--30); }
@media (max-width: 781px) { .wp-block-gallery.rogiq-mosaic:not(.is-cropped)[class*="columns-"] { columns: 2; } .wp-block-gallery.rogiq-mosaic.columns-1:not(.is-cropped) { columns: 1; } }

/* ---------- Split Hero: tinted text half beside a full-bleed photo ---------- */
.rogiq-split-hero.wp-block-columns { gap: 0; margin-block: 0; min-height: clamp(26rem, 41vw, 50rem); }
/* Padding counts inside each half, so the split stays exactly 50/50 */
.rogiq-split-hero > .wp-block-column { box-sizing: border-box; }
.rogiq-split-hero > .wp-block-column:first-child > * { max-width: 36rem; }
.rogiq-split-hero > .wp-block-column:first-child {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: var(--wp--preset--spacing--80) var(--wp--preset--spacing--70);
	background: var(--wp--preset--color--base-alt);
}
.rogiq-split-hero > .wp-block-column:last-child { position: relative; min-height: 22rem; }
.rogiq-split-hero > .wp-block-column:last-child .wp-block-image,
.rogiq-split-hero > .wp-block-column:last-child img { position: absolute; inset: 0; width: 100%; height: 100% !important; margin: 0; object-fit: cover; }
@media (max-width: 781px) { .rogiq-split-hero > .wp-block-column:first-child { padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40); } }

/* ---------- Full-width Hero: Hero Media across the page under the cover's wash, white text (rogiq-hero-full) ----------
   Same height as the split hero; text sits on the header's edge line (logo left edge). The cover's content position
   picks left (center left) or centred (center center); the overlay strength is the cover's own setting. */
.rogiq-hero-full.wp-block-cover {
	box-sizing: border-box;
	min-height: var(--wp--custom--hero-height, clamp(26rem, 41vw, 50rem));
	margin-block: 0;
	padding: var(--wp--preset--spacing--80) max(var(--wp--preset--spacing--50), (100% - var(--wp--custom--site-width, 100%)) / 2);
	color: var(--wp--custom--hero-full-text, var(--wp--preset--color--base));
}
/* In page content the hero is pulled out over the root padding, so "100%" is the padded width: add the padding back */
.has-global-padding > .rogiq-hero-full.wp-block-cover { padding-inline: max(var(--wp--preset--spacing--50), (100% - var(--wp--custom--site-width, 100%)) / 2 + var(--wp--style--root--padding-left, 0px)); }
.rogiq-hero-full .wp-block-cover__inner-container { position: static; width: 100%; max-width: none; margin: 0; color: inherit; }
.rogiq-hero-full .wp-block-cover__inner-container > :not(.rogiq-hero-media) { max-width: var(--wp--custom--hero-text-width, 36rem); }
.rogiq-hero-full :is(h1, h2, h3, p) { color: inherit; }
.rogiq-hero-full h1 { margin: 0; }
.rogiq-hero-full h1 + p { margin-top: var(--wp--custom--hero-lead-gap, var(--wp--preset--spacing--40)); }
/* Centred (content position "center center"): text and buttons in the middle */
.rogiq-hero-full:not(.has-custom-content-position) .wp-block-cover__inner-container { text-align: center; }
.rogiq-hero-full:not(.has-custom-content-position) .wp-block-cover__inner-container > :not(.rogiq-hero-media) { margin-inline: auto; }
.rogiq-hero-full:not(.has-custom-content-position) .wp-block-buttons { justify-content: center; }
/* Outline buttons turn white on the photo */
.rogiq-hero-full .wp-block-button.is-style-outline > .wp-block-button__link { border-color: currentColor; background: transparent; color: inherit; }
.rogiq-hero-full .wp-block-button.is-style-outline > .wp-block-button__link:is(:hover, :focus-visible) { border-color: var(--wp--preset--color--base); background: var(--wp--preset--color--base); color: var(--wp--preset--color--contrast); }
/* Layer order as in the page banner: media (0–1) → wash (2) → text (3) → pause button (4) */
.rogiq-hero-full > .wp-block-cover__background { z-index: 2; }
.rogiq-hero-full .wp-block-cover__inner-container > :not(.rogiq-hero-media) { position: relative; z-index: 3; }
.rogiq-hero-full .rogiq-hero-media { z-index: auto; border-radius: 0; }
.rogiq-hero-full .rogiq-hero-media > * { z-index: 0; }
.rogiq-hero-full .rogiq-hero-media .rogiq-hero-media__toggle { z-index: 4; }
/* Phones: text stays over the photo, with a minimum height */
@media (max-width: 781px) {
	.rogiq-hero-full.wp-block-cover { min-height: var(--wp--custom--hero-height-mobile, 32rem); padding-block: var(--wp--preset--spacing--70); }
}

/* ---------- Section header: heading + note on the left, button on the right ---------- */
.rogiq-section-head { align-items: flex-end; }
.rogiq-section-head h2 { margin-bottom: var(--wp--preset--spacing--20); }
/* Stacked on phones: the button follows the heading on the left instead of hugging the right edge */
@media (max-width: 781px) { .rogiq-section-head .wp-block-buttons { justify-content: flex-start !important; } }

/* ---------- Split Card: tinted card with a photo filling one side (services, locations) ---------- */
.rogiq-split-card.wp-block-columns {
	gap: 0;
	margin-block: 0;
	border-radius: var(--wp--custom--radius--card, 22px);
	background: var(--wp--preset--color--base-alt);
	overflow: hidden;
}
.rogiq-split-card > .wp-block-column { display: flex; flex-direction: column; justify-content: center; }
.rogiq-split-card { min-height: var(--wp--custom--split-card-height, clamp(16rem, 20vw, 24rem)); }
/* Text side: outer edge / photo side padding are tokens (split-card-pad-outer / -inner) */
.rogiq-split-card > .wp-block-column:not(.rogiq-split-media) { padding: var(--wp--preset--spacing--50) var(--wp--custom--split-card-pad-inner, var(--wp--preset--spacing--60)) var(--wp--preset--spacing--50) var(--wp--custom--split-card-pad-outer, var(--wp--preset--spacing--60)); }
.rogiq-split-card > .wp-block-column:not(.rogiq-split-media):last-child { padding-inline: var(--wp--custom--split-card-pad-inner, var(--wp--preset--spacing--60)) var(--wp--custom--split-card-pad-outer, var(--wp--preset--spacing--60)); }
.rogiq-split-card .rogiq-split-media { position: relative; min-height: 16rem; }
.rogiq-split-card .rogiq-split-media .wp-block-image,
.rogiq-split-card .rogiq-split-media img { position: absolute; inset: 0; width: 100%; height: 100% !important; margin: 0; object-fit: cover; border-radius: 0; }
.rogiq-split-card h3 { font-size: var(--wp--preset--font-size--x-large); }
.rogiq-split-card .wp-block-buttons { margin-top: var(--wp--custom--split-card-button-gap, var(--wp--preset--spacing--30)); }
.rogiq-split-stack { display: grid; gap: var(--wp--custom--split-card-gap, var(--wp--preset--spacing--30)); }
@media (max-width: 781px) {
	.rogiq-split-card.wp-block-columns { flex-direction: column; }
	.rogiq-split-card.wp-block-columns > .wp-block-column { flex-basis: auto !important; }
	/* Stacked: the photo keeps its shape (a fixed height squashed it on tablets) */
	.rogiq-split-card.wp-block-columns > .rogiq-split-media { order: -1; flex: 0 0 auto !important; width: 100%; height: auto; min-height: 0; aspect-ratio: var(--wp--custom--split-media-ratio, 3 / 2); }
	/* Stacked: even padding round the text */
	.rogiq-split-card.wp-block-columns > .wp-block-column:not(.rogiq-split-media):is(:first-child, :last-child) { padding: var(--wp--preset--spacing--40); }
}
.rogiq-split-card .rogiq-contact-item { --rogiq-tile: 32px; --rogiq-glyph: 16px; --rogiq-inset: 0px; --rogiq-inset-y: 0px; margin-top: var(--wp--preset--spacing--20); padding-top: 0; border-top: 0; }
.rogiq-split-card .rogiq-contact-item p { font-size: var(--wp--preset--font-size--small); }
.rogiq-split-card .rogiq-contact-item p.rogiq-contact-label { font-size: var(--wp--preset--font-size--x-small); color: var(--rogiq-small); }

/* ---------- Steps Band: faded tinted band, intro left, icon steps across ---------- */
/* Fades from the page background on the left to base-alt on the right */
.rogiq-steps-band {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: var(--wp--custom--steps-band-height, auto);
	box-sizing: border-box;
	background: linear-gradient(90deg, var(--wp--preset--color--base), var(--wp--preset--color--base-alt));
}
.rogiq-steps-row { text-align: center; }
.rogiq-steps-row .wp-block-image { margin: 0 auto var(--wp--preset--spacing--20); width: 5.5rem; }
.rogiq-steps-row .wp-block-image img {
	box-sizing: border-box;
	width: 5.5rem;
	height: 5.5rem;
	padding: 4px;
	border: 1px solid var(--rogiq-ink);
	border-radius: var(--wp--custom--radius--sm, 12px);
	background: var(--rogiq-tint);
}
.rogiq-steps-row h3 { margin: 0 0 4px; font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--preset--font-size--large); }
.rogiq-steps-row p { margin: 0; font-size: var(--wp--preset--font-size--small); }
.rogiq-steps-row p strong { display: block; font-weight: inherit; color: var(--rogiq-ink); }

/* ---------- Quote Card: one testimonial in a tinted rounded card ---------- */
.rogiq-quote-card {
	border-radius: var(--wp--custom--radius--card, 22px);
	background: var(--wp--preset--color--base-alt);
	text-align: center;
}
.rogiq-quote-card .rogiq-testimonials { --rogiq-raised: transparent; }

/* ---------- Team Strip: heading and button beside a row of team cards ---------- */
.rogiq-team-strip .rogiq-team__excerpt { display: none; }

/* ---------- Media column images (intro and feature sections) ---------- */
.rogiq-media-col .wp-block-image img { border-radius: var(--wp--custom--radius--card, 22px); }

/* ---------- Logo Row: partner logos spread across the wide width ---------- */
.rogiq-logo-row { row-gap: var(--wp--preset--spacing--40); }
.rogiq-logo-row .wp-block-image { margin: 0; }
/* Site width: a full-width row capped at the design's site width (header/banner width), e.g. band content and logo rows */
:is(.rogiq-logo-row, .rogiq-site-wide).alignfull { max-width: var(--wp--custom--site-width, none); margin-inline: auto !important; padding-inline: var(--wp--preset--spacing--40); box-sizing: border-box; }
.rogiq-logo-row img { height: 2.75rem; width: auto; object-fit: contain; }

/* ---------- Plain variants (opt in with a class on the wrapping section) ---------- */
/* Stats: big centered numbers with a label, no cards or bars */
.rogiq-stats-plain .rogiq-stat { padding: 0; border: 0; background: none; align-items: center; text-align: center; gap: var(--wp--preset--spacing--20); }
.rogiq-stats-plain .rogiq-stat__bar { display: none; }
.rogiq-stats-plain .rogiq-stat__label { font-size: var(--wp--preset--font-size--small); }
/* Testimonial inside a Quote Card: the card is the frame, so the slide itself is flat */
.rogiq-quote-card .rogiq-testimonials__head { justify-content: center; text-align: center; }
.rogiq-quote-card .rogiq-testimonials__title { margin-inline: auto; font-size: var(--wp--preset--font-size--x-large); }
.rogiq-quote-card .rogiq-testimonial { padding: 0; background: none; box-shadow: none; align-items: center; text-align: center; }
.rogiq-quote-card .rogiq-testimonial:hover { box-shadow: none; transform: none; }
.rogiq-quote-card .rogiq-testimonial__mark { display: none; }
.rogiq-quote-card .rogiq-testimonial__quote { max-width: 46rem; margin-inline: auto; font-family: var(--wp--preset--font-family--body); font-size: var(--wp--preset--font-size--small); }
.rogiq-quote-card .rogiq-testimonial__person { border: 0; padding-top: 0; }
/* Team: photo, name and role with no card. Sizes come from optional design tokens (custom.team-*). */
.rogiq-team-plain .rogiq-team__card,
.rogiq-team-strip .rogiq-team__card { padding: 0; background: none; box-shadow: none; gap: 0; }
:is(.rogiq-team-plain, .rogiq-team-strip) .rogiq-team__card:hover { box-shadow: none; transform: none; }
:is(.rogiq-team-plain, .rogiq-team-strip) .rogiq-team__photo { aspect-ratio: 1; margin-bottom: var(--wp--custom--team-name-gap, var(--wp--preset--spacing--20)); border-radius: var(--wp--custom--team-photo-radius, var(--wp--custom--radius--card, 22px)); }
:is(.rogiq-team-plain, .rogiq-team-strip) :is(.rogiq-team__name, .rogiq-team__role) { padding-inline: 0; }
:is(.rogiq-team-plain, .rogiq-team-strip) .rogiq-team__name { font-family: var(--wp--preset--font-family--body); font-size: var(--wp--custom--team-name-size, var(--wp--preset--font-size--medium)); line-height: var(--wp--custom--team-name-line, 1.4); }
:is(.rogiq-team-plain, .rogiq-team-strip) .rogiq-team__role { font-size: var(--wp--custom--team-role-size, var(--wp--preset--font-size--small)); line-height: 1.5; }
/* Fixed card width (custom.team-card-width): columns stop growing and the grid centres */
.rogiq-team-plain .rogiq-team { column-gap: var(--wp--custom--team-gap, var(--wp--preset--spacing--40)); row-gap: var(--wp--custom--team-row-gap, var(--wp--preset--spacing--50)); grid-template-columns: repeat(var(--rogiq-team-cols), minmax(0, var(--wp--custom--team-card-width, 1fr))); justify-content: center; }

/* Rounded media images fill their column even when the upload is smaller than the column */
.wp-block-image.rogiq-media img { width: 100%; }
/* Card surface: a design can set custom.color.surface (e.g. a tinted card on a white page) */
.rogiq-card:not(.is-style-feature) { background-color: var(--wp--custom--color--surface, var(--wp--preset--color--base)); }

/* ---------- Plain post cards and blog sidebar ----------
   Blog index + single post. Card spacing, photo shape, sidebar and newsletter sizes are tokens (post-*, blog-*,
   sidebar-*, newsletter-*); fallbacks keep the original look. */
.rogiq-post-query .wp-block-post-template { gap: var(--wp--custom--post-gap-y, var(--wp--preset--spacing--50)) var(--wp--custom--post-gap-x, var(--wp--preset--spacing--40)); }
.rogiq-post-plain .wp-block-post-featured-image { margin: 0 0 var(--wp--custom--post-image-gap, var(--wp--preset--spacing--20)); }
/* Photo shape: the block's own aspect ratio (set in the editor) wins over the token */
.rogiq-post-plain .wp-block-post-featured-image img { width: 100%; aspect-ratio: var(--wp--custom--post-ratio, 3 / 2); object-fit: cover; border-radius: var(--wp--custom--post-radius, var(--wp--custom--radius--card, 22px)); }
.rogiq-post-plain .wp-block-post-terms { margin: 0; font-size: var(--wp--custom--post-meta-size, var(--wp--preset--font-size--x-small)); line-height: var(--wp--custom--post-meta-line, inherit); }
.rogiq-post-plain .wp-block-post-terms a,
.rogiq-post-main > .wp-block-post-terms a { color: inherit; text-decoration: none; }
.rogiq-post-plain .wp-block-post-title { margin: var(--wp--custom--post-title-gap, 4px) 0 0; line-height: var(--wp--custom--post-title-line, var(--wp--custom--line-height--tight, 1.2)); }
.rogiq-post-plain .wp-block-post-title a { color: var(--rogiq-ink); text-decoration: none; }
.rogiq-post-plain > .wp-block-read-more { margin-top: var(--wp--custom--post-link-gap, var(--wp--style--block-gap)); line-height: var(--wp--custom--post-link-line, inherit); }
/* Index / single layout: main column fills, sidebar has a fixed width (blog-sidebar), gap blog-gap */
@media (min-width: 782px) {
	.rogiq-blog-cols.wp-block-columns { column-gap: var(--wp--custom--blog-gap, var(--wp--preset--spacing--60)); }
	.rogiq-blog-cols.rogiq-blog-cols > .rogiq-sidebar { flex: 0 0 min(var(--wp--custom--blog-sidebar, 32%), 32%); }
	.rogiq-blog-cols.rogiq-blog-cols > .wp-block-column:not(.rogiq-sidebar) { flex: 1 1 0; min-width: 0; }
	/* No sidebar (Site Info → Blog switched everything in it off): an article keeps its reading width, centred */
	.rogiq-blog-cols.rogiq-blog-cols--solo > .wp-block-column.rogiq-post-main { flex: 0 1 var(--wp--style--global--content-size, 46rem); margin-inline: auto; }
}
/* Single post: header stack (category, title, lede, photo, text) */
.rogiq-post-main > * { max-width: var(--wp--custom--post-width, none); }
.rogiq-post-main > * + * { margin-top: var(--wp--custom--post-stack-gap, var(--wp--style--block-gap)); }
.rogiq-post-main > .wp-block-post-terms { font-size: var(--wp--custom--post-meta-size, var(--wp--preset--font-size--small)); line-height: var(--wp--custom--post-meta-line, inherit); }
.rogiq-post-main > .wp-block-post-terms + .wp-block-post-title { margin-top: var(--wp--custom--post-meta-gap, var(--wp--custom--post-stack-gap, var(--wp--style--block-gap))); }
.rogiq-post-main > .wp-block-post-featured-image img { width: 100%; aspect-ratio: var(--wp--custom--post-hero-ratio, 16 / 9); object-fit: cover; border-radius: var(--wp--custom--post-radius, var(--wp--custom--radius--card, 22px)); }
.rogiq-post-lede { font-style: italic; font-size: var(--wp--custom--post-lede-size, var(--wp--preset--font-size--small)); }
.rogiq-post-lede p { margin: 0; }
/* Sidebar */
.rogiq-sidebar > * + * { margin-top: var(--wp--custom--sidebar-gap, var(--wp--preset--spacing--50)); }
.rogiq-sidebar-box > h3 { line-height: var(--wp--custom--sidebar-title-line, var(--wp--custom--line-height--tight, 1.2)); }
.rogiq-sidebar-box > * + * { margin-top: var(--wp--custom--sidebar-item-gap, var(--wp--style--block-gap)); }
.rogiq-sidebar-box > h3 + * { margin-top: var(--wp--custom--sidebar-title-gap, var(--wp--custom--sidebar-item-gap, var(--wp--style--block-gap))); }
.rogiq-cat-list { padding: 0; list-style: none; font-size: var(--wp--custom--sidebar-list-size, var(--wp--preset--font-size--small)); line-height: var(--wp--custom--sidebar-list-line, inherit); }
.rogiq-cat-list li + li { margin-top: var(--wp--custom--sidebar-list-gap, 0.5em); }
.rogiq-cat-list a { color: var(--wp--preset--color--contrast); text-decoration: none; }
.rogiq-cat-list a:hover { color: var(--wp--preset--color--accent); }
/* "All" (added by the plugin, links to the posts page) and the category being viewed are underlined */
.rogiq-cat-list :is(.current-cat, .rogiq-cat-all.is-current) > a { text-decoration: underline; text-underline-offset: 3px; font-weight: var(--wp--custom--sidebar-current-weight, inherit); color: var(--wp--custom--sidebar-current-color, var(--wp--preset--color--contrast)); }
/* ---------- Post Author block: byline + author card (rogiq/post-author) ----------
   Colours, sizes and spacing are tokens (byline-*, author-*); fallbacks shown. */
.rogiq-byline { margin: 0; font-size: var(--wp--custom--byline-size, var(--wp--preset--font-size--small)); line-height: 1.5; color: var(--rogiq-small, var(--wp--preset--color--contrast-alt)); }
.rogiq-byline > span { white-space: nowrap; }
.rogiq-byline a { color: var(--wp--preset--color--contrast); font-weight: var(--wp--custom--byline-name-weight, 700); text-decoration: none; }
.rogiq-byline a:is(:hover, :focus-visible) { color: var(--wp--preset--color--primary); text-decoration: underline; text-underline-offset: 3px; }
.rogiq-byline__sep::before { content: var(--wp--custom--byline-sep, '·'); margin-inline: 0.5em; }
@media (max-width: 781px) { .rogiq-byline > span { white-space: normal; } }

.rogiq-author-card {
	box-sizing: border-box;
	display: flex;
	gap: var(--wp--custom--author-card-gap, var(--wp--preset--spacing--40));
	align-items: flex-start;
	padding: var(--wp--custom--author-card-pad, var(--wp--preset--spacing--50));
	border-radius: var(--wp--custom--author-card-radius, var(--wp--custom--radius--card, 22px));
	background: var(--wp--custom--author-card-bg, var(--wp--preset--color--base-alt));
}
.rogiq-post-main > .rogiq-author-card { margin-top: var(--wp--custom--author-card-top, var(--wp--preset--spacing--60)); }
.rogiq-author-card__media { flex: 0 0 auto; display: block; }
.rogiq-author-card__photo { display: block; width: var(--wp--custom--author-photo-size, 6rem); height: var(--wp--custom--author-photo-size, 6rem); object-fit: cover; border-radius: var(--wp--custom--author-photo-radius, var(--wp--custom--radius--round, 50%)); }
.rogiq-author-card__media.is-logo .rogiq-author-card__photo { object-fit: contain; border-radius: 0; }
.rogiq-author-card__body { flex: 1 1 auto; min-width: 0; }
.rogiq-author-card__body > * { margin: 0; }
.rogiq-author-card__label,
.rogiq-author-card__role,
.rogiq-author-card__reviewer { font-size: var(--wp--preset--font-size--small); color: var(--rogiq-small, var(--wp--preset--color--contrast-alt)); }
.rogiq-author-card__name { margin-top: 0.125rem !important; font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--custom--author-name-size, var(--wp--preset--font-size--x-large)); line-height: var(--wp--custom--line-height--tight, 1.2); }
.rogiq-author-card__name a { color: var(--rogiq-ink, var(--wp--preset--color--contrast)); text-decoration: none; }
.rogiq-author-card__name a:is(:hover, :focus-visible) { text-decoration: underline; text-underline-offset: 4px; }
.rogiq-author-card__role { margin-top: 0.25rem !important; }
.rogiq-author-card__bio { margin-top: var(--wp--custom--author-card-text-gap, var(--wp--preset--spacing--20)) !important; }
.rogiq-author-card__more { display: flex; flex-wrap: wrap; column-gap: var(--wp--custom--author-card-link-gap, var(--wp--preset--spacing--40)); row-gap: 0.25rem; margin-top: var(--wp--custom--author-card-text-gap, var(--wp--preset--spacing--20)) !important; }
.rogiq-author-card__reviewer { margin-top: var(--wp--custom--author-card-text-gap, var(--wp--preset--spacing--20)) !important; padding-top: var(--wp--custom--author-card-text-gap, var(--wp--preset--spacing--20)); border-top: 1px solid var(--wp--preset--color--border); }
.rogiq-author-card__reviewer a { color: var(--wp--preset--color--contrast); font-weight: 700; text-decoration: none; }
.rogiq-author-card__reviewer a:is(:hover, :focus-visible) { color: var(--wp--preset--color--primary); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 480px) { .rogiq-author-card { flex-direction: column; } }
/* Bio page articles: phones (grid stacked, ≤600px) show the newest few (filter rogiq_blocks_author_articles_phone, default 3);
   when that hides some, "See all" shows on phones even if every article fits on desktop */
@media (min-width: 601px) { .rogiq-author-articles .rogiq-phone-only { display: none; } }
@media (max-width: 600px) { .rogiq-author-articles .rogiq-phone-hide { display: none; } }
/* Bio page "See all N articles by …" under the articles grid */
.rogiq-author-articles .rogiq-author-all { margin-top: var(--wp--custom--author-all-gap, var(--wp--preset--spacing--50)); text-align: var(--wp--custom--author-all-align, center); }

/* ---------- Blog search (core Search with rogiq-blog-search): field + button on one row, like the sidebar newsletter ---------- */
.rogiq-blog-search .wp-block-search__inside-wrapper { gap: calc(var(--wp--preset--spacing--20) * (1 - var(--wp--custom--newsletter-joined, 0))); padding: 0; border: 0; }
.rogiq-blog-search .wp-block-search__input {
	box-sizing: border-box;
	height: var(--wp--custom--newsletter-height, 2.75rem);
	min-width: 0;
	padding: 0 0.875rem;
	border: 1px solid var(--rogiq-input-border, var(--wp--preset--color--border));
	border-radius: var(--wp--custom--radius--sm, 12px);
	border-start-end-radius: calc(var(--wp--custom--radius--sm, 12px) * (1 - var(--wp--custom--newsletter-joined, 0)));
	border-end-end-radius: calc(var(--wp--custom--radius--sm, 12px) * (1 - var(--wp--custom--newsletter-joined, 0)));
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
}
.rogiq-blog-search .wp-block-search__input::placeholder { color: color-mix(in srgb, var(--wp--preset--color--contrast) 45%, transparent); opacity: 1; }
.rogiq-blog-search .wp-block-search__button { flex: 0 0 auto; height: var(--wp--custom--newsletter-height, 2.75rem); margin: 0; padding-block: 0; white-space: nowrap; }
.rogiq-blog-search { --rogiq-input-border: color-mix(in srgb, var(--wp--preset--color--contrast) 40%, transparent); }

/* Eyebrow: short label above a heading (e.g. "404 error") */
p.rogiq-eyebrow { margin: 0; font-size: var(--wp--custom--eyebrow-size, var(--wp--preset--font-size--small)); font-weight: 700; letter-spacing: var(--wp--custom--eyebrow-tracking, 0.08em); text-transform: uppercase; color: var(--wp--custom--eyebrow-color, var(--wp--preset--color--primary)); }
p.rogiq-eyebrow + :is(h1, h2) { margin-top: var(--wp--custom--heading-gap, var(--wp--preset--spacing--20)); }

/* ---------- Site search results (search template): count, search box, list of results with a type label ----------
   List width / photo size are tokens (search-width, result-media). */
.rogiq-search-intro .rogiq-search-count { color: var(--rogiq-small, var(--wp--preset--color--contrast-alt)); }
.rogiq-search-intro .rogiq-site-search { max-width: var(--wp--custom--search-width, 50rem); margin-top: var(--wp--preset--spacing--40); }
.rogiq-search-body .rogiq-search-results { max-width: var(--wp--custom--search-width, 50rem); }
.rogiq-search-results .wp-block-post-template { margin: 0; padding: 0; list-style: none; }
.rogiq-search-results .wp-block-post-template > li { margin: 0; padding-block: var(--wp--custom--result-gap, var(--wp--preset--spacing--40)); border-top: 1px solid var(--wp--preset--color--border); }
.rogiq-search-results .wp-block-post-template > li:last-child { border-bottom: 1px solid var(--wp--preset--color--border); }
.rogiq-result { display: flex; gap: var(--wp--preset--spacing--40); align-items: flex-start; }
.rogiq-result__media { flex: 0 0 var(--wp--custom--result-media, 10rem); margin: 0 !important; }
.rogiq-result__media img { width: 100%; object-fit: cover; border-radius: var(--wp--custom--post-radius, var(--wp--custom--radius--card, 22px)); }
.rogiq-result__body { flex: 1 1 auto; min-width: 0; }
.rogiq-result__body > * { margin: 0; }
.rogiq-result__body .wp-block-post-title { margin-top: 0.25rem; line-height: var(--wp--custom--post-title-line, var(--wp--custom--line-height--tight, 1.2)); }
.rogiq-result__body .wp-block-post-title a { color: var(--rogiq-ink, var(--wp--preset--color--contrast)); text-decoration: none; }
.rogiq-result__body .wp-block-post-title a:is(:hover, :focus-visible) { color: var(--wp--preset--color--primary); text-decoration: underline; text-underline-offset: 4px; }
.rogiq-result__body .wp-block-post-excerpt { margin-top: var(--wp--preset--spacing--20); }
.rogiq-result__body .wp-block-post-excerpt__excerpt { margin: 0; }
.rogiq-search-results .rogiq-no-results + * { margin-top: var(--wp--preset--spacing--40); }
@media (max-width: 600px) { .rogiq-result__media { flex-basis: 6rem; } }

/* 404 page: the split hero's text column carries the search box */
.rogiq-404-hero .rogiq-blog-search { margin-top: var(--wp--preset--spacing--40); }

/* Query "nothing found" line (search, empty category) */
.rogiq-no-results { box-sizing: border-box; margin: 0; padding: var(--wp--preset--spacing--50); border-radius: var(--wp--custom--radius--card, 22px); background: var(--wp--preset--color--base-alt); }

/* ---------- On This Page (rogiq/post-toc): jump links to the article's headings ---------- */
.rogiq-toc { box-sizing: border-box; padding: var(--wp--custom--toc-pad, var(--wp--preset--spacing--40)); border-radius: var(--wp--custom--toc-radius, var(--wp--custom--radius--card, 22px)); background: var(--wp--custom--toc-bg, var(--wp--preset--color--base-alt)); font-size: var(--wp--custom--toc-size, var(--wp--preset--font-size--small)); }
.rogiq-toc__title { margin: 0 0 var(--wp--preset--spacing--20); font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--custom--toc-title-size, var(--wp--preset--font-size--large)); line-height: var(--wp--custom--line-height--tight, 1.2); }
.rogiq-toc ol { margin: 0; padding-left: 1.25em; }
.rogiq-toc li + li, .rogiq-toc ol ol { margin-top: 0.375em; }
.rogiq-toc ol ol { list-style: lower-alpha; }
.rogiq-toc a { color: var(--wp--preset--color--contrast); text-decoration: underline; text-decoration-color: color-mix(in srgb, currentColor 30%, transparent); text-underline-offset: 3px; }
.rogiq-toc a:is(:hover, :focus-visible) { color: var(--wp--preset--color--primary); text-decoration-color: currentColor; }
.rogiq-prose :is(h2, h3, h4)[id] { scroll-margin-top: var(--wp--preset--spacing--50); }
@media (prefers-reduced-motion: no-preference) { html:has(.rogiq-toc) { scroll-behavior: smooth; } }

/* ---------- Share Links (rogiq/post-share) ---------- */
.rogiq-share { display: flex; flex-wrap: wrap; align-items: center; gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30); }
.rogiq-share__label { margin: 0; font-size: var(--wp--preset--font-size--small); font-weight: 700; }
.rogiq-share__list { display: flex; gap: var(--wp--custom--share-gap, 0.5rem); margin: 0; padding: 0; list-style: none; }
.rogiq-share__link {
	display: inline-grid;
	place-items: center;
	box-sizing: border-box;
	width: var(--wp--custom--share-size, 2.5rem);
	height: var(--wp--custom--share-size, 2.5rem);
	padding: 0;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--share-radius, var(--wp--custom--radius--round, 50%));
	background: transparent;
	color: var(--wp--preset--color--contrast);
	cursor: pointer;
	transition: color var(--wp--custom--transition--fast, 0.2s ease), border-color var(--wp--custom--transition--fast, 0.2s ease), background-color var(--wp--custom--transition--fast, 0.2s ease);
}
.rogiq-share__link svg { width: 1.125rem; height: 1.125rem; fill: currentColor; }
.rogiq-share__link:is(:hover, :focus-visible), .rogiq-share__copy.is-copied { border-color: var(--wp--preset--color--primary); background: color-mix(in srgb, var(--wp--preset--color--primary) 10%, var(--wp--preset--color--base)); color: var(--wp--preset--color--primary); }
.rogiq-share__status { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--primary); }
.rogiq-share__status:empty { display: none; }
.rogiq-post-main > .rogiq-share { margin-top: var(--wp--custom--share-top, var(--wp--preset--spacing--50)); }

/* ---------- Gravity Forms extras: compact required marker, one-line newsletter ---------- */
.rogiq-form .gform_required_legend { display: none; }
.rogiq-form .gfield_required_text { font-size: 0; }
.rogiq-form .gfield_required_text::after { content: '*'; font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--contrast-alt); }
/* Newsletter: email and button on one line, same height (newsletter-height); label kept for screen readers only.
   newsletter-joined: 1 = button joined onto the end of the field (no gap, inner corners square). */
.rogiq-sidebar-box .rogiq-form .gform_wrapper form { display: flex; gap: calc(var(--wp--preset--spacing--20) * (1 - var(--wp--custom--newsletter-joined, 0))); align-items: flex-end; }
.rogiq-sidebar-box .rogiq-form .gform_body { flex: 1 1 auto; min-width: 0; }
.rogiq-sidebar-box .rogiq-form .gform_footer { flex: 0 0 auto; margin: 0 !important; padding: 0 !important; }
.rogiq-sidebar-box .rogiq-form .gform_button { white-space: nowrap; }
.rogiq-sidebar-box .rogiq-form .gfield--type-email .gfield_label { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.rogiq-sidebar-box .rogiq-form .gform-theme--framework input[type="email"] { height: var(--wp--custom--newsletter-height, 2.75rem); }
.rogiq-sidebar-box .rogiq-form .gform_wrapper :is(button, input).gform_button { height: var(--wp--custom--newsletter-height, 2.75rem) !important; min-height: 0 !important; padding-block: 0 !important; }
.rogiq-sidebar-box > .rogiq-form { margin-top: var(--wp--custom--newsletter-gap, var(--wp--custom--sidebar-item-gap, var(--wp--style--block-gap))); }
.rogiq-sidebar-box .rogiq-form .gform-theme--framework input[type="email"] { border-start-end-radius: calc(var(--wp--custom--radius--sm, 12px) * (1 - var(--wp--custom--newsletter-joined, 0))); border-end-end-radius: calc(var(--wp--custom--radius--sm, 12px) * (1 - var(--wp--custom--newsletter-joined, 0))); }
/* Gravity Forms Orbital theme: point its variables at the design tokens */
.rogiq-form .gform-theme--framework {
	--gf-color-primary: var(--wp--preset--color--primary);
	--gf-color-primary-contrast: var(--wp--preset--color--primary-contrast);
	--gf-color-primary-darker: var(--wp--preset--color--secondary);
	--gf-ctrl-border-color: var(--rogiq-input-border);
	--gf-ctrl-label-color-primary: var(--wp--preset--color--contrast);
	--gf-ctrl-label-color-secondary: var(--wp--preset--color--contrast-alt);
	--gf-radius: var(--wp--custom--radius--sm, 12px);
	--gf-ctrl-btn-radius: var(--wp--custom--radius--button, var(--wp--custom--radius--pill, 999px));
	--gf-font-family-base: var(--wp--preset--font-family--body);
	--gf-ctrl-font-family: var(--wp--preset--font-family--body);
	--gf-ctrl-btn-font-family: var(--wp--preset--font-family--body);
	--gf-ctrl-label-font-family-primary: var(--wp--preset--font-family--body);
}
.rogiq-form .gform-theme--framework :is(input:not([type="checkbox"], [type="radio"], [type="submit"]), select) { min-height: 0; padding-block: 0; }
.rogiq-form .gform-theme--framework .gform_button { border-radius: var(--wp--custom--radius--button, var(--wp--custom--radius--pill, 999px)); }
/* Gravity Forms prints its own color variables inline on each form, so set the button and focus colors directly */
.rogiq-form .gform-theme--framework .gform_button,
.rogiq-form .gform-theme--framework .gform_button:hover {
	border-color: var(--wp--preset--color--primary);
	background-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary-contrast);
}
.rogiq-form .gform-theme--framework :is(input, select, textarea):focus { border-color: var(--wp--preset--color--accent); outline-color: var(--wp--preset--color--accent); }
.rogiq-form .gform-theme--framework .gfield_required { color: var(--wp--preset--color--contrast-alt); }
.rogiq-form .gform_button {
	--gf-ctrl-btn-bg-color-primary: var(--wp--preset--color--primary);
	--gf-ctrl-btn-bg-color-hover-primary: var(--wp--preset--color--secondary);
	--gf-ctrl-btn-bg-color-focus-primary: var(--wp--preset--color--secondary);
	--gf-ctrl-btn-border-color-primary: var(--wp--preset--color--primary);
	--gf-ctrl-btn-color-primary: var(--wp--preset--color--primary-contrast);
	--gf-ctrl-btn-radius: var(--wp--custom--radius--button, var(--wp--custom--radius--pill, 999px));
}

/* ---------- Dynamic Split Cards and Location Columns (rendered without core Columns CSS) ---------- */
.rogiq-split-card { display: flex; }
.rogiq-split-card > .wp-block-column { box-sizing: border-box; flex: 1 1 50%; min-width: 0; }
/* Photo half is slightly narrower than the text half (48 / 52, as in the designs) */
/* (doubled class beats core's .wp-block-columns:not(…) > .wp-block-column { flex-basis: 0 }) */
@media (min-width: 782px) {
	.rogiq-split-card.rogiq-split-card > .wp-block-column { flex: 1 1 0; }
	.rogiq-split-card.rogiq-split-card > .wp-block-column.rogiq-split-media { flex: 0 0 var(--wp--custom--split-media, 48%); }
}
.rogiq-split-text > * { margin-block: 0; }
.rogiq-split-text > * + * { margin-top: var(--wp--preset--spacing--20); }
.rogiq-split-text .wp-block-buttons { display: flex; margin-top: var(--wp--custom--split-card-button-gap, var(--wp--preset--spacing--30)); }
.rogiq-location-columns { display: flex; }
.rogiq-location-columns > .wp-block-column { flex: 1 1 0; min-width: 0; }
.rogiq-location-columns p { margin-block: 0 var(--wp--preset--spacing--20); }
.rogiq-location-columns .rogiq-meta a { color: inherit; text-decoration: none; }
.rogiq-location-info .rogiq-contact-item + .rogiq-contact-item { margin-top: var(--wp--preset--spacing--30); }
@media (max-width: 781px) { .rogiq-location-columns { flex-direction: column; } }

/* ---------- Sitemap section: drive the RogIQ Integration [custom_sitemap] accordion from design tokens ---------- */
.rogiq-sitemap {
	--acc-header-bg: var(--wp--preset--color--base-alt);
	--acc-header-text: var(--rogiq-ink);
	--acc-header-bg-active: var(--wp--preset--color--primary);
	--acc-header-text-active: var(--wp--preset--color--primary-contrast);
	--acc-content-bg: var(--wp--preset--color--base);
	--acc-content-text: var(--wp--preset--color--contrast);
}

/* Quote Card: centered title, slide, then the arrows underneath */
.rogiq-quote-card .rogiq-testimonials { display: flex; flex-direction: column; }
.rogiq-quote-card .rogiq-testimonials__head { display: contents; }
.rogiq-quote-card .rogiq-testimonials__title { order: 0; text-align: center; }
.rogiq-quote-card .rogiq-testimonials__track { order: 1; }
.rogiq-quote-card .rogiq-testimonials__arrows { order: 2; margin: var(--wp--preset--spacing--30) auto 0; }
.rogiq-quote-card .rogiq-testimonials { gap: var(--wp--preset--spacing--30); }

/* Centered section headings may run the wide width instead of wrapping at the text width */
.wp-block-group.alignfull.is-layout-constrained:not(.rogiq-cta-band) > h2.has-text-align-center { max-width: var(--wp--style--global--wide-size); }

/* ---------- Carousels: steps rows with 4+ steps and every team strip scroll sideways (arrows hide when all fit) ----------
   The row runs to the right edge of the screen so the next item peeks in. assets/sections.js adds the arrows. */
.rogiq-steps-band { overflow-x: clip; }
.rogiq-carousel-nav { display: flex; gap: var(--wp--preset--spacing--20); margin-top: var(--wp--preset--spacing--30); }
.rogiq-carousel-nav[hidden] { display: none; }
.rogiq-carousel-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	padding: 0;
	border: 1px solid var(--rogiq-ink);
	border-radius: var(--wp--custom--radius--round, 50%);
	background: var(--rogiq-tint);
	color: var(--rogiq-ink);
	cursor: pointer;
	transition: background-color var(--wp--custom--transition--fast, 0.2s ease), color var(--wp--custom--transition--fast, 0.2s ease);
}
.rogiq-carousel-btn.is-prev svg { transform: rotate(180deg); }
.rogiq-carousel-btn:not([disabled]):hover { background: var(--wp--preset--color--primary); border-color: var(--wp--preset--color--primary); color: var(--wp--preset--color--primary-contrast); }
.rogiq-carousel-btn[disabled] { opacity: 0.35; cursor: default; }
.rogiq-carousel-btn:focus-visible { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 2px; }

@media (min-width: 782px) {
	.rogiq-steps-row:has(> .wp-block-column:nth-child(4)),
	.rogiq-team-strip .rogiq-team {
		display: flex !important;
		flex-wrap: nowrap !important;
		gap: var(--wp--preset--spacing--40);
		margin-inline-end: calc(-1 * (max(0px, (100vw - var(--wp--custom--site-width, 100vw)) / 2) + var(--wp--preset--spacing--40)));
		padding-inline-end: var(--wp--preset--spacing--40);
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-padding-inline-start: 0;
		scrollbar-width: none;
	}
	.rogiq-steps-row:has(> .wp-block-column:nth-child(4))::-webkit-scrollbar,
	.rogiq-team-strip .rogiq-team::-webkit-scrollbar { display: none; }
	.rogiq-steps-row:has(> .wp-block-column:nth-child(4)) > .wp-block-column { flex: 0 0 clamp(14rem, 17vw, 19rem) !important; scroll-snap-align: start; }
	.rogiq-team-strip .rogiq-team { gap: var(--wp--custom--team-gap, var(--wp--preset--spacing--40)); }
	.rogiq-team-strip .rogiq-team > * { flex: 0 0 var(--wp--custom--team-card-width, clamp(10rem, 11vw, 12.5rem)); scroll-snap-align: start; }
}
/* Sections fed by a dynamic block hide themselves on the site when it has nothing to show (no providers or services at
   this location yet). Team strips always do; add rogiq-hide-empty to any other section around Split Cards / Team Grid / Location Columns. */
body:not(.editor-styles-wrapper) .rogiq-team-strip:not(:has(.rogiq-team__card)),
body:not(.editor-styles-wrapper) .rogiq-hide-empty:not(:has(.rogiq-team__card, .rogiq-split-card, .rogiq-location-columns, .rogiq-location-columns-empty)) { display: none; }
/* Band columns take the band's full width (capped by site-width). The band is a flex column and its auto side
   margins would otherwise size the row to its content, so a long slider widened the page. Columns never grow
   to fit the slider's cards either (the track scrolls instead). */
.rogiq-steps-band > .wp-block-columns { width: 100%; }
.rogiq-team-strip > .wp-block-columns > .wp-block-column { min-width: 0; }
/* Team strip: below 992px the heading + button go on top and the slider runs the full width under them */
@media (max-width: 991px) {
	.rogiq-team-strip > .wp-block-columns { flex-wrap: wrap !important; row-gap: var(--wp--preset--spacing--50); }
	.rogiq-team-strip > .wp-block-columns > .wp-block-column { flex-basis: 100% !important; }
}
/* Phones: team strips with many people scroll too; steps stack */
@media (max-width: 781px) {
	.rogiq-team-strip .rogiq-team { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; gap: var(--wp--preset--spacing--30); }
	.rogiq-team-strip .rogiq-team > * { flex: 0 0 min(var(--wp--custom--team-card-width, 15rem), 72vw); scroll-snap-align: start; }
}

/* ---------- Icon block (rogiq/icon): image, Font Awesome or Lordicon inside the design's icon frame ----------
   Frame = hairline outline + tint box offset down-left (same family as contact / list icon boxes).
   Shape and colour follow the design's icon settings (--rogiq-icon-tile-radius, --rogiq-icon-color). */
.rogiq-icon-tile { --tile: 2.5rem; --tile-dx: 3px; --tile-dy: 3px; --tile-r: 5px; display: flex; float: none; margin-inline: 0; }
.rogiq-icon-tile.is-size-medium { --tile: 3.5rem; --tile-dx: 4px; --tile-dy: 3px; --tile-r: 6px; }
.rogiq-icon-tile.is-size-large { --tile: 5.4375rem; --tile-dx: 5px; --tile-dy: 4px; --tile-r: 7px; }
.rogiq-icon-tile.aligncenter { justify-content: center; }
.rogiq-icon-tile.alignright { justify-content: flex-end; }
.rogiq-icon-tile__frame {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: var(--tile);
	height: var(--tile);
	margin-left: var(--tile-dx);
	border: 1px solid var(--rogiq-icon-color, var(--rogiq-ink));
	--tile-radius: var(--rogiq-icon-tile-radius, var(--tile-r));
	border-radius: var(--tile-radius);
	/* tint inside the overlap, with the tint box's own rounded top-right corner */
	background:
		radial-gradient(farthest-side at 0 100%, var(--rogiq-tint) calc(100% - 0.5px), transparent 100%) right var(--tile-dx) top var(--tile-dy) / var(--tile-radius) var(--tile-radius) no-repeat border-box,
		linear-gradient(var(--rogiq-tint), var(--rogiq-tint)) left calc(-1 * var(--tile-dx)) top var(--tile-dy) / calc(100% - var(--tile-radius)) 100% no-repeat border-box,
		linear-gradient(var(--rogiq-tint), var(--rogiq-tint)) right var(--tile-dx) bottom calc(-1 * var(--tile-dy)) / var(--tile-radius) calc(100% - var(--tile-radius)) no-repeat border-box;
	box-shadow: calc(-1 * var(--tile-dx)) var(--tile-dy) 0 0 var(--rogiq-tint);
}
.rogiq-icon-tile.is-frameless .rogiq-icon-tile__frame { margin-left: 0; border: 0; background: none; box-shadow: none; }
.rogiq-icon-tile__frame > img,
.rogiq-icon-tile__frame > lord-icon { display: block; width: 84%; height: 84%; object-fit: contain; }
.rogiq-icon-tile__frame > i { font-size: calc(var(--tile) * 0.42); line-height: 1; color: var(--rogiq-icon-color, var(--rogiq-accent)); }
.rogiq-icon-tile.is-empty .rogiq-icon-tile__frame { opacity: 0.5; }
/* Steps band: tile centred above the step title */
.rogiq-steps-row .rogiq-icon-tile { margin-bottom: var(--wp--preset--spacing--20); }

/* ---------- Hero Media (rogiq/media): static image, Ken Burns slideshow or background video ----------
   Fills its positioned parent: the split hero's photo half, or a page banner (under the cover's wash). */
.rogiq-hero-media { position: absolute; inset: 0; overflow: hidden; margin: 0 !important; max-width: none !important; width: auto !important; }
/* Editor: the block's wrapper carries the class too and must beat the editor's position: relative on blocks */
.block-editor-block-list__block.rogiq-hero-media { position: absolute; }
.rogiq-hero-media > .rogiq-hero-media__img,
.rogiq-hero-media__slide > img,
.rogiq-hero-media__video { position: absolute; inset: 0; width: 100%; height: 100% !important; object-fit: cover; margin: 0; border-radius: 0; }
.rogiq-hero-media__slide { position: absolute; inset: 0; opacity: 0; transition: opacity var(--rogiq-kb-fade, 1.5s) ease; }
.rogiq-hero-media__slide.is-active { opacity: 1; z-index: 1; }
.rogiq-hero-media__slide.is-leaving { opacity: 0; z-index: 0; }
.rogiq-hero-media__slide img { transform-origin: center; will-change: transform; }
.rogiq-hero-media__slide.is-zoom-in img { animation: rogiq-kb-in var(--rogiq-kb-dur, 7.5s) linear forwards; }
.rogiq-hero-media__slide.is-zoom-out img { animation: rogiq-kb-out var(--rogiq-kb-dur, 7.5s) linear forwards; }
.rogiq-hero-media__slide:only-child img { animation-iteration-count: infinite; animation-direction: alternate; }
.rogiq-hero-media.is-paused img { animation-play-state: paused; }
@keyframes rogiq-kb-in { from { transform: scale(1); } to { transform: scale(var(--wp--custom--ken-burns-zoom, 1.12)); } }
@keyframes rogiq-kb-out { from { transform: scale(var(--wp--custom--ken-burns-zoom, 1.12)); } to { transform: scale(1); } }
.rogiq-hero-media__video { opacity: 0; transition: opacity 0.6s ease; }
.rogiq-hero-media.is-playing .rogiq-hero-media__video { opacity: 1; }
/* Pause / play: small, faint, fully visible on hover or keyboard focus */
.rogiq-hero-media__toggle {
	position: absolute;
	right: var(--wp--preset--spacing--20);
	bottom: var(--wp--preset--spacing--20);
	z-index: 3;
	width: 2rem;
	height: 2rem;
	padding: 0;
	border: 0;
	border-radius: var(--wp--custom--radius--round, 50%);
	background: color-mix(in srgb, var(--wp--preset--color--contrast) 40%, transparent);
	color: var(--wp--preset--color--base);
	opacity: var(--wp--custom--media-toggle-opacity, 0.4);
	cursor: pointer;
	transition: opacity var(--wp--custom--transition--fast, 0.2s ease);
}
.rogiq-hero-media__toggle:hover,
.rogiq-hero-media__toggle:focus-visible { opacity: 1; }
.rogiq-hero-media__toggle::before {
	content: '';
	position: absolute;
	inset: 0;
	margin: auto;
	width: 0.625rem;
	height: 0.75rem;
	background: linear-gradient(90deg, currentColor 35%, transparent 35% 65%, currentColor 65%);
}
.rogiq-hero-media.is-paused .rogiq-hero-media__toggle::before { left: 0.15rem; width: 0.7rem; background: currentColor; clip-path: polygon(0 0, 100% 50%, 0 100%); }
.rogiq-hero-media.is-empty { display: flex; align-items: center; justify-content: center; background: var(--rogiq-tint); color: var(--rogiq-small); font-size: var(--wp--preset--font-size--small); }
/* Banners and full-width heroes keep their layer numbers to themselves (isolation), so the header's dropdowns
   always open above them */
.rogiq-banner.wp-block-cover, .rogiq-hero-full.wp-block-cover { isolation: isolate; }
/* In a page banner the media sits behind the wash; the title stays above it */
.rogiq-banner .wp-block-cover__inner-container { position: static; }
/* Layer order: media (0–1, the active Ken Burns slide is 1) → dark wash (2) → title (3) → pause button (4). Core only lifts the wash when the cover holds the image itself. */
.rogiq-banner > .wp-block-cover__background { z-index: 2; }
.rogiq-banner .wp-block-cover__inner-container > :not(.rogiq-hero-media),
.rogiq-banner .wp-block-cover__inner-container > .wp-block > :not(.rogiq-hero-media) { position: relative; z-index: 3; }
.rogiq-banner .rogiq-hero-media { z-index: auto; }
.rogiq-banner .rogiq-hero-media > * { z-index: 0; }
.rogiq-banner .rogiq-hero-media .rogiq-hero-media__toggle { z-index: 4; }
/* Split hero photo half */
.rogiq-split-hero > .wp-block-column:last-child > .rogiq-hero-media { border-radius: 0; }

/* ---------- Client Logos (rogiq/logos) ----------
   Every logo gets the same box (height = logo size, width = 1 column) and is scaled to fit it, so wide wordmarks and
   square marks read evenly. Grid columns step down on tablets (max 3) and phones (max 2); a short last row centres. */
.rogiq-logos { --logo-h: var(--wp--custom--logo-height, 2.75rem); --gap-x: var(--wp--preset--spacing--50); --gap-y: var(--wp--preset--spacing--40); }
.rogiq-logos.is-size-small { --logo-h: calc(var(--wp--custom--logo-height, 2.75rem) * 0.75); }
.rogiq-logos.is-size-large { --logo-h: calc(var(--wp--custom--logo-height, 2.75rem) * 1.4); }
.rogiq-logos__list { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--gap-y) var(--gap-x); margin: 0; padding: 0; list-style: none; }
.rogiq-logos__item { display: flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 0; height: var(--logo-h); margin: 0; }
.is-grid .rogiq-logos__item { flex: 0 0 calc((100% - (var(--cols) - 1) * var(--gap-x)) / var(--cols)); }
@media (max-width: 1024px) { .is-grid .rogiq-logos__item { flex-basis: calc((100% - (var(--cols-t) - 1) * var(--gap-x)) / var(--cols-t)); } }
@media (max-width: 600px) { .is-grid .rogiq-logos__item { flex-basis: calc((100% - (var(--cols-p) - 1) * var(--gap-x)) / var(--cols-p)); } }
.rogiq-logos__item > a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.rogiq-logos__img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; transition: filter var(--wp--custom--transition--fast, 0.2s ease), opacity var(--wp--custom--transition--fast, 0.2s ease); }
/* Single-colour logos: the logo shape as a mask, filled with the chosen colour */
.rogiq-logos__mark { display: block; width: 100%; height: 100%; background: var(--logo-color, currentColor); -webkit-mask: var(--logo) center / contain no-repeat; mask: var(--logo) center / contain no-repeat; transition: opacity var(--wp--custom--transition--fast, 0.2s ease), background-color var(--wp--custom--transition--fast, 0.2s ease); }
.rogiq-logos.is-color-grayscale .rogiq-logos__img { filter: grayscale(1); opacity: 0.75; }
.rogiq-logos.is-color-grayscale.has-hover .rogiq-logos__item:hover .rogiq-logos__img { filter: none; opacity: 1; }
.rogiq-logos:not(.is-color-original):not(.is-color-grayscale).has-hover .rogiq-logos__mark { opacity: 0.8; }
.rogiq-logos:not(.is-color-original):not(.is-color-grayscale).has-hover .rogiq-logos__item:hover .rogiq-logos__mark { opacity: 1; }
.rogiq-logos.is-color-dark.has-hover .rogiq-logos__item:hover .rogiq-logos__mark { background-color: var(--wp--preset--color--accent); }
/* Carousel: continuous scroll, N logos in view; pauses on hover (mouse only: a tap would stick) / keyboard focus.
   Items get a real width, not just flex-basis: Firefox sizes the max-content track from the logos otherwise, and the
   -50% loop then jumps. logos.js sets --dur so the pace matches on every screen. */
.rogiq-logos.is-carousel { position: relative; container-type: inline-size; }
.rogiq-logos__viewport { overflow: hidden; -webkit-mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.rogiq-logos__track { display: flex; width: max-content; animation: rogiq-logos-scroll var(--dur, 20s) linear infinite; }
.is-carousel .rogiq-logos__list { flex-wrap: nowrap; gap: 0; }
.is-carousel .rogiq-logos__item { flex: 0 0 auto; width: calc(100cqw / var(--cols)); padding-inline: calc(var(--gap-x) / 2); }
@container (max-width: 1024px) { .is-carousel .rogiq-logos__item { width: calc(100cqw / var(--cols-t)); } }
@container (max-width: 600px) { .is-carousel .rogiq-logos__item { width: calc(100cqw / var(--cols-p)); } }
@media (hover: hover) { .rogiq-logos.is-carousel:hover .rogiq-logos__track { animation-play-state: paused; } }
.rogiq-logos.is-carousel:focus-within .rogiq-logos__track { animation-play-state: paused; }
@keyframes rogiq-logos-scroll { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
	.rogiq-logos__track { animation: none; }
	.rogiq-logos__viewport { overflow-x: auto; }
	.rogiq-logos__list[aria-hidden="true"] { display: none; }
}

/* ---------- Team contact links (bio page + optional Team Grid icons). Kit glyphs override the masks (icons.php). ---------- */
.rogiq-team-contact { display: grid; gap: var(--wp--preset--spacing--20); margin: 0; padding: 0; list-style: none; }
.rogiq-team-contact a { display: inline-flex; align-items: center; gap: var(--wp--preset--spacing--30); color: inherit; text-decoration: none; overflow-wrap: anywhere; }
.rogiq-team-contact a:hover .rogiq-team-contact__value { text-decoration: underline; text-underline-offset: 4px; }
.rogiq-team-contact__icon {
	--rogiq-contact-box: 2.25rem;
	position: relative;
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: var(--rogiq-contact-box);
	height: var(--rogiq-contact-box);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--rogiq-icon-box-radius, var(--wp--custom--radius--sm, 8px));
	color: var(--rogiq-icon-color, var(--rogiq-accent, currentColor));
}
.rogiq-team-contact__icon::before {
	content: '';
	width: 1rem;
	height: 1rem;
	background: currentColor;
	-webkit-mask: var(--rogiq-glyph-img) center / contain no-repeat;
	        mask: var(--rogiq-glyph-img) center / contain no-repeat;
}
.rogiq-team-contact__icon[data-icon="email"] { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x=%223%22 y=%225%22 width=%2218%22 height=%2214%22 rx=%222%22/%3E%3Cpath d=%22M3 7l9 6 9-6%22/%3E%3C/svg%3E"); }
.rogiq-team-contact__icon[data-icon="phone"] { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d=%22M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2%22/%3E%3C/svg%3E"); }
.rogiq-team-contact__icon[data-icon="cell"] { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x=%226%22 y=%222.5%22 width=%2212%22 height=%2219%22 rx=%222.5%22/%3E%3Cpath d=%22M10.5 18.5h3%22/%3E%3C/svg%3E"); }
.rogiq-team-contact__icon[data-icon="linkedin"] { --rogiq-glyph-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M100.28 448H7.4V148.9h92.88zM53.79 108.1C24.09 108.1 0 83.5 0 53.8a53.79 53.79 0 0 1 107.58 0c0 29.7-24.1 54.3-53.79 54.3zM447.9 448h-92.68V302.4c0-34.7-.7-79.2-48.29-79.2-48.29 0-55.69 37.7-55.69 76.7V448h-92.78V148.9h89.08v40.8h1.3c12.4-23.5 42.69-48.3 87.88-48.3 94 0 111.28 61.9 111.28 142.3V448z'/%3E%3C/svg%3E"); }
/* The icon says what it is; the word stays for screen readers. */
.rogiq-team-contact__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.rogiq-team-contact.is-icons { position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--20); margin-top: var(--wp--preset--spacing--20); }
.rogiq-team-contact.is-icons .rogiq-team-contact__icon { --rogiq-contact-box: 2rem; transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease; }
.rogiq-team-contact.is-icons a:is(:hover, :focus-visible) .rogiq-team-contact__icon { border-color: var(--wp--preset--color--primary); background: var(--wp--preset--color--primary); color: var(--wp--preset--color--primary-contrast); }

/* ---------- Team Member Info block: "Role | Location" line and the bio page contact list ---------- */
.rogiq-team-info.is-role { color: var(--wp--preset--color--contrast-alt); }
.rogiq-team-info__sep::before { content: var(--wp--custom--team-info-sep, '|'); margin-inline: 0.5em; }
/* Bio page: name, then the role line close under it, then the contact links two across (stacking when there's no room) */
.rogiq-bio .rogiq-bio-name { line-height: var(--wp--custom--bio-name-line, var(--wp--custom--line-height--tight, 1.2)); }
.rogiq-bio .rogiq-team-info.is-role { margin-block-start: var(--wp--custom--bio-role-gap, var(--wp--preset--spacing--20)); }
.rogiq-team-info.is-contact { max-width: var(--wp--custom--bio-text-width, none); margin-block-start: var(--wp--preset--spacing--40); }
.rogiq-team-info.is-contact .rogiq-team-contact { grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); column-gap: var(--wp--preset--spacing--40); }

/* Bio page (designs opt in with rogiq-bio on the columns): photo + text, held to custom.bio-width */
.rogiq-bio.wp-block-columns { max-width: var(--wp--custom--bio-width, var(--wp--style--global--wide-size)); margin-inline: auto; }
.rogiq-bio-photo img { border-radius: var(--wp--custom--radius--photo, var(--wp--custom--radius--card, 22px)); }

/* ---- Dark presets (custom.tone "dark" → body.rogiq-tone-dark) ----
   Images drawn for light pages: logo without a light version, line-drawing icons (PNG), full-colour partner logos. */
.rogiq-tone-dark .rogiq-logo-invert img,
.rogiq-tone-dark .rogiq-logos.is-color-original img {
	filter: brightness(0) invert(1);
}

.rogiq-tone-dark .rogiq-logos.is-color-original img {
	opacity: 0.85;
}

.rogiq-tone-dark .wp-block-rogiq-icon img {
	filter: invert(1) hue-rotate(180deg);
}

/* The top bar is a "contrast" strip on light pages; on a dark page it stays a dark strip, one step off the page. */
.rogiq-tone-dark .rogiq-topbar.has-contrast-background-color {
	background-color: var(--wp--preset--color--base-alt) !important;
	color: var(--wp--preset--color--contrast) !important;
	border-bottom: 1px solid var(--wp--preset--color--border);
}

/* Social icons: core draws them as pills (9999px); they follow the "round" token so Site Info → Corners → Sharp squares them. */
.wp-block-social-links .wp-block-social-link.wp-social-link { border-radius: var(--wp--custom--radius--round, 9999px); }