/* ---------------------------------------------------------------------------
 * Glenwood Systems — front-end CSS supplement
 *
 * theme.json carries the brand tokens and base typography. This file adds
 * the few things theme.json can't express cleanly:
 *   - core/button style variations (secondary, iq, ghost, white)
 *   - sticky header behaviour + dark/light mode swap
 *   - mega-menu shell (markup lives in parts/header.html)
 *   - 5-column footer grid + column accents
 *   - focus rings (WCAG AA: 2px violet, 2px offset)
 *   - reduced-motion + print
 * ------------------------------------------------------------------------- */

:root {
	--gw-focus-ring: 0 0 0 2px var(--wp--preset--color--canvas), 0 0 0 4px var(--wp--preset--color--violet);

	/* z-index scale — see Z_INDEX_SCALE.md */
	--z-base:     0;
	--z-dropdown: 100;
	--z-sticky:   1000;
	--z-overlay:  1050;
	--z-drawer:   1100;
	--z-modal:    1200;
	--z-toast:    1300;
	--z-tooltip:  1400;
	--z-cookie:   1500;

	/* Spacing-preset aliases.
	 *
	 * theme.json defines slugs "2xl", "3xl", "4xl", "5xl" -- but WP 6.5+
	 * inserts a hyphen when generating the CSS variable name (slug "2xl"
	 * becomes --wp--preset--spacing--2-xl). All our page markup references
	 * the un-hyphenated names (--4xl etc), so without these aliases every
	 * section padding silently resolves to 0. Defining both forms means
	 * both var(--4xl) and var(--4-xl) work; theme files can use either.
	 */
	--wp--preset--spacing--2xl: var(--wp--preset--spacing--2-xl);
	--wp--preset--spacing--3xl: var(--wp--preset--spacing--3-xl);
	--wp--preset--spacing--4xl: var(--wp--preset--spacing--4-xl);
	--wp--preset--spacing--5xl: var(--wp--preset--spacing--5-xl);
}

/* --- Focus rings --------------------------------------------------------- */
*:focus-visible {
	outline: 2px solid var(--wp--preset--color--violet);
	outline-offset: 2px;
}

/* --- Button variations --------------------------------------------------- */
.wp-block-button.is-style-secondary .wp-block-button__link {
	background-color: var(--wp--preset--color--canvas);
	color: var(--wp--preset--color--violet);
	border: 1.5px solid var(--wp--preset--color--violet);
	box-shadow: none;
	border-radius: 6px;
}
.wp-block-button.is-style-secondary .wp-block-button__link:hover,
.wp-block-button.is-style-secondary .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--violet-light);
	color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--ink);
}

.wp-block-button.is-style-iq .wp-block-button__link {
	background: var(--wp--preset--gradient--iq-gradient);
	color: var(--wp--preset--color--white);
	box-shadow: var(--wp--preset--shadow--iq);
	border: 0;
	border-radius: 6px;
}
.wp-block-button.is-style-iq .wp-block-button__link:hover,
.wp-block-button.is-style-iq .wp-block-button__link:focus {
	filter: brightness(1.08);
}

.wp-block-button.is-style-ghost .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--violet);
	box-shadow: none;
	padding: 14px 4px;
}
.wp-block-button.is-style-ghost .wp-block-button__link:hover,
.wp-block-button.is-style-ghost .wp-block-button__link:focus {
	background: var(--wp--preset--color--violet-light);
	color: var(--wp--preset--color--ink);
	padding: 14px 24px;
	border-radius: 6px;
}

.wp-block-button.is-style-white .wp-block-button__link {
	background-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--violet);
	border-radius: 6px;
}
.wp-block-button.is-style-white .wp-block-button__link:hover,
.wp-block-button.is-style-white .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--violet-light);
	color: var(--wp--preset--color--ink);
}

.wp-block-button.is-style-white-outline .wp-block-button__link {
	background-color: transparent;
	color: var(--wp--preset--color--white);
	border: 1.5px solid rgba(255, 255, 255, 0.7);
	box-shadow: none;
	border-radius: 6px;
}
.wp-block-button.is-style-white-outline .wp-block-button__link:hover,
.wp-block-button.is-style-white-outline .wp-block-button__link:focus {
	background-color: rgba(255, 255, 255, 0.1);
	border-color: #ffffff;
}

