/* v0.5 typography: one family, shared roles; layout follows below. */
:root {
  --font-sans:Arial,Helvetica,sans-serif;
  --weight-regular:400;
  --weight-bold:700;
  --type-hero:clamp(2.5rem,1.5rem + 4vw,5rem);
  --type-section:clamp(1.875rem,1.5rem + 1.2vw,2.75rem);
  --type-panel:clamp(1.75rem,1.5rem + .8vw,2.25rem);
  --type-project:clamp(1.875rem,1.5rem + 1vw,2.5rem);
  --type-flagship:clamp(2.25rem,1.8rem + 1.5vw,3.25rem);
  --type-subsection:clamp(1.1875rem,1.1rem + .35vw,1.375rem);
  --type-lead:clamp(1.125rem,1.05rem + .25vw,1.25rem);
  --type-body:clamp(1.0625rem,1rem + .14vw,1.125rem);
  --type-control:1rem;
  --type-meta:.8125rem;
  --leading-display:1.08;
  --leading-heading:1.2;
  --leading-subsection:1.35;
  --leading-body:1.6;
  --leading-lead:1.5;
  --leading-control:1.35;
  --tracking-display:-.025em;
  --tracking-heading:-.015em;
  --measure-reading:66ch;
  font-family:var(--font-sans);
  font-weight:var(--weight-regular);
  letter-spacing:0;
}
body {
  font-size:var(--type-body);
  line-height:var(--leading-body);
}
h1,h2,h3,strong { font-weight:var(--weight-bold) }
h1 {
  font-size:var(--type-hero);
  line-height:var(--leading-display);
  letter-spacing:var(--tracking-display);
}
h2 {
  font-size:var(--type-section);
  line-height:var(--leading-heading);
  letter-spacing:var(--tracking-heading);
}
.panel-content h2 {
  font-size:var(--type-panel);
  max-width:28ch;
}
h3,.purpose-statements strong,.experience-list strong {
  font-size:var(--type-subsection);
  line-height:var(--leading-subsection);
  letter-spacing:0;
}
.project h3,.flagship h3 {
  font-size:var(--type-project);
  line-height:var(--leading-heading);
  letter-spacing:var(--tracking-heading);
}
.flagship h3 { font-size:var(--type-flagship) }
.hero-copy p,.panel-lead,.editorial-note {
  font-size:var(--type-lead);
  line-height:var(--leading-lead);
  font-weight:var(--weight-regular);
  letter-spacing:0;
}
.panel-content p,.panel-sources,.story-copy { max-width:var(--measure-reading) }
.section-intro { max-width:48ch }
.text-link,.navigation a,.menu-open,.panel-close,.language,.skip-link {
  font-size:var(--type-control);
  font-weight:var(--weight-bold);
  line-height:var(--leading-control);
  letter-spacing:0;
}
.language { font-size:.875rem }
.menu-open,.panel-close { font-size:.9375rem }
.menu-panel nav a { font-size:1.25rem; line-height:1.4; font-weight:var(--weight-bold) }
.menu-panel h2 { font-size:var(--type-subsection); letter-spacing:0 }
.eyebrow,.prototype-label,figcaption,.panel-toolbar,.footer {
  font-size:var(--type-meta);
  line-height:1.5;
  letter-spacing:0;
}
.eyebrow { font-size:.75rem; font-weight:var(--weight-bold); letter-spacing:.055em }
.prototype-label { font-size:.75rem }
.footer .text-link { font-size:var(--type-meta) }
.ui-icon {
  width:1.25em;
  height:1.25em;
  flex:none;
  vertical-align:-.22em;
}
/* Reading focus is an orientation cue, not an interactive control's ring.
   Suppression is limited to static titles and explicitly pointer-restored controls.
   Unknown activation keeps a visible cue. Forced colors retains system outlines. */
