

:root {
  --ground:#FFFFFF;
  --surface:#F0F0F0;
  --surface-2:#DEDEDE;
  --line:#BABABA;
  --ink-soft:#4D4D4D;
  --ink:#292929;
  --accent:#3A5A8C;
  --accent-ink:#FFFFFF;


  --cuba-6ff:"Bitter", "Bitter Fallback", Georgia, serif;
  --cuba-d06:"Source Sans 3", "Source Sans 3 Fallback", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --cuba-059:"JetBrains Mono", "JetBrains Mono Fallback", ui-monospace, SFMono-Regular, Menlo, monospace;


  --fs-xs:clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);
  --fs-sm:clamp(0.875rem, 0.84rem + 0.2vw, 0.9375rem);
  --fs-base:clamp(1rem, 0.96rem + 0.25vw, 1.0625rem);
  --fs-md:clamp(1.125rem, 1.05rem + 0.4vw, 1.25rem);
  --fs-lg:clamp(1.3125rem, 1.2rem + 0.65vw, 1.5625rem);
  --fs-xl:clamp(1.625rem, 1.42rem + 1.1vw, 2.0625rem);
  --fs-2xl:clamp(2rem, 1.7rem + 1.7vw, 2.75rem);
  --fs-3xl:clamp(2.375rem, 1.95rem + 2.5vw, 3.625rem);
  --fs-display:clamp(2.625rem, 2.1rem + 3.4vw, 4.5rem);


  --lh-tight:1.15;
  --lh-snug:1.28;
  --lh-base:1.55;
  --lh-loose:1.7;


  --space-2xs:clamp(0.25rem, 0.22rem + 0.15vw, 0.375rem);
  --space-xs:clamp(0.5rem, 0.44rem + 0.3vw, 0.6875rem);
  --space-sm:clamp(0.75rem, 0.65rem + 0.5vw, 1rem);
  --space-md:clamp(1.25rem, 1.05rem + 1vw, 1.75rem);
  --space-lg:clamp(2rem, 1.65rem + 1.8vw, 2.875rem);
  --space-xl:clamp(3rem, 2.45rem + 2.8vw, 4.5rem);
  --space-2xl:clamp(4.5rem, 3.6rem + 4.5vw, 6.75rem);
  --space-3xl:clamp(6rem, 4.8rem + 6vw, 9rem);


  --radius-xs:1px;
  --radius-sm:2px;
  --radius-md:4px;


  --ease-standard:cubic-bezier(0.2, 0, 0, 1);
  --ease-out:cubic-bezier(0, 0, 0.2, 1);
  --ease-in:cubic-bezier(0.4, 0, 1, 1);
  --dur-fast:140ms;
  --dur-base:220ms;
  --dur-slow:380ms;


  --container-max:1440px;
  --measure-narrow:46ch;
  --measure-prose:65ch;
  --pinned-height:48px;
}


*,
*::before,
*::after {
  box-sizing:border-box;
  margin:0;
  padding:0;
}


html {
  background-color:var(--ground);
  color:var(--ink);
  font-family:var(--cuba-d06);
  font-size:100%;
  line-height:var(--lh-base);
  -webkit-text-size-adjust:100%;
  text-rendering:optimizeLegibility;
  scroll-behavior:smooth;
  scroll-padding-block-start:5.5rem;
}


body {
  background-color:var(--ground);
  color:var(--ink);
  font-family:var(--cuba-d06);
  min-height:100vh;
  display:flex;
  flex-direction:column;
  overflow-x:hidden;
  position:relative;
}


main {
  flex:1 0 auto;
  width:100%;
}


img,
picture,
video,
canvas,
svg {
  display:block;
  max-width:100%;
  height:auto;
}


button,
input,
optgroup,
select,
textarea {
  font:inherit;
  color:inherit;
  letter-spacing:inherit;
}


button {
  background:none;
  border:none;
  cursor:pointer;
  text-align:left;
}


a {
  color:inherit;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}


table {
  border-collapse:collapse;
  border-spacing:0;
  width:100%;
}


h1,
h2,
h3,
h4,
h5,
h6 {
  font-family:var(--cuba-6ff);
  font-weight:600;
  line-height:var(--lh-tight);
  color:var(--ink);
  letter-spacing:-0.015em;
  text-wrap:balance;
}


h1 {
  font-size:var(--fs-3xl);
  font-weight:700;
  letter-spacing:-0.025em;
}