/* --- Site header --------------------------------------------------------- */
/* Header layout: full-bleed sticky bar, 3-column flex row inside the 1200px
 * track (logo | nav | actions). The header structure comes from
 * parts/header.html; the wp:navigation block uses overlayMenu:"mobile" which
 * means WP renders BOTH the inline menu (used on desktop) and a hamburger
 * drawer (used on mobile). The rules below style both states without
 * fighting WP's responsive toggle. */
.gw-site-header {
	position: sticky;
	top: 0;
	z-index: var(--z-sticky);
	background: var(--wp--preset--color--canvas);
	border-bottom: 1px solid transparent;
	transition: background 300ms ease, border-color 300ms ease, box-shadow 300ms ease;
}
.gw-site-header.is-scrolled {
	border-bottom-color: var(--wp--preset--color--light-gray);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

/* Logo sizing -- the wp:site-logo block emits the <img> directly */
.gw-site-header .wp-block-site-logo,
.gw-site-header .wp-block-site-logo a {
	display: flex;
	align-items: center;
	flex-shrink: 0;
}
.gw-site-header .custom-logo {
	height: auto;
	width: 220px;
	max-width: 100%;
	display: block;
}
@media (max-width: 540px) {
	.gw-site-header .custom-logo { width: 160px; }
}

/* Navigation: top-level items ------------------------------------------- */
.gw-site-header .wp-block-navigation {
	flex: 1 1 auto;
}
.gw-site-header .wp-block-navigation > .wp-block-navigation__container {
	gap: 28px;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
}
.gw-site-header .wp-block-navigation .wp-block-navigation-item__content {
	color: var(--wp--preset--color--ink);
	font-weight: 500;
	font-size: 0.9375rem;
	padding: 8px 0;
	text-decoration: none;
	transition: color 200ms ease;
}
.gw-site-header .wp-block-navigation .wp-block-navigation-item__content:hover,
.gw-site-header .wp-block-navigation .wp-block-navigation-item__content:focus {
	color: var(--wp--preset--color--violet);
}
.gw-site-header .wp-block-navigation .wp-block-navigation-submenu__toggle {
	padding: 0 0 0 4px;
	color: inherit;
}

/* Navigation: submenu dropdown ----------------------------------------- */
.gw-site-header .wp-block-navigation__submenu-container {
	background: var(--wp--preset--color--canvas);
	border: 1px solid var(--wp--preset--color--light-gray);
	border-radius: 8px;
	box-shadow: 0 12px 32px rgba(14, 14, 16, 0.10), 0 4px 8px rgba(14, 14, 16, 0.04);
	padding: 8px;
	min-width: 240px;
	margin-top: 4px;
}
.gw-site-header .wp-block-navigation__submenu-container .wp-block-navigation-item {
	width: 100%;
}
.gw-site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	display: block;
	padding: 8px 14px;
	border-radius: 4px;
	font-weight: 500;
	width: 100%;
}
.gw-site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.gw-site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus {
	background: var(--wp--preset--color--violet-light);
	color: var(--wp--preset--color--violet);
}

/* Right-side group: phone + Schedule a Demo button --------------------- */
.gw-site-header .gw-header-phone {
	margin: 0;
	font-weight: 500;
	font-size: 0.875rem;
	color: var(--wp--preset--color--dark-gray);
	white-space: nowrap;
}
.gw-site-header .gw-header-phone a {
	color: inherit;
	text-decoration: none;
}
.gw-site-header .gw-header-phone a:hover {
	color: var(--wp--preset--color--violet);
}
.gw-site-header .wp-block-buttons {
	flex-shrink: 0;
	margin: 0;
}
.gw-site-header .wp-block-button {
	margin: 0;
}
.gw-site-header .wp-block-button .wp-block-button__link {
	padding: 8px 16px;
	font-size: 0.875rem;
	white-space: nowrap;
	line-height: 1.2;
}

/* Hide the hamburger button on desktop -- WP shows it by default but we
 * use the inline menu down to the tablet breakpoint */