/* A bounded arrival marker; semantic focus stays on main, never on its text. */
.hero-content > .eyebrow { position:relative }
#sadrzaj:focus .hero-content > .eyebrow::before {
  content:"";
  position:absolute;
  inset-block-start:-.75rem;
  inset-inline-start:0;
  inline-size:2rem;
  border-block-start:3px solid var(--yellow);
}
@media (forced-colors:none) {
  .reading-focus:focus,#sadrzaj:focus { outline:none }
  .reading-focus:focus-visible:not([data-focus-kind="pointer"]),
  .reading-focus[data-focus-kind="keyboard"]:focus,
  .reading-focus[data-focus-kind="unknown"]:focus {
    text-decoration:underline;
    text-decoration-color:var(--focus);
    text-decoration-thickness:2px;
    text-underline-offset:.2em;
  }
  button[data-focus-kind="pointer"]:focus,a[data-focus-kind="pointer"]:focus { outline:none }
}
@media (forced-colors:active) {
  .reading-focus:focus,[data-focus-kind]:focus { outline:2px solid Highlight; outline-offset:5px }
}
@media (hover:hover) and (pointer:fine) {
  .text-link:hover { text-decoration:underline; text-decoration-thickness:2px }
  .navigation a:hover { background:#ffffff10; text-decoration:underline }
  .menu-open:hover,.panel-close:hover { border-color:currentColor }
  .menu-panel nav a:hover { text-decoration:underline }
}
:root {
  --navy:#102b46;
  --blue:#2459b8;
  --sky:#a8c9f4;
  --paper:#f5f8fc;
  --white:#fff;
  --yellow:#ffd43b;
  --muted:#496077;
  --line:#c9d5e1;
  --focus:var(--blue);
  color-scheme:light;

  color:var(--navy);
  background:var(--paper)
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:110px
}

body {
  margin:0;

  }

button,a {
  -webkit-tap-highlight-color:transparent
}

button {
  font:inherit;
  color:inherit;
  cursor:pointer
}

a {
  color:inherit;
  text-underline-offset:5px
}

button {
  border:0;
  background:none
}

img {
  display:block;
  max-width:100%;
  height:auto
}

figure,p,h1,h2,h3 {
  margin:0
}

p+p {
  margin-top:18px
}

h1,h2,h3 {


  text-wrap:balance;
  overflow-wrap:anywhere
}

h1 {


  max-width:15ch
}

button:focus-visible,a:focus-visible,
button[data-focus-kind="keyboard"]:focus,a[data-focus-kind="keyboard"]:focus,
button[data-focus-kind="unknown"]:focus,a[data-focus-kind="unknown"]:focus {
  outline:3px solid var(--focus);
  outline-offset:5px
}

button[hidden],[hidden] {
  display:none!important
}

.wrap {
  width:min(1248px,calc(100% - 96px));
  margin-inline:auto
}

.section-space {
  padding-block:78px
}

.blue-text {
  color:var(--blue)
}

.yellow-text {
  color:var(--yellow)
}

.eyebrow {




  text-transform:uppercase
}

.small-mark {
  display:inline-block;
  flex:none;
  width:7px;
  height:7px;
  background:var(--yellow);
  border-radius:50%
}

.text-link {
  display:inline-flex;
  align-items:center;
  gap:18px;
  min-height:44px;
  padding:7px 0;
  border-bottom:1px solid currentColor;
  text-decoration:none;



  text-align:left
}



.skip-link {
  position:fixed;
  left:20px;
  top:12px;
  z-index:30;
  padding:12px 18px;
  background:var(--yellow);
  color:var(--navy);
  transform:translateY(-180%)
}

.skip-link:focus {
  transform:none
}

.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  border:0
}

.hero {
  background:var(--navy);
  color:var(--white);
  --focus:var(--yellow)
}

.site-header {
  position:sticky;
  top:0;
  z-index:20;
  background:var(--navy);
  color:var(--white);
  border-bottom:1px solid #ffffff26;
  --focus:var(--yellow)
}

.header {
  display:flex;
  align-items:center;
  gap:30px;
  padding-block:16px
}

.site-header .brand {
  width:110px
}

.brand {
  width:138px;
  flex:none;
  display:block
}

.navigation {
  margin-left:auto;
  display:flex;
  gap:10px
}

.navigation a {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  text-decoration:none;

  border-bottom:2px solid transparent
}

