/*
 IQ MEDIA ARTS | ÜBER UNS
 Seitenspezifische Styles. Änderungen an anderen Seiten sind ausgeschlossen.
 Austausch der Bilder: gleichnamige ueber-uns-*.webp Dateien ersetzen.
*/
.about-page .about-hero {
  min-height: 570px;
  padding-top: 185px;
  padding-bottom: 82px;
  background:
    radial-gradient(ellipse at 82% 40%, rgba(123,29,48,.25),transparent 45%),
    linear-gradient(130deg,#090a0c 18%,#151116 100%);
}
.about-page .about-hero::before {
  background: linear-gradient(90deg,rgba(8,9,10,.84) 0%,rgba(8,9,10,.40) 78%,transparent);
}
.about-page .about-hero .hero-art::before { opacity:.22; }
.about-page .about-hero .hero-art::after { opacity:.16; }
.about-page .about-hero .display {
  text-transform: none;
  font: 800 clamp(43px,5.8vw,88px)/1.05 var(--body);
  letter-spacing:-.055em;
  max-width:920px;
  margin:27px 0 24px;
  text-wrap:balance;
}
.about-page .about-hero .lede { max-width:770px; font-size:clamp(16px,1.6vw,21px);line-height:1.7; }
.about-page .chapter { padding-top:clamp(85px,9vw,125px);padding-bottom:clamp(85px,9vw,125px); }
.about-page .chapter .h2 {
  text-transform:none;
  font:800 clamp(34px,4.2vw,62px)/1.10 var(--body);
  letter-spacing:-.045em;
  text-wrap:balance;
  margin:18px 0 24px;
}
.about-page .about-vision-grid { grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(40px,6.5vw,102px); }
.about-page .about-vision-copy p, .about-page .about-founder-copy p {
  font-size:clamp(15px,1.15vw,17px);
  line-height:1.78;
  color:#c3c0c0;
  max-width:610px;
  margin:0 0 17px;
}
.about-page figure {margin:0;}
.about-page .about-production-figure {
  position:relative;
  isolation:isolate;
  min-height:490px;
  border:1px solid rgba(255,255,255,.12);
  overflow:hidden;
  background:#131417;
}
.about-page .about-production-photo,
.about-page .about-production-photo::after {
  position:absolute;
  inset:0;
}
.about-page .about-production-photo img {
  display:block;width:100%;height:100%;object-fit:cover;
  object-position:47% center;
  filter:brightness(.83) contrast(1.04) saturate(.88);
}
.about-page .about-production-photo::after {
  content:"";
  background:linear-gradient(180deg,rgba(6,7,9,.02) 35%,rgba(5,6,7,.30) 62%,rgba(5,6,7,.92) 100%);
  pointer-events:none;
}
.about-page .about-production-credit {
  position:absolute;left:clamp(23px,3vw,45px);bottom:clamp(22px,2.8vw,42px);
  z-index:2;display:flex;flex-direction:column;gap:3px;
  font-size:12px;line-height:1.6;color:#d7d2d1;
  max-width:calc(100% - 50px);
}
.about-page .about-production-credit strong {font-size:13px;color:#fff;}
.about-page .about-credit-mark {height:2px;width:52px;background:var(--red);margin-bottom:10px;}
.about-page .about-founder {
  background:linear-gradient(180deg,#101114 0%,#0b0c0e 100%);
}
.about-page .about-founder .split-head { margin-bottom:46px; }
.about-page .about-founder .split-head .h2{max-width:1000px;}
.about-page .about-founder-grid{grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr);gap:clamp(45px,6vw,88px);}
.about-page .about-founder-visual {
  border:1px solid rgba(255,255,255,.11);
  min-height:560px;
  overflow:hidden;
  background:radial-gradient(ellipse at 56% 48%,#353034 0%,#17171b 47%,#090a0c 85%);
}
.about-page .about-gimbal-frame {
  display:flex;align-items:flex-end;justify-content:center;
  height:clamp(520px,51vw,660px);
  width:100%;overflow:hidden;
}
.about-page .about-gimbal-frame img {
  display:block;width:100%;height:100%;object-fit:contain;
  object-position:center bottom;
  filter:brightness(.94) contrast(1.05) saturate(.96);
}
.about-page .about-founder-copy h3{
  font:800 clamp(35px,4.5vw,65px)/1.05 var(--body);
  letter-spacing:-.055em;
  color:#f5f3f3;
  margin:19px 0 24px;
}
.about-page .about-instagram-link{
  display:inline-flex;gap:14px;align-items:center;min-height:48px;
  margin-top:14px;border:1px solid rgba(255,255,255,.33);
  padding:12px 18px;color:#f4eeee;
  font-size:12px;font-weight:750;letter-spacing:.055em;
  transition:background .2s,border-color .2s,transform .2s;
}
.about-page .about-instagram-link:hover {background:#8b1b30;border-color:#b53244;transform:translateY(-2px);}
.about-page .about-instagram-link svg{flex:none;}
.about-page .about-instagram-link span:last-child{margin-left:6px;color:#ce8c96;}
.about-page .about-qualifications-grid{
  display:grid;
  grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr);
  gap:clamp(55px,8vw,120px);
  align-items:center;
}
.about-page .about-qualification-copy .h2{max-width:730px;}
.about-page .about-qualification-intro{color:#d1cdcc;font-size:clamp(16px,1.4vw,19px);line-height:1.65;margin:0 0 29px;}
.about-page .about-experience{display:flex;gap:20px;align-items:flex-start;padding:19px 0 23px;border-top:2px solid #942636;border-bottom:1px solid rgba(255,255,255,.17);margin-bottom:22px;}
.about-page .about-experience-year{white-space:nowrap;font-weight:800;font-size:clamp(20px,2.3vw,30px);letter-spacing:-.025em;color:#f5eded;}
.about-page .about-experience-text{line-height:1.6;color:#bdb7b7;font-size:14px;max-width:490px;}
.about-page .about-qualification {display:grid;grid-template-columns:32px 1fr;gap:15px;padding:23px 0;border-bottom:1px solid rgba(255,255,255,.13);}
.about-page .about-qualification-number{font-size:12px;color:#b85f6e;font-weight:800;letter-spacing:.07em;padding-top:5px;}
.about-page .about-qualification h3{font-size:clamp(17px,1.5vw,21px);letter-spacing:-.015em;line-height:1.35;color:#f4eded;margin:0 0 9px;}
.about-page .about-qualification p{font-size:14px;line-height:1.65;color:#bcb8b8;margin:0;max-width:660px;}
.about-page .about-portrait-visual{margin:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center;}
.about-page .about-portrait-frame {
  position:relative;display:flex;align-items:flex-end;justify-content:center;
  height:clamp(520px,55vw,720px);
  border:1px solid rgba(255,255,255,.12);overflow:hidden;
  background:radial-gradient(ellipse at 55% 45%,#292327 0%,#161519 50%,#08090b 90%);
}
.about-page .about-portrait-frame::before {
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 60%,rgba(5,5,6,.53) 100%);
  pointer-events:none;z-index:1;
}
.about-page .about-portrait-frame img {
  display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;
  filter:brightness(.93) contrast(1.045) saturate(.95);
}
.about-page .about-portrait-visual figcaption{margin-top:14px;color:#d0cbca;font-size:13px;}
.about-page .about-portrait-visual figcaption span{color:#b85f6e;margin:0 6px;}
@media(max-width:930px){
  .about-page .about-vision-grid,.about-page .about-founder-grid,.about-page .about-qualifications-grid{grid-template-columns:1fr;gap:38px;}
  .about-page .about-production-figure{min-height:470px;}
  .about-page .about-founder-visual{min-height:0;}
  .about-page .about-gimbal-frame{height:650px;}
  .about-page .about-portrait-frame{height:610px;max-width:600px;}
}
@media(max-width:550px){
  .about-page .about-hero{min-height:480px;padding-top:145px;padding-bottom:57px;}
  .about-page .about-hero .display{font-size:clamp(37px,10.5vw,56px);letter-spacing:-.05em;}
  .about-page .about-hero .lede{font-size:16px;}
  .about-page .chapter{padding-top:71px;padding-bottom:71px;}
  .about-page .chapter .h2{font-size:clamp(31px,8.4vw,46px);}
  .about-page .about-production-figure{min-height:420px;}
  .about-page .about-gimbal-frame{height:500px;}
  .about-page .about-portrait-frame{height:510px;}
  .about-page .about-experience{flex-direction:column;gap:5px;}
  .about-page .about-qualification{grid-template-columns:25px 1fr;gap:12px;}
  .about-page .about-vision-copy p,.about-page .about-founder-copy p{font-size:15px;}
}
@media(prefers-reduced-motion:reduce){
  .about-page .about-instagram-link{transition:none;}
}


/*
  IQ MEDIA ARTS | ÜBER UNS | v03 – geprüfte Bildkomposition
  Nur für .about-page: weiche Bildkanten, Gründer schaut Richtung Text,
  Porträt passend zugeschnitten. Keine Änderungen an globalen Styles.
*/

/* Film-Set: kein harter Bildrahmen. Die Bildkanten gehen in den Seitenhintergrund über. */
.about-page .about-production-figure {
  border: 0;
  background: transparent;
  overflow: hidden;
  isolation: isolate;
}
.about-page .about-production-photo {
  -webkit-mask-image: radial-gradient(ellipse 79% 80% at 50% 47%, #000 55%, rgba(0,0,0,.95) 64%, transparent 100%);
  mask-image: radial-gradient(ellipse 79% 80% at 50% 47%, #000 55%, rgba(0,0,0,.95) 64%, transparent 100%);
}
.about-page .about-production-photo::after {
  background: linear-gradient(180deg, rgba(6,7,9,.05) 30%, rgba(6,7,9,.24) 57%, rgba(6,7,9,.78) 100%);
}
/* Bildbeschreibung bleibt innerhalb der Bildfläche, mit ausreichend Kontrast. */
.about-page .about-production-credit { bottom:clamp(34px,4.2vw,58px); }

/* Gründer: Text links, echtes Kamera-/Gimbal-Foto rechts, ohne Spiegeln der Aufnahme. */
.about-page .about-founder-grid {
  grid-template-columns:minmax(0,.97fr) minmax(0,1.03fr);
  align-items:center;
}
.about-page .about-founder-copy { min-width:0; }
.about-page .about-founder-visual {
  min-width:0;
  min-height:0;
  border:0;
  overflow:visible;
  background:none;
}
.about-page .about-gimbal-frame {
  position:relative;
  isolation:isolate;
  height:clamp(535px,51vw,680px);
  overflow:hidden;
  background:radial-gradient(ellipse 54% 64% at 51% 48%,rgba(91,54,63,.19),rgba(21,21,25,.1) 62%,transparent 100%);
}
.about-page .about-gimbal-frame img {
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center bottom;
  -webkit-mask-image: linear-gradient(to bottom,#000 0%,#000 80%,rgba(0,0,0,.85) 87%,transparent 100%);
  mask-image: linear-gradient(to bottom,#000 0%,#000 80%,rgba(0,0,0,.85) 87%,transparent 100%);
}

/* Ausbildungsporträt: kein Leerraum über dem Kopf; Bild statt Rahmen skalieren. */
.about-page .about-portrait-visual { align-self:center; min-width:0; width:100%; }
.about-page .about-portrait-frame {
  height:clamp(430px,46vw,595px);
  border:0;
  background:radial-gradient(ellipse 58% 60% at 50% 50%,rgba(96,71,83,.15),rgba(18,18,21,.05) 67%,transparent 100%);
  overflow:hidden;
}
.about-page .about-portrait-frame::before {
  inset:auto 0 0;
  height:31%;
  background:linear-gradient(to bottom,transparent 0%,rgba(9,10,12,.55) 62%,#090a0c 100%);
}
.about-page .about-portrait-frame img {
  flex:none;
  width:auto;
  min-width:100%;
  max-width:none;
  height:97%;
  object-fit:cover;
  object-position:center bottom;
  -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.82) 0%,#000 7%,#000 76%,transparent 100%);
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.82) 0%,#000 7%,#000 76%,transparent 100%);
}

@media (max-width: 930px) {
  .about-page .about-founder-grid {grid-template-columns:1fr;gap:30px;}
  .about-page .about-gimbal-frame {height:clamp(420px,95vw,650px);}
  .about-page .about-portrait-frame {height:clamp(410px,95vw,590px);max-width:560px;}
}
@media (max-width: 550px) {
  .about-page .about-gimbal-frame {height:clamp(395px,118vw,525px);}
  .about-page .about-portrait-frame {height:clamp(390px,117vw,545px);}
  .about-page .about-production-credit {bottom:30px;left:23px;}
}


/* v23 — Same restrained image identity as the wedding and project previews.
   The images remain uncropped; only their presentation scales inside the frame. */
.about-page .about-production-photo img,
.about-page .about-gimbal-frame img,
.about-page .about-portrait-frame img {
  transform: scale(1);
  transform-origin: center center;
  transition: transform 1s ease;
}
@media (hover: hover) and (pointer: fine) {
  .about-page .about-production-figure:hover .about-production-photo img,
  .about-page .about-founder-visual:hover .about-gimbal-frame img,
  .about-page .about-portrait-frame:hover img {
    transform: scale(1.025);
  }
}
@media (hover: none), (pointer: coarse) {
  .about-page .about-production-figure:active .about-production-photo img,
  .about-page .about-founder-visual:active .about-gimbal-frame img,
  .about-page .about-portrait-frame:active img {
    transform: scale(1.025);
    transition-duration: .25s;
  }
}
@media (prefers-reduced-motion: reduce) {
  .about-page .about-production-photo img,
  .about-page .about-gimbal-frame img,
  .about-page .about-portrait-frame img {
    transition: none !important;
    transform: none !important;
  }
}