@media (min-width: 1025px) {
	.gw-site-header .wp-block-navigation__responsive-container-open {
		display: none !important;
	}
	.gw-site-header .wp-block-navigation__responsive-container {
		position: static;
		display: contents;
		background: transparent;
		padding: 0;
	}
	.gw-site-header .wp-block-navigation__responsive-close,
	.gw-site-header .wp-block-navigation__responsive-dialog,
	.gw-site-header .wp-block-navigation__responsive-container-content {
		display: contents;
	}
	.gw-site-header .wp-block-navigation__responsive-container-close {
		display: none;
	}
}

/* Tablet (iPad portrait + below): drop the phone label, tighten the row */
@media (max-width: 1024px) {
	.gw-site-header .gw-header-phone {
		display: none;
	}
	.gw-site-header .wp-block-navigation > .wp-block-navigation__container {
		gap: 24px;
	}
}

/* Mobile (below 782px): hamburger menu only. WP's responsive container
 * handles the open/close state via data-wp-* directives -- our job here is
 * just to style the drawer and hide the inline pieces. */
@media (max-width: 782px) {
	/* The wp-block-navigation has flex:1 + justify-content:center on
	 * the inner container -- without overrides, the hamburger button
	 * floats centered in the header. Fix: anchor the nav (which is now
	 * just the hamburger trigger) to the right edge. */
	.gw-site-header .wp-block-navigation {
		flex: 0 0 auto;
		margin-left: auto;
	}
	.gw-site-header .wp-block-navigation__responsive-container-open {
		display: flex;
		align-items: center;
		justify-content: center;
		background: transparent;
		border: 0;
		padding: 8px;
		color: var(--wp--preset--color--ink);
		cursor: pointer;
	}
	.gw-site-header .wp-block-navigation__responsive-container-open:hover,
	.gw-site-header .wp-block-navigation__responsive-container-open:focus {
		color: var(--wp--preset--color--violet);
	}

	/* Schedule a Demo: shrink padding only, keep nowrap so it stays one
	 * line, never breaks into pieces */
	.gw-site-header .wp-block-button .wp-block-button__link {
		padding: 8px 14px;
		font-size: 0.8125rem;
	}

	/* Drawer open state: full-screen canvas overlay */
	.gw-site-header .wp-block-navigation__responsive-container.has-modal-open {
		background: var(--wp--preset--color--canvas);
		padding: 32px 24px;
	}
	.gw-site-header .wp-block-navigation__responsive-container.has-modal-open
		.wp-block-navigation__container {
		gap: 0;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
	}

	/* Top-level items in the drawer: large, bold, with divider */
	.gw-site-header .wp-block-navigation__responsive-container.has-modal-open
		> .wp-block-navigation__responsive-close
		> .wp-block-navigation__responsive-dialog
		> .wp-block-navigation__responsive-container-content
		> .wp-block-navigation__container
		> .wp-block-navigation-item
		> .wp-block-navigation-item__content {
		font-size: 1.125rem;
		font-weight: 600;
		color: var(--wp--preset--color--ink);
		padding: 16px 0;
		border-bottom: 1px solid var(--wp--preset--color--light-gray);
	}

	/* Submenu items in the drawer: indented, lighter weight, smaller */
	.gw-site-header .wp-block-navigation__responsive-container.has-modal-open
		.wp-block-navigation__submenu-container {
		background: transparent;
		border: 0;
		box-shadow: none;
		padding: 0 0 0 16px;
		margin: 0 0 8px 0;
	}
	.gw-site-header .wp-block-navigation__responsive-container.has-modal-open
		.wp-block-navigation__submenu-container
		.wp-block-navigation-item__content {
		font-size: 0.9375rem;
		font-weight: 500;
		color: var(--wp--preset--color--dark-gray);
		padding: 8px 0;
		border-bottom: 0;
	}

	/* Section overline label above submenu group -- visual breath */
	.gw-site-header .wp-block-navigation__responsive-container.has-modal-open
		.wp-block-navigation-submenu {
		padding-bottom: 8px;
	}
}

/* Small mobile (below 540px): hide the demo button to free up space;
 * users can still tap the hamburger and find Schedule from inside */
@media (max-width: 540px) {
	.gw-site-header .wp-block-buttons {
		display: none;
	}
}

