/* stylelint-disable stylistic/max-line-length */

:root {
	--color-bg: #fff;
	--color-heading-blue: #0250d9;
	--color-heading-dark: #03234d;
	--color-text: #03234d;
	--color-text-secondary: #455a7e;
	--color-border: #d8dfe8;
	--color-surface: #f2f5f9;
	--color-dark-start: #03234d;
	--color-dark-end: #066afe;
	--color-white: #fff;
	--color-accent: #066afe;
	--color-accent-hover: #0250d9;
	--color-accent-deep: #022ac0;
	--color-share-icon-bg: #0469c1;
	--color-debug-value: #7ec4f8;
  
	/* Overlay scrims (blocker, hero, portrait, parallax, perspectives): use rgba(var(--color-overlay-rgb), opacity) */
	--color-overlay-rgb: 3, 35, 77;

	--font-display: "ITC Avant Garde", sans-serif;
	--font-body: "Salesforce Sans", sans-serif;
	--font-custom: "Salesforce Sans", sans-serif;
 
	/* Typography scale */
	--h-display-size: clamp(2.25rem, 4.5vw + 0.5rem, 4rem); /* 64px / 36px */
	--h-display-weight: 600;
	--h-display-leading: 1;
	--h-alt-size: clamp(2rem, 4vw + 0.5rem, 3.75rem); /* 60px / 32px */
	--h-alt-weight: 300;
	--h-alt-leading: 1;
	--h-md-size: clamp(1.125rem, 0.8vw + 0.75rem, 1.375rem); /* 22px / 18px */
	--h-md-weight: 600;
	--h-md-leading: 1.55;
	--body-size: clamp(1rem, 0.4vw + 0.8rem, 1.125rem); /* 18px / 16px */
	--body-weight: 400;
	--body-leading: 1.55;
	--body-tracking: 0.0012em;
	--lede-size: clamp(1.125rem, 0.6vw + 0.85rem, 1.375rem); /* 22px / 18px */
	--lede-weight: 600;
	--lede-leading: 1.5;
  
	/* Quote display (e.g. hurdle pull quotes) */
	--quote-display-size: 2.375rem; /* 38px / 38px */
	--quote-display-leading: 1.16; /* ~116% */
	--quote-display-tracking: -0.01em; /* -1% */
	--quote-gradient-light: linear-gradient(72.13deg, #90d0fe -27.06%, #fff 142.93%);
  
	/* Spacing */
	--sp-xs: 0.5rem;
	--sp-sm: 1rem;
	--sp-md: 1.5rem;
	--sp-md-2: 2rem;
	--sp-lg: 2.5rem;
	--sp-lg-2: 3rem;
	--sp-lg-3: 3.875rem;
	--sp-xl: 4rem;
	--sp-2xl: 6rem;
	--sp-3xl: 8rem;
	--sp-4xl: 10rem;
  
	/* Blocker #1: stronger pull-up to reduce wide-screen curve gaps */
	--ig-blocker-1-overlap: clamp(6rem, 18vw, 14rem);
  
	/* Blocker #2 → hurdle-2 (white): overlap under masked curve */
	--ig-blocker-2-overlap: clamp(4rem, 14vw, 8.5rem);
  
	/* Blocker #3 → hurdle-3 (dark): same curve as blocker 2 */
	--ig-blocker-3-overlap: clamp(4rem, 14vw, 8.5rem);
  
	/* Blocker #4 → summary: same curve as blocker 1 (needs more overlap at wide breakpoints) */
	--ig-blocker-4-overlap: clamp(4.5rem, 15vw, 10rem);
  
	/* Blocker #6 → hurdle-6: same curve family as blocker 1/4 */
	--ig-blocker-6-overlap: clamp(4.5rem, 15vw, 10rem);
  
	/* Paint extra next-section background upward behind blocker curves to reduce wide-screen gaps */
	--ig-next-section-top-bleed: clamp(14rem, 28vw, 28rem);
  
	/* Extra overlap to hide subpixel anti-alias seams between curve and next section */
	--ig-curve-seam-fix: 4px;
  
	/*
	 * Mask artboards: L = blocker 1 & 4 (1440×644), R = blocker 2 & 3 (1440×691).
	 * Inline base64 so masks load without path/CORS issues.
	 */
	--ig-blocker-curve-mask-l: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNDQwIDY0NCI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTAgNjQ0QzMyNi41MjggNTQ4Ljk3OCA2NzEuMjExIDQ5OC4xMTMgMTAyNy41IDQ5OC4xMTNDMTE2Ni45MSA0OTguMTEzIDEzMDQuNTQgNTA1LjkgMTQ0MCA1MjEuMDc0VjBIMEwwIDY0NFoiLz48L3N2Zz4=");
	--ig-blocker-curve-mask-r: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNDQwIDY5MSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE0NDAgNjkxQzExMTMuNDcgNTg5LjA0MyA3NjguNzg5IDUzNC40NjYgNDEyLjUgNTM0LjQ2NkMyNzMuMDkgNTM0LjQ2NiAxMzUuNDY0IDU0Mi44MjIgMCA1NTkuMTAyVjBIMTQ0MEwxNDQwIDY5MVoiLz48L3N2Zz4=");
	--ig-blocker-curve-mask-top: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQ0MCIgaGVpZ2h0PSIxMDg2IiB2aWV3Qm94PSIwIDAgMTQ0MCAxMDg2IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMTc1MSAwQzEyNjAuNzUgMTQyLjY1MiA3NDMuMjUgMjE5LjAxMyAyMDguMzIyIDIxOS4wMTNDLTAuOTg2NDUgMjE5LjAxMyAtMjA3LjYxNiAyMDcuMzIyIC00MTEgMTg0LjU0M0wtNDEwLjk5NyAxMDg2SDE3NTFMMTc1MSAwWiIgZmlsbD0iI0M0QzRDNCIvPgo8L3N2Zz4K");
  
	/* Containers */
	--container-max: 1110px;
	--container-narrow: 48rem;
	--container-pad: 1.5rem;
	--grid-gap: clamp(1.5rem, 2.5vw, 2.5rem);
	--sticky-bar-h: 3.25rem;
  
	/* Hero meta / lede share sidebar — same width so they align on the viewport */
	--sidebar-meta-width: 257px;
  
	/* Easing */
	--ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
	--ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
}
  
/* ==========================================================================
	 RESET & BASE
	 ========================================================================== */
  
*,
*::before,
*::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
  
html {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-size-adjust: 100%;
}
  
html.lenis,
html.lenis body {
	height: auto;
}
  
.lenis.lenis-smooth {
	scroll-behavior: auto !important;
}
  
body {
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: var(--body-size);
	font-weight: var(--body-weight);
	letter-spacing: var(--body-tracking);
	line-height: var(--body-leading);
	overflow-x: hidden;
}
  
img {
	display: block;
	height: auto;
	max-width: 100%;
}
  
a {
	color: inherit;
	text-decoration: underline;
	text-decoration-color: currentcolor;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.12em;
	transition: text-decoration-thickness 0.2s ease, text-underline-offset 0.2s ease;
}
  
a:hover,
a:focus-visible {
	text-decoration-thickness: 2px;
	text-underline-offset: 0.16em;
}
  
button {
	background: none;
	border: none;
	cursor: pointer;
	font: inherit;
}
  
/* Layout & Typography */
  
/* ==========================================================================
	 LAYOUT — Container & grid
	 ========================================================================== */
  
.ig-container {
	margin: 0 auto;
	max-width: var(--container-max);
	padding-left: var(--container-pad);
	padding-right: var(--container-pad);
	width: 100%;
}
  
.ig-container--narrow {
	max-width: var(--container-narrow);
}
  
.ig-grid {
	display: grid;
	gap: var(--grid-gap);
	grid-template-columns: 1fr;
}
  
@media (min-width: 48em) {

	.ig-grid--2col {
		grid-template-columns: repeat(2, 1fr);
	}
  
	.ig-grid--3col {
		grid-template-columns: repeat(3, 1fr);
	}
  
	.ig-grid--sidebar {

		/* Match ig-lede-row and ig-hero__content: main content flexible, sidebar fixed */
		grid-template-columns: minmax(0, 1fr) var(--sidebar-meta-width);
	}
}
  
.ig-grid--v-center {
	align-items: center;
}
  
.ig-container--center {
	text-align: center;
}
  
/* Centered narrow text block (max-width 36rem, content centered) */
  
.ig-container--narrow-text {
	margin-left: auto;
	margin-right: auto;
	max-width: 36rem;
	text-align: center;
}
  
/* Icon size modifiers (e.g. summary panel) */
  
.ig-icon--sm {
	height: 1rem;
	width: 1rem;
}
  
.ig-icon--md {
	height: 1.25rem;
	width: 1.25rem;
}
  
/* Narrow centered content (e.g. hurdle-steps body text) */
  
.ig-body--narrow {
	margin-left: auto;
	margin-right: auto;
	max-width: 36rem;
}
  
/* Portrait quote content width */
  
.ig-max-width-content {
	margin-left: auto;
	margin-right: auto;
	max-width: 42rem;
}
  
/* ==========================================================================
	 TYPOGRAPHY — Heading styles, body utilities, spacing helpers
	 All font sizing is centralized here.
	 ========================================================================== */
  
.ig-h-display {
	font-family: var(--font-display);
	font-size: var(--h-display-size);
	font-weight: var(--h-display-weight);
	line-height: var(--h-display-leading);
}
  
.ig-section--white .ig-h-display {
	color: var(--color-heading-blue);
	max-width: 55rem;
}
  
.ig-section--dark .ig-h-display {
	color: var(--color-white);
}
  
.ig-h-alt {
	font-family: var(--font-body);
	font-size: var(--h-alt-size);
	font-style: italic;
	font-weight: var(--h-alt-weight);
	letter-spacing: -0.008em;
	line-height: var(--h-alt-leading);
}
  
.ig-section--white .ig-h-alt {
	color: var(--color-heading-dark);
}
  
.ig-section--dark .ig-h-alt {
	color: var(--color-white);
}
  
.ig-h-md {
	font-family: var(--font-display);
	font-size: var(--h-md-size);
	font-weight: var(--h-md-weight);
	line-height: var(--h-md-leading);
}
  
.ig-lede {
	color: var(--color-text);
	font-family: var(--font-display);
	font-size: var(--lede-size);
	font-weight: var(--lede-weight);
	line-height: var(--lede-leading);
}
  
.ig-body p + p {
	margin-top: var(--sp-md);
}
  
/* Inline links in editorial body copy */
  
.ig-body p a {
	color: inherit;
}
  
/* Spacing utilities */
  
.ig-mt-sm {
	margin-top: var(--sp-sm);
}
  
.ig-mt-md {
	margin-top: var(--sp-md);
}
  
.ig-mt-lg {
	margin-top: var(--sp-lg);
}
  
.ig-mt-xl {
	margin-top: var(--sp-xl);
}
  
.ig-mt-2xl {
	margin-top: var(--sp-2xl);
}
  
.ig-mb-md {
	margin-bottom: var(--sp-md);
}
  
.ig-mb-lg {
	margin-bottom: var(--sp-lg);
}
  
.ig-mb-xl {
	margin-bottom: var(--sp-xl);
}
  
/* ==========================================================================
	 SECTIONS — Background & padding variants
	 ========================================================================== */
  
.ig-section {
	padding-bottom: var(--sp-3xl);
	padding-top: var(--sp-3xl);
	position: relative;
}
  
.ig-section--white {
	background: var(--color-bg);
	color: var(--color-text);
}
  
.ig-section--dark {
	background: linear-gradient(159.24deg, var(--color-dark-start) 1.25%, var(--color-dark-end) 99.08%);
	color: var(--color-white);
}
  
.ig-section--compact {
	padding-bottom: var(--sp-2xl);
	padding-top: var(--sp-2xl);
}
  
.ig-section--flush {
	padding-bottom: 0;
	padding-top: 0;
}
  
.ig-section--center {
	text-align: center;
}
  
.ig-section--bg-transparent {
	background: transparent;
}
  
.ig-section--pt-xl {
	padding-top: var(--sp-xl);
}
  
.ig-section__content {
	position: relative;
	z-index: 1;
}
  
/* Components */
  
/* ==========================================================================
	 BUTTON — Shared primitive for toolbar, CTA, and final section
	 Class order: ig-btn (block) then shape, variant, size modifiers.
	 ========================================================================== */
  
.ig-btn {
	align-items: center;
	border: none;
	cursor: pointer;
	display: inline-flex;
	font-family: var(--font-body);
	font-weight: 600;
	gap: 0.375rem;
	justify-content: center;
	text-decoration: none;
	transition: background 0.2s ease, box-shadow 0.2s ease, color 0.2s ease, border-color 0.2s ease;
	white-space: nowrap;
}
  
.ig-btn .ig-icon {
	flex-shrink: 0;
	height: 22px;
	vertical-align: middle;
	width: 22px;
}
  
/* Size: small (toolbar) */
  
.ig-btn--sm {
	font-size: 0.8125rem;
	padding: 20px;
}
  
/* Size: medium (CTA, default) */
  
.ig-btn--md {
	font-size: 1rem;
	padding: 0.875rem 1.75rem;
}
  
/* Size: CTA (slightly larger horizontal padding) */
  
.ig-btn--cta {
	font-size: 1.25rem;
	padding: 1rem 2.5rem;
}
  
/* Shape: pill (toolbar, final section) */
  
.ig-btn--pill {
	border-radius: 2rem;
}
  
/* Shape: rounded (CTA) */
  
.ig-btn--rounded {
	border-radius: 4px;
}
  
/* Primary: blue fill (toolbar, CTA) */
  
.ig-btn--primary {
	background: var(--color-accent);
	box-shadow: 0 2.23px 3.35px 0 rgba(0, 0, 0, 0.07);
	color: var(--color-white);
}
  
.ig-btn--primary:hover {
	background: var(--color-accent-hover);
}
  
/* Primary on light background (final section "Subscribe now") */
  
.ig-btn--primary-on-light {
	background: var(--color-white);
	color: var(--color-accent-deep);
}
  
.ig-btn--primary-on-light:hover {
	background: #e8f2ff;
	color: var(--color-accent-deep);
}
  
/* Secondary: outline on dark (final section "Get updates") */
  
.ig-btn--secondary {
	background: transparent;
	border: 2px solid var(--color-white);
	color: var(--color-white);
}
  
.ig-btn--secondary:hover {
	background: rgba(255, 255, 255, 0.15);
	color: var(--color-white);
}
  
/* AI gradient (toolbar) */
  
.ig-btn--ai {
	background: linear-gradient(96.25deg, #066afe 1.56%, #ba01ff 99.01%);
	color: var(--color-white);
}
  
.ig-btn--ai:hover {
	background: linear-gradient(96.25deg, #0558e0 1.56%, #a001e0 99.01%);
}
  
/* ==========================================================================
	 SHARE — Shared block for share label + icon (toolbar and lede)
	 ========================================================================== */
  
.ig-share-label {
	color: var(--color-heading-blue);
	font-size: 0.8125rem;
	font-weight: 600;
	white-space: nowrap;
}
  
.ig-share-icon {
	align-items: center;
	background: var(--color-share-icon-bg);
	border-radius: 12px;
	color: var(--color-white);
	display: flex;
	height: 41px;
	justify-content: center;
	opacity: 1;
	position: relative;
	transition: background 0.2s ease;
	width: 41px;
}
  
.ig-share-icon:hover {
	background: var(--color-accent);
}
  
.ig-share-icon .ig-icon {
	height: auto;
	width: 1.3125rem;
}
  
.ig-share-icon.is-copied {
	background: var(--color-accent);
}
  
/* Copy tooltip (used by ShareLinks.js) */
  
.ig-share-tooltip {
	background: var(--color-heading-dark);
	border-radius: 0.25rem;
	color: var(--color-white);
	font-size: 0.75rem;
	font-weight: 600;
	left: 50%;
	margin-top: 0.375rem;
	opacity: 0;
	padding: 0.375rem 0.625rem;
	pointer-events: none;
	position: absolute;
	top: 100%;
	transform: translateX(-50%);
	transition: opacity 0.2s ease, visibility 0.2s ease;
	visibility: hidden;
	white-space: nowrap;
	z-index: 1000;
}
  
.ig-share-tooltip.is-visible {
	opacity: 1;
	visibility: visible;
}
  
.ig-share-tooltip::after {
	border: 0.25rem solid transparent;
	border-bottom-color: var(--color-heading-dark);
	bottom: 100%;
	content: "";
	left: 50%;
	margin-left: -0.25rem;
	position: absolute;
}
  
/* ==========================================================================
	 HERO
	 ========================================================================== */
  
.ig-hero {
	align-items: flex-end;
	background: linear-gradient(160deg, #3b8beb 0%, #5aaef5 40%, #7ec4f8 100%);
	display: flex;
	flex-direction: column;
	min-height: 60vh;
	overflow: hidden;
	position: relative;
	width: 100%;
}

.ig-hero__avatar-link {
	text-decoration: none;
}

.ig-hero__avatar-link:hover {
	text-decoration: none;
}
  
.ig-hero__media {
	inset: 0;
	position: absolute;
	z-index: 1;
}
  
.ig-hero__media img {
	height: 100%;
	object-fit: cover;
	object-position: center bottom;
	width: 100%;
}
  
.ig-hero__media::after {
	background: linear-gradient(0deg, rgba(var(--color-overlay-rgb), 0.6) 0%, transparent 55%);
	content: "";
	inset: 0;
	position: absolute;
	z-index: 1;
}
  
.ig-hero__content {
	align-items: flex-end;
	display: flex;
	gap: var(--sp-2xl);
	justify-content: space-between;
	margin: 0 auto;
	max-width: var(--container-max);
	min-height: 60vh;
	position: relative;
	width: 100%;
	z-index: 2;
}
  
.ig-hero__head {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	height: 100%;
	justify-content: space-between;
	min-width: 0;
	padding: var(--sp-xl) var(--container-pad) var(--sp-lg-2);
}
  
.ig-hero__category {
	color: var(--color-white);
	font-family: var(--font-body);
	font-size: 30px;
	font-style: italic;
	font-weight: 300;
	letter-spacing: var(--body-tracking);
	line-height: var(--body-leading);
	margin-bottom: var(--sp-md);
	margin-top: 90px;
	opacity: 0.85;
}

.ig-hero__category a {
	text-decoration: none;
}

.ig-hero__category a:hover {
	text-decoration: underline;
}
  
.ig-hero__title {
	color: var(--color-white);
	font-family: var(--font-display);
	font-size: clamp(2.5rem, 5vw + 0.5rem, 4.5rem);
	font-weight: 600;
	line-height: 1.05;
}
  
/* Mobile: title + subheading on one line below hero; single gradient spans entire block */
  
.ig-hero__headline-row {
	padding: 0 var(--container-pad) var(--sp-lg-2);
	position: relative;
	width: 100%;
}
  
.ig-hero__headline-gradient {
	align-items: baseline;
	background: linear-gradient(180deg, #0250d9 0%, #012a73 100%);
	background-clip: text;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	gap: 0;
}
  
.ig-hero__headline-gradient .ig-hero__title,
.ig-hero__headline-gradient .ig-h-display {
	color: transparent;
}
  
.ig-hero__headline-gradient .ig-hero__title {
	flex-shrink: 1;
	min-width: 0;
}
  
.ig-hero__headline-gradient .ig-h-display {
	flex-shrink: 0;
}
  
.ig-hero__head .ig-hero__title {
	display: none;
}
  
/* Mobile: hide meta in hero (shown below in intro) */
  
.ig-hero__content .ig-hero__meta {
	display: none;
}
  
@media (min-width: 48em) {

	.ig-hero {
		flex-direction: row;
		min-height: 80vh;
	}
  
	.ig-hero__content {
		height: 80vh;
		min-height: 0;
	}
  
	.ig-hero__content .ig-hero__meta {
		display: flex;
	}
  
	.ig-hero__headline-row {
		display: none;
	}
  
	.ig-hero__meta-row {
		display: none;
	}
  
	.ig-hero__head .ig-hero__title {
		display: block;
		font-size: 4rem;
	}
}
  
/* Meta row below headline on mobile only */
  
.ig-hero__meta-row {
	padding: 0 var(--container-pad) var(--sp-sm);
	width: 100%;
  
	@media (min-width: 48em) {
		padding: 0 var(--container-pad) var(--sp-lg-2);
	}
}
  
.ig-hero__meta-row .ig-hero__meta {
	align-items: flex-start;
	border-left-color: var(--color-border);
	color: var(--color-text);
	min-width: 0;
	padding-left: var(--sp-md-2);
	width: auto;
}
  
.ig-hero__meta-row .ig-hero__avatars img {
	border-color: rgba(var(--color-overlay-rgb), 0.25);
}
  
.ig-hero__meta-row .ig-hero__byline {
	opacity: 1;
}
  
.ig-hero__meta {
	align-items: center;
	border-left: 2px solid #ffffff91;
	color: var(--color-white);
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
	gap: var(--sp-md-2);
	margin-top: 0;
	min-width: var(--sidebar-meta-width);
	padding-left: var(--sp-lg);
	width: var(--sidebar-meta-width);
}
  
.ig-hero__avatars {
	display: flex;
	width: 100%;
}
  
.ig-hero__avatars img {
	border: 2px solid rgba(255, 255, 255, 0.4);
	border-radius: 50%;
	height: 2.75rem;
	margin-left: -0.5rem;
	object-fit: cover;
	width: 2.75rem;
}
  
.ig-hero__avatars img:first-child {
	margin-left: 0;
}
  
.ig-hero__byline {
	font-size: 0.9375rem;
	line-height: 1.4;
	opacity: 0.9;
  
	@media (min-width: 48em) {
		padding-bottom: var(--sp-lg-2);
	}
}
  
/* ==========================================================================
	 STICKY TOOLBAR + SUMMARY
	 ========================================================================== */
  
.ig-sticky-header {
	background: var(--color-bg);
	position: sticky;
	top: 73px;
	transition: box-shadow 0.3s ease, border-color 0.3s ease;
	z-index: 100;
}

body.admin-bar .ig-sticky-header {
	top: 105px;
}

.ig-sticky-header.is-scroll-up {
	top: 145px;
}

body.admin-bar .ig-sticky-header.is-scroll-up {
	top: 177px;
}
  
.ig-sticky-header.is-stuck {
	border-bottom: 1px solid var(--color-border);
	box-shadow: 0 2px 12px rgba(var(--color-overlay-rgb), 0.08);
}
  
.ig-toolbar {
	background: transparent;
	position: relative;
}
  
.ig-toolbar-sentinel {
	height: 0;
	pointer-events: none;
	width: 100%;
}
  
.ig-toolbar__inner {
	align-items: center;
	display: flex;
	gap: var(--sp-sm);
	margin: 0 auto;
	max-width: var(--container-max);
	min-height: var(--sticky-bar-h);
	padding: 0.625rem var(--container-pad);
}
  
/* Toolbar uses shared .ig-btn primitive */
  
.ig-toolbar .ig-btn {
	flex-shrink: 0;
}
  
/* Mobile: scroll horizontally so all buttons fit without cutting off */
  
@media (width <= 80em) {

	.ig-sticky-header {
		top: 56px;
	}

	body.admin-bar .ig-sticky-header {
		top: 86px;
	}

	.ig-sticky-header.is-scroll-up {
		top: 112px;
	}

	body.admin-bar .ig-sticky-header.is-scroll-up {
		top: 142px;
	}
}

@media (width <= 47.9375em) {

	.ig-sticky-header {
		-webkit-overflow-scrolling: touch;
		overflow-x: auto;
		overflow-y: hidden;
		scrollbar-width: none;
		top: 56px;
	}

	body.admin-bar .ig-sticky-header {
		top: 86px;
	}

	.ig-sticky-header.is-scroll-up {
		top: 112px;
	}

	body.admin-bar .ig-sticky-header.is-scroll-up {
		top: 142px;
	}
  
	.ig-sticky-header::-webkit-scrollbar {
		display: none;
	}
  
	.ig-toolbar__inner {
		flex-wrap: nowrap;
		max-width: none;
		width: max-content;
	}
  
	.ig-toolbar__spacer {
		display: none;
	}
  
	.ig-toolbar .ig-btn {
		flex-shrink: 0;
		font-size: 10px;
		padding: 0.5rem 0.75rem;
	}
}
  
.ig-toolbar__spacer {
	flex: 1;
}
  
/* Share buttons — hidden until user scrolls past lede section */
  
.ig-toolbar__share {
	align-items: center;
	display: flex;
	gap: 0.5rem;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.25s ease, visibility 0.25s ease;
	visibility: hidden;
}
  
.ig-sticky-header.has-passed-lede .ig-toolbar__share,
.ig-toolbar.has-passed-lede .ig-toolbar__share {
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}
  
/* Share label and icon styles live in _share.css (.ig-share-label, .ig-share-icon) */
  
.ig-toolbar-spacer {
	display: none;
	height: var(--sticky-bar-h);
}
  
.ig-toolbar-spacer.is-visible {
	display: block;
}
  
/* ==========================================================================
	 LEDE — Two-column layout (lede left, share right) + share block
	 ========================================================================== */
  
.ig-lede-row {
	align-items: flex-start;
	display: flex;
	gap: var(--sp-lg-3);
	justify-content: space-between;
}
  
.ig-lede-row__text {
	flex: 1 1 auto;
	min-width: 0;
}

.ig-lede-row__text p {
	font-family: var(--font-display);
	font-size: var(--h-md-size);
	font-weight: 600;
	letter-spacing: 0.12%;
	line-height: 1.55;
}
  
.ig-lede__share {
	align-items: center;
	border-left: 2px solid #0469c1;
	display: flex;
	flex-direction: row;
	flex-shrink: 0;
	flex-wrap: wrap;
	gap: var(--sp-sm);
	min-width: var(--sidebar-meta-width);
	padding-left: var(--sp-md-2);
	width: var(--sidebar-meta-width);
}
  
/* Share icon/label styles in _share.css; lede only overrides layout (flex order) */
  
.ig-lede__share .ig-share-label {
	order: 2;
	width: 100%;
}
  
.ig-lede__share .ig-share-icon {
	display: inline-flex;
	order: 1;
}
  
/* ==========================================================================
	 TABLE OF CONTENTS DROPDOWN
	 ========================================================================== */
  
.ig-toc-dropdown {
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: 0.5rem;
	box-shadow: 0 8px 32px rgba(var(--color-overlay-rgb), 0.12);
	left: var(--container-pad);
	max-width: calc(100vw - 2rem);
	opacity: 0;
	padding: var(--sp-sm) 0;
	position: absolute;
	top: 100%;
	transform: translateY(-0.5rem);
	transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
	visibility: hidden;
	width: 20rem;
	z-index: 101;
}
  
.ig-toc-dropdown.is-open {
	opacity: 1;
	transform: translateY(0);
	visibility: visible;
}
  
.ig-toc-dropdown a {
	color: var(--color-text);
	display: block;
	font-size: 0.875rem;
	padding: 0.5rem 1.25rem;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}
  
.ig-toc-dropdown a:hover {
	background: var(--color-surface);
	color: var(--color-heading-blue);
}
  
.ig-toc-dropdown a.is-active {
	color: var(--color-heading-blue);
	font-weight: 600;
}
  
/* Mobile: use fixed positioning so dropdown isn't clipped by toolbar overflow */
  
@media (width <= 47.9375em) {

	.ig-toc-dropdown {
		left: var(--container-pad);
		max-height: calc(100vh - var(--sticky-bar-h) - 1rem);
		overflow-y: auto;
		position: fixed;
		right: var(--container-pad);
		top: var(--sticky-bar-h);
		width: auto;
	}
}
  
/* ==========================================================================
	 INTRO
	 ========================================================================== */
  
.ig-intro {
	background: var(--color-bg);
	padding-top: var(--sp-lg);
}
  
#ig-intro-body {
	padding-top: 2rem;
}
  
.ig-intro__heading {
	display: none;
	margin-bottom: var(--sp-sm);
}
  
@media (min-width: 48em) {

	.ig-intro__heading {
		display: block;
	}
}
  
/* ==========================================================================
	 PULL QUOTE
	 ========================================================================== */
  
.ig-quote {
	position: relative;
}
  
.ig-quote__mark {
	color: var(--color-accent);
	display: block;
	font-family: var(--font-display);
	font-size: clamp(3rem, 5vw, 4.5rem);
	font-weight: 600;
	line-height: 0.8;
	margin-bottom: var(--sp-sm);
	user-select: none;
}
  
.ig-section--dark .ig-quote__mark {
	color: rgba(255, 255, 255, 0.5);
}
  
.ig-quote__text {
	color: var(--color-heading-blue);
	font-family: var(--font-display);
	font-size: clamp(1.25rem, 1.8vw + 0.5rem, 1.625rem);
	font-weight: 600;
	line-height: 1.4;
}
  
.ig-section--dark .ig-quote__text {
	color: var(--color-white);
}
  
.ig-quote__attr {
	font-size: 0.9375rem;
	line-height: 1.5;
	margin-top: var(--sp-md);
}
  
.ig-quote__name {
	font-weight: 600;
}
  
.ig-quote__role {
	opacity: 0.75;
}
  
.ig-quote--gradient-light .ig-quote__text {
	background: var(--quote-gradient-light);
	background-clip: text;
	color: transparent;
	font-family: var(--font-display);
	font-size: var(--quote-display-size);
	font-weight: var(--h-display-weight);
	letter-spacing: var(--quote-display-tracking);
	line-height: var(--quote-display-leading);
}
  
.ig-quote--gradient-light .ig-quote__mark {
	display: block;
	font-size: 0;
	height: auto;
	line-height: 0;
	max-width: clamp(3rem, 5vw, 4.5rem);
	width: auto;
}
  
/* Match the portrait quote treatment within solution section */
  
#ig-solution-1 .ig-quote {
	margin-bottom: calc(var(--sp-xl) + var(--sp-sm)); /* ~80px */
	margin-top: calc(var(--sp-2xl) + var(--sp-3xl) / 4); /* ~124px */
}
  
#ig-solution-1 .ig-quote__mark {
	display: block;
	font-size: 0;
	height: 45px;
	line-height: 0;
	object-fit: contain;
	width: 63px;
}
  
#ig-solution-1 .ig-quote__text {
	color: var(--color-white);
	font-size: clamp(1.5rem, 2.5vw + 0.5rem, 2.25rem);
}
  
#ig-solution-1 .ig-quote__attr {
	color: var(--color-white);
	font-family: var(--font-body);
	font-size: 18px;
	font-style: normal;
	font-weight: 700;
	letter-spacing: 0.0012em;
	line-height: 1.55;
}
  