.navigation a[aria-current] {
  border-bottom-color:var(--yellow)
}



.menu-open {
  display:none;
  align-items:center;
  gap:10px;
  justify-content:center;
  min-height:44px;
  padding:8px 12px;
  border:1px solid #c9dbef70;
  }



.language {
  display:flex;
  align-items:center;
  position:relative;
  gap:5px;
  }

.language-current,.language a {
  min-width:44px;
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center
}

.language a {
  color:var(--sky)
}

.language-notice {
  position:absolute;
  z-index:2;
  right:0;
  top:calc(100% + 12px);
  width:280px;
  padding:20px;
  background:var(--white);
  color:var(--navy);
  box-shadow:0 12px 40px #081b2f33;
  }

.hero-content {
  padding-top:50px;
  padding-bottom:26px
}

.hero-content>.eyebrow {
  color:var(--sky);
  margin-bottom:24px
}

.hero-grid {
  display:grid;
  grid-template-columns:1.3fr 1fr;
  gap:8%;
  align-items:start
}

.hero-copy {
  padding-bottom:6px
}

.hero-copy p {


  max-width:38ch
}

.hero-copy .text-link {
  margin-top:28px
}

.prototype-label {
  display:flex;
  align-items:center;
  gap:9px;
  border-top:1px solid #ffffff2b;
  margin-top:49px;
  padding-top:17px;

  color:#c9dbef;
  }

.prototype-label>span:last-child {
  margin-left:auto;
  color:#c9dbef
}

.section-heading {
  margin-bottom:32px
}

.section-heading>.eyebrow {
  color:var(--blue);
  margin-bottom:14px
}

.section-heading h2 {
  max-width:26ch
}

.story h2 {
  max-width:27ch
}

.purpose-statements {
  margin-block:28px;
  padding-top:24px;
  border-top:1px solid var(--line)
}

.purpose-statements strong {
  display:block;
  margin-bottom:8px;
  }

.story-aside {
  align-self:start
}

.editorial-note {



  margin-top:24px
}

.story-aside>p:last-child {

  color:var(--muted)
}

.story-grid {
  display:grid;
  grid-template-columns:1.35fr 1fr;
  gap:8%;
  align-items:start
}

.story-copy {
  max-width:66ch
}

.story-copy>.text-link {
  margin-top:22px
}

.story-figure {
  align-self:center
}

.story-figure img {
  width:100%;
  aspect-ratio:960/538;
  object-fit:cover
}

.story-figure figcaption,.platform-figure figcaption {


  margin-top:12px;
  color:var(--muted)
}

.projects {
  padding-top:78px
}

.projects-heading {
  display:flex;
  justify-content:space-between;
  gap:50px;
  align-items:baseline;
  margin-bottom:32px
}

.projects-heading h2 {
  max-width:20ch
}

.projects-heading p {
  max-width:35ch
}

.projects-heading p {

  color:var(--muted)
}

.flagship {
  display:grid;
  grid-template-columns:.8fr 1.25fr;
  gap:5%;
  background:var(--blue);
  color:var(--white);
  padding:40px;
  --focus:var(--yellow)
}

.flagship h3 {

  margin:16px 0 20px
}

.flagship .eyebrow {
  color:#e1edff;

  }

.flagship p:not(.eyebrow) {


  max-width:38ch
}

.flagship-copy {
  display:flex;
  flex-direction:column;
  align-items:flex-start
}

.flagship .project-actions {
  margin-top:auto;
  padding-top:24px
}

.project-actions {
  display:flex;
  flex-wrap:wrap;
  gap:12px 25px;
  align-items:center
}

.platform-figure {
  align-self:center;
  min-width:0
}

.platform-figure img {
  width:100%;
  border:1px solid #ffffff4f
}

.platform-figure figcaption {
  color:#e1edff
}

.project-pair {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7%;
  margin-top:44px
}

.project {
  border-top:1px solid var(--line);
  padding-top:28px;
  display:flex;
  flex-direction:column;
  align-items:flex-start
}

.project-intro h3 {
  min-width:0
}

