* { box-sizing: border-box; }
body { margin: var(--craft-page-margin); background: var(--craft-field); color: var(--craft-ink); font: var(--craft-size-body)/1.6 var(--craft-font-body); }
main { width: min(1360px, 100%); margin-inline: auto; padding: clamp(20px, 4vw, 64px); }
.intro { display: grid; grid-template-columns: 1.2fr 1fr; align-items: end; gap: var(--craft-space-lg); margin-bottom: clamp(32px, 4vw, 56px); }
.eyebrow { margin: 0 0 var(--craft-space-md); color: var(--craft-accent); font: var(--craft-size-small)/1.5 var(--craft-font-mono); letter-spacing: .08em; text-transform: uppercase; }
h1 { font: normal var(--craft-size-title)/1.04 var(--craft-font-display); letter-spacing: -.035em; margin: 0; }
.intro p:last-child { margin: 0; max-width: 44ch; color: var(--craft-muted); }
.fallback img { width: 100%; height: auto; }
.fallback { margin: 0; }
.notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--craft-space-lg); margin-top: clamp(40px, 6vw, 80px); padding-top: var(--craft-space-lg); border-top: 1px solid var(--craft-line); }
.notes h2 { font-size: var(--craft-size-body); font-weight: 600; margin: 0 0 var(--craft-space-sm); }
.notes p { margin: 0; font-size: var(--craft-size-small); color: var(--craft-muted); }
footer { color: var(--craft-muted); margin-top: 48px; font: var(--craft-size-small)/1.6 var(--craft-font-mono); }
a { color: var(--craft-accent); text-underline-offset: .2em; }
a:focus-visible { outline: 2px solid var(--craft-focus); outline-offset: 4px; }
@media (max-width: 767px) { .intro, .notes { grid-template-columns: 1fr; } }