#ig-solution-1 .ig-quote__name {
	font-style: normal;
	font-weight: 700;
	opacity: 1;
}

#ig-solution-1 .ig-quote__role {
	font-style: normal;
	font-weight: 500;
	opacity: 1;
}
  
/* Hurdle 4 quote variant: light gradient text + compact quote mark */
.ig-quote--hurdle-4 {
	margin-top: 4rem;
}

.ig-quote--hurdle-4 .ig-quote__text {
	background: linear-gradient(72.13deg, #fff -27.06%, #90d0fe 142.93%);
	background-clip: text;
	color: transparent;
}
  
/* ==========================================================================
	 STAT COUNTER
	 ========================================================================== */
  
.ig-stat {
	text-align: center;
}
  
.ig-stat__value {
	font-family: var(--font-display);
	font-size: clamp(2.5rem, 5vw + 0.5rem, 4.5rem);
	font-weight: 600;
	line-height: 1;
}
  
.ig-section--white .ig-stat__value {
	color: var(--color-heading-blue);
}
  
.ig-section--dark .ig-stat__value {
	color: var(--color-white);
}
  
.ig-stat__label {
	font-size: 1rem;
	margin-top: var(--sp-xs);
	opacity: 0.8;
}
  
/* ==========================================================================
	 PINNED STEPS
	 ========================================================================== */
  
.ig-pinned {
	position: relative;
}
  
.ig-pinned__track {
	position: relative;
}
  
.ig-pinned__viewport {
	align-items: center;
	display: flex;
	height: 100vh;
	overflow: hidden;
	position: relative;
}
  
.ig-pinned__step {
	align-items: center;
	display: flex;
	inset: 0;
	justify-content: center;
	opacity: 0;
	position: absolute;
	will-change: opacity, transform;
}
  
.ig-pinned__dots {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	position: absolute;
	right: var(--container-pad);
	top: 50%;
	transform: translateY(-50%);
	z-index: 5;
}
  
.ig-pinned__dot {
	background: rgba(255, 255, 255, 0.35);
	border-radius: 50%;
	height: 0.5rem;
	transition: background 0.3s ease, transform 0.3s ease;
	width: 0.5rem;
}
  
.ig-pinned__dot.is-active {
	background: var(--color-white);
	transform: scale(1.5);
}
  
/* ==========================================================================
	 BLOCKER SECTION — Image hero with text overlay + curved cutout
	 ========================================================================== */
  
.ig-blocker {
	overflow: hidden;
	position: relative;
}
  
.ig-blocker__media {
	min-height: 50vh;
	overflow: hidden;
	position: relative;
	width: 100%;
}
  
@media (min-width: 48em) {

	.ig-blocker__media {
		min-height: 60vh;
	}
}
  
.ig-blocker__media img {
	height: 100%;
	inset: 0;
	object-fit: cover;
	position: absolute;
	width: 100%;
	will-change: transform;
}
  
/* Blocker 1 — curve cutout: mask the media box (not the <img>) for reliable compositing.
	 Inline SVG (white fill) avoids relative url failures (Storybook, file://, CDN paths) and
	 luminance masks that treat mid-grey as semi-transparent. */
  
#ig-blocker-1 {

	/* Don’t clip the curved mask; .ig-blocker defaults to overflow: hidden. */
	margin-top: -45px;
	overflow: visible;
	top: 45px;
	z-index: 2;
}
  
