/* Keep the full logo inside the header at every scroll position. */
.nav .brand {
  transform: none;
  width: 150px;
  flex: 0 0 auto;
}
.nav .brand img {
  width: 100%;
  height: auto;
  max-height: 104px;
  object-fit: contain;
}

@media (max-width: 900px) {
  .nav .brand { width: 112px; }
  .nav .brand img { max-height: 80px; }
  .nav .menu {
    display: grid;
    place-items: center;
    min-width: 44px;
    min-height: 44px;
    cursor: pointer;
    position: relative;
    z-index: 2;
  }

  .nav .links {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    max-height: calc(100dvh - 92px);
    overflow-y: auto;
    padding: 18px 24px 28px;
    background: #f5f3ef;
    color: #151515;
    border-bottom: 1px solid rgba(21, 21, 21, .18);
    box-shadow: 0 16px 28px rgba(0, 0, 0, .12);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    text-align: start;
    z-index: 1;
  }

  .nav .links.is-open { display: flex; }
  .nav .links a {
    display: flex;
    align-items: center;
    min-height: 48px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(21, 21, 21, .12);
    font-size: .88rem;
  }
  .nav .links .lang { min-height: 44px; align-self: flex-start; margin-top: 18px; }
  .nav.mobile-menu-open { background: #f5f3ef; color: #151515; }
  .nav.mobile-menu-open .brand img { filter: none; }
  body.mobile-menu-visible { overflow: hidden; }

  /* Keep explanatory text and controls legible on phones and narrow tablets. */
  h1, h2, h3, p { max-width: 100%; overflow-wrap: break-word; }
  .hero h1 { line-height: 1.1; }
  .eyebrow, .kicker, .section-label, .intro > span,
  .brand-copy h3, .brand-facts span, .library-head span,
  .number, .document .number, .small-note, .note,
  .material-tag, .legal strong, .label span,
  .project-label span, .section-head span, .cta a,
  .action, .submit button, .form-panel label {
    font-size: .875rem;
    line-height: 1.5;
  }
  .brand-copy p, .partners-head p, .document p { font-size: 1rem; }
  .legal p { font-size: .875rem; }
  .project-label { gap: 16px; }
  .project-label span {
    flex: 0 0 auto;
    font-size: .62rem;
    line-height: 1.35;
    letter-spacing: .08em;
    white-space: nowrap;
    overflow-wrap: normal;
  }
  footer { font-size: .8rem; line-height: 1.6; overflow-wrap: anywhere; }
  .gallery .shot img { height: auto; min-height: 0; object-fit: contain; }
}

@media (max-width: 760px) {
  .material-visual + .hero-copy h1 {
    font-size: clamp(2.4rem, 12vw, 3.3rem);
    line-height: 1.1;
  }
}