:root{
  --olive:#44472B;
  --olive-soft:#a2a491;
  --text:#4e5038;
  --white:#fff;
  --page-max:1440px;
  --art-width:760px;
  --art-top:-56px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#fff;color:var(--text);font-family:Inter,Arial,Helvetica,sans-serif}
body{min-width:320px;overflow-x:hidden}
a{color:inherit}
img{display:block;max-width:100%}
.site{width:100%}
.stage{position:relative;width:min(var(--page-max),100%);margin:0 auto;padding:0 48px;overflow:visible}
.copy{position:relative;z-index:2;width:430px;padding-top:96px}
.logo{width:380px;height:auto;margin:0 0 18px}
.copy p{font-size:17px;line-height:1.18;margin:0 0 24px;font-weight:400}
.copy .contact-label{font-weight:600;margin-top:56px;margin-bottom:12px}
.copy .email-link{font-weight:700;text-decoration:none}
.copy .email-link:hover,.copy .email-link:focus-visible{text-decoration:underline}
.art{position:absolute;z-index:1;right:-70px;top:var(--art-top);width:var(--art-width);height:auto;max-width:none}
.home .stage{min-height:655px}
.imprint .stage{min-height:535px}
.privacy .stage{min-height:0;padding-bottom:42px}
.legal-copy{position:relative;z-index:2;width:430px;padding-top:98px}
.legal-copy h1{margin:0 0 44px;font-size:36px;line-height:1;font-weight:700;letter-spacing:-.035em;color:var(--olive)}
.legal-copy h1 .soft{color:var(--olive-soft)}
.legal-copy p{font-size:17px;line-height:1.22;margin:0 0 19px}
.legal-copy strong{font-weight:600}
.legal-copy .block{margin-bottom:28px}
.privacy .legal-copy{width:690px;padding-top:98px}
.privacy .privacy-top{width:430px;margin-bottom:20px}
.privacy .legal-copy h2{font-size:18px;line-height:1.15;margin:26px 0 8px;color:var(--olive);font-weight:700}
.privacy .legal-copy p{font-size:16px;line-height:1.22;margin-bottom:15px}
.footer{min-height:66px;display:flex;align-items:center;justify-content:center;background:linear-gradient(90deg,#d7d8d1 0%,#9b9d8f 50%,var(--olive) 100%);color:#fff}
.footer nav{display:flex;gap:42px;align-items:center}
.footer a{font-size:17px;text-decoration:none;font-weight:400}
.footer a:hover,.footer a:focus-visible{text-decoration:underline}

/* The three site illustrations share the same source width (957 units),
   so one CSS width keeps the person exactly the same scale on all pages. */
.imprint .art,.privacy .art{width:var(--art-width)}

@media (min-width:1450px){
  :root{--page-max:1700px;--art-width:920px;--art-top:-82px}
  .stage{padding:0 80px}
  .copy,.legal-copy{width:560px;padding-top:140px}
  .logo{width:500px}
  .copy p{font-size:20px;margin-bottom:28px}
  .copy .contact-label{margin-top:64px}
  .legal-copy h1{font-size:46px;margin-bottom:54px}
  .legal-copy p{font-size:20px}
  .privacy .legal-copy{width:850px}
  .privacy .privacy-top{width:560px}
  .privacy .legal-copy p{font-size:18px}
  .privacy .legal-copy h2{font-size:20px}
  .home .stage{min-height:775px}
  .imprint .stage{min-height:625px}
  .footer{min-height:80px}
  .footer a{font-size:20px}
}

@media (max-width:1050px){
  :root{--art-width:62vw;--art-top:-35px}
  .stage{padding:0 34px}
  .copy,.legal-copy{width:38vw;min-width:340px;padding-top:70px}
  .logo{width:320px}
  .copy p,.legal-copy p{font-size:15px}
  .home .stage{min-height:680px}
  .imprint .stage{min-height:590px}
  .privacy .legal-copy{width:58vw;min-width:520px}
}

@media (max-width:760px){
  :root{--art-width:100%;--art-top:0}
  .stage{padding:24px 20px 0;display:flex;flex-direction:column}
  .art{position:relative;right:auto;top:auto;width:100%;order:1;margin:-24px 0 20px}
  .copy,.legal-copy,.privacy .legal-copy{width:100%;min-width:0;padding-top:0;order:2}
  .home .stage,.imprint .stage{min-height:0}
  .logo{width:min(78vw,360px);margin-bottom:18px}
  .copy p,.legal-copy p,.privacy .legal-copy p{font-size:16px;line-height:1.25}
  .copy .contact-label{margin-top:34px}
  .legal-copy h1{font-size:34px;margin-bottom:28px}
  .privacy .privacy-top{width:100%;margin-bottom:18px}
  .footer{min-height:58px;margin-top:24px}
  .footer nav{gap:28px}
  .footer a{font-size:15px}
}
