/* Impresario: a calm, readable site. Navy ink on cool white; the five-line staff in champagne gold is the one flourish. */
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: #F6F8FB;
  color: #16233F;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 17px;
  line-height: 1.65;
}
.wrap { max-width: 40rem; margin: 0 auto; padding: 0 1.25rem; }

.skip { position: absolute; left: -999px; top: 0; background: #16233F; color: #FFFFFF; padding: .5rem .9rem; }
.skip:focus { left: .5rem; top: .5rem; z-index: 10; }

header { padding-top: 1.1rem; }
.brand {
  font-family: Palatino, "Palatino Linotype", "Iowan Old Style", "Book Antiqua", Georgia, serif;
  font-size: 1.25rem; font-weight: 600; letter-spacing: .01em;
  color: #16233F; text-decoration: none;
}
nav { margin-top: .35rem; }
nav a {
  display: inline-block; margin: 0 1.1rem .25rem 0; padding: .15rem 0;
  color: #5B6477; text-decoration: none; border-bottom: 2px solid transparent;
}
nav a:hover { color: #16233F; border-bottom-color: #B08D3C; }
nav a[aria-current="page"] { color: #16233F; border-bottom-color: #B08D3C; }

.staff { display: block; width: 100%; height: 34px; margin: .9rem 0 0; color: #B08D3C; }

h1, h2 {
  font-family: Palatino, "Palatino Linotype", "Iowan Old Style", "Book Antiqua", Georgia, serif;
  font-weight: 600; color: #16233F;
}
h1 { font-size: 2.6rem; line-height: 1.15; margin: 1.6rem 0 .4rem; letter-spacing: -.01em; }
h2 { font-size: 1.45rem; line-height: 1.3; margin: 2.4rem 0 .5rem; }
p { margin: .7rem 0; }
.lede { font-size: 1.3rem; line-height: 1.5; color: #3B455B; margin: .2rem 0 1rem; }
.meta { color: #5B6477; font-size: .95rem; margin-top: 0; }

a { color: #16233F; text-underline-offset: 2px; }
a:hover { color: #0B1426; }
a:focus-visible, summary:focus-visible { outline: 3px solid #B08D3C; outline-offset: 3px; }

ul { padding-left: 1.2rem; margin: .6rem 0; }
li { margin: .4rem 0; }

details { border-top: 1px solid #D6DCE8; padding: .1rem 0; }
details:last-of-type { border-bottom: 1px solid #D6DCE8; }
summary { cursor: pointer; font-weight: 600; padding: .85rem 0; }
details p, details ul { margin-top: 0; }
details > :last-child { margin-bottom: 1rem; }

.soon { margin: 1.4rem 0 .5rem; padding: .8rem 1rem; border-left: 3px solid #B08D3C; background: #ECEFF5; }

footer { margin: 3.5rem 0 2.5rem; padding-top: 1rem; border-top: 1px solid #D6DCE8; color: #5B6477; font-size: .95rem; }
footer a { color: #5B6477; }

@media (max-width: 480px) {
  body { font-size: 16.5px; }
  h1 { font-size: 2.1rem; }
  .lede { font-size: 1.15rem; }
}

@media (prefers-color-scheme: dark) {
  body { background: #0F1830; color: #E9EDF5; }
  .brand, h1, h2 { color: #F3F5FA; }
  nav a { color: #A9B3C7; }
  nav a:hover, nav a[aria-current="page"] { color: #F3F5FA; border-bottom-color: #D8BE7C; }
  .staff { color: #D8BE7C; }
  .lede { color: #C9D1E0; }
  .meta, footer, footer a { color: #A9B3C7; }
  a { color: #E9EDF5; }
  a:hover { color: #FFFFFF; }
  a:focus-visible, summary:focus-visible { outline-color: #D8BE7C; }
  details { border-top-color: #2A3757; }
  details:last-of-type { border-bottom-color: #2A3757; }
  .soon { background: #16213D; border-left-color: #D8BE7C; }
  footer { border-top-color: #2A3757; }
  .skip { background: #E9EDF5; color: #0F1830; }
}