/* stylelint-disable property-no-vendor-prefix, order/properties-alphabetical-order -- Safari -webkit-mask-* */
  
#ig-blocker-1 .ig-blocker__media {
	-webkit-mask-image: var(--ig-blocker-curve-mask-r);
  
	/* Bottom-align mask so the SVG toe (0,644) isn’t cropped; avoid shifting down — that misaligns the curve vs hurdle. */
  
	-webkit-mask-position: center bottom;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: cover;
	mask-image: var(--ig-blocker-curve-mask-r);
	mask-mode: alpha;
	mask-position: center bottom;
	mask-repeat: no-repeat;
	mask-size: cover;
	overflow: visible;
}
  
/* stylelint-enable property-no-vendor-prefix, order/properties-alphabetical-order */
  
/* Keep the headline clear of the curved cutout (mask shift was clipping the second line). */
  
#ig-blocker-1 .ig-blocker__text-overlay {
	padding-bottom: calc(var(--sp-xl) + var(--sp-2xl));
  
	@media (min-width: 48em) {
		padding-bottom: calc(var(--sp-3xl) + var(--sp-2xl));
	}
}
  
/* Hurdle 1 sits under blocker-1 in the stack; overlap pulls its dark gradient into the masked curve */
  
#ig-hurdle-1 {
	margin-top: calc(-1 * (var(--ig-blocker-1-overlap) + var(--ig-curve-seam-fix)));
	padding-top: calc(var(--sp-xl) + var(--ig-blocker-1-overlap) + var(--ig-curve-seam-fix));
	z-index: 0;
}
  
