@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('./assets/fonts/dm-sans-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('./assets/fonts/fraunces-semibold-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url('./assets/fonts/fraunces-semibold-italic-latin.woff2') format('woff2');
}

/* Warm workshop: characterful headings, straightforward reading and controls. */
:root {
  --font-ui: 'DM Sans', 'Segoe UI', Arial, sans-serif;
  --font-display: 'Fraunces', Georgia, serif;
  --ink: #23271f;
  --ink-muted: #505648;
}
body {
  font-family: var(--font-ui);
  font-size: 1.125rem;
  font-weight: 400;
  line-height: 1.6;
  color: var(--ink);
  font-synthesis: none;
}
button, input, textarea { font-family: var(--font-ui); }
h1, h2, h3 { color: var(--ink); }
.event-brand { max-width: none; }
.event-brand h1 {
  font-family: var(--font-display);
  font-size: clamp(2.75rem, 5.6vw, 6rem);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -.025em;
  white-space: nowrap;
}
.event-brand p {
  font-size: clamp(1.0625rem, 1.3vw, 1.25rem);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0;
  margin: 12px 0 0;
}
.header-apply { font-size: 1rem; font-weight: 600; line-height: 1.5; }
.buildathon-invite { max-width: 400px; }
.buildathon-invite .event-date, .section-eyebrow {
  font: 600 .8125rem/1.5 var(--font-ui);
  letter-spacing: .07em;
  color: var(--ink-muted);
}
.buildathon-invite h2 {
  font-family: var(--font-display);
  font-size: clamp(2.25rem, 3.6vw, 3.5rem);
  font-weight: 600;
  line-height: 1.13;
  letter-spacing: -.025em;
  margin-bottom: 20px;
}
.buildathon-invite h2 em, .closing-invite h2 em, .possibilities-header h2 em {
  font-family: inherit;
  font-weight: 600;
  font-style: italic;
  letter-spacing: inherit;
}
.buildathon-invite .event-host {
  font-size: 1.125rem;
  line-height: 1.6;
  color: var(--ink-muted);
  max-width: 32ch;
  margin-bottom: 24px;
}
.apply-button {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
  min-height: 52px;
  padding: 15px 20px;
}
.event-details h2 {
  font: 600 clamp(2rem, 3.5vw, 3rem)/1.15 var(--font-display);
  letter-spacing: -.02em;
}
.event-facts { grid-template-columns: 1.1fr .85fr 1.4fr 1.5fr; }
.event-facts dt {
  font: 600 .8125rem/1.5 var(--font-ui);
  letter-spacing: .06em;
  color: var(--ink-muted);
}
.event-facts dd { font-size: 1.25rem; font-weight: 600; line-height: 1.5; letter-spacing: -.015em; }
.event-facts small { font-size: 1rem; font-weight: 400; line-height: 1.5; color: var(--ink-muted); }
.event-notes p { font-size: 1.125rem; line-height: 1.65; color: var(--ink-muted); max-width: 50ch; }
.event-notes strong { font-weight: 700; color: var(--ink); }
.possibilities-header h2 {
  font: 600 clamp(2rem, 3.7vw, 3.25rem)/1.2 var(--font-display);
  letter-spacing: -.025em;
}
.possibilities-header p { font-size: 1.125rem; line-height: 1.6; color: var(--ink-muted); }
.demo-tab { padding: 18px 16px; color: var(--ink-muted); }
.demo-tab strong { font-size: 1.0625rem; font-weight: 700; line-height: 1.4; letter-spacing: -.01em; }
.demo-tab small { font-size: .875rem; line-height: 1.5; color: var(--ink-muted); }
.demo-description { font-size: 1.0625rem; line-height: 1.6; letter-spacing: 0; }
.demo-credit, .demo-watch, .community-note, .demo-status {
  font-size: .875rem;
  line-height: 1.6;
  color: var(--ink-muted);
}
.demo-credit { text-decoration: underline; text-underline-offset: 4px; }
.closing-invite h2 {
  font: 600 clamp(2.5rem, 5vw, 4.75rem)/1.15 var(--font-display);
  letter-spacing: -.025em;
}
.site-footer { font-size: .875rem; line-height: 1.6; color: var(--ink-muted); }
.site-footer > a:first-child { font: 600 1.75rem/1.2 var(--font-display); letter-spacing: -.025em; }

