/* ===== Variablen ===== */
.about-page{ overflow-x:hidden; }
:root{
  --side:86px;
  --side-m:20px;
  --arrow:43px;
}

/* Typo */
.about-page h1, .about-page h2, .about-page h3,
.about-page h4, .about-page h5, .about-page h6{
  font-family:"Swear Display", serif !important;
  font-weight:400; font-synthesis:none; color:#000;
}
.about-page p, .about-page .copy, .about-page li{
  font-family:"Swear Text", serif !important;
  font-weight:400; font-style:normal; font-synthesis:none; color:#000;
}
.is-italic{ font-style:italic; }

/* Wrap */
.about-page .wrap{ padding-left:var(--side); padding-right:var(--side); }
@media (max-width:768px){
  .about-page .wrap{ padding-left:var(--side-m); padding-right:var(--side-m); }
}

/* Fullbleed */
.about-page .fullbleed{
  position:relative; width:100vw;
  margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
  overflow:hidden;
}
@supports (width:100dvw){
  .about-page .fullbleed{ width:100dvw; margin-left:calc(50% - 50dvw); margin-right:calc(50% - 50dvw); }
}

/* Hero */
.about-hero{ background:#EDEDED; }
.about-hero-media img{ width:100%; height:auto; display:block; }

/* Desktop Cropping */
@media (min-width:1025px){
  .about-hero{ max-height:1080px; transition:max-height .5s ease; }
  .about-hero.is-collapsed{ max-height:1080px; }
  .about-hero:not(.is-collapsed){ max-height:5000px; }
}
@media (max-width:1024px){ .about-hero{ max-height:none; } }

/* Overlay Text */
.about-hero .overlay{
  position:absolute; inset:0; z-index:2;
  display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
}
@media (max-width:768px){
  .about-hero .overlay{
    position:static;
    padding-top:36px; padding-bottom:24px;
  }
}

/* H1 */
.about-h1{ margin:0; font-size:140px; line-height:.92; letter-spacing:-.02em; }
@media (max-width:768px){
  .about-h1{ font-size:80px; margin-top:40px; } /* 40px Downshift mobil */
}

/* Copy */
.about-copy{ font-size:17px; line-height:1.6; max-width:560px; margin-top:40px; }
.about-copy[data-collapsed="true"]{
  display:-webkit-box; -webkit-line-clamp:12; -webkit-box-orient:vertical; overflow:hidden;
}

/* Actions */
.about-actions{ display:flex; align-items:center; gap:16px; margin-top:18px; }

/* LinkedIn */
.about-linkedin{
  display:inline-flex; align-items:center; gap:12px;
  text-decoration:none; color:#000; background:transparent; border:0; padding:0;
}
.about-linkedin .li-icon{ width:28px; height:28px; display:block; }
.about-linkedin .li-label{
  white-space:nowrap;
  font-family:"Swear Display", serif !important;
  font-style:normal !important;
}
@media (max-width:768px){ .about-linkedin .li-label{ display:none; } }

/* Mehr-Anzeigen Button */
.btn-more{
  padding:10px 20px; border:1.5px solid #000; border-radius:999px;
  background:transparent; color:#000;
  font-family:"Swear Display", serif;
  cursor:pointer;
  transition:background .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.btn-more.is-active{ background:#111; color:#fff; border-color:#fff; box-shadow:0 0 0 1px #111 inset; }
.btn-more:hover{ box-shadow:0 0 0 1px #000 inset; }
.btn-more.is-active:hover{ opacity:.95; }
.btn-more:focus-visible{ outline:2px solid #000; outline-offset:3px; }
.btn-more.is-active:focus-visible{ outline:2px solid #fff; outline-offset:3px; }

/* CTA Black */
.about-page .cta-black{ background:#000; color:#fff; margin:0; }
.about-page .cta-black .cta-inner{
  min-height:60vh; display:flex; flex-direction:column; justify-content:center; gap:24px;
  padding-top:80px; padding-bottom:120px;
}
.about-page .cta-black .cta-pre{
  color:#fff; margin-bottom:10px;
  font-family:"Swear Display", serif; font-weight:400;
  font-size:32px; line-height:1.15;
}
.about-page .cta-black .cta-row{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }
.about-page .cta-black .cta-head{
  color:#fff; line-height:.95; font-style:italic;
  font-family:"Swear Display", serif; font-weight:400;
  font-size:80px; letter-spacing:-.01em;
}
.about-page .cta-black .cta-mail img{ width:var(--arrow); height:var(--arrow); filter:invert(1); position:relative; top:-4px; }
@media (max-width:768px){
  .about-page .cta-black .cta-pre{ font-size:28px; }
  .about-page .cta-black .cta-head{ font-size:60px; }
}

/* Container neutralisieren */
@supports selector(body:has(main)){
  body:has(main.about-page) .grid-container,
  body:has(main.about-page) .container,
  body:has(main.about-page) .site-content,
  body:has(main.about-page) .content-area,
  body:has(main.about-page) .inside-article,
  body:has(main.about-page) .entry-content{
    max-width:none !important; width:100% !important;
    padding-left:0 !important; padding-right:0 !important;
    margin-left:0 !important; margin-right:0 !important;
    border:0 !important; box-shadow:none !important; overflow:visible !important;
  }
  body.separate-containers:has(main.about-page) .site-main > .inside-article{ padding:0 !important; }
  body.separate-containers:has(main.about-page) .site-main{ margin:0 !important; }

  body:has(main.about-page) .site-footer{
    position:relative; z-index:3;
    background:#000 !important; color:#fff !important;
    padding-top:28px !important; padding-bottom:28px !important;
    box-shadow:none !important; border:0 !important; margin-top:0 !important;
  }
  body:has(main.about-page) .site-footer a{ color:#fff !important; }
}

/* Fallback */
html, body{ overflow-x:hidden; }
.about-page img{ display:block; }