#ig-hurdle-1::before,
#ig-hurdle-4::before {
	background: linear-gradient(8deg, var(--color-dark-start) 1.25%, var(--color-dark-end) 99.08%);
	content: "";
	height: var(--ig-next-section-top-bleed);
	left: 0;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: calc(-1 * var(--ig-next-section-top-bleed));
	z-index: 0;
}
  
#ig-hurdle-1::before {
	height: clamp(5rem, 9vw, 9rem);
	top: calc(-1 * clamp(5rem, 9vw, 9rem));
}
  
/* Mobile-only seam fix for blocker-4 -> hurdle-4 join. Keep desktop behavior unchanged. */
  
#ig-hurdle-4::before {

	@media (width <= 47.99em) {
		background: linear-gradient(159.24deg, var(--color-dark-start) 1.25%, var(--color-dark-end) 99.08%);
		height: clamp(5rem, 9vw, 9rem);
		top: calc(-1 * clamp(5rem, 9vw, 9rem));
	}
}
  
#ig-hurdle-1 .ig-container,
#ig-hurdle-4 .ig-container {
	position: relative;
	z-index: 1;
}
  
#ig-hurdle-1 .ig-quote {
	margin-top: 5.125rem;
	max-width: 747px;
}
  
/* Blocker 2 — curve (mirrors blocker-1; viewBox 1440×691). White hurdle shows through cutout. */
  
#ig-blocker-2,
#ig-blocker-5 {
	overflow: visible;
	z-index: 2;
}
  
/* stylelint-disable property-no-vendor-prefix, order/properties-alphabetical-order -- Safari -webkit-mask-* */
  
#ig-blocker-2 .ig-blocker__media {
	-webkit-mask-image: var(--ig-blocker-curve-mask-l);
	-webkit-mask-position: center bottom;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: cover;
	mask-image: var(--ig-blocker-curve-mask-l);
	mask-mode: alpha;
	mask-position: center bottom;
	mask-repeat: no-repeat;
	mask-size: cover;
	overflow: visible;
}
  
#ig-blocker-5 .ig-blocker__media {
	-webkit-mask-image: var(--ig-blocker-curve-mask-r);
	-webkit-mask-position: center bottom;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: cover;
	mask-image: var(--ig-blocker-curve-mask-r);
	mask-mode: alpha;
	mask-position: center bottom;
	mask-repeat: no-repeat;
	mask-size: cover;
	min-height: clamp(38rem, 78vh, 58rem);
	overflow: visible;
}
  
/* stylelint-enable property-no-vendor-prefix, order/properties-alphabetical-order */
  
#ig-blocker-2 .ig-blocker__text-overlay,
#ig-blocker-5 .ig-blocker__text-overlay {
	bottom: var(--sp-2xl);
  
	@media (min-width: 48em) {
		padding-bottom: calc(var(--sp-2xl) + var(--sp-md));
	}
}
  
#ig-hurdle-2 {
	padding-top: var(--sp-md);
	z-index: 0;
}
  
#ig-hurdle-5 {
	padding-top: 0;
	z-index: 0;
  
	@media (width <= 47.9375em) {
		padding-top: var(--sp-sm);
	}
}
  
