/* =============================================================================
   BASE — reset, typography, elements, accessibility
   ============================================================================= */

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
	font-family: var(--font-body);
	font-size: var(--fs-400);
	line-height: var(--lh-base);
	color: var(--color-ink);
	background: var(--color-bg);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	min-height: 100vh;
	overflow-x: hidden;
}

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

input, button, textarea, select { font: inherit; color: inherit; }

a {
	color: var(--color-brand-dark);
	text-decoration: none;
	transition: color var(--dur) var(--ease);
}
a:hover { color: var(--color-brand); }

/* Headings */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-heading);
	font-weight: var(--fw-semi);
	line-height: var(--lh-tight);
	color: var(--color-ink);
	text-wrap: balance;
}
h1 { font-size: var(--fs-900); letter-spacing: -0.02em; }
h2 { font-size: var(--fs-800); letter-spacing: -0.01em; }
h3 { font-size: var(--fs-700); }
h4 { font-size: var(--fs-600); }
h5 { font-size: var(--fs-500); }
h6 { font-size: var(--fs-400); text-transform: uppercase; letter-spacing: var(--ls-caps); }

p { line-height: var(--lh-base); }
p + p { margin-top: var(--space-4); }

ul, ol { padding-left: 1.25rem; }
li + li { margin-top: var(--space-2); }

strong, b { font-weight: var(--fw-semi); }
small { font-size: var(--fs-300); }

blockquote {
	border-left: 3px solid var(--color-brand);
	padding-left: var(--space-5);
	font-size: var(--fs-500);
	color: var(--color-ink-soft);
	font-style: italic;
}

hr { border: 0; border-top: 1px solid var(--color-line); margin: var(--space-7) 0; }

code, pre { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.9em; }

/* Tables (used by spec sheets) */
table { border-collapse: collapse; width: 100%; }
th, td { text-align: left; padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--color-line); }
th { font-family: var(--font-heading); font-weight: var(--fw-semi); }

/* Form fields — global, consistent styling */
input[type=text], input[type=email], input[type=tel], input[type=search],
input[type=number], input[type=url], input[type=password], textarea, select {
	width: 100%;
	padding: 0.7rem 0.9rem;
	background: var(--color-bg);
	border: 1px solid var(--color-line);
	border-radius: var(--radius-sm);
	color: var(--color-ink);
	transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
input:focus, textarea:focus, select:focus {
	outline: none;
	border-color: var(--color-brand);
	box-shadow: 0 0 0 3px rgba(138,109,59,.18);
}
label { display: inline-block; font-weight: var(--fw-medium); margin-bottom: var(--space-1); }
textarea { min-height: 120px; resize: vertical; }

/* Selection */
::selection { background: var(--color-brand); color: #fff; }

/* Visible focus for keyboard users (accessibility / WCAG) */
:focus-visible { outline: 2px solid var(--color-brand); outline-offset: 2px; }

/* Screen-reader-only utility */
.screen-reader-text {
	border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
	height: 1px; width: 1px; margin: -1px; padding: 0; position: absolute;
	overflow: hidden; word-wrap: normal !important;
}
.skip-link {
	position: absolute; left: -9999px; top: 0; z-index: 99999;
	background: var(--color-ink); color: #fff; padding: var(--space-3) var(--space-4);
	border-radius: 0 0 var(--radius) 0;
}
.skip-link:focus { left: 0; color: #fff; }

/* Reduced motion handled in tokens.css */