/* --- Footer 5-column grid (markup in parts/footer.html) ----------------- */
.gw-footer { background: var(--wp--preset--color--ink); color: rgba(255, 255, 255, 0.65); }
.gw-footer a { color: rgba(255, 255, 255, 0.65); text-decoration: none; }
.gw-footer a:hover, .gw-footer a:focus { color: #ffffff; text-decoration: underline; }
.gw-footer__columns { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
.gw-footer__col-title { font-size: 11px; font-weight: 600; color: rgba(255, 255, 255, 0.4); text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 16px; }
.gw-footer__link-accent { color: var(--wp--preset--color--cyan); }
.gw-footer__divider { height: 1px; background: rgba(255, 255, 255, 0.08); margin: 32px 0; border: 0; }
.gw-footer__office-label { font-size: 11px; font-weight: 600; color: rgba(255, 255, 255, 0.4); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 8px; }
.gw-footer__compliance-row { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.gw-footer__compliance-row .gw-footer__col-title { margin-bottom: 0; }
.gw-footer__bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; font-size: 13px; }
.gw-footer__social .wp-social-link { background: transparent !important; }

@media (max-width: 900px) {
	.gw-footer__columns { grid-template-columns: 1fr 1fr; gap: 28px; }
	.gw-footer__compliance-row { flex-direction: column; gap: 8px; }
}
@media (max-width: 540px) {
	.gw-footer__columns { grid-template-columns: 1fr; }
}

/* --- Trust bar / stat counter shells ------------------------------------ */
.gw-stat__value { font-size: clamp(2rem, 1.5rem + 2vw, 3rem); font-weight: 700; color: var(--wp--preset--color--violet); line-height: 1; letter-spacing: -0.02em; }
.gw-stat__label { font-size: 0.875rem; color: var(--wp--preset--color--medium-gray); margin-top: 4px; }

/* --- Overline / eyebrow -------------------------------------------------- */
.gw-overline { font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--violet); }

/* --- IQ spotlight section (gradient bg, white text) --------------------- */
.gw-iq-spotlight { background: var(--wp--preset--gradient--iq-gradient); color: var(--wp--preset--color--white); }
.gw-iq-spotlight :where(h1, h2, h3, h4, h5, h6) { color: var(--wp--preset--color--white); }
.gw-iq-spotlight a { color: var(--wp--preset--color--white); text-decoration: underline; }

/* --- Reduced motion ------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
}

/* --- Print --------------------------------------------------------------- */
@media print {
	.gw-site-header, .gw-footer, .wp-block-navigation, .wp-block-button { display: none !important; }
	body { color: #000; background: #fff; font-size: 12pt; }
	a::after { content: " (" attr(href) ")"; font-size: 10pt; color: #555; }
}

/* --- Section content width ---------------------------------------------- */
/* Marketing pages use alignfull sections (full viewport bg) whose inner
 * content should sit on a 1200px max-width track. Each section declares
 * "layout":{"type":"constrained","contentSize":"1200px"} in its JSON
 * attrs, which is supposed to generate a per-block .wp-container-XXX CSS
 * rule. That generation can fail when content is imported via WXR rather
 * than authored in the editor, leaving sections to inherit the global
 * 680px content-size from theme.json. This rule is a belt-and-suspenders
 * override so imported marketing pages render at the intended 1200px
 * width regardless of whether WP emitted the per-block container CSS.
 *
 * single.html (blog posts) explicitly sets its own 680px content-size on
 * main + post-content, so blog body prose is unaffected.
 */
.wp-site-blocks .wp-block-group.alignfull.is-layout-constrained > :where(
	.wp-block-columns,
	.wp-block-buttons,
	.wp-block-heading,
	.wp-block-paragraph,
	p,
	.wp-block-list,
	ul, ol,
	.wp-block-table,
	figure,
	.wp-block-group:not(.alignfull):not(.alignwide),
	.wp-block-query
) {
	max-width: var(--wp--style--global--wide-size);
	margin-left: auto;
	margin-right: auto;
}

/* ===========================================================================
 * Section rhythm
 *
 * Every marketing-page section in our markup is a wp-block-group with
 * align:"full" + layout:"constrained" + inline padding using the spacing
 * presets. The :root spacing aliases above already make the inline padding
 * resolve, but we also need a baseline to handle sections whose markup is
 * missing inline padding (rare but happens in some imported pages).
 * ========================================================================= */

.wp-site-blocks .wp-block-group.alignfull {
	box-sizing: border-box;
}

/* Ensure consistent vertical rhythm: every alignfull section gets the same
 * generous top/bottom padding unless its own inline style overrides. The
 * inline style wins because it has higher specificity. */
.wp-site-blocks > .wp-block-group.alignfull,
main .wp-block-group.alignfull {
	padding-top: var(--wp--preset--spacing--4-xl);
	padding-bottom: var(--wp--preset--spacing--4-xl);
	padding-left: var(--wp--preset--spacing--xl);
	padding-right: var(--wp--preset--spacing--xl);
}

/* Headings inside sections: tighten top margin since the section already
 * provides padding. Prevents double-space at the top of a section. */
.wp-site-blocks .wp-block-group.alignfull > .wp-block-heading:first-child,
.wp-site-blocks .wp-block-group.alignfull > .wp-block-paragraph:first-child {
	margin-top: 0;
}

/* ===========================================================================
 * Equal-height cards (multi-column layouts)
 *
 * Our testimonials, product grids, and feature grids are wp-block-columns
 * with a wp-block-group inside each column. Default WP layout doesn't make
 * the inner groups fill the column height, so cards in the same row appear
 * different heights when their content differs.
 * ========================================================================= */

.wp-block-columns > .wp-block-column {
	display: flex;
	flex-direction: column;
}
.wp-block-columns > .wp-block-column > .wp-block-group {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
}

/* Card visual polish: subtle hover lift for clickable card contexts */
.wp-block-columns .wp-block-group.has-background[style*="border-radius"] {
	transition: transform 200ms ease, box-shadow 200ms ease;
}
.wp-block-columns .wp-block-group.has-background[style*="border-radius"]:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(14, 14, 16, 0.06);
}

/* ===========================================================================
 * Stat tiles (trust bar + per-section stat rows)
 * ========================================================================= */

.gw-stat__value {
	font-size: clamp(1.75rem, 1.4rem + 1.5vw, 2.75rem);
	font-weight: 700;
	color: var(--wp--preset--color--violet);
	line-height: 1;
	letter-spacing: -0.02em;
	margin: 0;
}
.gw-stat__label {
	font-size: 0.8125rem;
	color: var(--wp--preset--color--medium-gray);
	margin-top: 4px;
	font-weight: 500;
}

/* ===========================================================================
 * Specialty grid (homepage 23-specialty wrap-list)
 * ========================================================================= */

.gw-specialty-grid > p {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px 24px;
	margin: 0;
}
.gw-specialty-grid > p > a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	font-weight: 500;
	padding: 8px 0;
	transition: color 200ms ease;
	font-size: 0.9375rem;
}
.gw-specialty-grid > p > a:hover,
.gw-specialty-grid > p > a:focus {
	color: var(--wp--preset--color--violet);
}

@media (max-width: 900px) {
	.gw-specialty-grid > p {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 540px) {
	.gw-specialty-grid > p {
		grid-template-columns: 1fr;
	}
}

/* ===========================================================================
 * Integration rows (homepage "Connected to the Systems You Already Use")
 * ========================================================================= */

.gw-integration-rows > p {
	color: rgba(255, 255, 255, 0.85);
	font-size: 1rem;
	line-height: 1.6;
	padding: 14px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	margin: 0;
}
.gw-integration-rows > p:last-child {
	border-bottom: 0;
}
.gw-integration-rows > p strong {
	color: var(--wp--preset--color--white);
	margin-right: 8px;
}

/* ===========================================================================
 * Comparison table (why-glenwood + product pages)
 * ========================================================================= */

.gw-comparison {
	width: 100%;
}
.gw-comparison table {
	width: 100%;
	border-collapse: collapse;
	background: var(--wp--preset--color--canvas);
	border: 1px solid var(--wp--preset--color--light-gray);
	border-radius: 8px;
	overflow: hidden;
}
.gw-comparison thead {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--white);
}
.gw-comparison th,
.gw-comparison td {
	padding: 14px 16px;
	text-align: left;
	border-bottom: 1px solid var(--wp--preset--color--light-gray);
	font-size: 0.9375rem;
	line-height: 1.5;
}
.gw-comparison th {
	font-weight: 600;
	letter-spacing: 0.02em;
}
.gw-comparison tr:last-child td {
	border-bottom: 0;
}
.gw-comparison th:last-child,
.gw-comparison td:last-child {
	background: var(--wp--preset--color--violet-light);
	color: var(--wp--preset--color--ink);
}
.gw-comparison thead th:last-child {
	background: var(--wp--preset--color--violet);
	color: var(--wp--preset--color--white);
}

@media (max-width: 782px) {
	.gw-comparison th,
	.gw-comparison td {
		padding: 8px;
		font-size: 0.8125rem;
	}
}

/* ===========================================================================
 * Button groups: consistent gap, no text-wrap inside buttons
 * ========================================================================= */

.wp-block-buttons {
	gap: 16px;
}
.wp-block-buttons.is-content-justification-center {
	justify-content: center;
}
.wp-block-button .wp-block-button__link {
	white-space: nowrap;
}

/* ===========================================================================
 * Lists with bold lead-in (RCM features, product feature lists)
 * ========================================================================= */

.gw-rcm-features {
	padding-left: 0;
	list-style: none;
}
.gw-rcm-features > li {
	padding: 8px 0;
	border-bottom: 1px solid var(--wp--preset--color--light-gray);
	font-size: 0.9375rem;
	line-height: 1.5;
}
.gw-rcm-features > li:last-child {
	border-bottom: 0;
}
.gw-rcm-features > li > strong {
	display: block;
	margin-bottom: 4px;
	color: var(--wp--preset--color--ink);
}

/* ===========================================================================
 * Hero media (right column on product pages)
 * ========================================================================= */

.gw-hero-media img {
	border-radius: 16px;
	width: 100%;
	height: auto;
	display: block;
}

/* ===========================================================================
 * Fluent Forms styling (lead-capture sections)
 * ========================================================================= */

.fluentform .ff-el-input--label label {
	font-weight: 600;
	font-size: 0.875rem;
	color: var(--wp--preset--color--ink);
}
.fluentform .ff-el-form-control {
	border-radius: 6px;
	border: 1px solid var(--wp--preset--color--light-gray);
	padding: 8px 14px;
	font-size: 1rem;
	font-family: var(--wp--preset--font-family--geist);
}
.fluentform .ff-el-form-control:focus {
	border-color: var(--wp--preset--color--violet);
	outline: 2px solid var(--wp--preset--color--violet);
	outline-offset: 1px;
}
.fluentform .ff_btn_style {
	background: var(--wp--preset--color--violet);
	color: var(--wp--preset--color--white);
	border: 0;
	border-radius: 6px;
	padding: 14px 28px;
	font-weight: 600;
	font-family: var(--wp--preset--font-family--geist);
	cursor: pointer;
	transition: background 200ms ease;
}
.fluentform .ff_btn_style:hover,
.fluentform .ff_btn_style:focus {
	background: var(--wp--preset--color--ink);
}

/* ===========================================================================
 * Responsive: pages, sections, paddings at smaller breakpoints
 * ========================================================================= */

@media (max-width: 1024px) {
	.wp-site-blocks > .wp-block-group.alignfull,
	main .wp-block-group.alignfull {
		padding-top: var(--wp--preset--spacing--3-xl);
		padding-bottom: var(--wp--preset--spacing--3-xl);
	}
}

@media (max-width: 782px) {
	.wp-site-blocks > .wp-block-group.alignfull,
	main .wp-block-group.alignfull {
		padding-top: var(--wp--preset--spacing--2-xl);
		padding-bottom: var(--wp--preset--spacing--2-xl);
		padding-left: var(--wp--preset--spacing--lg);
		padding-right: var(--wp--preset--spacing--lg);
	}

	.wp-block-columns > .wp-block-column {
		flex-basis: 100% !important;
	}

	.has-display-font-size {
		font-size: clamp(2rem, 1.5rem + 2vw, 2.75rem) !important;
	}
}

/* ===========================================================================
 * Trust bar — new card style (per pattern revamp 2026-05-22)
 *
 * Replaces the 5-column band of small stats with a 4-card grid that reads
 * as proper differentiator cards: bold value text + supporting context.
 * Each card has a subtle border and breathes more on its own.
 * ========================================================================= */

.gw-trust-grid {
	gap: 16px !important;
}
.gw-trust-card {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--light-gray);
	border-radius: 8px;
	padding: 24px;
	display: flex !important;
	flex-direction: column;
	gap: 8px;
	transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}