/* Blocker 3 — same curve as blocker 2 (mask-r); hurdle 3 is dark under the cutout */
  
#ig-blocker-3 {
	overflow: visible;
	z-index: 2;
}
  
/* stylelint-disable property-no-vendor-prefix, order/properties-alphabetical-order -- Safari -webkit-mask-* */
  
#ig-blocker-3 .ig-blocker__media {
	-webkit-mask-image: var(--ig-blocker-curve-mask-r);
	-webkit-mask-position: center bottom;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: cover;
	margin-top: -4rem;
	mask-image: var(--ig-blocker-curve-mask-r);
	mask-mode: alpha;
	mask-position: center bottom;
	mask-repeat: no-repeat;
	mask-size: cover;
	overflow: visible;
	top: 4rem;
}
  
/* stylelint-enable property-no-vendor-prefix, order/properties-alphabetical-order */
  
#ig-blocker-3 .ig-blocker__text-overlay {
	padding-bottom: calc(var(--sp-xl) + var(--sp-xl));
  
	@media (min-width: 48em) {
		padding-bottom: calc(var(--sp-2xl) + var(--sp-2xl));
	}
}
  
#ig-hurdle-3 {
	margin-top: calc(-1 * (var(--ig-blocker-3-overlap) + var(--ig-curve-seam-fix)));
	padding-top: calc(var(--sp-xl) + var(--ig-blocker-3-overlap) + var(--ig-curve-seam-fix));
	z-index: 0;
}
  
/* Blocker 4 — same curve as blocker 1 (mask-l); hurdle 4 (dark) under the cutout */
  
#ig-blocker-4 {
	overflow: visible;
	z-index: 2;
}
  
#ig-blocker-1 .ig-blocker__media,
#ig-blocker-2 .ig-blocker__media,
#ig-blocker-3 .ig-blocker__media,
#ig-blocker-5 .ig-blocker__media,
#ig-blocker-6 .ig-blocker__media {
	min-height: clamp(34rem, 72vh, 52rem);

	@media (min-width: 48em) {
		min-height: clamp(55rem, 72vh, 52rem);
	}
}
  
/* stylelint-disable property-no-vendor-prefix, order/properties-alphabetical-order -- Safari -webkit-mask-* */
  
#ig-blocker-4 .ig-blocker__media {
	-webkit-mask-image: var(--ig-blocker-curve-mask-l);
	-webkit-mask-position: center bottom;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: cover;
	margin-top: -2rem;
	min-height: 50vh;
	mask-image: var(--ig-blocker-curve-mask-l);
	mask-mode: alpha;
	mask-position: center bottom;
	mask-repeat: no-repeat;
	mask-size: cover;
	overflow: visible;
	top: 2rem;
  
	@media (min-width: 48em) {
		min-height: clamp(50rem, 72vh, 52rem);
	}
}
  
/* stylelint-enable property-no-vendor-prefix, order/properties-alphabetical-order */
  
#ig-blocker-4 .ig-blocker__text-overlay {
	padding-bottom: 6rem;
  
	@media (min-width: 48em) {
		padding-bottom: 10rem;
	}
}
  
/* Hurdle 4 under blocker-4; overlap pulls the dark section into the masked curve */
  
#ig-hurdle-4 {
	margin-top: calc(-1 * (var(--ig-blocker-4-overlap) + var(--ig-curve-seam-fix)));
	padding-top: var(--sp-xl);
	z-index: 0;
  
	@media (min-width: 48em) {
		padding-top: calc(var(--sp-3xl) + var(--ig-blocker-4-overlap) + var(--ig-curve-seam-fix));
	}
}
  
/* Hide any residual anti-aliased seam at blocker-4 -> hurdle-4 join. */
  
#ig-hurdle-4::after {
	background: linear-gradient(159.24deg, var(--color-dark-start) 1.25%, var(--color-dark-end) 99.08%);
	content: "";
	height: 8px;
	left: 0;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: -6px;
	z-index: 0;
}
  
/* Blocker 6 — same curve as blocker 1/4 (mask-l); hurdle 6 (white) under the cutout */
  
#ig-blocker-6 {
	overflow: visible;
	z-index: 2;
}
  
/* stylelint-disable property-no-vendor-prefix, order/properties-alphabetical-order -- Safari -webkit-mask-* */
  
#ig-blocker-6 .ig-blocker__media {
	-webkit-mask-image: var(--ig-blocker-curve-mask-l);
	-webkit-mask-position: center bottom;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: cover;
	mask-image: var(--ig-blocker-curve-mask-l);
	mask-mode: alpha;
	mask-position: center bottom;
	mask-repeat: no-repeat;
	mask-size: cover;
	overflow: visible;
}
  
/* stylelint-enable property-no-vendor-prefix, order/properties-alphabetical-order */
  
#ig-blocker-6 .ig-blocker__text-overlay {
	padding-bottom: 10.5rem;
}
  
#ig-hurdle-6 {
	padding: 0;
	z-index: 0;
  
	@media (min-width: 48em) {
		padding-top: 6rem;
	}
}
  
/* Blocker 7 — standalone section with the curve revealed at the top */
  
#ig-blocker-7 {
	overflow: visible;
}
  
/* stylelint-disable property-no-vendor-prefix, order/properties-alphabetical-order -- Safari -webkit-mask-* */
  
#ig-blocker-7 .ig-blocker__media {
	-webkit-mask-image: var(--ig-blocker-curve-mask-top);
	-webkit-mask-position: center top;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: cover;
	background: #d9d9d9;
	mask-image: var(--ig-blocker-curve-mask-top);
	mask-mode: alpha;
	mask-position: center top;
	mask-repeat: no-repeat;
	mask-size: cover;
	min-height: clamp(40rem, 74vw, 68rem);
}
  
/* stylelint-enable property-no-vendor-prefix, order/properties-alphabetical-order */
  
#ig-blocker-7 .ig-blocker__text-overlay {
	bottom: clamp(6rem, 12vw, 10rem);
	padding-bottom: 0;
}
  
#ig-blocker-7 .ig-blocker-7__body {
	color: var(--color-white);
	margin-top: var(--sp-md);
}
  
.ig-hurdle-4 .ig-lede,
.ig-hurdle-4 .ig-body {
	color: var(--color-white);
}
  
/* Blocker 2/3/4/6: larger image so parallax (y: 12%) doesn’t reveal top/bottom */
  
#ig-blocker-2 .ig-blocker__media img,
#ig-blocker-5 .ig-blocker__media img,
#ig-blocker-3 .ig-blocker__media img,
#ig-blocker-4 .ig-blocker__media img,
#ig-blocker-6 .ig-blocker__media img {
	height: 100%;
	top: -10%;
}
  
.ig-blocker__media::after {
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
	z-index: 1;
}
  
.ig-blocker--light-overlay .ig-blocker__media::after {
	background: linear-gradient(180deg, rgba(var(--color-overlay-rgb), 0.1) 0%, rgba(var(--color-overlay-rgb), 0.35) 70%, rgba(var(--color-overlay-rgb), 0.6) 100%);
}
  
.ig-blocker--dark-overlay .ig-blocker__media::after {
	background: linear-gradient(180deg, rgba(var(--color-overlay-rgb), 0.2) 0%, rgba(var(--color-overlay-rgb), 0.7) 100%);
}
  
/* Blocker 4: reduce top tint so no visible dark band above imagery. */
  
#ig-blocker-4 .ig-blocker__media::after {
	background: linear-gradient(180deg, rgba(var(--color-overlay-rgb), 0.04) 0%, rgba(var(--color-overlay-rgb), 0.62) 100%);
}
  
.ig-blocker__text-overlay {
	bottom: 0;
	left: 0;
	margin: 0 auto;
	max-width: var(--container-max);
	padding: var(--sp-xl) var(--container-pad) var(--sp-2xl);
	position: absolute;
	right: 0;
	z-index: 2;
}
  
.ig-blocker--text-right .ig-blocker__line2 {
	padding-right: 0.5em;
	text-indent: 0;
}
  
.ig-blocker__label {
	color: var(--color-white);
	font-family: var(--font-display);
	font-size: clamp(1.25rem, 2vw, 1.75rem);
	font-weight: 600;
	margin-bottom: var(--sp-xs);
}
  
.ig-blocker__title {
	color: var(--color-white);
	font-family: var(--font-display);
	font-size: clamp(2rem, 4vw + 0.5rem, 3.5rem);
	font-weight: 600;
	line-height: 1.05;
}
  
/* Inline style switches — use inside .ig-blocker__title or .ig-blocker__subtitle */
  
.ig-blocker__b {
	font-style: normal;
	font-weight: 600;
}
  
.ig-blocker__i {
	font-style: italic;
	font-weight: 300;
}
  
/* Optional: second line (e.g. for two-line headline) */
  
.ig-blocker__line2 {
	display: block;
}
  
#ig-blocker-1 .ig-blocker__line2,
#ig-blocker-2 .ig-blocker__line2,
#ig-blocker-5 .ig-blocker__line2 {
	display: inline;
}
  
/* Hurdle 1 solution header — text left, illustration right; fixed sizes */
  
.ig-hurdle-1__header {
	margin-bottom: var(--sp-xl);
}
  
.ig-hurdle-1__title.ig-blocker__title {
	color: var(--color-white);
	margin: 0;
}
  
.ig-hurdle-1__title .ig-blocker__b {
	font-size: 64px;
	line-height: 1.05;
}
  
.ig-hurdle-1__title .ig-blocker__line2.ig-blocker__i {
	font-size: 60px;
	font-weight: 300;
	line-height: 1.05;
}
  
.ig-hurdle-1__header-media {
	align-items: center;
	display: flex;
	justify-content: flex-end;
}
  
.ig-hurdle-1__header-media img {
	height: auto;
	max-width: 100%;
	object-fit: contain;
}
  