.project-intro {
  display:flex;
  align-items:center;
  gap:28px;
  width:100%;
  margin-bottom:23px
}

.project-art {
  width:176px;
  flex:none
}

.project-art img {
  width:100%;
  aspect-ratio:1;
  object-fit:cover
}

.project-art img[src*="eucast"] {
  object-fit:contain;
  background:#fff
}

.project>p {
  max-width:52ch
}

.project>.project-actions {
  margin-top:auto;
  padding-top:20px
}

.closing {
  background:var(--navy);
  color:var(--white);
  padding-block:60px;
  --focus:var(--yellow)
}

.closing-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9%;
  align-items:center
}

.closing h2 {
  max-width:23ch
}

.footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding-block:24px;
  }

.modal-open {
  position:fixed;
  left:0;
  right:0;
  overflow:hidden
}

.editorial-panel {
  position:fixed;
  inset:0 0 0 auto;
  margin:0;
  height:100vh;
  height:100dvh;
  max-height:none;
  width:min(850px,74vw);
  max-width:100%;
  padding:0;
  border:0;
  background:var(--paper);
  color:var(--navy);
  overflow-y:auto;
  overscroll-behavior:contain;
  box-shadow:-20px 0 80px #081b2f26
}

.editorial-panel::backdrop {
  background:#081b2f88
}

.editorial-panel[open] {
  animation:panel-in 160ms ease-out
}

.panel-toolbar {
  position:sticky;
  top:0;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  overflow-wrap:anywhere;
  padding:20px 36px;
  border-bottom:1px solid var(--line);
  background:var(--paper);

  }

.panel-close {
  flex:none;
  min-height:44px;
  min-width:104px;
  display:inline-flex;
  gap:18px;
  align-items:center;
  justify-content:center;
  border:1px solid var(--line);
  }



.panel-content {
  padding:42px 60px 64px;
  max-width:780px;
  margin:auto
}

.panel-content h2 {

  margin-bottom:28px
}

.panel-lead {




  margin-bottom:24px
}

.panel-content h3 {



  margin-top:32px;
  margin-bottom:10px
}

.panel-content h3 a {
  text-decoration-thickness:1px
}

.year {
  color:var(--blue);
  margin-right:10px
}

.panel-content>.text-link {
  margin-top:18px
}

.panel-sources {
  margin-top:36px;
  border-top:1px solid var(--line);
  }

.panel-sources ul {
  padding-left:20px
}

.panel-sources li+li {
  margin-top:14px
}

.panel-sources a {
  overflow-wrap:anywhere;
  }

.menu-panel {
  max-width:520px
}

.menu-panel nav {
  display:flex;
  flex-direction:column
}

.menu-panel nav a {
  display:block;


  min-height:64px;
  padding-block:14px;
  border-bottom:1px solid var(--line);
  text-decoration:none
}



.menu-note {
  margin-top:32px;
  color:var(--muted);
  }

.production-note {
  border-top:1px solid var(--line);
  padding-top:22px;
  margin-top:28px;

  color:var(--muted)
}

@keyframes panel-in {
  from {
    opacity:0;
    transform:translateX(16px)
  }
  to {
    opacity:1;
    transform:none
  }
}

.work-section {
  background:#e7eff9;
  border-block:1px solid var(--line)
}

.work-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5%
}

.work-grid h3 {


  margin-bottom:18px
}

.work-bottom {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:8%;
  margin-top:35px;
  padding-top:26px;
  border-top:1px solid #b5c6dc;
  align-items:center
}

.work-bottom p {

  color:var(--muted)
}

.work-bottom .text-link {
  justify-self:start
}

.collaborations {
  padding-top:0
}

.collaboration-grid {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:8%
}

.experience-list {
  border-left:1px solid var(--line);
  padding-left:32px
}

.experience-list strong {
  display:block;

  margin-bottom:7px
}

.experience-list>.text-link {
  margin-top:22px
}

