/*
Theme Name: GeneratePress Child
Theme URI: https://green-racks.com.au/
Description: Green Racks site customisations on top of GeneratePress.
Author: Green Racks
Template: generatepress
Version: 1.0.0
Text Domain: generatepress-child
*/

/* ---------- Floating header: pin the branding row + menu bar to the top,
   full size, while scrolling. position:sticky keeps it in normal flow, so
   there is no content jump. ---------- */
.gr-floating-header {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 999;
	background-color: #ffffff;
	box-shadow: 0 2px 8px rgba(20, 37, 59, 0.08);
}

/* Sit below the WordPress admin bar for logged-in users (no effect for visitors). */
.admin-bar .gr-floating-header {
	top: 32px;
}
@media screen and (max-width: 782px) {
	.admin-bar .gr-floating-header {
		top: 46px;
	}
}

/* ---------- Primary nav: centred menu + right-aligned CTAs ---------- */
.gr-nav-extras {
	display: flex;
	align-items: center;
	gap: 0.6rem;
}
.gr-quote-btn {
	display: inline-block;
	background-color: #F59E0B;
	color: #14253B;
	font-weight: 600;
	padding: 0.5em 1em;
	border-radius: 4px;
	text-decoration: none;
	line-height: 1.2;
	white-space: nowrap;
}
.gr-quote-btn:hover,
.gr-quote-btn:focus {
	background-color: #d98a06;
	color: #14253B;
}
.gr-phone {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.4em;
	height: 2.4em;
	border-radius: 50%;
	color: #0d4d2c;
	border: 1px solid #E5E7EB;
	text-decoration: none;
	flex: 0 0 auto;
}
.gr-phone svg { fill: currentColor; display: block; }

/* .gr-phone lives inside .main-navigation, where GeneratePress's
   `.main-navigation a { display: block }` (specificity 0-1-1) outranks the
   plain `.gr-phone` class (0-1-0) and forces display:block — which silently
   kills the flex centering, pinning the 18x18 SVG to the top-left of the
   circle. Re-assert flex on a nav-scoped selector (0-2-0) so the icon centres
   intrinsically. Width/height stay on the lower-specificity rules so the
   mobile size override still wins. */