h2 {
  font-size:var(--fs-2xl);
  letter-spacing:-0.02em;
}


h3 {
  font-size:var(--fs-xl);
  font-weight:600;

}


h4 {
  font-size:var(--fs-lg);
  font-weight:600;
}


p {
  max-width:var(--measure-prose);
  font-size:var(--fs-base);
  line-height:var(--lh-base);
  color:var(--ink);
}


p + p {
  margin-top:var(--space-sm);
}


.lede {
  font-size:var(--fs-md);
  line-height:var(--lh-snug);
  color:var(--ink-soft);
  max-width:var(--measure-prose);
}


small,
.caption,
.meta {
  font-size:var(--fs-xs);
  line-height:var(--lh-snug);
  color:var(--ink-soft);
}


code,
kbd,
samp,
pre,
.tabular,
.spec-value {
  font-family:var(--cuba-059);
  font-variant-numeric:tabular-nums lining-nums;
}


ul,
ol {
  padding-inline-start:1.25rem;
}


li + li {
  margin-top:var(--space-2xs);
}


hr {
  border:none;
  border-top:1px solid var(--line);
  margin:var(--space-lg) 0;
}


.skip-link {
  position:absolute;
  top:-999px;
  left:1rem;
  z-index:10000;
  padding:0.75rem 1.25rem;
  background-color:var(--ink);
  color:var(--ground);
  font-size:var(--fs-sm);
  font-weight:600;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  transition:top var(--dur-fast) var(--ease-out);
}


.skip-link:focus {
  top:1rem;
}


.visually-hidden {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0, 0, 0, 0) !important;
  white-space:nowrap !important;
  border:0 !important;
}


.container {
  width:100%;
  max-width:var(--container-max);
  margin-inline:0 auto;
  padding-inline:var(--space-md);
}


.offcenter-shell {
  width:100%;
  max-width:var(--container-max);
  margin-inline:auto;
  padding-left:clamp(1rem, 2.5vw, 2.5rem);
  padding-right:clamp(1rem, 2.5vw, 2.5rem);
  box-sizing:border-box;
}


.split-2-1 {
  display:grid;
  grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);
  gap:var(--space-lg);
  align-items:start;
}


.split-1-2 {
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 2fr);
  gap:var(--space-lg);
  align-items:start;
}


@media (max-width: 860px) {
  .split-2-1,
  .split-1-2 {
    grid-template-columns:minmax(0, 1fr);
    gap:var(--space-md);
  }
}


.verb-heading {
  font-family:var(--cuba-6ff);
  font-size:var(--fs-display);
  font-weight:700;
  line-height:1.05;
  letter-spacing:-0.03em;
  margin-bottom:var(--space-sm);
  color:var(--ink);
  text-wrap:balance;
}


.verb-narrative {
  max-width:var(--measure-narrow);
  font-size:var(--fs-base);
  line-height:var(--lh-loose);
  color:var(--ink);
}


.verb-narrative p + p {
  margin-top:var(--space-sm);
}


.flow-band {
  width:100%;
  margin-block:var(--space-xl);
  position:relative;
}


.flow-band-full {
  width:100vw;
  position:relative;
  left:50%;
  right:50%;
  margin-left:max(-50vw, calc(50% - 50vw));
  margin-right:max(-50vw, calc(50% - 50vw));
  margin-block:var(--space-2xl);
}


.flow-band-full img {
  width:100%;
  height:auto;
  aspect-ratio:3 / 2 !important;
  max-height:none !important;

  object-fit:cover;
  object-position:center;
}


div.flow-band-full picture img,
div.flow-band-full > img,
.flow-band picture img,
.flow-band > img {
  aspect-ratio:3 / 2 !important;
  max-height:none !important;
  height:auto !important;
}


.band-caption {
  padding:var(--space-xs) var(--space-md);
  font-family:var(--cuba-059);
  font-size:var(--fs-xs);
  color:var(--ink-soft);
  border-bottom:1px solid var(--line);
  background-color:var(--surface);
  display:flex;
  justify-content:space-between;
  gap:var(--space-sm);
  flex-wrap:wrap;
  max-width:100%;
  box-sizing:border-box;
}


.band-caption > * {
  max-width:100%;
  overflow-wrap:break-word;
}


:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:2px;
}


@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {

    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
    scroll-behavior:auto !important;
  }
}