@media(max-width:1000px) {
  .wrap {
    width:calc(100% - 64px)
  }
  .hero-grid {
    gap:6%;
    grid-template-columns:1.1fr 1fr
  }
  .story-grid {
    gap:6%
  }
  .flagship {
    grid-template-columns:1fr;
    padding:32px;
    gap:30px
  }
  .flagship-copy {
    display:block
  }
  .flagship p:not(.eyebrow) {
    max-width:60ch
  }
  .flagship .project-actions {
    margin-top:0
  }
  .platform-figure {
    width:100%
  }
  .work-grid {
    grid-template-columns:1fr;
    gap:26px
  }
  .header {
    gap:16px
  }
  .navigation a {
    padding-inline:9px
  }
  .project-intro {
    gap:20px;
    align-items:flex-end
  }
  .project-art {
    width:140px
  }
  .editorial-panel {
    width:84vw
  }
  .panel-content {
    padding-inline:44px
  }
}

@media(min-width:761px) and (max-width:1000px) {
  .work-grid article {
    display:grid;
    grid-template-columns:1fr 2fr;
    gap:30px
  }
}

@media(max-width:760px) {
  .wrap {
    width:calc(100% - 40px)
  }
  .section-space {
    padding-block:48px
  }
  .header {
    gap:12px;
    padding-block:12px;
    flex-wrap:wrap
  }
  .site-header .brand {
    width:96px
  }
  .language {
    margin-left:auto
  }
  .navigation {
    order:3;
    margin-left:0;
    width:100%;
    flex-wrap:wrap;
    gap:4px
  }
  .has-dialogs .navigation {
    display:none
  }
  .has-dialogs .menu-open {
    display:inline-flex
  }
  .has-dialogs .header {
    flex-wrap:wrap
  }
  .language-current,.language a {
    min-width:44px
  }
  .language {
    gap:2px
  }
  .language-notice {
    right:-88px
  }
  .hero-content {
    padding-top:28px;
    padding-bottom:20px
  }
  .hero-content>.eyebrow {


    margin-bottom:20px
  }
  .hero-grid {
    grid-template-columns:1fr;
    gap:25px
  }
  h1 {

    max-width:17ch;
    }
  .hero-copy p {


    max-width:40ch
  }
  .hero-copy .text-link {
    margin-top:18px
  }
  .prototype-label {
    margin-top:30px
  }
  .section-heading {
    margin-bottom:25px
  }
  .story-grid {
    grid-template-columns:1fr;
    gap:28px
  }
  .story-copy>.text-link {
    margin-top:18px
  }
  .story-figure {
    max-width:480px
  }
  .story-aside {
    max-width:600px
  }
  .story-figure img {
    max-height:195px;
    object-position:center
  }
  .projects {
    padding-top:48px
  }
  .projects-heading {
    padding-top:28px;
    display:block;
    margin-bottom:24px
  }
  .projects-heading p {
    margin-top:12px
  }
  .flagship {
    padding:25px 22px;
    gap:25px
  }
  .flagship h3 {

    margin:14px 0 18px
  }
  .flagship .project-actions {
    gap:12px 22px;
    padding-top:19px
  }
  .platform-figure {
    min-width:0
  }
  .project-pair {
    grid-template-columns:1fr;
    gap:32px;
    margin-top:32px
  }
  .project {
    padding-top:24px
  }
  .project-intro {
    gap:24px;
    margin-bottom:21px;
    align-items:center
  }
  .project-art {
    width:144px
  }
  .project>.project-actions {
    padding-top:18px
  }
  .text-link {

    gap:16px
  }
  .closing {
    padding-block:44px
  }
  .closing-grid {
    grid-template-columns:1fr;
    gap:24px
  }
  .closing h2 {

    max-width:19ch
  }
  .footer {
    align-items:flex-start;
    padding-block:18px;
    }
  .editorial-panel {
    width:100%;
    box-shadow:none
  }
  .panel-toolbar {
    padding:12px 20px;
    gap:12px;
    }
  .panel-close {
    min-width:98px;
    }
  .panel-content {
    padding:30px 24px 48px
  }
  .panel-content h2 {

    margin-bottom:24px
  }
  .panel-lead {

    margin-bottom:22px
  }
  .panel-content h3 {

    margin-top:28px
  }
  .language-notice {
    width:260px
  }
  .work-grid {
    grid-template-columns:1fr;
    gap:28px
  }
  .work-bottom,.collaboration-grid {
    grid-template-columns:1fr;
    gap:24px
  }
  .experience-list {
    padding-left:0;
    border-left:0
  }
  .work-bottom .text-link {
    max-width:100%
  }
  .collaborations {
    padding-top:12px
  }
}

