:root {
  color-scheme: light;
  --navy: #152536;
  --red: #bf2336;
  --muted: #596674;
  --rule: #e8ebee;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--navy);
  background: #fff;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; }
button { font: inherit; }
.header { width: 100%; padding: 26px clamp(20px, 4vw, 64px) 0; display: flex; justify-content: flex-end; }
.languages { display: flex; align-items: center; gap: 2px; color: #c3c9ce; }
.languages button { position: relative; border: 0; background: transparent; color: var(--muted); min-width: 44px; min-height: 44px; padding: 12px 10px; font-size: .875rem; cursor: pointer; }
.languages button[aria-pressed="true"] { color: var(--navy); font-weight: 700; }
.languages button[aria-pressed="true"]::after { content: ""; position: absolute; bottom: 5px; left: calc(50% - 6px); width: 12px; height: 2px; background: var(--red); }
.languages button:hover { color: var(--red); }
:focus-visible { outline: 2px solid var(--red); outline-offset: 6px; }
main { position: relative; flex: 1; display: grid; place-items: center; width: 100%; padding: 44px 24px 64px; isolation: isolate; }
.identity { text-align: center; width: min(100%, 500px); }
h1 { margin: 0; line-height: 0; }
.logo { width: clamp(280px, 30vw, 372px); max-width: 100%; height: auto; display: block; margin: 0 auto; }
.slogan { margin: 0; font-size: clamp(1rem, 1.5vw, 1.125rem); line-height: 1.5; letter-spacing: .01em; }
.contact { margin-top: clamp(48px, 7vh, 76px); scroll-margin-top: 32px; }
.contact p { margin: 0 0 12px; color: var(--muted); font-size: .9375rem; line-height: 1.5; }
.contact a { display: inline-block; font-size: clamp(1.0625rem, 2vw, 1.25rem); line-height: 1.6; text-decoration: none; padding: 0 0 5px; border-bottom: 1px solid var(--red); }
.contact a:hover { color: var(--red); }
.plumb-line { position: absolute; top: -70px; left: calc(50% - .5px); width: 1px; height: clamp(38px, 14vh, 160px); background: var(--rule); transform-origin: top; z-index: -1; }
.plumb-line::after { content: ""; display: block; position: absolute; bottom: 0; width: 1px; height: 24px; background: var(--red); }
.baseline { position: absolute; width: 1px; height: 28px; background: var(--rule); bottom: 0; left: calc(50% - .5px); }
footer { padding: 26px 20px 28px; text-align: center; color: var(--muted); }
footer small { font-size: .75rem; line-height: 1.5; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 12px; left: 12px; transform: translateY(-200%); padding: 12px 18px; background: white; z-index: 5; }
.skip-link:focus { transform: none; }
@media (prefers-reduced-motion: no-preference) {
  .plumb-line { animation: align 1.6s cubic-bezier(.22,.68,.2,1) both; }
  .identity { animation: arrive 1.2s ease-out both; }
  .contact { animation: arrive 1.2s .25s ease-out both; }
  @keyframes align { from { transform: rotate(18deg) scaleY(.35); opacity: 0; } to { transform: rotate(0) scaleY(1); opacity: 1; } }
  @keyframes arrive { from { opacity: 0; } to { opacity: 1; } }
}
@media (max-width: 480px) {
  .header { padding-top: 16px; }
  main { padding-top: 32px; padding-bottom: 48px; }
  .plumb-line { top: -60px; height: 62px; }
  .contact { margin-top: 52px; }
  footer { padding-bottom: max(22px, env(safe-area-inset-bottom)); }
}
@media (max-height: 650px) and (min-width: 481px) {
  main { padding: 4px 24px 30px; }
  .logo { width: 250px; }
  .contact { margin-top: 24px; }
  .plumb-line { height: 36px; }
}