.gw-trust-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 16px rgba(14, 14, 16, 0.04);
	border-color: var(--wp--preset--color--violet-light);
}
.gw-trust-card__value {
	font-size: clamp(1.25rem, 0.9rem + 1.2vw, 1.625rem);
	font-weight: 700;
	color: var(--wp--preset--color--violet);
	letter-spacing: -0.01em;
	margin: 0;
	line-height: 1.15;
}
.gw-trust-card__label {
	font-size: 0.875rem;
	color: var(--wp--preset--color--dark-gray);
	margin: 0;
	line-height: 1.45;
}

@media (max-width: 782px) {
	.gw-trust-card {
		padding: 16px;
	}
}

/* ===========================================================================
 * Footer logo (white variant, larger than header)
 * ========================================================================= */

.gw-footer__logo {
	margin: 0 0 16px 0;
}
.gw-footer__logo img {
	max-width: 240px;
	width: 240px;
	height: auto;
	display: block;
}
@media (max-width: 540px) {
	.gw-footer__logo img {
		max-width: 200px;
		width: 200px;
	}
}

/* ===========================================================================
 * Section padding + inter-section gap override
 *
 * Three forces were stacking up to make sections feel huge:
 *   1. Each section's inline style="padding-top:var(--wp--preset--spacing--4xl)"
 *      resolves to 96px (theme.json default). That's 96 top + 96 bottom per
 *      section = 192px of empty space per section.
 *   2. WP core adds margin-block-start: var(--wp--preset--spacing--lg) (24px)
 *      to every top-level block via :where(.wp-site-blocks) > * { ... },
 *      which puts another 24px BETWEEN sections.
 *   3. CSS rules without !important lose to inline styles.
 *
 * Fix: use !important to force tight vertical padding regardless of the
 * inline 4xl markup, and zero out the inter-section block-gap (sections
 * already supply their own breathing room).
 *
 * Token-allowed values: 0, 1, 4, 8, 14, 16, 24, 28, 32, 48, 64, 96, 128.
 * ========================================================================= */

