:root{--site-width:1380px;--site-gutter:5vw}

/* One shared frame prevents horizontal jumps between the home page and subpages. */
.shell,.site-header,.hero>header{
  width:min(var(--site-width),100%)!important;
  max-width:var(--site-width)!important;
  margin-inline:auto!important;
  padding-inline:var(--site-gutter)!important;
}

.site-header,.hero>header{
  min-height:104px!important;
  height:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:30px!important;
  padding-block:0!important;
}

.site-header .brand,.hero>header .brand{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  flex:0 0 auto!important;
  text-decoration:none!important;
}

.site-header .brand .mark,.hero>header .brand .mark{
  font:500 46px/.75 'Cormorant Garamond',Georgia,serif!important;
  letter-spacing:-.14em!important;
}

.site-header .brand .name,.hero>header .brand .name{
  font:500 25px/.85 'Cormorant Garamond',Georgia,serif!important;
  letter-spacing:0!important;
  text-transform:none!important;
  white-space:nowrap;
}

.site-header .brand .name small,.hero>header .brand .name small{
  display:block!important;
  margin-top:7px!important;
  font:700 9px/1.4 Manrope,Arial,sans-serif!important;
  letter-spacing:.16em!important;
  text-transform:uppercase!important;
}

.site-header nav,.hero>header nav{padding-top:0!important;gap:22px!important}

/* Home hero copy uses the same left edge as every other page. */
.hero>.hero-copy{
  left:max(var(--site-gutter),calc((100vw - var(--site-width))/2 + var(--site-gutter)))!important;
}

/* The secondary About section reads as a self-contained editorial feature. */
body[data-page="about"] .editorial-about{
  position:relative;
  width:min(calc(100% - (2 * var(--site-gutter))),1180px)!important;
  max-width:1180px!important;
  margin:clamp(90px,10vw,150px) auto!important;
  padding:clamp(38px,5vw,72px)!important;
  grid-template-columns:minmax(280px,.84fr) minmax(0,1fr)!important;
  gap:clamp(42px,7vw,105px)!important;
  background:#e8e0d5;
  border:1px solid var(--line,#211b1530);
  box-shadow:18px 18px 0 #ded5ca;
  overflow:visible;
}

body[data-page="about"] .editorial-about::before{
  content:"02 · WEITERE ARBEITEN";
  position:absolute;
  top:22px;
  right:26px;
  color:var(--terra,#a95743);
  font:700 10px/1 Manrope,Arial,sans-serif;
  letter-spacing:.16em;
}

body[data-page="about"] .editorial-about .editorial-photo{
  border:1px solid #211b1524;
  background:#d8cec1;
}

body[data-page="about"] .editorial-about-copy{max-width:520px}

@media(max-width:760px){
  :root{--site-gutter:6vw}
  .site-header,.hero>header{min-height:86px!important;gap:8px!important}
  .site-header .brand,.hero>header .brand{gap:7px!important;min-width:0}
  .site-header .brand .mark,.hero>header .brand .mark{font-size:38px!important}
  .site-header .brand .name,.hero>header .brand .name{font-size:20px!important}
  .site-header .brand .name small,.hero>header .brand .name small{font-size:7.5px!important;margin-top:5px!important}
  body[data-page="about"] .editorial-about{
    width:calc(100% - (2 * var(--site-gutter)))!important;
    margin:80px auto!important;
    padding:52px 24px 30px!important;
    grid-template-columns:1fr!important;
    gap:34px!important;
    box-shadow:10px 10px 0 #ded5ca;
  }
  body[data-page="about"] .editorial-about::before{top:20px;left:24px;right:auto}
}