:root {
  --ink: #1d1d1b;
  --paper: #f4f1ed;
  --line: #e2e2dc;
}

* { box-sizing: border-box; }
html, body { margin: 0; background: var(--paper); color: var(--ink); }
body { font-family: "futura-pt"; font-style: normal; font-weight: 400; }
a { color: inherit; text-decoration: none; }
.landing-shell { min-height: 1024px; background: var(--paper); }
.landing-stage { display: grid; grid-template-columns: 640.8px minmax(0, 1fr); height: 920px; overflow: hidden; }
.landing-copy { position: relative; min-width: 0; }
.brand-logo { position: absolute; top: 56px; left: 56.3px; display: block; width: 213.4px; height: auto; }
.landing-title { position: absolute; top: 257px; left: 54px; margin: 0; font-family: "roca"; font-size: 60px; font-style: normal; font-weight: 400; line-height: 72px; letter-spacing: 0; }
.landing-title span { display: block; white-space: nowrap; }
.title-rule { position: absolute; top: 512px; left: 56.3px; width: 82.7px; height: 1px; background: var(--ink); }
.landing-text { position: absolute; top: 551px; left: 54px; font-size: 24px; font-weight: 400; line-height: 28.8px; }
.landing-text p { margin: 0 0 28.8px; }
.contact-button { position: absolute; top: 750.9px; left: 56.3px; display: flex; align-items: center; width: 258.4px; height: 53.1px; padding: 0 17.4px 0 25.3px; background: var(--ink); color: var(--paper); font-size: 18px; font-style: normal; font-weight: 500; line-height: 1; }
.button-arrow { margin-left: auto; font-size: 23px; font-weight: 400; line-height: 1; }
.hero-figure { width: 100%; height: 919.3px; margin: 0; overflow: hidden; }
.hero-figure img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.site-footer { position: relative; display: flex; align-items: center; height: 104px; border-top: 1px solid var(--line); padding: 0 54px 0 56.3px; font-size: 18px; line-height: 1; }
.footer-brand { position: relative; top: -2px; font-weight: 600; }
.footer-rule { position: absolute; top: 29.5px; left: 486.3px; width: 1px; height: 25.2px; background: var(--line); }
.footer-links { position: relative; top: -2px; display: flex; gap: 30.3px; margin-left: auto; font-weight: 400; }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }

.legal-shell { min-height: 1024px; }
.legal-stage { position: relative; height: 920px; overflow: hidden; }
.close-link { position: absolute; top: 58.8px; right: 54.6px; display: flex; align-items: center; gap: 12px; height: 18px; font-size: 18px; line-height: 1; }
.close-x { position: relative; display: block; width: 18px; height: 18px; }
.close-x::before, .close-x::after { position: absolute; top: 8.5px; left: 0; width: 18px; height: 1px; content: ""; background: var(--ink); }
.close-x::before { transform: rotate(45deg); }
.close-x::after { transform: rotate(-45deg); }
.legal-title { position: absolute; top: 257px; left: 54px; margin: 0; font-family: "roca"; font-size: 60px; font-style: normal; font-weight: 400; line-height: 72px; }
.legal-title-rule { position: absolute; top: 364.4px; left: 56.3px; width: 82.7px; height: 1px; background: var(--ink); }
.imprint-copy { position: absolute; top: 407px; left: 54px; margin: 0; font-size: 16px; font-style: normal; font-weight: 400; line-height: 22px; }
.privacy-stage { height: 1120px; overflow: visible; }
.privacy-copy { position: absolute; top: 410px; left: 54px; width: calc(100% - 108px); font-size: 16px; line-height: 22px; }
.privacy-copy section { margin: 0 0 22px; }
.privacy-copy h2, .privacy-copy p { margin: 0; font: inherit; }
.privacy-copy .privacy-date { margin-top: 22px; }