.wp-site-blocks > .wp-block-group.alignfull,
main .wp-block-group.alignfull {
	padding-top: 32px !important;
	padding-bottom: 32px !important;
	margin-block-start: 0 !important;
}

@media (max-width: 1024px) {
	.wp-site-blocks > .wp-block-group.alignfull,
	main .wp-block-group.alignfull {
		padding-top: 24px !important;
		padding-bottom: 24px !important;
	}
}

@media (max-width: 782px) {
	.wp-site-blocks > .wp-block-group.alignfull,
	main .wp-block-group.alignfull {
		padding-top: 16px !important;
		padding-bottom: 16px !important;
		padding-left: var(--wp--preset--spacing--lg) !important;
		padding-right: var(--wp--preset--spacing--lg) !important;
	}
}

/* ===========================================================================
 * Specialty hero (auto-rendered via [gw_specialty_hero] shortcode) +
 * page hero supporting photos (gw-page-hero-photo class).
 *
 * Wraps the auto-rendered specialty hero image and the in-content page
 * heroes on /about-us, /why-glenwood, /contact-us, /glaceemr (telehealth
 * section), /glacescribe, /glacephonesmart, /glace-grow, and the two
 * GlaceRCM deep-dive sub-pages. Keeps a consistent visual treatment
 * (rounded corners, soft shadow, max-width track) across all of them.
 * ========================================================================= */

