/*
 * PCL Base — Design tokens, reset, typography, utilities
 * Source of truth for all design decisions
 */
:root {
	--pcl-mint: #CAF2F1;
	--pcl-cyan: #8CEBEF;
	--pcl-teal: #6ABAC3;
	--pcl-teal-text: #2E6B74;
	--pcl-lilac: #9671BD;
	--pcl-purple: #6A408D;
	--pcl-logo-purple: #59357D;
	--pcl-purple-ink: #241536;
	--pcl-purple-deep: #1A0E29;
	--pcl-paper: #FAFCFC;
	--pcl-line: rgba(106,64,141,.15);
	--pcl-line-dark: rgba(202,242,241,.16);
	--pcl-text: #2B2231;
	--pcl-text-soft: #5A4F66;
	--pcl-text-inv: #F2FBFB;
	--pcl-text-inv-soft: #BFD3D9;
	--pcl-display: 'Marcellus', 'Marcellus Fallback', serif;
	--pcl-body: 'Figtree', 'Figtree Fallback', system-ui, sans-serif;
	--pcl-max: 100vw;
	--pcl-r: 6px;
	--pcl-r-lg: 12px;
	--pcl-ease: cubic-bezier(.16,1,.3,1);
	--pcl-ease-soft: cubic-bezier(.4,0,.2,1);
	--pcl-shadow-sm: 0 4px 16px rgba(36,21,54,.08);
	--pcl-shadow-md: 0 24px 60px rgba(106,64,141,.14);
	--pcl-shadow-lg: 0 40px 90px rgba(0,0,0,.3);
	--pcl-ring: 0 0 0 3px rgba(140,235,239,.4);
	--pcl-space-1: 4px;
	--pcl-space-2: 8px;
	--pcl-space-3: 12px;
	--pcl-space-4: 16px;
	--pcl-space-5: 24px;
	--pcl-space-6: 32px;
	--pcl-space-7: 48px;
	--pcl-space-8: 64px;
	--pcl-white: #fff;
	--pcl-teal-dark: #2C727A;
	--pcl-teal-mid:  #307D87;
	--pcl-teal-light:#8CB9B6;
	--pcl-maxw: 1180px;
	--pcl-gutter: clamp(20px, 5vw, 48px);
	--pcl-section-y: clamp(72px, 9vw, 120px);
	--pcl-section-y-tight: clamp(48px, 7vw, 80px);
}