.main-navigation .gr-phone {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.gr-phone:hover,
.gr-phone:focus {
	background-color: #0d4d2c;
	color: #ffffff;
	border-color: #0d4d2c;
}

/* Desktop: flex bar so the menu centres and the CTAs sit at the right edge. */
@media (min-width: 769px) {
	.main-navigation .inside-navigation {
		display: flex;
		align-items: center;
	}
	.main-navigation .gr-nav-spacer { flex: 1 1 0; }
	.main-navigation .main-nav { flex: 0 1 auto; }
	.main-navigation .main-nav > ul {
		display: flex;
		justify-content: center;
	}
	.main-navigation .gr-nav-extras {
		flex: 1 1 0;
		justify-content: flex-end;
		margin-right: 20px;
	}
}

/* Mobile: keep CTAs pinned right of the toggle bar; hide the balancing spacer. */
@media (max-width: 768px) {
	.main-navigation .gr-nav-spacer { display: none; }
	.main-navigation .inside-navigation { position: relative; }
	.main-navigation .gr-nav-extras {
		position: absolute;
		top: 50%;
		right: 12px;
		transform: translateY(-50%);
		z-index: 5;
	}
}

/* ===== Montserrat (self-hosted) — Proxima Nova alternative, applied site-wide ===== */
@font-face {
	font-family: 'Montserrat';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('fonts/montserrat-400.woff2') format('woff2');
}
@font-face {
	font-family: 'Montserrat';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('fonts/montserrat-600.woff2') format('woff2');
}
@font-face {
	font-family: 'Montserrat';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('fonts/montserrat-700.woff2') format('woff2');
}
@font-face {
	font-family: 'Montserrat';
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url('fonts/montserrat-800.woff2') format('woff2');
}

:root {
	--gr-font-sans: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* Main text site-wide. */
body,
button,
input,
select,
optgroup,
textarea,
.main-navigation .main-nav ul li a,
.menu-toggle,
.gr-quote-btn {
	font-family: var(--gr-font-sans);
}

/* Headings site-wide. */
h1, h2, h3, h4, h5, h6,
.entry-title,
.site-title {
	font-family: var(--gr-font-sans);
	font-weight: 700;
}

/* Page & post titles: larger and bolder so they stand out. */
.entry-title,
.page-header .entry-title,
h1.entry-title,
.site-main h1 {
	font-size: clamp(2rem, 1.4rem + 2.4vw, 2.75rem);
	font-weight: 800;
	line-height: 1.15;
}
.entry-content h2,
.site-main h2 {
	font-size: clamp(1.5rem, 1.2rem + 1.4vw, 2rem);
	font-weight: 700;
	line-height: 1.2;
}

/* Header nav titles: larger + bolder to fill the bar and stand out. */
.main-navigation .main-nav ul li a {
	font-size: 1.1rem;
	font-weight: 600;
	letter-spacing: 0.005em;
}

/* ===================== Green Racks brand colour system ===================== */
:root {
	--gr-green: #0BAF4F;       /* bright logo green: hovers, accents, borders */
	--gr-green-dark: #0d4d2c;  /* primary: links + button fills (white text safe) */
	--gr-navy: #14253B;        /* nav bar, footer, headings */
	--gr-navy-2: #1d3354;      /* submenu / hover surfaces on navy */
	--gr-amber: #F59E0B;       /* CTA */
	--gr-border: #E5E7EB;
}

/* Body + content links */
body { background-color: #DDE2E7; }
a { color: var(--gr-green-dark); }
a:hover, a:focus { color: var(--gr-green); }
::selection { background-color: var(--gr-green); color: #ffffff; }

/* Headings navy, with a green accent bar under single page/post titles */
h1, h2, h3, h4, h5, h6, .entry-title { color: var(--gr-navy); }
.site-title a { color: var(--gr-navy); }
.single .entry-title::after,
.page .entry-title::after {
	content: "";
	display: block;
	width: 64px;
	height: 4px;
	margin-top: 0.45rem;
	background-color: var(--gr-green);
	border-radius: 2px;
}

/* Buttons (core, blocks, GenerateBlocks, forms): green fill, bright-green hover */
button:not(.menu-toggle),
.button,
input[type="submit"],
input[type="button"],
.wp-block-button__link,
.gb-button,
.wpforms-submit,
.wpcf7-submit {
	background-color: var(--gr-green-dark);
	color: #ffffff;
	border-color: var(--gr-green-dark);
}
button:not(.menu-toggle):hover,
.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.wp-block-button__link:hover,
.gb-button:hover,
.wpforms-submit:hover,
.wpcf7-submit:hover {
	background-color: var(--gr-green);
	border-color: var(--gr-green);
	color: #14253B;
}

/* Form field focus ring */
input:focus, textarea:focus, select:focus {
	border-color: var(--gr-green);
	box-shadow: 0 0 0 3px rgba(11, 175, 79, 0.18);
	outline: none;
}
blockquote { border-left: 4px solid var(--gr-green); }

/* ---- Header chrome: white branding row, navy menu bar, green underline ---- */
#masthead.site-header { background-color: #ffffff; }
.gr-floating-header { border-bottom: 3px solid var(--gr-green); }
.gr-floating-header .main-navigation { background-color: var(--gr-navy); }

/* Nav links: white, bright-green on hover/active */
.main-navigation .main-nav ul li a { color: #ffffff; }
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li a:focus,
.main-navigation .main-nav ul li[class*="current-menu"] > a {
	color: var(--gr-green);
}
.main-navigation .menu-toggle,
.main-navigation .menu-toggle .mobile-menu {
	background-color: transparent;
	color: #ffffff;
}

/* Dropdown submenus on the navy bar */
.main-navigation .main-nav ul ul { background-color: var(--gr-navy-2); }
.main-navigation .main-nav ul ul li a { color: #ffffff; }
.main-navigation .main-nav ul ul li a:hover,
.main-navigation .main-nav ul ul li[class*="current-menu"] > a {
	color: var(--gr-green);
	background-color: rgba(255, 255, 255, 0.05);
}

/* Phone icon recoloured for the navy bar */
.gr-phone {
	color: #ffffff;
	border-color: rgba(255, 255, 255, 0.45);
}
.gr-phone:hover, .gr-phone:focus {
	background-color: var(--gr-green);
	border-color: var(--gr-green);
	color: #14253B;
}

/* ---- Footer: navy with light text and green link hover ---- */
.site-footer,
.footer-widgets,
.site-info,
.inside-site-info {
	background-color: var(--gr-navy);
	color: rgba(255, 255, 255, 0.85);
}
.footer-widgets .widget-title { color: #ffffff; }
.site-footer a, .footer-widgets a, .site-info a { color: #ffffff; }
.site-footer a:hover, .footer-widgets a:hover, .site-info a:hover { color: var(--gr-green); }

/* Force the WordPress 'accent' colour utility classes to brand green.
   A stock-blue (#1e73be) :root palette block is still emitted alongside the
   brand one, so var(--accent) is order-dependent; these win outright. */
:root { --accent: #0d4d2c; }
.has-accent-color { color: #0d4d2c !important; }
.has-accent-background-color { background-color: #0d4d2c !important; }
.has-accent-border-color { border-color: #0d4d2c !important; }

/* ===================== Mobile (<=768px) layout polish — 2026-06-25 =====================
   Phone-view fixes:
   - Several content headings carried fixed inline rem sizes (e.g. 5rem "Services",
     4rem "Built for Perth businesses", 2.5rem "Latency matters") that did not scale
     down, so on a phone single words broke mid-line. Capped responsively below.
     Inline styles can only be overridden with !important.
   - Header branding row + nav bar were oversized (~267px tall) and the "Menu" toggle
     collided with the "Get a Quote" button. Logo shrunk, toggle left-aligned, CTAs
     made compact so the bar reads cleanly. Desktop is untouched (scoped to <=768px). */
@media (max-width: 768px) {

	/* ---- Compact header ---- */
	.gr-floating-header .site-logo img.header-image {
		max-height: 48px;
		width: auto;
		height: auto;
	}
	.gr-floating-header .inside-header,
	.gr-floating-header .site-branding-container {
		padding-top: 8px;
		padding-bottom: 8px;
	}
	.gr-floating-header .site-title {
		font-size: 1.3rem;
		line-height: 1.15;
	}

	/* ---- Nav bar: hamburger far-left, compact CTAs far-right (no overlap) ---- */
	.main-navigation .menu-toggle {
		text-align: left;
		justify-content: flex-start;
		padding-left: 20px;
	}
	.main-navigation .gr-nav-extras {
		right: 10px;
		gap: 0.4rem;
	}
	.gr-quote-btn {
		padding: 0.45em 0.7em;
		font-size: 0.9rem;
	}
	.gr-phone {
		width: 2.1em;
		height: 2.1em;
	}

	/* ---- Headings: cap oversized inline sizes so words don't break mid-line ---- */
	.site-main h2,
	.entry-content h2 {
		font-size: clamp(1.55rem, 6vw, 2.3rem) !important;
		line-height: 1.2 !important;
		word-break: normal;
	}
	.site-main h3[style*="font-size:2.5rem"],
	.site-main h3[style*="font-size:2.3rem"],
	.entry-content h3[style*="font-size:2.5rem"],
	.entry-content h3[style*="font-size:2.3rem"] {
		font-size: clamp(1.3rem, 5vw, 1.75rem) !important;
		line-height: 1.25 !important;
	}
	.rank-math-question {
		font-size: 1.2rem !important;
		line-height: 1.3 !important;
	}
}

/* ---- Collapse stacked group padding on phones (2026-06-25) ----
   Section content was squished to ~57% width: an alignfull section (24px L/R)
   wrapping two nested group inner-containers (30px L/R each) stacked to 84px of
   inset per side. Fine on a 1240px desktop, far too much at 390px. Drop the
   nested inner-container side padding and keep one comfortable gutter on the
   outermost full-width sections so backgrounds still run edge-to-edge. */
@media (max-width: 768px) {
	.entry-content .wp-block-group__inner-container {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	.entry-content .wp-block-group.alignfull,
	.entry-content > .wp-block-group {
		padding-left: 18px !important;
		padding-right: 18px !important;
	}
}

/* ---- Keep header CTAs in the top nav row when the mobile menu is open (2026-06-25).
   The extras were centred with top:50% against .inside-navigation, which grows tall
   when the menu opens, dropping them into the middle of the menu list. Pin them to
   the 60px toggle row instead so they stay put. ---- */
@media (max-width: 768px) {
	.main-navigation .gr-nav-extras {
		top: 0;
		height: 60px;
		transform: none;
	}
}

/* ============================================================
   Homepage "Services" cards — layout/typography fix (2026-07-03)
   Symptoms: at desktop the 4-up columns block crammed all four
   cards onto one row (flex-wrap:nowrap), crushing width so long
   words broke mid-line ("WordPres s", "Dedicate d"), body text
   wrapped 2-3 words per line, and card heights were uneven.
   Two root causes, both fixed here:
     1) flex-wrap:nowrap forced 4-across from 781px up. Replaced
        with an explicit responsive grid: 4-up >=1200px, 2-up
        768-1199px, 1-col <768px. (auto-fit was unusable here -
        the block's container is capped at ~1080px so auto-fit
        could not distinguish 4-up from 2-up by width alone.)
     2) .wp-block-group__inner-container carries its own ~40px
        padding on top of the card's padding at desktop, so the
        text column was squeezed to ~half the card width. Zeroed
        it; the card padding lives on the outer group (24px).
   Also equalises card height and pins each CTA to the bottom.
   Scoped to the homepage (.page-id-13) and, via :has(), to the
   single columns block holding the bordered service cards
   (:not(.alignwide) excludes the hero, whose right column also
   contains a bordered group) - no global selectors, no content
   edits (avoids the editor-clobber / kses gotchas on page 13).
   ============================================================ */
.page-id-13 .wp-block-columns:not(.alignwide):has(> .wp-block-column > .wp-block-group.has-border-color) {
	display: grid;
	grid-template-columns: 1fr; /* phones: single column */
	gap: 24px;
}
@media (min-width: 768px) {
	.page-id-13 .wp-block-columns:not(.alignwide):has(> .wp-block-column > .wp-block-group.has-border-color) {
		grid-template-columns: repeat(2, 1fr); /* laptop/tablet: 2x2 */
	}
}
@media (min-width: 1200px) {
	.page-id-13 .wp-block-columns:not(.alignwide):has(> .wp-block-column > .wp-block-group.has-border-color) {
		grid-template-columns: repeat(4, 1fr); /* wide desktop: 4-up */
	}
}

/* each column becomes a flex track so its card stretches to full row height */
.page-id-13 .wp-block-columns:not(.alignwide):has(> .wp-block-column > .wp-block-group.has-border-color) > .wp-block-column {
	display: flex;
	margin: 0;
	min-width: 0;
}

/* the card: full-height flex column with comfortable padding */
.page-id-13 .wp-block-columns:not(.alignwide):has(> .wp-block-column > .wp-block-group.has-border-color) > .wp-block-column > .wp-block-group.has-border-color {
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 24px !important; /* override the inline 2rem */
}

/* inner container: fill the card, drop its stacked padding so text uses full width */
.page-id-13 .wp-block-columns:not(.alignwide):has(> .wp-block-column > .wp-block-group.has-border-color) .wp-block-group__inner-container {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	width: 100%;
	padding: 0 !important; /* remove the ~40px inner padding that crushed the text column */
}

/* CTA (last paragraph) pinned to the bottom so every CTA aligns */
.page-id-13 .wp-block-columns:not(.alignwide):has(> .wp-block-column > .wp-block-group.has-border-color) .wp-block-group__inner-container > p:last-child {
	margin-top: auto !important;
}

/* stop mid-word breaks in headings; override .site-content{word-wrap:break-word} */
.page-id-13 .wp-block-columns:not(.alignwide):has(> .wp-block-column > .wp-block-group.has-border-color) h3.wp-block-heading {
	overflow-wrap: normal;
	word-wrap: normal;
	word-break: normal;
	hyphens: none;
	line-height: 1.3;
}

/* readable body copy, full card width */
.page-id-13 .wp-block-columns:not(.alignwide):has(> .wp-block-column > .wp-block-group.has-border-color) .wp-block-group__inner-container > p {
	overflow-wrap: normal;
	word-wrap: normal;
	word-break: normal;
	line-height: 1.6 !important; /* override the inline 1.75 */
}

/* ============================================================
   .gr-cards — shared card/column layout fix (2026-07-03)
   ONE reusable class for every card/column section across the
   site (service pricing/config cards, "how it works", "who this
   is for", founders, principles, etc). Applied to the wrapping
   core `wp:columns` block on each affected section.

   Fixes the shared crushing: core columns render with
   flex-wrap:nowrap, cramming all N cards onto one row from 782px
   up so columns collapse and long words break mid-line (worst
   pages hit one character per line). Grid replaces that; the
   .wp-block-group__inner-container's own ~40px padding (which
   stacked on the card padding and squeezed the text column) is
   zeroed here too.

   Layout/typography only - never touches border colours (card
   highlights), backgrounds, status labels, prices, copy or links.
   ============================================================ */
.gr-cards {
	display: grid !important; /* beat core .wp-block-columns-is-layout-flex{display:flex} */
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
	gap: 24px !important;
}

/* columns become equal-height flex tracks (min-width:0 lets them shrink) */
.gr-cards > .wp-block-column {
	display: flex;
	flex-direction: column;
	margin: 0;
	min-width: 0;
}

/* bordered card group: fill the track height, comfortable padding */
.gr-cards > .wp-block-column > .wp-block-group {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 24px !important; /* override the inline 1.5rem/2rem; preserves border/bg */
}

/* inner container: fill the card, drop its stacked ~40px padding so text uses full width */
.gr-cards .wp-block-group__inner-container {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	width: 100%;
	padding: 0 !important;
}

/* pin a footer button row (if any) to the bottom so CTAs align; inert on cards without one */
.gr-cards .wp-block-group__inner-container > .wp-block-buttons:last-child,
.gr-cards > .wp-block-column > .wp-block-buttons:last-child {
	margin-top: auto !important;
}

/* stop mid-word/one-char breaks; let headings and body use full card width */
.gr-cards :is(h1, h2, h3, h4, h5, h6, p, li, ul, ol, a) {
	overflow-wrap: normal;
	word-wrap: normal;
	word-break: normal;
	hyphens: none;
}
.gr-cards :is(h2, h3, h4, h5, h6) {
	line-height: 1.3;
}
.gr-cards :is(p, li) {
	line-height: 1.6;
}

/* ===================== Pricing pages: Buy Now CTA + WP-hosting accordion ===================== */

/* Buy Now button (gr-buynow): amber CTA to match "Get a quote", deliberate amber-darken hover */
.gr-buynow .wp-block-button__link {
	background-color: var(--gr-amber);
	color: #14253B;
	border-color: var(--gr-amber);
}
.gr-buynow .wp-block-button__link:hover,
.gr-buynow .wp-block-button__link:focus {
	background-color: #d97706;
	border-color: #d97706;
	color: #14253B;
}
/* full-width, solid tap target when cards stack on mobile */
@media (max-width: 768px) {
	.gr-buynow,
	.gr-buynow .wp-block-button__link {
		width: 100%;
		text-align: center;
	}
}

/* Native <details> accordion for the Managed WordPress hosting blocks — no JS */
.gr-wp-details {
	border: 1px solid var(--gr-border);
	border-radius: 8px;
	background-color: #F6F7F8;
	margin: 0.25rem 0 1rem;
	overflow: hidden;
}
.gr-wp-details > summary {
	cursor: pointer;
	list-style: none;
	padding: 0.7rem 2rem 0.7rem 0.9rem;
	position: relative;
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--gr-green-dark);
	line-height: 1.4;
}
.gr-wp-details > summary::-webkit-details-marker { display: none; }
.gr-wp-details > summary::after {
	content: "";
	position: absolute;
	right: 0.9rem;
	top: 50%;
	width: 0.5rem;
	height: 0.5rem;
	margin-top: -0.35rem;
	border-right: 2px solid var(--gr-green-dark);
	border-bottom: 2px solid var(--gr-green-dark);
	transform: rotate(45deg);
	transition: transform 0.15s ease;
}
.gr-wp-details[open] > summary::after {
	transform: rotate(-135deg);
	margin-top: -0.1rem;
}
.gr-wp-details[open] > summary { border-bottom: 1px solid var(--gr-border); }
.gr-wp-details > summary:focus-visible {
	outline: 2px solid var(--gr-green);
	outline-offset: 2px;
}
.gr-wp-details__body { padding: 0.75rem 0.9rem 0.9rem; }
.gr-wp-details__body ul {
	margin: 0;
	padding-left: 1.1rem;
	font-size: 0.86rem;
	line-height: 1.6;
	color: #374151;
}
.gr-wp-details__body li { margin: 0.15rem 0; }
.gr-wp-details__lead {
	margin: 0 0 0.5rem;
	font-size: 0.84rem;
	color: #4b5563;
	font-style: italic;
}
.gr-wp-details__not {
	margin: 0.6rem 0 0;
	font-size: 0.8rem;
	line-height: 1.5;
	color: #4b5563;
}

/* ===================== v2 HEADER — horizontal lockup + slim single-row bar (2026-07-21)
   Collapses the old two-bar header (white branding row + navy nav bar, ~283px) into one
   slim light band. Logo = brand-kit horizontal lockup. Kit colours: Ink Navy #17212B text,
   Primary Green #1E9E4A hover/rule, Mist #EAF1EC hover surface. No GP nav-position change:
   .gr-floating-header is flexed so #masthead (logo) + .main-navigation (menu) share one row.
   ===================================================================================== */
:root { --gr-ink: #17212B; --gr-primary: #1E9E4A; --gr-mist: #EAF1EC; }

/* Light band + thin green rule (matches the brand-kit header) */
.gr-floating-header {
	background-color: #ffffff;
	border-bottom: 2px solid var(--gr-primary);
	box-shadow: 0 1px 6px rgba(23, 33, 43, 0.06);
}
#masthead.site-header { background-color: #ffffff; }
.gr-floating-header .main-navigation { background-color: transparent !important; }

/* Redundant text site-title off (lockup carries the wordmark; img alt keeps a11y) */
.site-branding { display: none !important; }

/* Single row: logo left, nav right */
.gr-floating-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-left: 24px;
	padding-right: 24px;
	column-gap: 1rem;
}
.gr-floating-header > #masthead { flex: 0 0 auto; }
.gr-floating-header > .main-navigation { flex: 1 1 auto; min-width: 0; }
.gr-floating-header .inside-header {
	display: flex;
	align-items: center;
	padding-top: 12px;    /* resting vertical padding */
	padding-bottom: 12px;
}
.gr-floating-header .site-branding-container { margin: 0; padding: 0; }
.gr-floating-header .site-logo { display: flex; align-items: center; line-height: 0; }

/* Logo render size — resting 40px, transition for the shrink */
.gr-floating-header .site-logo img,
.gr-floating-header img.header-image,
.gr-floating-header .custom-logo {
	height: 40px !important;
	width: auto !important;
	max-width: none !important;
	max-height: none !important;
	display: block;
	transition: height 0.18s ease;
}

/* Nav on the right, transparent, Ink-Navy links / Primary-Green hover */
.gr-floating-header .main-navigation .inside-navigation.grid-container {
	max-width: none;
	padding: 0;
}
/* !important beats GeneratePress's inline Customizer nav-colour CSS (printed in wp_head
   after this stylesheet); without it the links stayed white and vanished on the new white band. */
.main-navigation .main-nav ul li a { color: var(--gr-ink) !important; }
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li a:focus,
.main-navigation .main-nav ul li[class*="current-menu"] > a { color: var(--gr-primary) !important; }
.main-navigation .menu-toggle,
.main-navigation .menu-toggle .mobile-menu,
.main-navigation .menu-toggle .gp-icon { color: var(--gr-ink) !important; }

/* Dropdown submenu: light card, navy text, mist hover — opens below the slimmer bar */
.main-navigation .main-nav ul ul {
	background-color: #ffffff !important;  /* beat GP inline submenu bg (navy) */
	border: 1px solid #E5E7EB;
	box-shadow: 0 6px 18px rgba(23, 33, 43, 0.10);
}
.main-navigation .main-nav ul ul li a { color: var(--gr-ink) !important; }
.main-navigation .main-nav ul ul li a:hover,
.main-navigation .main-nav ul ul li a:focus,
.main-navigation .main-nav ul ul li[class*="current-menu"] > a {
	color: var(--gr-primary) !important;
	background-color: var(--gr-mist) !important;
}

/* No gap between header and first section */
#content.site-content, .site-content { margin-top: 0 !important; }

/* Desktop nav layout: menu + CTAs hug the right */
@media (min-width: 769px) {
	.gr-floating-header .main-navigation .inside-navigation {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		gap: 1.5rem;
	}
	.main-navigation .gr-nav-spacer { display: none !important; }
	.main-navigation .main-nav { flex: 0 1 auto; }
	.main-navigation .main-nav > ul { display: flex; justify-content: flex-end; }
	.main-navigation .gr-nav-extras { flex: 0 0 auto; margin-right: 0; }
	/* bound nav link vertical footprint so the shrink can actually reach <=56px */
	.gr-floating-header .main-nav ul li a { padding-top: 10px; padding-bottom: 10px; line-height: 1.2; }
	.gr-floating-header.gr-shrink .main-nav ul li a { padding-top: 6px; padding-bottom: 6px; }
	.gr-floating-header.gr-shrink .gr-quote-btn { padding-top: 0.3em; padding-bottom: 0.3em; }
	.gr-floating-header.gr-shrink .gr-phone { width: 2em; height: 2em; }
}

/* Scrolled shrink (JS toggles .gr-shrink): <=56px, logo 32px, padding 8px */
.gr-floating-header .inside-header { transition: padding 0.18s ease; }
.gr-floating-header.gr-shrink .inside-header { padding-top: 8px; padding-bottom: 8px; }
.gr-floating-header.gr-shrink .site-logo img,
.gr-floating-header.gr-shrink img.header-image,
.gr-floating-header.gr-shrink .custom-logo { height: 32px !important; }

/* Mobile: <=60px. The lockup is too wide next to a hamburger + CTA, so clip the logo
   to its square badge (leftmost ~46px) via an overflow wrapper — keeps the CTA, on-brand,
   no second asset. Badge is square (129x129 in the master) => ~40px wide at 40px tall. */
@media (max-width: 768px) {
	.gr-floating-header { padding-left: 16px; padding-right: 16px; align-items: center; }
	.gr-floating-header .inside-header { padding-top: 6px; padding-bottom: 6px; }
	.gr-floating-header .site-branding-container { padding: 0 !important; margin: 0 !important; }
	.gr-floating-header .main-navigation { padding-top: 0 !important; padding-bottom: 0 !important; }
	.gr-floating-header .main-navigation .inside-navigation.grid-container { padding-top: 0 !important; padding-bottom: 0 !important; }
	.gr-nav-extras .gr-quote-btn { padding: 0.4em 0.7em; font-size: 0.9rem; }
	.gr-floating-header .site-logo { width: 46px; height: 40px; overflow: hidden; }
	.gr-floating-header .site-logo img,
	.gr-floating-header img.header-image,
	.gr-floating-header .custom-logo { height: 40px !important; width: auto !important; max-width: none !important; }
	.gr-floating-header.gr-shrink .site-logo { height: 34px; }
	.gr-floating-header.gr-shrink .site-logo img,
	.gr-floating-header.gr-shrink img.header-image,
	.gr-floating-header.gr-shrink .custom-logo { height: 34px !important; }

	/* nav hugs the right and sizes to content; single nowrap row (kill old absolute layout) */
	.gr-floating-header > .main-navigation { flex: 0 0 auto; min-width: 0; }
	.gr-floating-header .main-navigation .inside-navigation {
		display: flex;
		flex-wrap: nowrap;
		align-items: center;
		justify-content: flex-end;
		gap: 0.5rem;
		position: static;
	}
	.main-navigation .gr-nav-spacer { display: none !important; }
	.main-navigation .gr-nav-extras {
		position: static !important;
		transform: none !important;
		top: auto !important;
		right: auto !important;
		height: auto !important;
		margin: 0 !important;
		gap: 0.4rem;
		flex: 0 0 auto;
	}
	/* icon-only hamburger, exact 44x44 tap target */
	.main-navigation .menu-toggle {
		position: static;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		min-width: 44px;
		height: 44px;
		min-height: 44px;
		padding: 0;
		flex: 0 0 auto;
		order: 3;
	}
	.main-navigation .menu-toggle .mobile-menu { display: none; }
	/* opened mobile menu = full-width panel below the bar (doesn't grow the header row) */
	.main-navigation { position: static; }
	.main-navigation.toggled .main-nav {
		position: absolute;
		left: 0;
		right: 0;
		top: 100%;
		background-color: #ffffff;
		border-top: 1px solid #E5E7EB;
		box-shadow: 0 8px 18px rgba(23, 33, 43, 0.12);
		z-index: 60;
	}
	.main-navigation.toggled .main-nav ul li a { color: var(--gr-ink) !important; }
}

/* ============ Site-wide visual life (2026-07-21) — on-brand depth, colour, scroll motion ============
   Goal: kill the flat white/grey feel with brand-pack colour + depth + subtle scroll reveal.
   Content/markup untouched — this is a pure CSS/JS presentation layer, fully reversible. */
:root { --gr-deep: #0E7A38; --gr-lime: #3FD07A; --gr-slate: #64748B; }
/* (--gr-primary #1E9E4A, --gr-mist #EAF1EC, --gr-ink #17212B defined in the v2 HEADER block) */

/* 1. SECTION BACKGROUNDS — replace flat grey with a warm Mist gradient; enrich navy + green blocks.
   Scoped to full-bleed sections (.alignfull); grey cards recolour to solid Mist. */
.entry-content .wp-block-group.alignfull.has-background[style*="background-color:#DDE2E7"] {
	background: linear-gradient(180deg, #EAF1EC 0%, #F5F9F6 100%) !important;
}
.entry-content .wp-block-group.has-background[style*="background-color:#DDE2E7"]:not(.alignfull) {
	background-color: #EAF1EC !important;
}
.entry-content .wp-block-group.alignfull.has-background[style*="background-color:#14253B"] {
	background: linear-gradient(157deg, #17212B 0%, #0f1a22 100%) !important;
}
.entry-content .wp-block-group.alignfull.has-background[style*="background-color:#0d4d2c"] {
	background: linear-gradient(118deg, #0E7A38 0%, #1E9E4A 100%) !important;
}
/* hairline brand rule where two white sections stack, for crisp depth without a colour change */
.entry-content .wp-block-group.alignfull.has-background[style*="background-color:#ffffff"] + .wp-block-group.alignfull.has-background[style*="background-color:#ffffff"] {
	border-top: 1px solid #E9EEF0;
}

/* 2. CARD DEPTH + interactive lift (on-brand green edge on hover) */
.entry-content .wp-block-group.has-border-color.has-background {
	box-shadow: 0 1px 2px rgba(23, 33, 43, 0.05), 0 10px 28px rgba(23, 33, 43, 0.05);
	transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}
.entry-content .wp-block-group.has-border-color.has-background:hover {
	transform: translateY(-4px);
	box-shadow: 0 4px 10px rgba(23, 33, 43, 0.08), 0 20px 44px rgba(23, 33, 43, 0.10);
	border-color: var(--gr-primary) !important;
}

/* 3. SCROLL REVEAL — each section's content fades + rises in. Hidden state is gated on html.gr-motion,
   which the script adds ONLY when motion is allowed; if JS/observer fail, content stays visible. */
@media (prefers-reduced-motion: no-preference) {
	html.gr-motion .entry-content .wp-block-group.alignfull > .wp-block-group,
	html.gr-motion .entry-content .wp-block-group.alignfull > .wp-block-columns {
		opacity: 0;
		transform: translateY(20px);
		transition: opacity 0.7s cubic-bezier(0.2, 0.6, 0.2, 1), transform 0.7s cubic-bezier(0.2, 0.6, 0.2, 1);
		will-change: opacity, transform;
	}
	html.gr-motion .entry-content .wp-block-group.alignfull > .wp-block-group.gr-in,
	html.gr-motion .entry-content .wp-block-group.alignfull > .wp-block-columns.gr-in {
		opacity: 1;
		transform: none;
	}
}

/* ===== Buttons: orange/amber (#F59E0B) -> brand Deep Green #0E7A38, white text (2026-07-21) ===== */
.gr-quote-btn,
.gr-quote-btn:link,
.gr-quote-btn:visited { background-color: #0E7A38 !important; color: #ffffff !important; }
.gr-quote-btn:hover,
.gr-quote-btn:focus { background-color: #0d4d2c !important; color: #ffffff !important; }

.wp-block-button__link[style*="background-color:#F59E0B"] {
	background-color: #0E7A38 !important;
	color: #ffffff !important;
	border-color: #0E7A38 !important;
}
.wp-block-button__link[style*="background-color:#F59E0B"]:hover,
.wp-block-button__link[style*="background-color:#F59E0B"]:focus {
	background-color: #0d4d2c !important;
	color: #ffffff !important;
}

.gr-buynow .wp-block-button__link {
	background-color: #0E7A38 !important;
	color: #ffffff !important;
	border-color: #0E7A38 !important;
}
.gr-buynow .wp-block-button__link:hover,
.gr-buynow .wp-block-button__link:focus {
	background-color: #0d4d2c !important;
	color: #ffffff !important;
}

/* ===== Header nav: force menu + Get-a-Quote onto ONE row (beats GP inline head CSS) 2026-07-21 ===== */
@media (min-width: 769px) {
	.gr-floating-header .main-navigation .inside-navigation {
		display: flex !important;
		flex-flow: row nowrap !important;
		align-items: center !important;
		justify-content: flex-end !important;
		gap: 1.5rem;
	}
	.gr-floating-header .main-navigation .inside-navigation > .main-nav {
		order: 1;
		flex: 0 1 auto !important;
		float: none !important;
		width: auto !important;
	}
	.gr-floating-header .main-navigation .inside-navigation > .gr-nav-extras {
		order: 2;
		flex: 0 0 auto !important;
		display: flex !important;
		float: none !important;
	}
	.gr-floating-header .main-navigation .inside-navigation > .main-nav > ul {
		display: flex !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
	}
}

/* ===== Buttons on dark/green CTA bands -> white, so nothing is green-on-green ===== */
.entry-content .wp-block-group.alignfull[style*="background-color:#0d4d2c"] .wp-block-button__link:not([style*="background-color:transparent"]),
.entry-content .wp-block-group.alignfull[style*="background-color:#0e7a38"] .wp-block-button__link:not([style*="background-color:transparent"]),
.entry-content .wp-block-group.alignfull[style*="background-color:#14253B"] .wp-block-button__link:not([style*="background-color:transparent"]) {
	background-color: #ffffff !important;
	color: #0E7A38 !important;
	border-color: #ffffff !important;
}
.entry-content .wp-block-group.alignfull[style*="background-color:#0d4d2c"] .wp-block-button__link:not([style*="background-color:transparent"]):hover,
.entry-content .wp-block-group.alignfull[style*="background-color:#0e7a38"] .wp-block-button__link:not([style*="background-color:transparent"]):hover,
.entry-content .wp-block-group.alignfull[style*="background-color:#14253B"] .wp-block-button__link:not([style*="background-color:transparent"]):hover {
	background-color: #EAF1EC !important;
	color: #0d4d2c !important;
}
/* outline/secondary buttons on those bands -> transparent with white border + text */
.entry-content .wp-block-group.alignfull[style*="background-color:#0d4d2c"] .wp-block-button__link[style*="background-color:transparent"],
.entry-content .wp-block-group.alignfull[style*="background-color:#14253B"] .wp-block-button__link[style*="background-color:transparent"] {
	background-color: transparent !important;
	color: #ffffff !important;
	border-color: #ffffff !important;
}
.entry-content .wp-block-group.alignfull[style*="background-color:#0d4d2c"] .wp-block-button__link[style*="background-color:transparent"]:hover,
.entry-content .wp-block-group.alignfull[style*="background-color:#14253B"] .wp-block-button__link[style*="background-color:transparent"]:hover {
	background-color: rgba(255, 255, 255, 0.14) !important;
	color: #ffffff !important;
}

.gr-floating-header .main-nav ul li a{white-space:nowrap;}

/* Nav fit: slightly tighten desktop nav so menu + Get-a-Quote clear the wide logo on smaller desktops */
@media (min-width: 769px) {
	.gr-floating-header .main-nav ul li a { font-size: 1rem !important; padding-left: 0.55rem !important; padding-right: 0.55rem !important; letter-spacing: 0 !important; }
	.gr-floating-header .main-navigation .inside-navigation { gap: 1rem !important; }
	.gr-floating-header .gr-nav-extras { gap: 0.5rem; }
	.gr-floating-header .gr-quote-btn { padding: 0.45em 0.85em; font-size: 0.95rem; }
}

/* ===== Raise nav hamburger breakpoint to 1100px (2026-07-21) — the wide lockup + 7 items + CTA
   only fit as one row >=~1200px, so 769-1100 was overlapping. Switch those widths to the hamburger. ===== */
@media (max-width: 1100px) {
	/* show the hamburger, hide the inline desktop menu until toggled */
	.gr-floating-header .main-navigation .menu-toggle {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		width: 44px; min-width: 44px; height: 44px; min-height: 44px;
		padding: 0;
		order: 3;
	}
	.gr-floating-header .main-navigation .menu-toggle .mobile-menu { display: none !important; }
	.gr-floating-header .main-navigation:not(.toggled) #primary-menu.main-nav > ul { display: none !important; }

	/* right-aligned single row: hamburger + Get-a-Quote (kill desktop centring) */
	.gr-floating-header .main-navigation .inside-navigation {
		display: flex !important;
		flex-flow: row nowrap !important;
		align-items: center !important;
		justify-content: flex-end !important;
		gap: 0.5rem !important;
		position: static !important;
	}
	.gr-floating-header > .main-navigation { flex: 0 0 auto !important; }
	.gr-floating-header .main-navigation .gr-nav-extras {
		position: static !important; transform: none !important;
		top: auto !important; right: auto !important; height: auto !important; margin: 0 !important;
		flex: 0 0 auto;
	}

	/* badge-only logo to free horizontal room */
	.gr-floating-header .site-logo { width: 46px; height: 40px; overflow: hidden; }
	.gr-floating-header .site-logo img,
	.gr-floating-header img.header-image,
	.gr-floating-header .custom-logo { height: 40px !important; width: auto !important; max-width: none !important; }

	/* opened menu = full-width panel below the bar */
	.gr-floating-header .main-navigation { position: static !important; }
	.gr-floating-header .main-navigation.toggled #primary-menu.main-nav {
		position: absolute !important;
		left: 0; right: 0; top: 100%;
		background: #ffffff !important;
		border-top: 1px solid #E5E7EB;
		box-shadow: 0 8px 18px rgba(23, 33, 43, 0.12);
		z-index: 60;
	}
	.gr-floating-header .main-navigation.toggled #primary-menu.main-nav > ul { display: block !important; }
	.gr-floating-header .main-navigation.toggled .main-nav ul li a { color: #17212B !important; }
}

/* ===== Three-tone depth system (2026-07-21): White / Mist / Sage — cards always white =====
   White card-sections get a soft on-brand Sage tone (distinct from Mist, so section rhythm
   alternates AND white boxes gain two-tone depth). All bordered card boxes render white so they
   always contrast their toned section. Mist (#DDE2E7), Green CTAs and Navy footer are unchanged. */
.entry-content .wp-block-group.alignfull.has-background[style*="background-color:#ffffff"]:has(.wp-block-group.has-border-color.has-background) {
	background: linear-gradient(180deg, #D5E5D9 0%, #E4EFE7 100%) !important;
}
.entry-content .wp-block-group.has-border-color.has-background {
	background-color: #ffffff !important;
}

/* ===== Hero background image (home) — faded, full-bleed, contained to the hero section ===== */
body.page-id-13 .entry-content .wp-block-group.alignfull:first-of-type {
	background-color: #ffffff !important;
	background-image:
		linear-gradient(90deg, rgba(255,255,255,0.93) 0%, rgba(255,255,255,0.88) 42%, rgba(255,255,255,0.66) 100%),
		url("/wp-content/uploads/2026/07/backroung-image.png") !important;
	background-repeat: no-repeat, no-repeat !important;
	background-position: center right, center right !important;
	background-size: cover, cover !important;
}
@media (max-width: 768px) {
	/* stronger, even veil on small screens so stacked text stays clear over the image */
	body.page-id-13 .entry-content .wp-block-group.alignfull:first-of-type {
		background-image:
			linear-gradient(180deg, rgba(255,255,255,0.90) 0%, rgba(255,255,255,0.86) 100%),
			url("/wp-content/uploads/2026/07/backroung-image.png") !important;
		background-position: center, center !important;
	}
}

/* ===== Hero background image on About / Services / Managed Colocation / Contact (same as home) ===== */
body.page-id-23 .entry-content .wp-block-group.alignfull:first-of-type,
body.page-id-128 .entry-content .wp-block-group.alignfull:first-of-type,
body.page-id-114 .entry-content .wp-block-group.alignfull:first-of-type,
body.page-id-25 .entry-content .wp-block-group.alignfull:first-of-type {
	background-color: #ffffff !important;
	background-image:
		linear-gradient(90deg, rgba(255,255,255,0.93) 0%, rgba(255,255,255,0.88) 42%, rgba(255,255,255,0.66) 100%),
		url("/wp-content/uploads/2026/07/backroung-image.png") !important;
	background-repeat: no-repeat, no-repeat !important;
	background-position: center right, center right !important;
	background-size: cover, cover !important;
}
@media (max-width: 768px) {
	body.page-id-23 .entry-content .wp-block-group.alignfull:first-of-type,
	body.page-id-128 .entry-content .wp-block-group.alignfull:first-of-type,
	body.page-id-114 .entry-content .wp-block-group.alignfull:first-of-type,
	body.page-id-25 .entry-content .wp-block-group.alignfull:first-of-type {
		background-image:
			linear-gradient(180deg, rgba(255,255,255,0.90) 0%, rgba(255,255,255,0.86) 100%),
			url("/wp-content/uploads/2026/07/backroung-image.png") !important;
		background-position: center, center !important;
	}
}

/* ===== Mobile nav sub-menus always visible in the opened panel (2026-08-08) =====
   At <=1100px the panel only forced the TOP-LEVEL `> ul` to display, so the
   Services children (VPS Hosting, Business Plans, Managed Colocation) stayed
   hidden behind GP's dropdown arrow and were effectively unreachable on phones
   and tablets. Show them inline, indented, and drop the now-redundant arrow. */
@media (max-width: 1100px) {
	.gr-floating-header .main-navigation.toggled #primary-menu.main-nav ul ul.sub-menu {
		display: block !important;
		position: static !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		width: 100% !important;
		min-width: 0 !important;
		opacity: 1 !important;
		visibility: visible !important;
		transform: none !important;
		pointer-events: auto !important;
		box-shadow: none !important;
		border: 0 !important;
		background: #F3F6F4 !important;
	}
	.gr-floating-header .main-navigation.toggled #primary-menu.main-nav ul ul.sub-menu li a {
		padding-left: 2.5rem !important;
		font-size: 0.95rem !important;
		color: #17212B !important;
	}
	.gr-floating-header .main-navigation.toggled .dropdown-menu-toggle {
		display: none !important;
	}
}

/* ===== "Order a service" menu button (menu item class gr-menu-btn), matches .gr-quote-btn (2026-10-01) ===== */
.main-navigation .main-nav ul li.gr-menu-btn > a,
.main-navigation .main-nav ul li.gr-menu-btn > a:link,
.main-navigation .main-nav ul li.gr-menu-btn > a:visited {
	display: inline-block;
	background-color: #0E7A38 !important;
	color: #ffffff !important;
	font-weight: 600;
	padding: 0.5em 1em !important;
	border-radius: 4px;
	line-height: 1.2 !important;
	white-space: nowrap;
	text-decoration: none;
	margin-left: 0.4rem;
}
.main-navigation .main-nav ul li.gr-menu-btn > a:hover,
.main-navigation .main-nav ul li.gr-menu-btn > a:focus {
	background-color: #0d4d2c !important;
	color: #ffffff !important;
}
.main-navigation .main-nav ul li.gr-menu-btn { display: flex; align-items: center; }
@media (max-width: 768px) {
	.main-navigation.toggled .main-nav ul li.gr-menu-btn { display: block; padding: 0.6rem 1rem; }
	.main-navigation.toggled .main-nav ul li.gr-menu-btn > a { margin-left: 0; font-size: 0.95rem; }
}
.gr-floating-header .main-navigation.toggled .main-nav ul li.gr-menu-btn > a,
.gr-floating-header .main-navigation.toggled .main-nav ul li.gr-menu-btn > a:visited,
.main-navigation.toggled .main-nav ul li.gr-menu-btn > a { color: #ffffff !important; background-color: #0E7A38 !important; }

/* Blog meta: show the published date only (GP outputs updated + published together) (2026-10-01) */
.posted-on .updated { display: none !important; }
.posted-on .updated + .entry-date { display: inline !important; }

/* Book a visit page (/book-a-visit/) - added 2026-10-01 */
.gr-visit-facts { list-style: none; margin: 0 0 1.5rem; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem 1.75rem; }
.gr-visit-facts li { margin: 0; padding-left: 1.1rem; position: relative; }
.gr-visit-facts li::before { content: ""; position: absolute; left: 0; top: 0.7em; width: 0.45rem; height: 0.45rem; border-radius: 50%; background: #0E7A38; }
.gr-booking-card { max-width: 100%; overflow: hidden; }
.gr-booking-card iframe.ssa_booking_iframe { display: block; width: 100%; min-height: 520px; }
/* OSBORNE-DARK-BEGIN */
/* =====================================================================================
   OSBORNE DARK — site-wide redesign layer (2026-10-06, STAGING first)
   Appended to the end of generatepress-child/style.css so it wins over every earlier
   layer. Pure presentation: no copy, URLs or menu changes. Remove this block (from the
   "OSBORNE DARK" marker to EOF) to roll back.
   ===================================================================================== */

/* ---------- Fonts: Inter self-hosted (body), Montserrat already self-hosted (headings) */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/inter-400.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url('fonts/inter-500.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/inter-600.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url('fonts/inter-700.woff2') format('woff2'); }

/* ---------- Design tokens */
:root {
	--od-bg: #0B1220;
	--od-bg-2: #0E1828;
	--od-surface: #14253B;
	--od-surface-2: #1A2F48;
	--od-text: #E8EEF5;
	--od-body: #C9D4E1;
	--od-muted: #9AA8BC;
	--od-green: #12B76A;
	--od-green-hi: #34D399;
	--od-green-deep: #0E9F6E;
	--od-amber: #F59E0B;
	--od-amber-hi: #FBBF24;
	--od-border: #243044;
	--od-ink: #04120A;
	--od-head: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--od-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
	--od-radius: 12px;
	--od-wrap: 1180px;

	/* re-point every legacy token used by earlier layers */
	--accent: var(--od-green);
	--contrast: var(--od-text);
	--contrast-2: var(--od-body);
	--contrast-3: var(--od-muted);
	--base: var(--od-border);
	--base-2: var(--od-bg-2);
	--base-3: var(--od-surface);
	--gr-green: var(--od-green);
	--gr-green-dark: var(--od-green);
	--gr-navy: var(--od-text);
	--gr-navy-2: var(--od-surface-2);
	--gr-ink: var(--od-text);
	--gr-primary: var(--od-green);
	--gr-mist: var(--od-surface-2);
	--gr-border: var(--od-border);
	--gr-font-sans: var(--od-sans);
	color-scheme: dark;
}

/* ---------- Base */
html, body { background: var(--od-bg) !important; }
body, button, input, select, optgroup, textarea {
	font-family: var(--od-sans);
	color: var(--od-body);
	-webkit-font-smoothing: antialiased;
}
body { font-size: 17px; line-height: 1.65; }
h1, h2, h3, h4, h5, h6, .entry-title, .site-title, .main-title,
.main-navigation .main-nav ul li a, .wp-block-button__link, .gr-quote-btn, .wpcf7-submit {
	font-family: var(--od-head);
}
h1, h2, h3, h4, h5, h6, .entry-title, .entry-title a { color: var(--od-text) !important; letter-spacing: -0.015em; }
.entry-content h1, .site-main h1, h1.entry-title { font-weight: 700; }
a { color: var(--od-green); }
a:hover, a:focus { color: var(--od-green-hi); }
::selection { background: var(--od-green); color: var(--od-ink); }
:focus-visible { outline: 2px solid var(--od-green-hi); outline-offset: 2px; }
strong, b { color: inherit; }
hr, .wp-block-separator { border-color: var(--od-border) !important; background-color: var(--od-border) !important; color: var(--od-border) !important; opacity: 1; }
blockquote, .wp-block-quote { border-left: 4px solid var(--od-green); color: var(--od-text); background: var(--od-surface); padding: 1rem 1.25rem; border-radius: 0 8px 8px 0; }
code, pre, kbd { background: var(--od-surface-2) !important; color: var(--od-text) !important; border-radius: 4px; }

/* GeneratePress containers (separate-containers layout) */
.site, .site-content, #page, .inside-article, .separate-containers .inside-article,
.separate-containers .comments-area, .separate-containers .page-header, .separate-containers .paging-navigation,
.one-container .site-content, .inside-page-header, .widget-area .widget, .sidebar .widget,
.separate-containers .site-main > *, .container.grid-container {
	background-color: transparent !important;
	color: var(--od-body);
}
.entry-content { color: var(--od-body); }
.entry-content > p, .entry-content li { color: var(--od-body); }

/* ---------- Header (floating, single row) */
.gr-floating-header {
	background: rgba(11, 18, 32, 0.92) !important;
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	border-bottom: 1px solid var(--od-border) !important;
	box-shadow: 0 1px 0 rgba(0,0,0,.2) !important;
}
.gr-floating-header #masthead.site-header, #masthead.site-header { background: transparent !important; }
.main-navigation, .main-navigation .inside-navigation { background: transparent !important; }
.main-navigation .main-nav ul li a { color: var(--od-muted) !important; font-weight: 600; }
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li a:focus { color: var(--od-text) !important; }
.main-navigation .main-nav ul li[class*="current-menu"] > a { color: var(--od-green) !important; }
.main-navigation .main-nav ul li.gr-menu-btn > a,
.main-navigation .main-nav ul li.gr-menu-btn[class*="current-menu"] > a,
.gr-floating-header .main-navigation .main-nav ul li.gr-menu-btn > a,
.gr-floating-header .main-navigation .main-nav ul li.gr-menu-btn > a:visited {
	background: var(--od-amber) !important;
	color: #0B1220 !important;
	border-radius: 6px;
	padding-left: 1rem !important; padding-right: 1rem !important;
	margin-left: .5rem;
}
.main-navigation .main-nav ul li.gr-menu-btn > a:hover,
.main-navigation .main-nav ul li.gr-menu-btn > a:focus,
.gr-floating-header .main-navigation .main-nav ul li.gr-menu-btn > a:hover,
.gr-floating-header .main-navigation .main-nav ul li.gr-menu-btn > a:focus { background: var(--od-amber-hi) !important; color: #0B1220 !important; }
.main-navigation .main-nav ul ul {
	background: var(--od-surface) !important;
	border: 1px solid var(--od-border) !important;
	border-radius: 10px;
	box-shadow: 0 14px 34px rgba(0,0,0,.45) !important;
	overflow: hidden;
}
.main-navigation .main-nav ul ul li a { color: var(--od-body) !important; }
.main-navigation .main-nav ul ul li a:hover,
.main-navigation .main-nav ul ul li a:focus,
.main-navigation .main-nav ul ul li[class*="current-menu"] > a { color: var(--od-text) !important; background: var(--od-surface-2) !important; }
.main-navigation .dropdown-menu-toggle .gp-icon { color: currentColor; }
.main-navigation .menu-toggle, .main-navigation .menu-toggle .mobile-menu, .main-navigation .menu-toggle .gp-icon,
.gr-floating-header .main-navigation .menu-toggle { color: var(--od-text) !important; background: transparent !important; }
.gr-floating-header .main-navigation .menu-toggle { border: 1px solid var(--od-border) !important; border-radius: 8px; }
/* header utility CTAs (child functions.php) */
.gr-quote-btn, .gr-quote-btn:link, .gr-quote-btn:visited {
	background: transparent !important; color: var(--od-green) !important;
	border: 1px solid var(--od-green); border-radius: 6px !important; font-weight: 600;
}
.gr-quote-btn:hover, .gr-quote-btn:focus { background: rgba(18,183,106,.12) !important; color: var(--od-green-hi) !important; }
.gr-phone, .main-navigation .gr-phone { color: var(--od-text) !important; border-color: var(--od-border) !important; background: transparent !important; }
.gr-phone:hover, .gr-phone:focus { background: var(--od-surface) !important; color: var(--od-green) !important; border-color: var(--od-green) !important; }
@media (max-width: 1100px) {
	.gr-floating-header .main-navigation.toggled #primary-menu.main-nav {
		background: var(--od-bg) !important;
		border-top: 1px solid var(--od-border) !important;
		box-shadow: 0 18px 30px rgba(0,0,0,.5) !important;
		max-height: calc(100vh - 64px); overflow-y: auto;
	}
	.gr-floating-header .main-navigation.toggled .main-nav ul li a { color: var(--od-text) !important; border-bottom: 1px solid var(--od-border); }
	.gr-floating-header .main-navigation.toggled .main-nav ul li[class*="current-menu"] > a { color: var(--od-green) !important; }
	.gr-floating-header .main-navigation.toggled #primary-menu.main-nav ul ul.sub-menu { background: var(--od-bg-2) !important; }
	.gr-floating-header .main-navigation.toggled #primary-menu.main-nav ul ul.sub-menu li a { color: var(--od-body) !important; }
	.main-navigation .main-nav ul li.gr-menu-btn > a { margin: .75rem 1rem !important; text-align: center; display: block; }
	.main-navigation .main-nav ul ul { border-radius: 0; border: 0 !important; }
}

/* ---------- Footer (mu-plugin markup restyled only) */
.site-footer, .gr-footer, .site-info, .inside-site-info, .footer-widgets {
	background: #080E18 !important; color: var(--od-muted) !important;
}
.gr-footer { border-top: 1px solid var(--od-border); }
.site-info, .inside-site-info { border-top: 1px solid var(--od-border); }
.gr-footer__heading, .footer-widgets .widget-title { color: var(--od-text) !important; font-family: var(--od-head); font-size: .82rem !important; letter-spacing: .06em; text-transform: uppercase; }
.gr-footer__tag, .gr-footer p, .copyright-bar { color: var(--od-muted) !important; }
.site-footer a, .gr-footer a, .footer-widgets a, .site-info a { color: var(--od-body) !important; }
.site-footer a:hover, .gr-footer a:hover, .footer-widgets a:hover, .site-info a:hover,
.site-footer a:focus, .gr-footer a:focus, .site-info a:focus { color: var(--od-green) !important; }
/* footer lockup: the mu-plugin prints the dark-wordmark PNG; paint the light variant instead */
.gr-footer__logo-chip {
	background: url('images/gr-lockup-light.png') left center / contain no-repeat !important;
	padding: 0 !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important;
	display: inline-block; width: 240px; max-width: 100%; aspect-ratio: 960 / 129;
}
.gr-footer__logo-chip img.gr-footer__logo { opacity: 0 !important; width: 100%; height: auto; }

/* ---------- Buttons (core + GenerateBlocks + legacy inline-styled buttons) */
.wp-block-button__link, .wp-element-button, .gb-button, button.button, .button,
input[type="submit"], input[type="button"], .wpcf7-submit {
	border-radius: 6px !important; font-weight: 600 !important; letter-spacing: .005em;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
/* default solid button = green with dark ink (7.3:1) */
.wp-block-button:not([class*="is-style-gr-"]):not(.is-style-outline) .wp-block-button__link:not([style*="background-color:transparent"]),
.gb-button:not([style*="transparent"]), input[type="submit"], .wpcf7-submit, button.button, .button {
	background-color: var(--od-green) !important; color: var(--od-ink) !important; border: 1px solid var(--od-green) !important;
}
.wp-block-button:not([class*="is-style-gr-"]) .wp-block-button__link:not([style*="background-color:transparent"]):hover,
input[type="submit"]:hover, .wpcf7-submit:hover, .gb-button:hover {
	background-color: var(--od-green-hi) !important; border-color: var(--od-green-hi) !important; color: var(--od-ink) !important;
}
/* amber = primary CTA (legacy amber inline buttons, Buy Now, and the new is-style-gr-amber) */
#content .entry-content .wp-block-button__link[style*="background-color:#F59E0B"],
#content .entry-content .wp-block-button__link[style*="background-color:#f59e0b"],
#content .gr-buynow .wp-block-button__link,
#content .wp-block-button.is-style-gr-amber .wp-block-button__link {
	background-color: var(--od-amber) !important; color: #0B1220 !important; border: 1px solid var(--od-amber) !important;
}
#content .entry-content .wp-block-button__link[style*="background-color:#F59E0B"]:hover,
#content .entry-content .wp-block-button__link[style*="background-color:#f59e0b"]:hover,
#content .gr-buynow .wp-block-button__link:hover,
#content .wp-block-button.is-style-gr-amber .wp-block-button__link:hover,
#content .wp-block-button.is-style-gr-amber .wp-block-button__link:focus { background-color: var(--od-amber-hi) !important; border-color: var(--od-amber-hi) !important; color: #0B1220 !important; }
/* outline / transparent legacy buttons -> green ghost */
#content .entry-content .wp-block-button__link[style*="background-color:transparent"],
.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-gr-ghost .wp-block-button__link {
	background-color: transparent !important; color: var(--od-green) !important; border: 1px solid var(--od-green) !important;
}
#content .entry-content .wp-block-button__link[style*="background-color:transparent"]:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-gr-ghost .wp-block-button__link:hover { background-color: rgba(18,183,106,.12) !important; color: var(--od-green-hi) !important; }
.wp-block-button.is-style-gr-outline .wp-block-button__link { background: transparent !important; color: var(--od-text) !important; border: 1px solid #3A4B63 !important; }
.wp-block-button.is-style-gr-outline .wp-block-button__link:hover { border-color: var(--od-green) !important; color: var(--od-green) !important; }
.wp-block-button.is-style-gr-green .wp-block-button__link { background: var(--od-green) !important; color: var(--od-ink) !important; border: 1px solid var(--od-green) !important; }
.wp-block-button.is-style-gr-green .wp-block-button__link:hover { background: var(--od-green-hi) !important; border-color: var(--od-green-hi) !important; }
/* neutralise the 2026-07 "white button on dark band" rules — every band is dark now */
#content .entry-content .wp-block-group.alignfull[style*="background-color:#0d4d2c"] .wp-block-button__link:not([style*="background-color:transparent"]):not([style*="#F59E0B"]),
#content .entry-content .wp-block-group.alignfull[style*="background-color:#14253B"] .wp-block-button__link:not([style*="background-color:transparent"]):not([style*="#F59E0B"]) {
	background-color: var(--od-green) !important; color: var(--od-ink) !important; border-color: var(--od-green) !important;
}
#content .entry-content .wp-block-group.alignfull[style*="background-color:#0d4d2c"] .wp-block-button__link[style*="background-color:transparent"],
#content .entry-content .wp-block-group.alignfull[style*="background-color:#14253B"] .wp-block-button__link[style*="background-color:transparent"] {
	color: var(--od-text) !important; border-color: #3A4B63 !important;
}

/* ---------- Legacy page content: re-map the light inline palette to the dark system.
   (Pages keep their markup/copy; only presentation changes.) */
/* full-width section bands */
#content .entry-content .wp-block-group.alignfull.has-background,
#content .entry-content .wp-block-group.alignfull[style*="background-color:#ffffff"],
#content .entry-content .wp-block-group.alignfull[style*="background-color:#DDE2E7"],
#content .entry-content .wp-block-group.alignfull[style*="background-color:#f8fafc"],
#content .entry-content .wp-block-group.alignfull[style*="background-color:#ffffff"]:has(.wp-block-group.has-border-color.has-background) {
	background: var(--od-bg) !important;
	background-image: none !important;
	color: var(--od-body);
}
#content .entry-content .wp-block-group.alignfull[style*="background-color:#DDE2E7"],
#content .entry-content .wp-block-group.alignfull[style*="background-color:#f8fafc"] {
	background: linear-gradient(180deg, var(--od-bg) 0%, var(--od-bg-2) 45%, var(--od-bg) 100%) !important;
	border-block: 1px solid var(--od-border);
}
#content .entry-content .wp-block-group.alignfull[style*="background-color:#14253B"],
#content .entry-content .wp-block-group.alignfull[style*="background-color:#14253b"],
#content .entry-content .wp-block-group.alignfull[style*="background-color:#17212B"] {
	background: var(--od-surface) !important; border-block: 1px solid var(--od-border);
}
#content .entry-content .wp-block-group.alignfull[style*="background-color:#0d4d2c"],
#content .entry-content .wp-block-group.alignfull[style*="background-color:#0e7a38"],
#content .entry-content .wp-block-group.alignfull[style*="background-color:#0E7A38"] {
	background: linear-gradient(120deg, var(--od-surface) 0%, #0F3A35 100%) !important;
	border: 1px solid var(--od-border);
}
/* first band on content pages = page hero over a real facility photo */
body:not(.home) #content .entry-content > .wp-block-group.alignfull:first-child,
body.page-id-23 #content .entry-content .wp-block-group.alignfull:first-of-type,
body.page-id-128 #content .entry-content .wp-block-group.alignfull:first-of-type,
body.page-id-114 #content .entry-content .wp-block-group.alignfull:first-of-type,
body.page-id-25 #content .entry-content .wp-block-group.alignfull:first-of-type {
	background-color: var(--od-bg) !important;
	background-image:
		linear-gradient(105deg, rgba(11,18,32,.95) 0%, rgba(11,18,32,.86) 50%, rgba(20,37,59,.70) 100%),
		url('/wp-content/uploads/gr-img/enterprise-rack-servers-angle-1920.webp') !important;
	background-size: cover, cover !important;
	background-position: center, center !important;
	background-repeat: no-repeat, no-repeat !important;
	border-bottom: 1px solid var(--od-border);
}
@media (max-width: 768px) {
	body:not(.home) #content .entry-content > .wp-block-group.alignfull:first-child,
	body.page-id-23 #content .entry-content .wp-block-group.alignfull:first-of-type,
	body.page-id-128 #content .entry-content .wp-block-group.alignfull:first-of-type,
	body.page-id-114 #content .entry-content .wp-block-group.alignfull:first-of-type,
	body.page-id-25 #content .entry-content .wp-block-group.alignfull:first-of-type {
		background-image:
			linear-gradient(180deg, rgba(11,18,32,.93) 0%, rgba(11,18,32,.90) 100%),
			url('/wp-content/uploads/gr-img/enterprise-rack-servers-angle-1024.webp') !important;
	}
}
body.page-id-82 #content .entry-content > .wp-block-group.alignfull:first-child {
	background-image:
		linear-gradient(105deg, rgba(11,18,32,.95) 0%, rgba(11,18,32,.84) 50%, rgba(20,37,59,.62) 100%),
		url('/wp-content/uploads/gr-img/facility-cold-aisle-1920.webp') !important;
}
/* cards / boxed groups */
#content .entry-content .wp-block-group.has-border-color.has-background,
#content .entry-content .wp-block-group.has-background:not(.alignfull),
#content .entry-content .wp-block-column.has-background,
#content .entry-content .wp-block-group[style*="background-color:#ffffff"]:not(.alignfull),
#content .entry-content .wp-block-group[style*="background-color:#DDE2E7"]:not(.alignfull),
#content .entry-content .wp-block-group[style*="background-color:#f8fafc"]:not(.alignfull),
#content .entry-content .wp-block-group[style*="background-color:#F6F7F8"]:not(.alignfull) {
	background: var(--od-surface) !important;
	border-color: var(--od-border) !important;
	box-shadow: none !important;
	border-radius: var(--od-radius) !important;
}
#content .entry-content .wp-block-group.has-border-color.has-background:hover { border-color: var(--od-green) !important; box-shadow: 0 10px 30px rgba(0,0,0,.35) !important; }
/* green-bordered "featured" cards keep a green edge */
#content .entry-content .wp-block-group.has-border-color[style*="border-color:#0d4d2c"],
#content .entry-content .wp-block-group.has-border-color[style*="border-color:#0BAF4F"],
#content .entry-content .wp-block-group.has-border-color[style*="border-color:#F59E0B"] { border-color: var(--od-green) !important; }
#content .entry-content [style*="border-color:#E5E7EB"], #content .entry-content [style*="border-color:#e5e7eb"] { border-color: var(--od-border) !important; }
/* inline text colours */
#content .entry-content [style*="color:#14253B"], #content .entry-content [style*="color:#14253b"],
#content .entry-content [style*="color:#17212B"], #content .entry-content [style*="color:#111827"],
#content .entry-content [style*="color:#1f2937"], #content .entry-content [style*="color:#222"] { color: var(--od-text) !important; }
#content .entry-content [style*="color:#374151"], #content .entry-content [style*="color:#4b5563"], #content .entry-content [style*="color:#4B5563"],
#content .entry-content [style*="color:#444"], #content .entry-content [style*="color:#6b7280"], #content .entry-content [style*="color:#6B7280"],
#content .entry-content [style*="color:#64748B"] { color: var(--od-body) !important; }
#content .entry-content [style*="color:#0d4d2c"], #content .entry-content [style*="color:#0D4D2C"],
#content .entry-content [style*="color:#0BAF4F"], #content .entry-content [style*="color:#0E7A38"], #content .entry-content [style*="color:#1e73be"] { color: var(--od-green) !important; }
#content .entry-content [style*="color:#3fd07a"], #content .entry-content [style*="color:#3FD07A"] { color: var(--od-green-hi) !important; }
#content .entry-content .has-accent-color { color: var(--od-green) !important; }
#content .entry-content .has-accent-background-color { background-color: var(--od-green) !important; color: var(--od-ink) !important; }
/* white-on-light chips/badges inside cards stay legible */
#content .entry-content [style*="background-color:#ffffff"]:not(.wp-block-group):not(.wp-block-button__link) { background-color: var(--od-surface-2) !important; }
/* inline SVG icons drawn in the old dark green */
#content .entry-content svg [stroke="#0d4d2c"], #content .entry-content svg[stroke="#0d4d2c"],
#content .entry-content svg [stroke="#14253B"], #content .entry-content svg[stroke="#14253B"] { stroke: var(--od-green) !important; }
#content .entry-content svg [fill="#0d4d2c"], #content .entry-content svg[fill="#0d4d2c"] { fill: var(--od-green) !important; }
/* tables */
.entry-content table, .wp-block-table table { border-color: var(--od-border) !important; color: var(--od-body); }
.entry-content th, .entry-content td, .wp-block-table td, .wp-block-table th { border-color: var(--od-border) !important; background: transparent !important; }
.entry-content thead th, .wp-block-table thead { background: var(--od-surface-2) !important; color: var(--od-text) !important; }
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background: var(--od-surface) !important; }
/* images */
.entry-content .wp-block-image img, .entry-content figure img { border-radius: 10px; }
.entry-content figcaption, .wp-element-caption, .gr-cap { color: var(--od-muted) !important; }
/* details accordions (Websites page) */
.gr-wp-details, .entry-content details { background: var(--od-surface-2) !important; border: 1px solid var(--od-border) !important; border-radius: 8px; }
.gr-wp-details > summary { color: var(--od-green) !important; }
.gr-wp-details > summary::after { border-color: var(--od-green) !important; }
.gr-wp-details__body ul, .gr-wp-details__lead, .gr-wp-details__not { color: var(--od-body) !important; }
/* Rank Math FAQ */
.rank-math-faq-item, .rank-math-list-item { background: var(--od-surface); border: 1px solid var(--od-border); border-radius: 10px; padding: 1rem 1.25rem; margin-bottom: .75rem; }
.rank-math-question { color: var(--od-text) !important; }
.rank-math-answer, .rank-math-answer p { color: var(--od-body) !important; }
/* legacy trusted-logo tiles keep a light tile so the client logos stay true-colour */
.gr-trusted-caption { color: var(--od-muted) !important; }
.gr-logo-tile { background: #F3F6F8 !important; border: 1px solid var(--od-border) !important; border-radius: 10px !important; }
/* the old entry-title underline accent */
.page .entry-title::after { background: var(--od-green) !important; }
/* kill the 2026-07 light gradient / mist layers */
.entry-content .wp-block-group.alignfull.has-background[style*="background-color:#DDE2E7"],
.entry-content .wp-block-group.alignfull.has-background[style*="background-color:#ffffff"] + .wp-block-group.alignfull.has-background[style*="background-color:#ffffff"] { border-top-color: var(--od-border) !important; }

/* ---------- Forms (CF7 + generic) */
input[type="text"], input[type="email"], input[type="url"], input[type="tel"], input[type="number"], input[type="password"],
input[type="search"], input[type="date"], textarea, select, .wpcf7-form-control:not(.wpcf7-submit):not(.wpcf7-checkbox):not(.wpcf7-radio):not(.wpcf7-acceptance) {
	background-color: var(--od-bg-2) !important;
	color: var(--od-text) !important;
	border: 1px solid #33445E !important;
	border-radius: 8px !important;
	padding: .7rem .85rem;
}
input::placeholder, textarea::placeholder { color: #7D8BA0 !important; opacity: 1; }
input:focus, textarea:focus, select:focus {
	border-color: var(--od-green) !important; outline: none !important;
	box-shadow: 0 0 0 3px rgba(18,183,106,.25) !important;
	background-color: var(--od-bg) !important;
}
select option { background: var(--od-surface); color: var(--od-text); }
.wpcf7 label, .wpcf7-form p, .wpcf7-list-item-label { color: var(--od-body) !important; }
.wpcf7-not-valid-tip { color: #FCA5A5 !important; }
.wpcf7 form .wpcf7-response-output { border-color: var(--od-border) !important; color: var(--od-text); border-radius: 8px; }
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--od-green) !important; }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.failed .wpcf7-response-output { border-color: var(--od-amber) !important; }
/* SSA booking widget is an iframe with its own (light) styling: frame it as a card */
.ssa_booking_iframe, iframe[src*="ssa"], .entry-content iframe[title*="ppointment"] {
	border-radius: 12px; border: 1px solid var(--od-border) !important; background: #fff; max-width: 100%;
}

/* ---------- Blog index / archives / single */
.blog .site-main article, .archive .site-main article, .search .site-main article {
	background: var(--od-surface) !important; border: 1px solid var(--od-border); border-radius: var(--od-radius);
	margin-bottom: 1.5rem; overflow: hidden;
}
.blog .inside-article, .archive .inside-article, .search .inside-article { padding: 1.75rem !important; }
.blog .entry-title a, .archive .entry-title a { color: var(--od-text) !important; }
.blog .entry-title a:hover, .archive .entry-title a:hover { color: var(--od-green) !important; }
.entry-meta, .entry-meta a, .posted-on, .byline, .cat-links, .tags-links, .comments-link, .entry-meta time { color: var(--od-muted) !important; }
.entry-summary, .entry-summary p { color: var(--od-body) !important; }
.read-more, a.read-more, .more-link { color: var(--od-green) !important; font-weight: 600; }
.post-image img, .featured-image img { border-radius: 10px; }
.page-header, .page-header .page-title { color: var(--od-text) !important; }
.paging-navigation a, .nav-links a, .page-numbers { color: var(--od-body) !important; }
.page-numbers.current { color: var(--od-green) !important; }
.single .inside-article {
	background: var(--od-surface) !important; border: 1px solid var(--od-border); border-radius: var(--od-radius);
}
.single .entry-content, .single .entry-content p, .single .entry-content li { color: var(--od-body); font-size: 1.05rem; line-height: 1.75; }
.single .entry-content h2, .single .entry-content h3 { margin-top: 2rem; }
.post-navigation, .comments-area, .comment-respond { color: var(--od-body); }
.comment-content, .comment-meta, .comment-author { color: var(--od-body) !important; }
.blog .site-main, .archive .site-main, .single .site-main { margin-top: 2rem; }
@media (min-width: 769px) {
	.blog .site-main, .archive .site-main { max-width: 900px; margin-left: auto; margin-right: auto; }
	.single .site-main > article { max-width: 860px; margin-left: auto; margin-right: auto; }
}
.separate-containers .site-main { margin: 2rem auto 3rem; }
.sidebar .widget, .widget-area .widget { border: 1px solid var(--od-border); border-radius: 10px; }
.widget-title { color: var(--od-text) !important; }

/* =====================================================================================
   Home page (rebuilt with core blocks; classes below are in post 13 content)
   ===================================================================================== */
.home .entry-content > .alignfull { margin-left: 0; margin-right: 0; }
.home .inside-article, .home .site-main, .home .site-content .content-area { padding: 0 !important; margin: 0 !important; }
.home .entry-header { display: none; }
.od-hero, .od-specs, .od-section, .od-cta-band { padding-left: max(1.25rem, calc((100% - var(--od-wrap)) / 2)) !important; padding-right: max(1.25rem, calc((100% - var(--od-wrap)) / 2)) !important; }
.entry-content .od-hero > *, .entry-content .od-section > *, .entry-content .od-specs > *, .entry-content .od-cta-band > * { max-width: none; }
.od-hero .wp-block-group__inner-container, .od-section .wp-block-group__inner-container,
.od-specs .wp-block-group__inner-container, .od-cta-band .wp-block-group__inner-container { max-width: none !important; padding: 0 !important; }

/* labels / eyebrows / section heads */
.od-eyebrow, .od-label {
	display: inline-flex; align-items: center; gap: .5rem; margin: 0 0 .9rem !important;
	font-family: var(--od-sans); font-size: .78rem !important; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
	color: var(--od-green) !important;
}
.od-eyebrow::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--od-green); box-shadow: 0 0 10px var(--od-green); }
.od-section-head { max-width: 46rem; margin-bottom: 2.25rem !important; }
.od-section-head h2 { font-size: clamp(1.6rem, 2.8vw, 2.2rem) !important; margin: 0 0 .7rem !important; line-height: 1.2 !important; }
.od-section-head p:not(.od-label) { color: var(--od-muted) !important; font-size: 1.05rem; margin: 0; }

/* hero */
.od-hero,
body.page-id-13 #content .entry-content .wp-block-group.alignfull.od-hero:first-of-type,
body.home #content .entry-content .wp-block-group.alignfull.od-hero {
	position: relative; overflow: hidden; margin: 0 !important;
	padding-top: 5.5rem !important; padding-bottom: 5rem !important;
	background:
		linear-gradient(105deg, rgba(11,18,32,.95) 0%, rgba(11,18,32,.80) 48%, rgba(20,37,59,.55) 100%),
		url('/wp-content/uploads/gr-img/facility-cold-aisle-1920.webp') center / cover no-repeat,
		var(--od-bg) !important;
}
.od-hero::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 120px; background: linear-gradient(transparent, var(--od-bg)); pointer-events: none; }
.od-hero__grid { position: relative; z-index: 1; display: grid !important; grid-template-columns: 1.15fr .85fr; gap: 3rem !important; align-items: center; margin: 0 !important; }
.od-hero__grid > .wp-block-column { margin: 0 !important; min-width: 0; }
.od-hero__title { font-size: clamp(2.2rem, 4.4vw, 3.5rem) !important; line-height: 1.1 !important; font-weight: 700 !important; margin: 0 0 1.1rem !important; max-width: 15ch; }
.od-accent { color: var(--od-green); }
.od-hero__lead { font-size: 1.15rem !important; color: var(--od-body) !important; max-width: 40ch; margin: 0 0 1.9rem !important; line-height: 1.6; }
.od-btns { gap: .75rem !important; flex-wrap: wrap; }
.od-btns--center { justify-content: center; margin-top: 2rem; }
.od-btns .wp-block-button__link { padding: .85rem 1.4rem !important; font-size: .95rem !important; line-height: 1.2; }
.od-glance {
	background: rgba(20,37,59,.80) !important; border: 1px solid var(--od-border); border-radius: var(--od-radius);
	padding: 1.4rem 1.5rem !important; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	box-shadow: 0 20px 50px rgba(0,0,0,.35);
}
.od-glance .wp-block-group__inner-container { padding: 0 !important; }
.od-glance__title { font-size: 1rem !important; margin: 0 0 .6rem !important; color: var(--od-text) !important; }
.od-stat { display: flex; justify-content: space-between; gap: 1rem; margin: 0 !important; padding: .62rem 0; border-bottom: 1px solid var(--od-border); font-size: .93rem; }
.od-stat:last-child { border-bottom: 0; }
.od-stat span { color: var(--od-muted); }
.od-stat strong { color: var(--od-green); font-weight: 600; text-align: right; }
.od-stat strong.od-soon { color: var(--od-amber); }

/* spec strip */
.od-specs { background: var(--od-surface) !important; border-block: 1px solid var(--od-border); padding-top: 1.4rem !important; padding-bottom: 1.4rem !important; margin: 0 !important; }
.od-specs__grid { display: grid !important; grid-template-columns: repeat(6, 1fr); gap: 1rem !important; margin: 0 !important; text-align: center; }
.od-specs__grid > .wp-block-column { margin: 0 !important; }
.od-spec { margin: 0 !important; display: flex; flex-direction: column; gap: .2rem; }
.od-spec strong { font-family: var(--od-head); font-size: .95rem; color: var(--od-text); }
.od-spec span { font-size: .8rem; color: var(--od-muted); }

/* sections */
.od-section { padding-top: 4.75rem !important; padding-bottom: 4.75rem !important; margin: 0 !important; }
.od-section--tight { padding-top: 2.5rem !important; }
.od-why { background: linear-gradient(180deg, var(--od-bg), var(--od-bg-2) 40%, var(--od-bg)) !important; }

/* card grids */
.od-cardgrid { display: grid !important; gap: 1.15rem !important; margin: 0 0 1.15rem !important; }
.od-cardgrid--3 { grid-template-columns: repeat(3, 1fr); }
.od-cardgrid--4 { grid-template-columns: repeat(4, 1fr); }
.od-cardgrid > .wp-block-column { margin: 0 !important; min-width: 0; }
.od-card {
	position: relative; display: flex; flex-direction: column;
	background: var(--od-surface); border: 1px solid var(--od-border); border-radius: var(--od-radius);
	padding: 1.5rem 1.4rem !important; transition: border-color .15s, transform .15s;
}
.od-card:hover { border-color: var(--od-green); transform: translateY(-2px); }
.od-card h3 { font-size: 1.1rem !important; margin: 0 0 .55rem !important; line-height: 1.3 !important; }
.od-card p { color: var(--od-muted) !important; font-size: .94rem; line-height: 1.6; margin: 0 0 .9rem !important; }
.od-card p:not(.od-price):not(.od-more) { flex: 1 1 auto; }
.od-price { font-family: var(--od-head); font-weight: 700; font-size: 1.4rem !important; color: var(--od-text) !important; margin: 0 0 .6rem !important; }
.od-price small { font-family: var(--od-sans); font-size: .85rem; font-weight: 500; color: var(--od-muted); }
.od-more { margin: 0 !important; font-weight: 600; font-size: .9rem; }
.od-more a { color: var(--od-green); text-decoration: none; }
.od-more a:hover { color: var(--od-green-hi); }
.od-more a::after { content: ''; position: absolute; inset: 0; } /* whole card clickable */
/* card icons (CSS masks -> no extra markup) */
.od-ico::before {
	content: ''; display: block; width: 44px; height: 44px; border-radius: 10px; margin-bottom: 1rem;
	background: rgba(18,183,106,.12) var(--od-ico-img, none) center / 22px 22px no-repeat;
}
.od-card--aud.od-ico::before { width: 38px; height: 38px; background-color: rgba(245,158,11,.12); background-size: 18px 18px; }
.od-ico--colo   { --od-ico-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22' fill='none' stroke='%2312B76A' stroke-width='1.8'%3E%3Crect x='3' y='2' width='16' height='18' rx='2'/%3E%3Cpath d='M7 6h8M7 10h8M7 14h5'/%3E%3C/svg%3E"); }
.od-ico--server { --od-ico-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22' fill='none' stroke='%2312B76A' stroke-width='1.8'%3E%3Crect x='2' y='4' width='18' height='6' rx='1.5'/%3E%3Crect x='2' y='12' width='18' height='6' rx='1.5'/%3E%3Cpath d='M6 7h3M6 15h3'/%3E%3C/svg%3E"); }
.od-ico--vps    { --od-ico-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22' fill='none' stroke='%2312B76A' stroke-width='1.8'%3E%3Crect x='2' y='4' width='18' height='14' rx='2'/%3E%3Cpath d='M6 8h4M6 12h10'/%3E%3C/svg%3E"); }
.od-ico--ai     { --od-ico-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22' fill='none' stroke='%2312B76A' stroke-width='1.8'%3E%3Crect x='5' y='5' width='12' height='12' rx='2'/%3E%3Cpath d='M9 1v4M13 1v4M9 17v4M13 17v4M1 9h4M1 13h4M17 9h4M17 13h4'/%3E%3C/svg%3E"); }
.od-ico--web    { --od-ico-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22' fill='none' stroke='%2312B76A' stroke-width='1.8'%3E%3Ccircle cx='11' cy='11' r='9'/%3E%3Cpath d='M2 11h18M11 2a14 14 0 0 1 0 18M11 2a14 14 0 0 0 0 18'/%3E%3C/svg%3E"); }
.od-ico--plans  { --od-ico-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22' fill='none' stroke='%2312B76A' stroke-width='1.8'%3E%3Cpath d='M4 16V8l7-4 7 4v8l-7 4-7-4z'/%3E%3Cpath d='M11 12v8M4 8l7 4 7-4'/%3E%3C/svg%3E"); }
.od-ico--law    { --od-ico-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none' stroke='%23F59E0B' stroke-width='1.8'%3E%3Cpath d='M3 16V6l6-3 6 3v10M3 16h12M9 8v4'/%3E%3C/svg%3E"); }
.od-ico--agency { --od-ico-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none' stroke='%23F59E0B' stroke-width='1.8'%3E%3Crect x='2' y='3' width='14' height='12' rx='2'/%3E%3Cpath d='M5 14V9h8v5'/%3E%3C/svg%3E"); }
.od-ico--saas   { --od-ico-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none' stroke='%23F59E0B' stroke-width='1.8'%3E%3Ccircle cx='9' cy='9' r='6'/%3E%3Cpath d='M9 6v3l2 2'/%3E%3C/svg%3E"); }
.od-ico--sme    { --od-ico-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none' stroke='%23F59E0B' stroke-width='1.8'%3E%3Cpath d='M3 14h12M5 14V6h8v8M7 6V4h4v2'/%3E%3C/svg%3E"); }

/* why Perth */
.od-why__grid { display: grid !important; grid-template-columns: 1fr 1fr; gap: 2.75rem !important; align-items: center; margin: 0 !important; }
.od-why__grid > .wp-block-column { margin: 0 !important; min-width: 0; }
.od-why__visual { position: relative; }
.od-why__img { margin: 0 !important; border-radius: 14px; overflow: hidden; border: 1px solid var(--od-border); aspect-ratio: 4 / 3; }
.od-why__img img { width: 100%; height: 100%; object-fit: cover; border-radius: 0 !important; }
.od-why__badge {
	position: absolute; left: 1rem; bottom: 1rem; margin: 0 !important; max-width: 70%;
	background: rgba(11,18,32,.90); border: 1px solid var(--od-border); border-radius: 8px; padding: .75rem .95rem;
	font-size: .84rem; color: var(--od-body); line-height: 1.4;
}
.od-why__badge strong { display: block; color: var(--od-green); font-family: var(--od-head); font-size: 1.1rem; }
.od-why .od-section-head { margin-bottom: 1.4rem !important; }
.od-point {
	position: relative; background: var(--od-surface); border: 1px solid var(--od-border); border-radius: 10px;
	padding: 1rem 1.15rem 1rem 3.4rem !important; margin: 0 0 .9rem !important;
}
.od-point .wp-block-group__inner-container { padding: 0 !important; }
.od-point h3 { font-size: 1.02rem !important; margin: 0 0 .3rem !important; }
.od-point__num { position: absolute; left: 1.1rem; top: 1rem; font-family: var(--od-head); font-weight: 700; color: var(--od-green); font-size: 1.05rem; }
.od-point p { color: var(--od-muted) !important; font-size: .92rem; margin: 0 !important; line-height: 1.6; }
.od-point a { white-space: nowrap; font-weight: 600; }

/* facility teaser (re-uses the existing .gr-quad photo grid) */
.od-facility-teaser .od-section-head h2 { max-width: 30ch; }

/* manifesto + client logos */
.od-trusted-band { text-align: center; }
.od-manifesto { font-size: clamp(1.25rem, 2.2vw, 1.75rem) !important; font-weight: 600 !important; max-width: 46rem; margin: 0 auto 1.5rem !important; line-height: 1.35 !important; color: var(--od-text) !important; }

/* CTA band */
.od-cta-band { padding-top: 0 !important; padding-bottom: 4.75rem !important; margin: 0 !important; }
.od-cta-band__inner {
	background:
		linear-gradient(120deg, rgba(20,37,59,.96) 0%, rgba(20,37,59,.90) 55%, rgba(14,159,110,.35) 100%),
		url('/wp-content/uploads/gr-img/enterprise-rack-servers-angle-1024.webp') center / cover no-repeat !important;
	border: 1px solid var(--od-border); border-radius: 16px; padding: 3rem 2.5rem !important; text-align: center;
}
.od-cta-band__inner .wp-block-group__inner-container { padding: 0 !important; }
.od-cta-band__inner h2 { font-size: clamp(1.5rem, 2.6vw, 2.05rem) !important; margin: 0 auto .75rem !important; max-width: 30ch; }
.od-cta-band__inner p { color: var(--od-body) !important; max-width: 38rem; margin: 0 auto !important; }
.od-cta-band__inner .od-btns { margin-top: 1.6rem; }
.od-nap { margin-top: 1.5rem !important; font-size: .9rem; color: var(--od-text) !important; font-weight: 500; }

/* responsive */
@media (max-width: 1024px) {
	.od-hero__grid, .od-why__grid { grid-template-columns: 1fr; }
	.od-glance { max-width: 460px; }
	.od-cardgrid--3 { grid-template-columns: repeat(2, 1fr); }
	.od-cardgrid--4 { grid-template-columns: repeat(2, 1fr); }
	.od-specs__grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
	.od-hero, body.page-id-13 #content .entry-content .wp-block-group.alignfull.od-hero:first-of-type, body.home #content .entry-content .wp-block-group.alignfull.od-hero { padding-top: 3.25rem !important; padding-bottom: 3rem !important;
		background:
			linear-gradient(180deg, rgba(11,18,32,.90) 0%, rgba(11,18,32,.84) 100%),
			url('/wp-content/uploads/gr-img/facility-cold-aisle-1024.webp') center / cover no-repeat,
			var(--od-bg) !important; }
	.od-hero__title { font-size: clamp(2rem, 8.5vw, 2.5rem) !important; }
	.od-hero__lead { font-size: 1.04rem !important; }
	.od-section { padding-top: 3.25rem !important; padding-bottom: 3.25rem !important; }
	.od-specs__grid { grid-template-columns: repeat(2, 1fr); row-gap: 1.1rem !important; }
	.od-cta-band__inner { padding: 2.25rem 1.25rem !important; }
	.od-cta-band__inner .od-btns .wp-block-button { flex: 1 1 100%; }
	.od-cta-band__inner .od-btns .wp-block-button__link { width: 100%; text-align: center; }
}
@media (max-width: 560px) {
	.od-cardgrid--3, .od-cardgrid--4 { grid-template-columns: 1fr; }
	.od-hero .od-btns .wp-block-button { flex: 1 1 auto; }
	.od-hero .od-btns .wp-block-button__link { width: 100%; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
	.od-card, .od-card:hover { transition: none; transform: none; }
}

/* menu button inside the opened mobile panel + book-a-visit bits */
.gr-floating-header .main-navigation.toggled .main-nav ul li.gr-menu-btn > a,
.gr-floating-header .main-navigation.toggled .main-nav ul li.gr-menu-btn > a:visited,
.main-navigation.toggled .main-nav ul li.gr-menu-btn > a { color: #0B1220 !important; background-color: var(--od-amber) !important; border-bottom: 0 !important; }
.gr-visit-facts li { color: var(--od-body); }
.gr-visit-facts li::before { background: var(--od-green) !important; }

/* photo grid used on Home (was an inline <style> inside the old Home content) */
.gr-quad { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: 16px; }
.gr-quad img { display: block; width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; border: 1px solid var(--od-border); }
@media (min-width: 641px) { .gr-quad { grid-template-columns: repeat(2, 1fr); gap: 20px; } }
@media (min-width: 1025px) { .od-facility-teaser .gr-quad { grid-template-columns: repeat(4, 1fr); max-width: none; } .od-facility-teaser .gr-quad img { aspect-ratio: 3 / 4; } }

/* client logo tiles (styles were inline in the old Home content) */
.gr-trusted-logos { max-width: 1080px; margin: 0 auto; text-align: center; }
.gr-trusted-caption { font-size: .85rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; margin: 0 0 1.75rem !important; }
.gr-trusted-grid { display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; gap: 1.25rem; }
.gr-logo-tile { display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 190px; height: 120px; padding: 1.25rem 1.5rem; transition: transform .2s ease, border-color .2s ease; }
.gr-logo-tile:hover { transform: translateY(-2px); border-color: var(--od-green) !important; }
.gr-logo-tile img { display: block; width: auto; height: 64px; max-width: 100%; object-fit: contain; border-radius: 6px; }
@media (max-width: 600px) { .gr-logo-tile { width: calc(50% - .75rem); height: 104px; } }

/* footer NAP line (printed by child functions.php on generate_before_copyright) */
.od-nap-footer { margin: 0 0 .4rem !important; color: var(--od-text) !important; font-weight: 500; font-size: .9rem; }

@media (max-width: 768px) {
	.gr-floating-header { padding-left: 12px !important; padding-right: 12px !important; }
	.gr-floating-header .main-navigation .menu-toggle { box-sizing: border-box; width: 42px !important; min-width: 42px !important; height: 42px !important; min-height: 42px !important; }
	.gr-nav-extras .gr-quote-btn { padding: .4em .65em !important; font-size: .85rem !important; }
	.entry-content .od-glance__title, .od-glance h2.od-glance__title { font-size: 1rem !important; }
}

/* header fit: logo + 7 menu items + Secure Your Data + phone on one row from 1101px; tighter 1101-1439px */
@media (min-width: 1101px) {
	.gr-floating-header { padding-left: 24px !important; padding-right: 24px !important; column-gap: 1.25rem; }
	.gr-floating-header .site-logo img, .gr-floating-header img.header-image, .gr-floating-header .custom-logo { height: 36px !important; }
	.gr-floating-header .main-navigation .inside-navigation { gap: .75rem !important; }
	.gr-floating-header .main-nav ul li a { font-size: .95rem !important; padding-left: .6rem !important; padding-right: .6rem !important; }
	.gr-floating-header .main-nav ul li.gr-menu-btn > a { padding: .55rem 1rem !important; margin-left: .45rem !important; font-size: .92rem !important; }
	.gr-floating-header .gr-nav-extras { gap: .5rem !important; }
	.gr-floating-header .gr-quote-btn { padding: .5rem .85rem !important; font-size: .88rem !important; line-height: 1.2 !important; }
	.gr-floating-header .gr-phone { width: 2.3em !important; height: 2.3em !important; }
}
@media (min-width: 1101px) and (max-width: 1439px) {
	.gr-floating-header { padding-left: 18px !important; padding-right: 18px !important; column-gap: .75rem; }
	.gr-floating-header .site-logo img, .gr-floating-header img.header-image, .gr-floating-header .custom-logo { height: 30px !important; }
	.gr-floating-header .main-navigation .inside-navigation { gap: .5rem !important; }
	.gr-floating-header .main-nav ul li a { font-size: .88rem !important; padding-left: .45rem !important; padding-right: .45rem !important; }
	.gr-floating-header .main-nav ul li.gr-menu-btn > a { padding: .5rem .8rem !important; margin-left: .3rem !important; font-size: .86rem !important; }
	.gr-floating-header .gr-quote-btn { padding: .45rem .7rem !important; font-size: .84rem !important; }
}
/* Services dropdown arrow spacing */
.gr-floating-header .main-nav ul li.menu-item-has-children > a { padding-right: .4rem !important; }
.gr-floating-header .main-nav .dropdown-menu-toggle { padding-left: .3rem !important; padding-right: 0 !important; }

/* ---- staging review fixes (2026-10-06) ---- */
/* mobile/tablet header: GP's 30px header padding pushed the hamburger off-screen at 390px */
@media (max-width: 1100px) {
	.gr-floating-header .inside-header { padding-left: 0 !important; padding-right: 0 !important; }
	.gr-floating-header > .main-navigation { margin-left: auto; min-width: 0; }
	.gr-floating-header .main-navigation .inside-navigation { gap: .4rem !important; }
}
@media (max-width: 400px) {
	.gr-nav-extras .gr-quote-btn { font-size: .8rem !important; padding: .4em .55em !important; }
	.gr-floating-header .gr-phone { width: 2.1em !important; height: 2.1em !important; }
}
/* no boxed background behind the current/hovered top-level nav item */
.main-navigation .main-nav > ul > li > a,
.main-navigation .main-nav > ul > li:hover > a,
.main-navigation .main-nav > ul > li[class*="current-menu"] > a { background-color: transparent !important; }
.main-navigation .main-nav ul li.gr-menu-btn > a { background-color: var(--od-amber) !important; }
/* pages built from plain blocks (no full-width sections), e.g. Services hub: give them a container */
.page .entry-content:not(:has(> .alignfull)) {
	max-width: var(--od-wrap); margin: 0 auto; padding: 3.25rem 1.25rem 4rem;
}
.page .inside-article:has(.entry-content:not(:has(> .alignfull))) .entry-header {
	max-width: var(--od-wrap); margin: 0 auto; padding: 3.5rem 1.25rem 0;
}
#content .entry-content .wp-block-group.has-border-color:not(.has-background) {
	background: var(--od-surface) !important; border-color: var(--od-border) !important; border-radius: var(--od-radius) !important;
}
#content .entry-content .wp-block-group.has-border-color:not(.has-background):hover { border-color: var(--od-green) !important; }
/* blog index: centred column + header */
.blog .content-area, .archive .content-area { width: 100% !important; float: none !important; }
.blog .is-right-sidebar, .blog .sidebar { display: none !important; }
.od-blog-head { max-width: 900px; margin: 3rem auto 1.5rem; padding: 0 1.25rem; }
.od-blog-head h1 { font-size: clamp(2rem, 4vw, 2.75rem) !important; margin: 0 0 .5rem !important; }
.od-blog-head p:last-child { color: var(--od-muted); margin: 0; font-size: 1.05rem; }
@media (min-width: 769px) { .blog .site-main { max-width: 900px !important; margin-left: auto !important; margin-right: auto !important; } }
/* single post sidebar widgets */
.single .sidebar .widget, .single .inside-right-sidebar .widget { background: var(--od-surface) !important; padding: 1.25rem 1.4rem !important; }
.sidebar .widget ul li a, .sidebar .widget a { color: var(--od-body) !important; }
.sidebar .widget ul li a:hover { color: var(--od-green) !important; }
/* ======================= END OSBORNE DARK ======================= */