/* The form uses reading sizes throughout, including hints and validation. */
.application-topline { font-size: .8125rem; font-weight: 600; line-height: 1.5; letter-spacing: .05em; color: var(--ink-muted); }
#form-intro h2, .application-success h2 {
  font: 600 clamp(1.75rem, 3.1vw, 2.5rem)/1.18 var(--font-display);
  letter-spacing: -.02em;
  text-wrap: balance;
}
.application-description, .application-success p { font-size: 1.0625rem; line-height: 1.6; color: var(--ink-muted); }
.application-meta { font-size: .9375rem; line-height: 1.6; color: var(--ink-muted); }
#application-form { gap: 26px; }
.application-field > label, .application-field legend { font-size: 1rem; font-weight: 600; line-height: 1.5; }
.application-field input[type=email], .application-field input[type=url], .application-field textarea {
  font: 400 1.0625rem/1.6 var(--font-ui);
  color: var(--ink);
}
.application-field input::placeholder, .application-field textarea::placeholder { color: #626859; opacity: 1; }
.application-choice, .resume-upload { font-size: 1rem; line-height: 1.5; min-height: 48px; }
.application-field .field-help, .optional, .application-disclosure, .draft-status, .draft-clear {
  font-size: .875rem;
  line-height: 1.6;
  color: var(--ink-muted);
}
.field-error, .application-error { font-size: .9375rem; line-height: 1.6; color: #923b29; }
.resume-restore { color: var(--ink-muted) !important; }
.draft-actions { flex-wrap: wrap; }
.hero-workspace #error { font-size: 1rem; }

@media (max-width: 900px) {
  .hero { padding-top: 168px; }
  .buildathon-invite { max-width: 460px; }
  .buildathon-invite h2 { font-size: clamp(2rem, 5.8vw, 3rem); }
  .event-facts { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 650px) {
  .event-brand { max-width: 72%; }
  .event-brand h1 { font-size: clamp(1.875rem, 8.5vw, 3.25rem); }
  .event-brand p { font-size: 1rem; line-height: 1.5; margin-top: 10px; }
  .buildathon-invite .event-date { font-size: .8125rem; margin-bottom: 16px; }
  .buildathon-invite h2 { font-size: clamp(1.875rem, 8vw, 2.75rem); margin-bottom: 16px; }
  .buildathon-invite .event-host { font-size: 1.0625rem; max-width: 33ch; margin-bottom: 24px; }
  .event-details h2 { font-size: 2.25rem; }
  .event-facts { gap: 32px 24px; }
  .event-facts dd { font-size: 1.125rem; }
  .possibilities-header h2 { font-size: 2rem; max-width: 20ch; line-height: 1.25; }
  .possibilities-header h2 em { display: block; }
  .possibilities-header p { font-size: 1.0625rem; max-width: 32ch; }
  .demo-tabs { grid-template-columns: 1fr; gap: 12px; }
  .demo-tab { display: flex; gap: 16px; padding: 14px 16px; min-height: 88px; text-align: left; }
  .demo-tab img { width: 80px; height: 56px; margin: 0; }
  .demo-tab strong { font-size: 1.0625rem; }
  .demo-tab small { font-size: .875rem; margin-top: 4px; }
  .demo-description { font-size: 1rem; }
  .demo-credit, .demo-watch, .community-note { font-size: .875rem; }
  .closing-invite h2 { font-size: clamp(2rem, 9vw, 3rem); }
  .section-eyebrow { font-size: .8125rem; letter-spacing: .05em; }
  #apply-dialog { width: 100vw; max-width: 100vw; }
  .application-content { padding: 38px 24px 32px; }
}
@media (max-height: 650px) and (min-width: 901px) {
  .buildathon-invite { top: 29%; }
  .buildathon-invite h2 { font-size: 2rem; }
  .buildathon-invite .event-host { font-size: 1rem; margin-bottom: 16px; }
}