/* Self-hosted brand fonts — no external CDN dependency (fixes gstatic 404s) */
@font-face {
	font-family: 'Marcellus';
	src: url('../fonts/marcellus-400.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Figtree';
	src: url('../fonts/figtree-300.woff2') format('woff2');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Figtree';
	src: url('../fonts/figtree-400.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Figtree';
	src: url('../fonts/figtree-500.woff2') format('woff2');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Figtree';
	src: url('../fonts/figtree-600.woff2') format('woff2');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Figtree';
	src: url('../fonts/figtree-700.woff2') format('woff2');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* Font fallback with size-adjust — prevents CLS if web fonts are slow (Core Web Vitals) */
@font-face {
	font-family: 'Figtree Fallback';
	src: local('Arial');
	size-adjust: 106%;
	ascent-override: 94%;
	descent-override: 24%;
	line-gap-override: 0%;
}
@font-face {
	font-family: 'Marcellus Fallback';
	src: local('Times New Roman');
	size-adjust: 105%;
	ascent-override: 88%;
	descent-override: 22%;
	line-gap-override: 0%;
}

body,
.ast-container,
.ast-separate-container .site-content > .ast-container {
	font-family: var(--pcl-body);
	color: var(--pcl-text);
	background: var(--pcl-paper);
	line-height: 1.65;
	font-size: 16.5px;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

/* Typography alignment - LEFT for readability (standard for paragraphs/headings in LTR languages) */
p,
li,
dt, dd,
.block-editor-rich-text__editable,
.wp-block-paragraph,
.wp-block-heading,
.entry-content p,
.entry-content li,
.entry-content dt,
.entry-content dd,
.pcl-eyebrow,
.pcl-sub,
.pcl-hero p,
.pcl-section p,
.pcl-band-navy p,
.footer-widgets p,
.site-info p {
	text-align: left !important;
	margin-bottom: var(--pcl-space-4); /* 16px - consistent paragraph spacing */
}

/* Headings: LEFT for consistent hierarchy (visual weight comes from size/weight/color, not alignment) */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.wp-block-heading,
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6,
.pcl-section h2,
.pcl-section h3,
.pcl-band-navy h2,
.pcl-band-navy h3,
.pcl-section .wp-block-heading,
.pcl-band-navy .wp-block-heading {
	text-align: left !important;
	margin-top: var(--pcl-space-5);   /* 24px - heading top margin */
	margin-bottom: var(--pcl-space-3); /* 12px - heading bottom margin */
}

/* Specific heading adjustments for better hierarchy */
h1 {
	margin-top: 0; /* Usually at top of section */
	margin-bottom: var(--pcl-space-4);
}

h2 {
	margin-top: var(--pcl-space-5);
	margin-bottom: var(--pcl-space-4);
}

/* Selection styling */
::selection {
	background: rgba(140,235,239,.55);
	color: var(--pcl-purple-ink);
}

html { scroll-behavior: smooth; }
img { max-width: 100%; }
a { color: inherit; text-decoration: none; }

h1, h2, h3, .serif {
	font-family: var(--pcl-display);
	font-weight: 400;
	letter-spacing: .01em;
	text-wrap: balance;
	text-rendering: optimizeLegibility;
}

h2 {
	font-size: clamp(2rem, 3.8vw, 3rem);
	line-height: 1.12;
	letter-spacing: .005em;
	color: var(--pcl-purple);
	margin: 18px 0 16px;
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	font-family: var(--pcl-display);
	color: var(--pcl-purple-ink);
}

.lede { color: var(--pcl-text-soft); max-width: 58ch; font-size: 1.07rem; line-height: 1.75; }

.eyebrow {
	font-size: .72rem;
	letter-spacing: .34em;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--pcl-teal-text);
	display: flex;
	align-items: center;
	gap: 14px;
}

.eyebrow::before {
	content: "";
	width: 36px;
	height: 1px;
	background: linear-gradient(90deg, var(--pcl-teal-mid), var(--pcl-teal-light));
	flex: none;
}

.pcl-gradient-text {
	background: linear-gradient(120deg, var(--pcl-lilac), var(--pcl-purple));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.pcl-brand-grad {
	background: linear-gradient(135deg, var(--pcl-teal-dark) 0%, var(--pcl-teal-mid) 50%, var(--pcl-teal-light) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	background-size: 200% 100%;
}

section { position: relative; }

.dark {
	background: linear-gradient(180deg, var(--pcl-purple-ink), var(--pcl-purple-deep) 130%);
	color: var(--pcl-text-inv);
}
.dark h2 { color: var(--pcl-mint); }
.dark .lede { color: var(--pcl-text-inv-soft); }
.dark .eyebrow { color: var(--pcl-cyan); }

.wrap { max-width: 100vw; margin: 0 auto; padding: 0 28px; }

/* === Full-width / wide alignment helpers === */
.alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding-left: 0;
	padding-right: 0;
}

.alignwide {
	max-width: var(--pcl-max);
	margin-left: auto;
	margin-right: auto;
}

.pcl-section { padding: var(--pcl-section-y) 0; }
.pcl-section-tight { padding: var(--pcl-section-y-tight) 0; }

/* Unified content gutter — align hero, sections, footer, nav, counters at every breakpoint */
.pcl-section > .wp-block-group,
.pcl-band > .wp-block-group,
.pcl-band-navy > .wp-block-group,
.pcl-hero-grid > .wp-block-group,
.footer-widgets > .wp-block-group,
.site-info > .wp-block-group,
.pcl-section > .wp-block-group > .wp-block-group,
.pcl-band-navy > .wp-block-group > .wp-block-group {
	max-width: var(--pcl-maxw);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--pcl-gutter);
	padding-right: var(--pcl-gutter);
}

/* === Gutenberg layout neutralization === */
/* Override Gutenberg's constrained layout which adds max-width + centering margins */
.is-layout-constrained > .pcl-section,
.is-layout-constrained > .pcl-band,
.is-layout-constrained > .pcl-band-navy,
.is-layout-constrained > .pcl-section-tight,
.is-layout-constrained > .pcl-hero-grid,
.is-layout-constrained > .footer-widgets,
.is-layout-constrained > .site-info {
	max-width: none;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0;
	padding-right: 0;
	width: 100%;
}

/* Base layout containers (alternative approach - direct on section) */
.pcl-section,
.pcl-band-navy,
.pcl-hero-grid,
.footer-widgets,
.site-info {
	position: relative;
}

/* Additional direct container styling for consistency */
.pcl-section > .wp-block-group,
.pcl-band-navy > .wp-block-group,
.pcl-hero-grid > .wp-block-group,
.footer-widgets > .wp-block-group,
.site-info > .wp-block-group {
	max-width: var(--pcl-maxw);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--pcl-gutter);
	padding-right: var(--pcl-gutter);
}

/* Reset default container centering on inner content wrappers */
.is-layout-constrained > .pcl-section > .wp-block-group,
.is-layout-constrained > .pcl-band > .wp-block-group,
.is-layout-constrained > .pcl-section-tight > .wp-block-group {
	max-width: var(--pcl-maxw);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--pcl-gutter);
	padding-right: var(--pcl-gutter);
}

.pcl-tabular {
	font-variant-numeric: tabular-nums;
	font-feature-settings: "tnum";
}

/* Gutenberg color palette utilities */
.has-pcl-mint-background-color { background-color: var(--pcl-mint); }
.has-pcl-cyan-background-color { background-color: var(--pcl-cyan); }
.has-pcl-teal-background-color { background-color: var(--pcl-teal); }
.has-pcl-teal-text-background-color { background-color: var(--pcl-teal-text); }
.has-pcl-lilac-background-color { background-color: var(--pcl-lilac); }
.has-pcl-purple-background-color { background-color: var(--pcl-purple); }
.has-pcl-purple-ink-background-color { background-color: var(--pcl-purple-ink); }
.has-pcl-purple-deep-background-color { background-color: var(--pcl-purple-deep); }
.has-pcl-paper-background-color { background-color: var(--pcl-paper); }
.has-pcl-text-inv-background-color { background-color: var(--pcl-text-inv); }
.has-pcl-mint-color { color: var(--pcl-mint); }
.has-pcl-cyan-color { color: var(--pcl-cyan); }
.has-pcl-teal-color { color: var(--pcl-teal); }
.has-pcl-teal-text-color { color: var(--pcl-teal-text); }
.has-pcl-lilac-color { color: var(--pcl-lilac); }
.has-pcl-purple-color { color: var(--pcl-purple); }
.has-pcl-purple-ink-color { color: var(--pcl-purple-ink); }
.has-pcl-purple-deep-color { color: var(--pcl-purple-deep); }
.has-pcl-paper-color { color: var(--pcl-paper); }
.has-pcl-text-inv-color { color: var(--pcl-text-inv); }
.has-pcl-text-color { color: var(--pcl-text); }
.has-pcl-text-soft-color { color: var(--pcl-text-soft); }
.has-pcl-text-inv-soft-color { color: var(--pcl-text-inv-soft); }

/* Accessibility */
:focus-visible { outline: 2px solid var(--pcl-teal); outline-offset: 3px; box-shadow: var(--pcl-ring); }

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

.skip-link { position: absolute; left: -9999px; top: 0; z-index: 100000; }
.skip-link:focus {
	left: 12px; top: 12px;
	background-color: var(--pcl-paper);
	color: var(--pcl-purple-ink);
	padding: 10px 16px;
	border-radius: var(--pcl-r);
	box-shadow: 0 4px 16px rgba(106,64,141,.08);
	font-weight: 600;
}

/* Astra page title suppression */
.page .entry-header,
.page-template-default .entry-header,
.page .entry-header .entry-title,
.single .entry-header .entry-title,
body.page .entry-header,
body.page-template-default .entry-header {
	display: none !important;
}

/* Make PCL hero and dark bands full-width, edge-to-edge within viewport */
.pcl-hero,
.pcl-band-navy,
.pcl-marquee {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding-left: 0;
	padding-right: 0;
}

/* Ensure sections inside .ast-container fill the content area */
.ast-container .pcl-section,
.ast-container .pcl-band,
.ast-container .pcl-band-navy {
	padding-left: 0 !important;
	padding-right: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* Force full-width sections at all viewports — override ast-container max-width */
.pcl-section, .pcl-band, .pcl-band-navy, .pcl-hero, .pcl-marquee {
	max-width: 100% !important;
	width: 100% !important;
}

/* Full-bleed hero — force viewport width */
.pcl-hero {
	width: 100vw !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	left: 0 !important;
	right: 0 !important;
}

/* Override Astra container max-width for full-width content */
.ast-container {
	max-width: 100vw !important;
	margin: 0 !important;
	padding: 0 !important;
}
.ast-separate-container .site-content > .ast-container {
	max-width: 100vw !important;
	margin: 0 !important;
	padding: 0 !important;
}
.pcl-section, .pcl-band, .pcl-band-navy, .pcl-hero, .pcl-marquee {
	width: 100% !important;
	max-width: 100% !important;
}