/* Alternative color study. Layout, typography, copy, and motion remain in the original files. */
:root {
  --paper: #FAF9F6;
  --blue: #315E8C;
  --mustard: #D1AD3D;
  --red: #C7473D;
  --ink: #30332F;
  --rule: color-mix(in srgb, var(--ink) 22%, var(--paper));
}
body, .site-header, .opening-composition, .selected-work, .about, .contact {
  background: var(--paper);
  color: var(--ink);
}
::selection { background: var(--mustard); color: var(--ink); }
.skip-link { background: var(--blue); color: var(--paper); }
.brand, .footer-brand { color: var(--blue); }
h1 { color: var(--ink); }
h1 span { color: var(--blue); }
.hero-introduction { color: var(--ink); }
.continue-link, .bio a, .contact-links a { color: var(--blue); }
/* Blue carries the broadest area; mustard supplies light; red is the smaller accent. */
.ribbon { stroke: var(--paper); }
.ribbon-one, .ribbon-four, .ribbon-six, .ribbon-seven { fill: var(--blue); }
.ribbon-two, .ribbon-five { fill: var(--mustard); }
.ribbon-three { fill: var(--red); }
.ai-focus::before {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 12' preserveAspectRatio='none'%3E%3Cpath d='M0 6C160 -4 240 16 400 6S640 -4 800 6' fill='none' stroke='%23315E8C' stroke-width='1.6'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}
.project { border-top-color: var(--rule); }
.portrait-thread, .contact-thread { stroke: var(--blue); }
.portrait figcaption, .bio h2, .site-footer { color: var(--ink); }
@media (forced-colors: active) {
  body, .site-header, .opening-composition, .hero-introduction, .selected-work, .about, .contact { background: Canvas; color: CanvasText; }
  h1, h1 span, .bio h2, .site-footer { color: CanvasText; }
  .brand, .footer-brand, .continue-link, .bio a, .contact-links a { color: LinkText; }
  .project { border-top-color: CanvasText; }
  .skip-link { background: Canvas; color: LinkText; }
}
@media print {
  body, .opening-composition, .selected-work, .about, .contact, .site-header { background: white; color: var(--ink); }
  h1, h1 span, .bio h2, .brand, .footer-brand, .contact-links a { color: var(--ink); }
}
