/* ==========================================================================
   Design refresh tokens — extracted from the site's own compiled Brizy
   button colours (#094c44 / #073d36), not invented.
   ========================================================================== */
:root {
	--ir-color-primary-green: #094c44;
	--ir-color-primary-green-hover: #073d36;
	--ir-color-deep-forest: #052e29;
	--ir-color-light-bg: #f7f6f2;
	--ir-color-dark-charcoal: #1f2422;
	--ir-space-section: clamp(4rem, 8vw, 8rem);
}

/* ==========================================================================
   Hero video — dark gradient overlay for text legibility.
   Additive only: layers on top of Brizy's existing video background,
   does not alter Brizy's own markup or styles.
   ========================================================================== */
.brz-bg-video {
	position: relative;
}
.brz-bg-video::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		135deg,
		rgba(5, 46, 41, 0.88) 0%,
		rgba(9, 76, 68, 0.58) 45%,
		rgba(5, 46, 41, 0.82) 100%
	);
	pointer-events: none;
	z-index: 1;
}

/* ==========================================================================
   Global CTA widget
   ========================================================================== */
.ir-global-cta-block {
	background: linear-gradient(135deg, var(--ir-color-deep-forest) 0%, var(--ir-color-primary-green) 100%);
	padding: var(--ir-space-section) clamp(1.5rem, 5vw, 4rem);
}
.ir-container-asymmetric {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 3fr 2fr;
	gap: clamp(1.5rem, 4vw, 3rem);
	align-items: center;
}
.ir-cta-heading {
	color: #fff;
	font-size: clamp(1.75rem, 3vw, 2.5rem);
	line-height: 1.15;
	margin: 0 0 0.75rem;
}
.ir-cta-lead {
	color: rgba(255, 255, 255, 0.85);
	line-height: 1.65;
	margin: 0;
	max-width: 46ch;
}
.ir-cta-action-zone {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.75rem;
}
/* Gold is the sitewide signal for "this leads to ordering a certificate"
   (see .ir-btn-gold in homepage.css) — this closing CTA is the biggest
   instance of that on every page it appears. Defined again here (not just
   in homepage.css) because this design-refresh.css file loads on every
   single page unconditionally, while homepage.css only loads on the
   templates rebuilt so far — so a plain WP page that still gets this CTA
   injected via the_content, but hasn't been rebuilt yet, still needs a
   correctly-styled button. Two classes (0,0,2,0) reliably beat the theme's
   .site-content a{color:#6969d2} (0,0,1,1) regardless of load order. */
.ir-global-cta-block .ir-btn-gold {
	display: inline-block;
	background: #a39161;
	color: #fff;
	font-family: 'Nunito', sans-serif;
	font-weight: 800;
	text-decoration: none;
	padding: 0.9rem 1.75rem;
	border-radius: 4px;
	transition: background 0.2s ease, transform 0.2s ease;
}
.ir-global-cta-block .ir-btn-gold:hover {
	background: #8c7d51;
	transform: translateY(-1px);
}
.ir-cta-subtext {
	color: rgba(255, 255, 255, 0.65);
	font-size: 0.85rem;
}

@media (max-width: 782px) {
	.ir-container-asymmetric {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   Sitewide reskin of Brizy's EXISTING content via its own global tokens.
   Brizy already exposes every "Global Color" and heading/paragraph text
   preset as a CSS custom property at :root, and existing content already
   references them (brz-cp-color1..8 classes, brz-tp-lg-headingN presets).
   Overriding the variables restyles all existing content automatically —
   no Brizy data/JSON touched, nothing duplicated.

   `html:root` (not bare :root) is used so these reliably out-specificity
   Brizy's own inline :root block regardless of stylesheet load order.
   ========================================================================== */
html:root {
	/* Global color 2 is the site's existing brand green (used on ~30 elements
	   per page: headings, accents). Aligning it to the same hex already used
	   for buttons (#094c44) unifies two near-identical greens into one. */
	--brz-global-color2: 9, 76, 68;

	/* Global color 6 was a lavender-tinted off-white background swatch;
	   moved to a true clean off-white per the brief. */
	--brz-global-color6: 247, 246, 242;

	/* Global color 7 was a flat charcoal (#383838); given a very slight
	   green undertone so it reads as part of the same palette. */
	--brz-global-color7: 31, 36, 34;

	/* Heading rhythm: tighter line-height for a more editorial, less
	   "AI template" feel, per the brief's 1.1-1.2 target. */
	--brz-heading1lineheight: 1.12;
	--brz-heading1letterspacing: -1.5px;
	--brz-heading3lineheight: 1.2;

	/* Body copy: existing paragraphs were semi-bold (600) at 1.5 line-height;
	   lightened weight and opened up line-height for legibility per brief. */
	--brz-paragraphfontweight: 400;
	--brz-paragraphbold: 400;
	--brz-paragraphlineheight: 1.7;
}

/* ==========================================================================
   Hero polish — restyles the EXISTING hero heading/text over the existing
   video background (Bragg.com-style: large, tight, high-contrast type),
   without touching Brizy's content. Scoped to the section that actually
   contains the video so it can't leak onto unrelated headings site-wide.
   ========================================================================== */
.brz-section:has(.brz-bg-video) h1 {
	font-size: clamp(2.75rem, 6vw, 4.75rem) !important;
	line-height: 1.05 !important;
	letter-spacing: -0.02em !important;
	text-shadow: 0 2px 28px rgba(0, 0, 0, 0.4);
}
.brz-section:has(.brz-bg-video) p {
	text-shadow: 0 1px 14px rgba(0, 0, 0, 0.35);
}