.gw-specialty-hero,
.gw-page-hero-photo {
	max-width: var(--wp--style--global--wide-size);
	margin-left: auto;
	margin-right: auto;
	margin-top: var(--wp--preset--spacing--xl);
	margin-bottom: var(--wp--preset--spacing--xl);
}
.gw-specialty-hero img,
.gw-page-hero-photo img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(14, 14, 16, 0.06);
}

@media (max-width: 782px) {
	.gw-specialty-hero img,
	.gw-page-hero-photo img {
		border-radius: 8px;
	}
}

/* ===========================================================================
 * Mega-menu items: prevent wrapping to two lines
 *
 * "GlaceIQ (AI Layer)", "Integrations", "Certifications" and other dropdown
 * items would wrap to two lines inside the narrow dropdown column. Forcing
 * single-line treatment by using nowrap; the dropdown auto-widens to fit.
 * ========================================================================= */

.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	white-space: nowrap;
}
.wp-block-navigation .wp-block-navigation__submenu-container {
	min-width: 220px;
}

/* ===========================================================================
 * Footer compaction: tighten the cavernous vertical gaps
 *
 * The footer's two wp:separator dividers had margin: 32px 0 PLUS the parent
 * blockGap added another 32px on each side of every separator -> 96px wasted
 * around each. Top padding was 3xl (64px). Total footer height was excessive.
 * Compressing to a tighter editorial rhythm.
 *
 * The white-variant logo SVG renders larger than expected at 240px width
 * because its viewBox is wide-aspect; capping height to 48px keeps it
 * visually consistent with the header logo.
 * ========================================================================= */