/* Hurdle 1 quote — gradient on text (fill) + illustration quote mark */
  
.ig-blocker__subtitle {
	color: var(--color-white);
	font-family: var(--font-body);
	font-size: clamp(1.5rem, 3vw + 0.25rem, 2.75rem);
	font-style: italic;
	font-weight: 300;
	line-height: 1.05;
	margin-bottom: var(--sp-2xl);
	opacity: 0.9;
	text-align: right;
}
  
/* ==========================================================================
	 HURDLE 2 — White section, full-width copy + 50/50 text | quote
	 ========================================================================== */
  
.ig-hurdle-2 {
	background: var(--color-bg);
	color: var(--color-text);
	position: relative;
}
  
.ig-hurdle-5 {
	background: var(--color-bg);
	color: var(--color-text);
	position: relative;
}
  
.ig-hurdle-2 .ig-body,
.ig-hurdle-2 .ig-hurdle-2__title {
	color: var(--color-text);
}
  
.ig-hurdle-5 .ig-body {
	color: var(--color-text);
}
  
.ig-hurdle-2__heading {
	margin-bottom: var(--sp-lg);
}
  
.ig-hurdle-2__title {
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: clamp(2rem, 4vw + 0.5rem, 3.5rem);
	font-weight: 600;
	line-height: 1.1;
	margin: 0;
}
  
.ig-hurdle-2__title-line2 {
	display: block;
	font-style: italic;
	font-weight: 300;
	text-align: right;
}
  
.ig-hurdle-2__intro {
	margin-bottom: var(--sp-xl);
	max-width: 100%;
}
  
.ig-hurdle-5__intro {
	margin-bottom: 0;
	max-width: 100%;
  
	@media (min-width: 48em) {
		margin-bottom: var(--sp-xl);
	}
}
  
.ig-hurdle-2__split {
	margin-top: 0;
}
  
.ig-grid--v-start {
	align-items: start;
}
  
/* Quote block — gradient as text fill (blue quote text on white) */
  
/* Quote mark: image (dark variant for white sections) */
  
.ig-quote--hurdle-2 .ig-quote__mark {
	display: block;
	font-size: 0;
	height: auto;
	line-height: 0;
	max-width: clamp(3rem, 5vw, 4.5rem);
	width: auto;
}
  
.ig-quote--hurdle-2 .ig-quote__text {
	background: linear-gradient(0deg, #0250d9, #0250d9);
	background-clip: text;
	color: transparent;
	font-family: var(--font-display);
	font-size: var(--quote-display-size);
	font-weight: var(--h-display-weight);
	letter-spacing: var(--quote-display-tracking);
	line-height: var(--quote-display-leading);
}
  
.ig-quote--hurdle-2 .ig-quote__attr {
	color: var(--color-text);
	margin-top: var(--sp-md);
}
  
.ig-quote--hurdle-2 .ig-quote__name,
.ig-quote--hurdle-2 .ig-quote__role {
	color: var(--color-text);
}
  
.ig-quote--hurdle-2 .ig-quote__role {
	opacity: 1;
}
  
/* ==========================================================================
	 SUMMARY STATEMENT — White content area, yellow top strip, #03234D text
	 ========================================================================== */
  
.ig-summary-statement {
	background: var(--color-bg);
	color: var(--color-text);
	padding-bottom: var(--sp-2xl);
	padding-top: 0;
	position: relative;
}
  
.ig-summary-statement__accent {
	background: #ffd100;
	height: 6px;
	width: 100%;
}
  
.ig-summary-statement .ig-container {
	padding-bottom: var(--sp-2xl);
	padding-top: var(--sp-2xl);
}
  
.ig-summary-statement__lead {
	color: var(--color-text);
	font-family: var(--font-display);
	font-size: clamp(1.5rem, 3vw, 2.25rem);
	font-weight: 600;
	line-height: 1.35;
	margin: 0;
}
  
.ig-summary-statement__body {
	color: var(--color-text);
	margin-top: var(--sp-xl);
}
  
.ig-summary-statement .ig-body {
	color: var(--color-text);
}
  
/* ==========================================================================
	 FINAL SECTION — Subscribe (blue gradient) + More Feature Articles (white)
	 ========================================================================== */
  
.ig-final-section {
	background: linear-gradient(180deg, #022ac0 0%, #066afe 68.07%, #00b3ff 82%, #cceaff 90%, #fff 95%);
	color: var(--color-white);
	position: relative;
}
  
/* Subscribe block — sits in the blue gradient area */
  
.ig-final-section__subscribe {
	padding-bottom: var(--sp-xl);
	padding-top: var(--sp-xl);
	position: relative;
}
  
.ig-final-section__subscribe-inner {
	align-items: center;
	display: flex;
	flex-direction: column;
	max-width: 800px;
	text-align: center;
}
  
.ig-final-section__heading-row {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-md);
	justify-content: center;
	margin: var(--sp-xl) 0;
	position: relative;
}
  
.ig-final-section__deco {
	display: block;
	height: auto;
	max-height: 120px;
	max-width: 100px;
	width: auto;
}
  
@media (min-width: 48em) {

	.ig-final-section__subscribe {
		padding-bottom: var(--sp-3xl);
		padding-top: var(--sp-3xl);
	}
  
	.ig-final-section__heading-row {
		gap: var(--sp-sm);
		justify-content: center;
		width: 100%;
	}
  
	.ig-final-section__deco {
		max-height: 140px;
		max-width: 120px;
	}
  
	.ig-final-section__deco--left {
		left: 0;
		order: 0;
		position: absolute;
		top: -8rem;
		transform: translateY(-50%);
		z-index: 1;
	}
  
	.ig-final-section__deco--right {
		order: 2;
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		z-index: 1;
	}
}
  
/* Mobile only: position decos absolutely — left on separator, right beside buttons */
  
@media (width < 48em) {

	.ig-final-section__deco--left {
		bottom: 0;
		left: 0;
		order: 0;
		position: absolute;
		top: -105px;
		transform: translateY(50%);
		z-index: 1;
	}
  
	.ig-final-section__deco--right {
		bottom: var(--sp-2xl);
		order: 2;
		position: absolute;
		right: 0;
		top: 57px;
		z-index: 1;
	}
}
  
.ig-final-section__title {
	color: var(--color-white);
	font-family: var(--font-display);
	font-size: var(--h-display-size);
	font-weight: var(--h-md-weight);
	line-height: var(--h-display-leading);
	margin: 0;
	order: 1;
	position: relative;
	text-align: center;
	z-index: 2;
}
  
.ig-final-section__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-sm);
	justify-content: center;
}
  
/* More Feature Articles — blue fades into white via blurred rounded “subtract” */
  
.ig-final-section__articles {
	color: var(--color-text);
	overflow: hidden;
	padding-bottom: var(--sp-3xl);
	padding-top: var(--sp-2xl);
	position: relative;
}
  
/* Blurred white “subtract” shape: smooth elliptical curve (lowest point in center) */
  
