/* PGH Automation — base.css
   Reset, design tokens, and typography. Mobile-first. */

:root {
	--charcoal-950: #0f1216;
	--charcoal-900: #15191f;
	--charcoal-800: #1c2129;
	--charcoal-700: #2a3039;
	--charcoal-line: #313842;
	--white: #ffffff;
	--off-white: #f5f6f8;
	--ink: #181b20;
	--ink-muted: #5b6472;
	--ink-on-dark-muted: #aab1bd;
	--gold: #f0b23c;
	--gold-deep: #c2860f;
	--gold-soft: rgba(240, 178, 60, .14);
	--radius-s: 8px;
	--radius-m: 14px;
	--radius-pill: 999px;
	--shadow-card: 0 10px 30px rgba(15, 18, 22, .08);
	--shadow-card-dark: 0 10px 30px rgba(0, 0, 0, .35);
	--max-width: 1180px;
	--font-sans: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body, h1, h2, h3, h4, h5, h6, p, ul, ol, figure { margin: 0; padding: 0; }
ul, ol { list-style: none; }

html, body {
	font-family: var(--font-sans);
	color: var(--ink);
	background: var(--white);
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

img, svg { display: block; max-width: 100%; height: auto; }

a { color: inherit; text-decoration: none; }

button, input, textarea, select { font-family: inherit; font-size: 1rem; color: inherit; }
button { cursor: pointer; background: none; border: 0; }

a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
	outline: 2px solid var(--gold);
	outline-offset: 2px;
}

.visually-hidden {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0; border: 0;
	overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap;
}

/* Typography */
h1, h2, h3, h4 {
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: var(--ink);
}

h1 { font-size: clamp(2rem, 5.5vw + 1rem, 3.4rem); }
h2 { font-size: clamp(1.5rem, 3vw + 1rem, 2.25rem); }
h3 { font-size: clamp(1.15rem, 1.5vw + 1rem, 1.4rem); }

h1, h2, h3, h4, p { overflow-wrap: break-word; }

p { color: var(--ink-muted); }
p + p { margin-top: 14px; }

strong { color: var(--ink); font-weight: 700; }

.dark-section h1, .dark-section h2, .dark-section h3, .dark-section h4, .dark-section p, .dark-section strong {
	color: var(--white);
}
.dark-section p { color: var(--ink-on-dark-muted); }

.eyebrow {
	display: inline-block;
	position: relative;
	padding-left: 26px;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--gold-deep);
}
.dark-section .eyebrow { color: var(--gold); }
.eyebrow::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 18px; height: 2px;
	background: currentColor;
}