:root {
  color-scheme: dark;
  --background: #000008;
  --text: #f0f0f0;
}
* { box-sizing: border-box; }
html { min-height: 100%; background: var(--background); }
body { margin: 0; min-height: 100vh; background: var(--background); color: var(--text); font-family: Arial, Helvetica, sans-serif; }
.page {
  width: 100%;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: clamp(30px, 8.4vh, 90px) 20px 80px;
}
.brand { display: block; width: min(100%, 730px); height: auto; }
.information { margin-top: clamp(38px, 10.5vh, 96px); text-align: center; }
.mission { font-family: "Myriad Pro", "Myriad", "ITC Avant Garde Gothic", "Avant Garde", "Century Gothic", Arial, sans-serif; margin: 0; font-size: 20px; line-height: 1.28; font-weight: 400; }
.contact { display: inline-block; margin-top: 52px; font-size: 20px; line-height: 1.35; color: inherit; text-underline-offset: 2px; }
.contact:hover, .contact:focus-visible { color: #fff; }
@media (max-width: 760px) {
  .page { padding: clamp(40px, 10vh, 76px) 20px 56px; }
  .brand { width: min(100%, 620px); }
  .information { margin-top: clamp(36px, 8vh, 70px); }
  .mission { max-width: 34ch; font-size: clamp(16px, 3.2vw, 19px); line-height: 1.42; }
  .desktop-break { display: none; }
  .contact { margin-top: 42px; font-size: clamp(15px, 3.1vw, 19px); overflow-wrap: anywhere; }
}
@media (max-width: 400px) {
  .page { padding-inline: 14px; }
  .information { margin-top: 34px; }
}