.ig-final-section__articles::before {
	animation: ig-articles-bg-drift 25s ease-in-out infinite;
	/* stylelint-disable-next-line property-no-vendor-prefix -- Safari needs -webkit-backdrop-filter */
	background:
		linear-gradient(180deg, transparent 24%, rgba(255, 255, 255, 0.35) 42%, #fff 64%),
		radial-gradient(ellipse 200% 100% at 50% 120%, #fff 75%, transparent 100%);
	bottom: 0;
	content: "";
	height: 72%;
	left: -15%;
	pointer-events: none;
	position: absolute;
	right: -15%;
	will-change: transform;
	z-index: 0;
}
  
@keyframes ig-articles-bg-drift {

	0%,
	100% {
		transform: translate(0, 0) scale(1);
	}

	25% {
		transform: translate(12px, -8px) scale(1.015);
	}

	50% {
		transform: translate(-8px, 6px) scale(0.99);
	}

	75% {
		transform: translate(6px, 4px) scale(1.008);
	}
}
  
/* Content above the background layer */
  
.ig-final-section__articles .ig-container {
	position: relative;
	z-index: 1;
}
  
/* Fallback when backdrop-filter is not supported: same elliptical curve, softer gradient */
  
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {

	.ig-final-section__articles::before {
		/* stylelint-disable-next-line property-no-vendor-prefix -- Safari fallback */
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
		background:
			linear-gradient(180deg, transparent 20%, rgba(255, 255, 255, 0.5) 40%, #fff 62%),
			radial-gradient(ellipse 200% 100% at 50% 120%, #fff 48%, transparent 52%);
	}
}
  
.ig-final-section__articles-header {
	margin-bottom: var(--sp-xl);
}
  
@media (min-width: 48em) {

	.ig-final-section__articles-header {
		align-items: start;
		display: grid;
		gap: var(--sp-lg);
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
	}
}
  
.ig-final-section__articles-title {
	color: var(--color-surface);
	font-family: var(--font-display);
	font-size: clamp(2rem, 4vw + 0.5rem, 3.5rem);
	font-weight: var(--h-md-weight);
	line-height: var(--h-display-leading);
	margin: 0 0 var(--sp-sm);
}
  
@media (min-width: 48em) {

	.ig-final-section__articles-title {
		margin-bottom: 0;
	}
}
  
.ig-final-section__articles-desc {
	color: var(--color-surface);
	margin: 0;
}
  
/* Article cards row — 352×352px each */
  
.ig-final-section__cards {
	--card-size: 352px;
  
	align-items: stretch;
	display: flex;
	flex-wrap: nowrap;
	gap: var(--sp-md);
	justify-content: center;
	overflow: visible;
}
  
@media (width <= 1520px) {

	.ig-final-section__cards {
		--card-size: min(352px, calc((100vw - var(--sp-md) * 3 - var(--sp-lg) * 2) / 4));
	}
}
  
/* Desktop: stagger cards — odd cards get extra top padding */
  
@media (width >= 48em) {

	.ig-final-section__card:nth-child(even) {
		margin-top: 60px;
	}
}
  
/* Mobile: side-scroll carousel */
  
@media (width < 48em) {

	.ig-final-section__cards {
		--card-size: min(280px, 82vw);
  
		gap: var(--sp-md);
		justify-content: flex-start;
		margin-left: calc(-1 * var(--container-pad));
		margin-right: calc(-1 * var(--container-pad));
		min-height: 0;
		overflow-x: auto;
		overflow-y: hidden;
		padding-left: var(--container-pad);
		padding-right: var(--container-pad);
		scroll-behavior: smooth;
		scroll-snap-type: x mandatory;
	}
  
	.ig-final-section__card {
		scroll-snap-align: start;
		scroll-snap-stop: normal;
	}
}
  
.ig-final-section__card {
	border-radius: 8px;
	display: block;
	flex-shrink: 0;
	height: var(--card-size);
	overflow: hidden;
	position: relative;
	text-decoration: none;
	transition: box-shadow 0.2s var(--ease-out-quart);
	width: var(--card-size);
}
  
.ig-final-section__card:hover {
	box-shadow: 0 8px 24px rgba(var(--color-overlay-rgb), 0.2);
}
  
.ig-final-section__card-img {
	background: var(--color-surface);
	display: block;
	height: 100%;
	overflow: hidden;
	width: 100%;
}
  
.ig-final-section__card-img img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}
  
/* Dark gradient behind caption for readability on any image */
  
.ig-final-section__card::after {
	background: linear-gradient(to top, rgba(var(--color-overlay-rgb), 0.85) 0%, transparent 60%);
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
	z-index: 0;
}
  
/* Caption floats above the image, bottom-left */
  
.ig-final-section__card-caption {
	bottom: var(--sp-md);
	color: var(--color-white);
	font-family: var(--font-display);
	font-size: 1.125rem;
	font-weight: 600;
	left: var(--sp-md);
	position: absolute;
	right: var(--sp-md);
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
	z-index: 1;
}
  
.ig-final-section__card:hover .ig-final-section__card-caption {
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}
  
/* ==========================================================================
	 PARALLAX OVERLAY SECTION — Image moves, text floats on top
	 ========================================================================== */
  
.ig-parallax-overlay {
	align-items: center;
	display: flex;
	min-height: 80vh;
	overflow: hidden;
	position: relative;
}
  
#ig-solution-1 {
	background: linear-gradient(320deg, rgba(2, 42, 192, 0.85) 0%, rgba(3, 126, 212, 0.85) 50%, rgba(4, 134, 213, 0.85) 100%);
}
  
.ig-parallax-overlay__bg {
	inset: -15% 0;
	position: absolute;
	will-change: transform;
	z-index: 0;
}
  
.ig-parallax-overlay__bg img {
	filter: grayscale(100%);
	height: 100%;
	object-fit: cover;
	width: 100%;
}
  
.ig-parallax-overlay__scrim {
	background: linear-gradient(160deg, rgba(var(--color-overlay-rgb), 0.6) 0%, rgba(var(--color-overlay-rgb), 0.35) 50%, rgba(var(--color-overlay-rgb), 0.6) 100%);
	inset: 0;
	pointer-events: none;
	position: absolute;
	z-index: 1;
}
  
.ig-parallax-overlay__content {
	color: var(--color-white);
	margin: 0 auto;
	max-width: var(--container-max);
	padding: var(--sp-3xl) var(--container-pad);
	position: relative;
	width: 100%;
	z-index: 2;
}
  
.ig-parallax-overlay .ig-h-display {
	color: var(--color-white);
}
  
.ig-parallax-overlay .ig-h-alt {
	color: var(--color-white);
	max-width: var(--container-narrow);
}
  
/* ==========================================================================
	 FULL-WIDTH PORTRAIT QUOTE — Image fills viewport, text overlays
	 ========================================================================== */
  
.ig-portrait-quote {
	align-items: flex-end;
	box-sizing: border-box;
	display: flex;
	height: auto;
	min-height: 780px;
	overflow: hidden;
	position: relative;
}
  
.ig-portrait-quote__bg {
	inset: 0;
	position: absolute;
	z-index: 0;
}
  
.ig-portrait-quote__bg img {
	filter: grayscale(100%);
	height: 780px;
	object-fit: cover;
	transition: filter 1.2s var(--ease-out-quart);
	width: 100%;
}
  
.ig-portrait-quote.is-in-view .ig-portrait-quote__bg img {
	filter: grayscale(40%);
}
  
.ig-portrait-quote__bg::after {
	background: linear-gradient(0deg, rgba(var(--color-overlay-rgb), 0.75) 0%, rgba(var(--color-overlay-rgb), 0.2) 50%, transparent 100%);
	content: "";
	inset: 0;
	position: absolute;
	z-index: 1;
}
  
.ig-portrait-quote__footer {
	align-items: flex-start;
	display: flex;
	flex-direction: column;
	margin: 0 auto;
	max-width: var(--container-max);
	padding: var(--sp-3xl) var(--container-pad) var(--sp-2xl);
	position: relative;
	width: 100%;
	z-index: 2;
}
  
.ig-portrait-quote__content {
	color: var(--color-white);
	flex: 1 1 0;
	min-width: 0;
	position: relative;
	text-align: left;
	z-index: 2;
}
  
/* Quote mark: graphic (grey variant for portrait overlay) */
  
.ig-portrait-quote .ig-quote__mark {
	display: block;
	font-size: 0;
	height: 45px;
	line-height: 0;
	object-fit: contain;
	width: 63px;
}
  
.ig-portrait-quote .ig-quote__text {
	background: none;
	color: var(--color-white) !important;
	font-size: clamp(1.5rem, 2.5vw + 0.5rem, 2.25rem);
	font-weight: 300;
}

.ig-portrait-quote blockquote.ig-quote::before {
	content: none;
}

.ig-portrait-quote .ig-quote__attr {
	color: var(--color-white);
}
  
/* ==========================================================================
	 PERSPECTIVES — Pinned viewport takeover
	 ========================================================================== */
  
.ig-perspectives {
	position: relative;
}
  
.ig-perspectives__track {
	overflow: hidden;
	position: relative;
}
  
.ig-perspectives__viewport {
	height: 100vh;
	overflow: hidden;
	position: relative;
}
  
.ig-perspectives__viewport-inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	height: 100%;
	position: relative;
}
  
.ig-perspectives__img-col {
	background: var(--color-heading-dark);
	overflow: hidden;
	position: relative;
}
  
.ig-perspectives__img {
	inset: 0;
	overflow: hidden;
	position: absolute;
}
  
.ig-perspectives__img img {
	filter: grayscale(100%);
	height: 100%;
	object-fit: cover;
	transition: filter 1.2s var(--ease-out-quart);
	width: 100%;
}
  
.ig-perspectives__img.is-active img {
	filter: grayscale(0%);
}
  
.ig-perspectives__img-mask {
	clip-path: inset(100% 0 0 0);
	inset: 0;
	position: absolute;
	will-change: clip-path;
}
  
.ig-perspectives__img:first-child .ig-perspectives__img-mask {
	clip-path: inset(0 0 0 0);
}
  
.ig-perspectives__img::after {
	background: linear-gradient(0deg, rgba(var(--color-overlay-rgb), 0.6) 0%, rgba(var(--color-overlay-rgb), 0.1) 40%, transparent 65%);
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
	z-index: 2;
}
  
.ig-perspectives__img-label {
	bottom: var(--sp-xl);
	color: var(--color-white);
	left: var(--sp-lg);
	opacity: 0;
	position: absolute;
	transform: translateY(1rem);
	will-change: opacity, transform;
	z-index: 3;
}
  
.ig-perspectives__img-label.is-active {
	opacity: 1;
	transform: translateY(0);
}
  
.ig-perspectives__img-label-title {
	font-family: var(--font-display);
	font-size: clamp(2rem, 4vw + 0.5rem, 3.5rem);
	font-style: normal;
	font-weight: var(--h-display-weight);
	letter-spacing: -0.008em;
	line-height: var(--h-display-leading);
}
  
.ig-perspectives__img-label-sub {
	font-family: var(--font-body);
	font-size: clamp(1.25rem, 2vw, 1.625rem);
	font-style: italic;
	font-weight: 300;
	margin-top: 0.25rem;
	opacity: 0.85;
}
  
.ig-perspectives__text-col {
	background: linear-gradient(159.24deg, var(--color-accent-hover) 1.25%, var(--color-accent) 99.08%);
	overflow: hidden;
	position: relative;
}
  
.ig-perspectives__text-panel {
	color: var(--color-white);
	display: flex;
	flex-direction: column;
	inset: 0;
	justify-content: center;
	opacity: 0;
	padding: var(--sp-2xl) var(--sp-xl);
	position: absolute;
	will-change: opacity, transform;
}
  
.ig-perspectives__text-panel:first-child {
	opacity: 1;
}
  
.ig-perspectives__text-panel-inner {
	max-width: 28rem;
}
  
.ig-perspectives__subtitle {
	font-family: var(--font-body);
	font-size: 1.125rem;
	font-style: normal;
	font-weight: var(--body-weight);
	letter-spacing: var(--body-tracking);
	line-height: var(--body-leading);
	margin-bottom: var(--sp-lg);
	opacity: 0.8;
}
  
.ig-perspectives__counter {
	font-family: var(--font-body);
	font-size: 0.8125rem;
	font-weight: 300;
	letter-spacing: 0.05em;
	margin-bottom: var(--sp-sm);
	opacity: 0.5;
	text-transform: uppercase;
}
  
.ig-perspectives__text-panel .ig-quote__attr {
	color: var(--color-white);
}
  
@media (width <= 47.9375em) {

	.ig-perspectives__viewport-inner {
		grid-template-columns: 1fr;
		grid-template-rows: 50vh auto;
	}
  
	.ig-perspectives__text-panel {
		padding: var(--sp-xl) var(--container-pad);
	}
}
  
/* ==========================================================================
	 SUMMARY PANEL
	 ========================================================================== */
  
[data-ai-summary-content] {
	display: none;
}
  
.ig-ai-summary {
	background: var(--color-surface);
	border-bottom: 1px solid var(--color-border);
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	transition: max-height 0.5s var(--ease-out-expo), opacity 0.4s ease, padding 0.5s ease;
}
  
.ig-ai-summary.is-open {
	max-height: 40rem;
	opacity: 1;
}
  
.ig-ai-summary__inner {
	margin: 0 auto;
	max-width: var(--container-max);
	padding: var(--sp-lg) var(--container-pad);
}
  
.ig-ai-summary__inner .ig-ai-summary__title .ig-ai-summary__star path {
	fill: var(--color-heading-blue);
}
  
.ig-ai-summary__header {
	align-items: center;
	display: flex;
	justify-content: space-between;
	margin-bottom: var(--sp-md);
}
  
.ig-ai-summary__title {
	align-items: center;
	color: var(--color-heading-blue);
	display: flex;
	font-family: var(--font-display);
	font-size: 0.9375rem;
	font-weight: 600;
	gap: 0.5rem;
}
  
.ig-ai-summary__close {
	align-items: center;
	color: var(--color-text-secondary, #666);
	display: flex;
	height: 1.5rem;
	justify-content: center;
	opacity: 0.5;
	transition: opacity 0.2s;
	width: 1.5rem;
}
  
.ig-ai-summary__close:hover {
	opacity: 1;
}
  
.ig-ai-summary__body {
	color: var(--color-text);
	font-size: 0.9375rem;
	line-height: 1.65;
	min-height: 3rem;
}
  
/* Thinking dots */
  
.ig-ai-dots {
	align-items: center;
	display: inline-flex;
	gap: 4px;
	height: 1.5rem;
}
  
.ig-ai-dots span {
	animation: ig-dot-bounce 1.2s ease-in-out infinite;
	background: var(--color-heading-blue);
	border-radius: 50%;
	height: 6px;
	width: 6px;
}
  
.ig-ai-dots span:nth-child(2) {
	animation-delay: 0.15s;
}
  
.ig-ai-dots span:nth-child(3) {
	animation-delay: 0.3s;
}
  
@keyframes ig-dot-bounce {

	0%,
	80%,
	100% {
		opacity: 0.4;
		transform: scale(0.6);
	}
  
	40% {
		opacity: 1;
		transform: scale(1);
	}
}
  
/* Typing cursor */
  
.ig-ai-cursor {
	animation: ig-cursor-blink 0.8s steps(2) infinite;
	background: var(--color-heading-blue);
	display: inline-block;
	height: 1em;
	margin-left: 2px;
	vertical-align: text-bottom;
	width: 2px;
}
  
@keyframes ig-cursor-blink {

	0% {
		opacity: 1;
	}
  
	50% {
		opacity: 0;
	}
}
  
/* ==========================================================================
	 AUDIO PLAYER PANEL
	 ========================================================================== */
  
.ig-audio-panel {
	background: var(--color-surface);
	border-bottom: 1px solid var(--color-border);
	margin: 0 auto;
	max-height: 0;
	max-width: var(--container-max);
	opacity: 0;
	overflow: hidden;
	padding: 0 var(--container-pad);
	transition: max-height 0.5s var(--ease-out-expo), opacity 0.4s ease, padding 0.5s ease;
}
  
.ig-audio-panel.is-active {
	max-height: 6rem;
	opacity: 1;
	padding: var(--sp-md) var(--container-pad);
}
  
.ig-audio-panel__inner {
	align-items: center;
	display: flex;
	gap: 0.75rem;
}
  
.ig-audio-panel__title {
	color: var(--color-heading-dark);
	flex-shrink: 0;
	font-family: var(--font-body);
	font-size: 0.875rem;
	font-weight: 600;
}
  
.ig-audio-panel__player {
	flex: 1;
	height: 2rem;
	min-width: 0;
}
  
/* ==========================================================================
	 PROGRESS BAR
	 ========================================================================== */
  
.ig-progress {
	background: var(--color-accent);
	height: 3px;
	left: 0;
	pointer-events: none;
	position: fixed;
	top: 0;
	transform: scaleX(0);
	transform-origin: left;
	width: 100%;
	z-index: 9999;
}
  
.ig-body__video-placeholder {
	margin-top: var(--sp-md);
	width: 100%;
}
  
.ig-body__video-frame {
	height: 0;
	padding-bottom: 56.25%;
	position: relative;
	width: 100%;
}
  
.ig-body__video-frame iframe {
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}
  
.ig-body__video-caption {
	font-family: var(--font-body);
	font-size: 1.25rem;
	font-style: normal;
	font-weight: var(--h-md-weight);
	letter-spacing: var(--body-tracking);
	line-height: var(--h-md-leading);
	margin-top: var(--sp-sm);
	text-align: left;
}
  
/* Dev / Debug */
  
/* ==========================================================================
	 DEBUG BAR
	 ========================================================================== */
  
.ig-debug {
	align-items: center;
	backdrop-filter: blur(8px);
	background: rgba(var(--color-overlay-rgb), 0.92);
	bottom: 0;
	color: var(--color-white);
	display: flex;
	flex-wrap: wrap;
	font-family: var(--font-body);
	font-size: 0.75rem;
	gap: 1.5rem;
	left: 0;
	padding: 0.5rem 1rem;
	position: fixed;
	right: 0;
	z-index: 10000;
}
  
.ig-debug__label {
	color: var(--color-accent);
	font-weight: 600;
	white-space: nowrap;
}
  
.ig-debug__item {
	align-items: center;
	display: flex;
	gap: 0.375rem;
	white-space: nowrap;
}
  
.ig-debug__item span {
	opacity: 0.6;
}
  
.ig-debug__value {
	color: var(--color-debug-value);
	font-weight: 600;
}
  
.ig-debug__toggle {
	background: rgba(255, 255, 255, 0.15);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 3px;
	color: var(--color-white);
	cursor: pointer;
	font-size: 0.6875rem;
	font-weight: 600;
	padding: 0.25rem 0.625rem;
	transition: background 0.15s ease;
}
  
.ig-debug__toggle:hover {
	background: rgba(255, 255, 255, 0.25);
}
  
.ig-debug__toggle.is-active {
	background: var(--color-accent);
	border-color: var(--color-accent);
}
  
.ig-debug__spacer {
	flex: 1;
}
  
.ig-debug__close {
	background: none;
	border: none;
	color: var(--color-white);
	cursor: pointer;
	font-size: 1rem;
	opacity: 0.5;
	transition: opacity 0.2s;
}
  
.ig-debug__close:hover {
	opacity: 1;
}
  
/* States & Overrides */
  
/* ==========================================================================
	 ANIMATION STATES — Initial states for scroll-triggered reveals
	 ========================================================================== */
  
[data-animate] {
	will-change: transform, opacity;
}
  
[data-animate="fade-up"] {
	opacity: 0;
	transform: translateY(2rem);
}
  
[data-animate="fade-in"] {
	opacity: 0;
}
  
[data-animate="fade-left"] {
	opacity: 0;
	transform: translateX(2.5rem);
}
  
[data-animate="fade-right"] {
	opacity: 0;
	transform: translateX(-2.5rem);
}
  
[data-animate="scale-in"] {
	opacity: 0;
	transform: scale(0.94);
}
  
[data-animate="stagger"] > * {
	opacity: 0;
	transform: translateY(1.5rem);
}
  
/* ==========================================================================
	 RESPONSIVE — Mobile overrides
	 ========================================================================== */
  
.info-graphic-hide-on-mobile {
	display: none;
}
  
@media (min-width: 48em) {

	.info-graphic-hide-on-mobile {
		display: flex;
	}
}
  
@media (width <= 47.9375em) {

	.ig-grid--2col,
	.ig-grid--3col,
	.ig-grid--sidebar {
		grid-template-columns: 1fr;
	}
  
	.ig-section {
		padding-bottom: var(--sp-2xl);
		padding-top: var(--sp-2xl);
	}
}
  
/* ==========================================================================
	 REDUCED MOTION ~ Accessibility preference + class-based toggle
	 ========================================================================== */
  
@media (prefers-reduced-motion: reduce) {

	[data-animate],
	[data-animate="stagger"] > *,
	.ig-perspectives__img-mask {
		clip-path: none !important;
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
  
	.ig-final-section__articles::before {
		animation: none !important;
	}
  
	.ig-ai-dots span {
		animation: none !important;
		opacity: 1 !important;
		transform: scale(1) !important;
	}
  
	.ig-ai-cursor {
		animation: none !important;
		opacity: 1 !important;
	}
}
  
/* Class-based reduced motion toggle (for debug bar) */
  
html.ig-reduced-motion [data-animate],
html.ig-reduced-motion [data-animate="stagger"] > *,
html.ig-reduced-motion .ig-perspectives__img-mask {
	clip-path: none !important;
	opacity: 1 !important;
	transform: none !important;
	transition: none !important;
}
  
html.ig-reduced-motion .ig-final-section__articles::before {
	animation: none !important;
}
  
html.ig-reduced-motion .ig-ai-dots span {
	animation: none !important;
	opacity: 1 !important;
	transform: scale(1) !important;
}
  
html.ig-reduced-motion .ig-ai-cursor {
	animation: none !important;
	opacity: 1 !important;
}
  
html.ig-reduced-motion .ig-progress {
	display: none;
}