/* Keep the complete 1440 x 1024 desktop composition visible on short screens. */
@media (min-width: 901px) and (max-height: 1023px) {
  .landing-shell, .legal-shell { min-height: 100vh; }
  .landing-stage { grid-template-columns: 62.578125vh minmax(0, 1fr); height: 89.84375vh; }
  .brand-logo { top: 5.46875vh; left: 5.498047vh; width: 20.839844vh; }
  .landing-title, .legal-title { top: 25.097656vh; left: 5.273438vh; font-size: 5.859375vh; line-height: 7.03125vh; }
  .title-rule { top: 50vh; left: 5.498047vh; width: 8.076172vh; }
  .landing-text { top: 53.808594vh; left: 5.273438vh; font-size: 2.34375vh; line-height: 2.8125vh; }
  .landing-text p { margin-bottom: 2.8125vh; }
  .contact-button { top: 73.330078vh; left: 5.498047vh; width: 25.234375vh; height: 5.185547vh; padding-right: 1.699219vh; padding-left: 2.470703vh; font-size: 1.757813vh; }
  .button-arrow { font-size: 2.246094vh; }
  .hero-figure { height: 89.775391vh; }
  .hero-figure img { object-position: center bottom; }
  .site-footer { height: 10.15625vh; padding-right: 5.273438vh; padding-left: 5.498047vh; font-size: 1.757813vh; }
  .footer-rule { top: 2.880859vh; left: 47.490234vh; height: 2.460938vh; }
  .footer-links { gap: 2.958984vh; }
  .close-link { top: 5.742188vh; right: 5.332031vh; gap: 1.171875vh; height: 1.757813vh; font-size: 1.757813vh; }
  .close-x { width: 1.757813vh; height: 1.757813vh; }
  .close-x::before, .close-x::after { top: 0.830078vh; left: 0; width: 1.757813vh; }
  .legal-stage { height: 89.84375vh; }
  .legal-title-rule { top: 35.585938vh; left: 5.498047vh; width: 8.076172vh; }
  .imprint-copy { top: 39.746094vh; left: 5.273438vh; font-size: 16px; line-height: 22px; }
  .privacy-stage { height: auto; min-height: 1120px; overflow: visible; }
  .privacy-copy { top: 40.039063vh; left: 5.273438vh; width: calc(100% - 10.546875vh); font-size: 16px; line-height: 22px; }
  .privacy-copy section { margin-bottom: 22px; }
  .privacy-copy .privacy-date { margin-top: 22px; }
}

@media (max-width: 1100px) {
  .landing-shell { min-height: 0; }
  .landing-stage { grid-template-columns: minmax(420px, 44.5%) minmax(0, 55.5%); }
  .landing-title { font-size: clamp(43px, 4.2vw, 60px); line-height: 1.2; }
  .landing-text { max-width: calc(100% - 86px); font-size: clamp(18px, 1.67vw, 24px); line-height: 1.2; }
  .desktop-break { display: none; }
}

@media (max-width: 900px) {
  .landing-stage { display: flex; height: auto; overflow: visible; flex-direction: column; }
  .landing-copy { min-height: 720px; padding: 40px 28px 56px; }
  .brand-logo, .landing-title, .title-rule, .landing-text, .contact-button { position: static; }
  .brand-logo { width: min(213.4px, 65vw); margin-bottom: 92px; }
  .landing-title { font-size: clamp(43px, 12.2vw, 58px); line-height: 1.1; }
  .landing-title span { white-space: normal; }
  .title-rule { display: block; margin: 42px 0; }
  .landing-text { max-width: 590px; font-size: 22px; line-height: 1.25; }
  .landing-text p { margin-bottom: 27.5px; }
  .contact-button { margin-top: 48px; }
  .hero-figure { height: min(118vw, 680px); }
  .hero-figure img { object-position: center 22%; }
  .site-footer { min-height: 150px; height: auto; padding: 34px 28px; align-items: flex-start; flex-direction: column; gap: 30px; }
  .footer-rule { display: none; }
  .footer-links { margin-left: 0; gap: 28px; flex-wrap: wrap; }
  .legal-shell { min-height: 0; }
  .legal-stage { min-height: calc(100vh - 150px); height: auto; overflow: visible; padding: 40px 28px 72px; }
  .legal-stage .brand-logo, .close-link, .legal-title, .legal-title-rule, .imprint-copy, .privacy-copy { position: static; }
  .legal-stage .brand-logo { display: block; margin-bottom: 78px; }
  .close-link { position: absolute; top: 44px; right: 28px; gap: 10px; height: 16px; font-size: 16px; }
  .close-x { width: 16px; height: 16px; }
  .close-x::before, .close-x::after { top: 7.5px; left: 0; width: 16px; }
  .legal-title { font-size: clamp(43px, 12.2vw, 58px); line-height: 1.1; }
  .legal-title-rule { display: block; margin: 42px 0; }
  .imprint-copy { font-size: 15px; line-height: 1.45; }
  .privacy-copy { width: auto; font-size: 15px; line-height: 1.45; }
  .privacy-copy section { margin-bottom: 28px; }
  .privacy-copy h2 { margin-bottom: 4px; }
  .privacy-copy .desktop-break { display: none; }
  .privacy-copy .privacy-date { margin-top: 28px; }
}

@media (max-width: 390px) {
  .landing-copy { padding-right: 22px; padding-left: 22px; }
  .landing-title { font-size: 41px; }
  .site-footer { padding-right: 22px; padding-left: 22px; }
}