@media(max-width:360px) {
  .wrap {
    width:calc(100% - 32px)
  }
  .header {
    gap:8px
  }
  .site-header .brand {
    width:82px
  }
  .menu-open {
    padding-inline:9px;
    gap:7px
  }
  .language-current,.language a {
    min-width:44px
  }
  .flagship {
    padding:24px 18px
  }
  .project-intro {
    gap:18px
  }
  .project-art {
    width:112px
  }
  .project-actions {
    gap:10px 22px
  }
  .footer {
    flex-wrap:wrap
  }
  .panel-toolbar {
    padding-inline:16px
  }
  .panel-content {
    padding-inline:20px
  }
  .language-notice {
    width:250px
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  .editorial-panel[open] {
    animation:none
  }
}

/* Removable review markers; public copy remains in separate elements. */
.review-note {
  display:table;
  font-size:var(--type-meta);
  line-height:1.5;
  font-weight:var(--weight-regular);
  color:var(--navy);
  background:var(--yellow);
  padding:2px 7px;
  border-radius:3px;
  margin-top:12px;
  max-width:var(--measure-reading);
}
.story-figure figcaption .review-note { margin:0 }
.purpose-statements > div { margin-top:24px }
.closing .review-note { color:var(--navy) }
.footer .review-note { margin-top:4px }
.language a { flex-direction:column; gap:0; padding:2px }
.language-pending { font-size:.625rem; font-weight:var(--weight-regular); white-space:nowrap }
.projects-heading p { max-width:60ch }
.projects-heading h2 { flex:0 0 35% }
@media(min-width:761px) and (max-width:1100px) {
  .has-dialogs .navigation { display:none }
  .has-dialogs .menu-open { display:inline-flex }
  .language { margin-left:auto }
  .navigation { flex-wrap:wrap }
  .header:not(:has(.menu-open:not([hidden]))) { flex-wrap:wrap }
}
/* Expanded no-JS navigation needs room above native anchor destinations. */
@media(max-width:760px) {
  html:not(.has-dialogs) { scroll-padding-top:190px }
}
@media(max-width:360px) {
  html:not(.has-dialogs) { scroll-padding-top:238px }
}

/* 21 October content candidate: retain the A1 editorial system. */
.header { gap:24px; flex-wrap:nowrap }
.navigation { gap:2px; flex-wrap:nowrap; width:auto; order:initial }
.navigation a { font-size:.875rem; font-weight:400; padding-inline:9px; white-space:nowrap }
.language { margin-left:0 }
.has-dialogs .header .navigation { display:flex }
.has-dialogs .header .menu-open { display:none }
.has-dialogs .header.nav-compact .navigation { display:none }
.has-dialogs .header.nav-compact .language { margin-left:auto }
.has-dialogs .header.nav-compact .menu-open { display:inline-flex }
.has-dialogs .header { flex-wrap:nowrap }
.navigation.nav-measure { display:flex!important; position:fixed; left:-10000px; top:0; width:max-content!important; max-width:none; visibility:hidden; flex-wrap:nowrap!important }
.hero h1 { max-width:15ch; font-size:clamp(2.5rem,1.35rem + 3.35vw,4.5rem) }
.hero-copy p { max-width:43ch }
.hero-content { padding-bottom:32px }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px 28px; margin-top:26px }
.hero-actions a { min-height:44px; display:inline-flex; align-items:center; text-decoration-thickness:1px }
.impact-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:42px 0 0; padding-top:24px; border-top:1px solid #ffffff40; gap:28px }
.impact-strip dt { font-size:clamp(2rem,1.1rem + 2.4vw,3.5rem); line-height:1.1; font-weight:700; letter-spacing:-.025em }
.impact-strip dd { margin:10px 0 0; max-width:24ch; color:#d8e7fa; font-size:.9375rem; line-height:1.5 }
.story-aside { position:sticky; top:132px }
blockquote { margin:28px 0 0; padding:0 0 0 22px; border-left:3px solid var(--blue) }
blockquote p { font-size:var(--type-lead) }
.purpose-statements { margin-bottom:0; padding-top:36px; scroll-margin-top:118px }
.purpose-statements h2 { font-size:var(--type-subsection); margin:12px 0 20px; max-width:30ch }
.work-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px 5% }
.work-grid h3 { margin-bottom:12px }
.work-bottom { display:block }
.supported-stories { margin-top:64px; padding:36px 0 0; border-top:3px solid var(--navy) }
.supported-stories>h3 { font-size:var(--type-section); max-width:28ch; margin-bottom:20px }
.stories-grid { display:grid; grid-template-columns:1fr 1fr; gap:7%; margin-top:28px }
.supported-stories .panel-sources ul { columns:2; column-gap:7% }
.supported-stories .panel-sources li { break-inside:avoid; padding-bottom:12px }
.team-section { background:#e7eff9; border-block:1px solid var(--line) }
.team-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px }
.team-member { min-width:0 }
.team-member img { width:100%; aspect-ratio:1; object-fit:cover; margin-bottom:22px }
.team-member h3 { font-size:1.25rem; line-height:1.3 }
.team-role { font-size:.875rem; line-height:1.5; color:var(--blue); margin:8px 0 14px }
.team-member p:not(.team-role) { font-size:1rem; line-height:1.6; margin:0 }
.team-network { display:grid; grid-template-columns:1fr 1fr; gap:7%; margin-top:40px; padding-top:28px; border-top:1px solid #b5c6dc }
.team-network p { font-size:1rem }
.lab-list { padding-left:1.25em }
.lab-list li+li { margin-top:12px }
.grant-list { list-style:none; padding:0; margin:0; counter-reset:grant }
.grant-list>li { padding:28px 0; border-top:1px solid var(--line) }
.grant-list>li:first-child { padding-top:0; border-top:0 }
.grant-list h3 { margin:10px 0 18px }
.grant-list dt { font-size:.8125rem; font-weight:700; text-transform:uppercase; color:var(--muted); margin:18px 0 4px }
.grant-list dd { margin:0; overflow-wrap:anywhere }
.footer { align-items:flex-start; font-size:.8125rem; gap:36px }
.footer p+p { margin-top:7px }
.footer-links { max-width:40ch }
.footer-links p { margin:0 0 7px }
.footer-links p:last-child { margin-top:14px }
.editorial-panel.is-closing { animation:panel-out 160ms ease-in forwards }
.editorial-panel.is-closing::backdrop { animation:backdrop-out 160ms ease-in forwards }
@keyframes panel-out { to { opacity:0; transform:translateX(16px) } }
@keyframes backdrop-out { to { background:transparent } }
@media(max-width:1100px) {
 .team-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px }
 .work-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
 .work-grid article { display:block }
}
@media(max-width:760px) {
 .hero h1 { max-width:18ch }
 .impact-strip { grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px 20px; margin-top:32px }
 .impact-strip dt { font-size:2.25rem }
 .impact-strip dd { font-size:.875rem }
 .story-aside { position:static }
 .work-grid { grid-template-columns:1fr }
 .stories-grid,.team-network { grid-template-columns:1fr; gap:24px }
 .supported-stories { margin-top:44px; padding-top:28px }
 .supported-stories .panel-sources ul { columns:1 }
 .footer { flex-direction:column }
 .menu-panel nav a { min-height:54px; padding-block:10px }
}
@media(max-width:600px) {
 .team-grid { grid-template-columns:1fr; gap:34px }
 .team-member img { max-width:440px }
}
@media(prefers-reduced-motion:reduce) {
 .editorial-panel[open],.editorial-panel.is-closing,.editorial-panel.is-closing::backdrop { animation:none }
}