@font-face {
  font-family: 'Zen Kaku Gothic New';
  src: url('assets/fonts/ZenKakuGothicNew-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: 'Zen Kaku Gothic New';
  src: url('assets/fonts/ZenKakuGothicNew-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: Inter;
  src: url('assets/fonts/Inter-Variable.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: block;
}
:root {
  --primary: #161616;
  --secondary: #5C6166;
  --background: #FAFAF8;
  --surface: #F2F2EF;
  --accent: #B3262E;
  --border: #D8D8D2;
  --hover-active: #3B4248;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { background: var(--background); color: var(--primary); }
/* All measurements scale uniformly from the 1920.04 × 1090.16 PDF artboard. */
.first-view { position: relative; width: 100%; aspect-ratio: 1920.04 / 1090.16; overflow: hidden; container-type: inline-size; }
.hero-image { position: absolute; inset: 0; background: #f7f7f7 url('02_images/hero.jpg') no-repeat; background-size: 104.586% 134.0%; background-position: 11.565cqw -0.368cqw; }
.header { position: absolute; inset: 0 0 auto; height: 9.1144cqw; background: rgb(255 255 255 / 50%); }
.logo { position: absolute; left: 12.212cqw; top: 3.07cqw; width: 20.834cqw; height: 2.474cqw; font-family: Inter, Arial, sans-serif; }
.navigation { position: absolute; inset: 0; font: 300 1.015604cqw / 1 Inter, Arial, sans-serif; color: #000; }
.navigation span { position: absolute; top: 4.015cqw; white-space: nowrap; }
.navigation span:nth-child(1) { left: 59.149cqw; }
.navigation span:nth-child(2) { left: 68.064cqw; }
.navigation span:nth-child(3) { left: 76.67cqw; }
.navigation span:nth-child(4) { left: 83.836cqw; }
.main-copy { position: absolute; left: 12.49974cqw; top: 25.175334cqw; margin: 0; font-family: 'Zen Kaku Gothic New', 'Hiragino Kaku Gothic ProN', sans-serif; font-weight: 300; font-size: 2.604112cqw; -webkit-text-stroke: 0.01104144cqw var(--primary); line-height: 6.40570cqw; color: var(--primary); }
.copy-line { display: block; white-space: nowrap; }

/* Preserve the supplied SVG geometry; load its Inter typeface in this document. */
.logo .cls-1, .logo .cls-2 { font-family: Inter, Arial, sans-serif; }
.logo { overflow: visible; }
.copy-line { position: relative; height: 6.40570cqw; letter-spacing: 0; }
.copy-line > span { position: absolute; left: calc(var(--x) * 0.975); }

/* Match the small-text appearance in the PDF rather than automatic optical sizing. */
.navigation { font-optical-sizing: none; }

/* A quiet entrance on page load; the final layout stays unchanged. */
.copy-line {
  animation: copy-entrance 2.4s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.first-line { animation-delay: 0.18s; }
.second-line { animation-delay: 1.16s; }
@keyframes copy-entrance {
  from { opacity: 0; transform: translateY(0.3125cqw); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .copy-line { animation: none; }
}