:root {
  --accent: #ffb454;
  --accent-red: #e2483d;
  --background: #17120d;
  --error: #e2483d;
  --info: #7fa8c9;
  --primary: #d8c49a;
  --secondary: #6e4f30;
  --success: #8fbf6a;
  --surface: #241b13;
  --surface-raised: #2e2115;
  --text: #f2e8d5;
  --text-secondary: #c9b490;
  --warning: #ffb454;
  --font-family-base: system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-family-heading: 'Avenir Next', 'Segoe UI', system-ui, -apple-system, Roboto, sans-serif;
  --font-family-mono: ui-monospace, 'SF Mono', 'Cascadia Mono', Menlo, Consolas, monospace;
  --max-width: 1120px;
  --space-small: 8px;
  --space: 24px;
  --section-space: 96px;
}
* { box-sizing: border-box; }
body { margin: 0; color: var(--text); background: var(--background); font-family: var(--font-family-base); font-size: 17px; line-height: 1.6; }
a { color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: 6px; transition: color 200ms cubic-bezier(0.2, 0, 0, 1); }
a:hover { color: var(--text); }
a:active { color: var(--info); }
a:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
a[aria-disabled="true"] { color: var(--text-secondary); pointer-events: none; }
.container { width: calc(100% - 48px); max-width: var(--max-width); margin-inline: auto; }
.masthead { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 24px; border-bottom: 1px solid var(--secondary); }
.wordmark, .eyebrow, .index, .hero-caption { font-family: var(--font-family-mono); font-size: .71rem; letter-spacing: .12em; }
.wordmark { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; text-decoration: none; font-weight: 700; }
.wordmark span { color: var(--text-secondary); font-weight: 400; }
nav { display: flex; gap: 24px; font-size: .82rem; }
nav a, footer a { display: inline-flex; align-items: center; min-height: 44px; }
.skip { position: absolute; top: -100px; left: 24px; padding: 16px; background: var(--surface); z-index: 2; }
.skip:focus { top: 8px; }
h1, h2, h3 { font-family: var(--font-family-heading); line-height: 1.15; margin: 0; }
h1 { font-size: clamp(3.3rem, 7vw, 6.5rem); letter-spacing: -.06em; font-weight: 750; }
h1 span { color: var(--primary); }
h2 { font-size: clamp(2rem, 4vw, 2.6rem); letter-spacing: -.035em; }
h3 { font-size: 1.25rem; letter-spacing: -.02em; }
p { max-width: 62ch; margin: 16px 0 0; color: var(--text-secondary); }
.eyebrow { color: var(--accent); margin-bottom: 24px; }
.hero { padding-top: 40px; position: relative; isolation: isolate; }
.hero > p { max-width: 43ch; }
.hero img { display: block; width: 78%; height: auto; margin: -190px -24px -24px auto; position: relative; z-index: -1; }
.hero-caption { display: flex; justify-content: space-between; gap: 16px; color: var(--text-secondary); padding-block: 24px; }
main > section + section { border-top: 1px solid var(--secondary); padding-block: var(--section-space); }
.split { display: grid; grid-template-columns: 1fr 1.2fr; gap: 64px; }
.split > div > p:first-child { margin-top: 0; }
.section-head { display: grid; grid-template-columns: 1fr 1fr; align-items: end; gap: 64px; margin-bottom: 40px; }
.section-head p { margin: 0; }
.categories { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.categories article { grid-column: span 2; background: var(--surface); padding: 24px; }
.categories article:nth-child(n+4) { grid-column: span 3; }
.index { display: block; color: var(--accent); margin-bottom: 40px; }
.workshop-list article { display: grid; grid-template-columns: 1fr 1.2fr; gap: 64px; border-top: 1px solid var(--secondary); padding-block: 24px; }
.workshop-list p { margin: 0; }
.care-notes article + article { margin-top: 40px; }
footer { border-top: 1px solid var(--secondary); padding-block: 24px; display: flex; justify-content: space-between; gap: 24px; align-items: center; font-size: .82rem; color: var(--text-secondary); }
@media (max-width: 1200px) { .hero img { margin-top: -40px; width: 90%; } }
@media (max-width: 900px) { .split, .section-head, .workshop-list article { gap: 40px; } }
@media (max-width: 640px) {
:root { --section-space: 64px; }
.masthead { align-items: start; flex-direction: column; gap: 8px; padding-block: 16px; }
nav { gap: 24px; }
.hero { padding-top: 40px; }
.hero img { width: 100%; margin: 0; }
.hero-caption { font-size: .6rem; letter-spacing: .04em; }
.split, .section-head, .workshop-list article { grid-template-columns: 1fr; gap: 24px; }
.categories { grid-template-columns: 1fr; }
.categories article, .categories article:nth-child(n+4) { grid-column: auto; }
.index { margin-bottom: 24px; }
footer { align-items: start; flex-direction: column; gap: 8px; }
}
@media (prefers-reduced-motion: reduce) { a { transition: none; } }