.gw-footer {
	padding-top: 32px !important;
	padding-bottom: 16px !important;
}
.gw-footer__divider {
	margin: 16px 0 !important;
	height: 1px;
	background: rgba(255, 255, 255, 0.08);
	border: 0;
}
/* Kill the wp:group blockGap that wraps each separator with another 32px */
.gw-footer > * {
	margin-block-start: 16px !important;
	margin-block-end: 0 !important;
}
.gw-footer > *:first-child {
	margin-block-start: 0 !important;
}

/* Footer logo: cap at 48px tall so it sits the same scale as the header logo */
.gw-footer__logo {
	margin: 0 0 8px 0 !important;
}
.gw-footer__logo img {
	max-width: 200px;
	width: auto;
	max-height: 48px;
	height: 48px;
}
@media (max-width: 540px) {
	.gw-footer__logo img {
		max-height: 40px;
		height: 40px;
	}
}

/* ===========================================================================
 * FAQ accordion (native <details>/<summary> with violet +/- toggle)
 *
 * Centralized in v1.0.11 to replace the inline <style> blocks that 50
 * sales-voice pages previously each carried their own copy of. Markup
 * convention (used by all current pages + the glenwood/faq-accordion
 * pattern): <div class="gw-faq"> > <details class="gw-faq__item">
 *   > <summary class="gw-faq__q">Question</summary>
 *   > <div class="gw-faq__a"><p>Answer</p></div>
 * </details>
 * ========================================================================= */

.gw-faq {
	max-width: 800px;
	margin: 0 auto;
}
.gw-faq__item {
	border-bottom: 1px solid var(--wp--preset--color--light-gray);
	padding: 1.5rem 0;
}
.gw-faq__item:first-child {
	border-top: 1px solid var(--wp--preset--color--light-gray);
}
.gw-faq__q {
	font-family: var(--wp--preset--font-family--geist);
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
	cursor: pointer;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	padding-right: 0.25rem;
}
.gw-faq__q::-webkit-details-marker { display: none; }
.gw-faq__q::after {
	content: '+';
	font-weight: 400;
	font-size: 1.5rem;
	color: var(--wp--preset--color--violet);
	transition: transform 200ms ease;
	flex-shrink: 0;
	min-width: 1.5rem;
	text-align: center;
}
.gw-faq__item[open] .gw-faq__q::after {
	/* Unicode MINUS SIGN U+2212 - escape-encoded to avoid mojibake when this
	   CSS is shipped through PowerShell-touching pipelines that mis-decode
	   non-ASCII without a BOM (see memory feedback-powershell-encoding). */
	content: '\2212';
}
.gw-faq__item[open] .gw-faq__q {
	color: var(--wp--preset--color--violet);
}
.gw-faq__a {
	margin-top: 1rem;
	color: var(--wp--preset--color--dark-gray);
}
.gw-faq__a p {
	font-size: 1rem;
	line-height: 1.7;
	margin: 0;
}
.gw-faq__q:focus-visible {
	outline: 2px solid var(--wp--preset--color--violet);
	outline-offset: 4px;
	border-radius: 2px;
}