/* =========================================================
   ULTIMATE FIX: Über-mich Rahmen/Box entfernen
   - keine runde Box mehr
   - kein Border, kein Shadow, keine Pseudo-Elemente
   - Abstand zwischen Header und Über-mich minimiert
   ========================================================= */

html body main.about-page{
  margin-top:0 !important;
  padding-top:0 !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
}

html body main.about-page section.about-hero-modern,
html body .about-page .about-hero-modern,
html body section.about-hero-modern{
  margin-top:0 !important;
  margin-bottom:18px !important;

  border:0 !important;
  border-top:0 !important;
  border-right:0 !important;
  border-bottom:0 !important;
  border-left:0 !important;

  outline:0 !important;
  box-shadow:none !important;

  border-radius:0 !important;
  background:transparent !important;
  background-image:none !important;

  overflow:visible !important;
}

html body main.about-page section.about-hero-modern::before,
html body main.about-page section.about-hero-modern::after,
html body main.about-page section.about-hero-modern:before,
html body main.about-page section.about-hero-modern:after,
html body .about-page .about-hero-modern::before,
html body .about-page .about-hero-modern::after,
html body .about-page .about-hero-modern:before,
html body .about-page .about-hero-modern:after{
  display:none !important;
  content:none !important;
  width:0 !important;
  height:0 !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:none !important;
  background-image:none !important;
  opacity:0 !important;
}

/* Falls der obere Strich vom Header/Body kommt */
html body .topbar,
html body .topbar.yi-header,
html body .topbar.yi-clean-header{
  margin-bottom:0 !important;
}

html body .about-page,
html body .about-hero-modern{
  transform:none !important;
}

/* Karten bleiben sichtbar, nur der große äußere Rahmen weg */
html body .about-hero-modern .stat-card{
  border:1px solid rgba(255,255,255,.06) !important;
  border-radius:16px !important;
  background:linear-gradient(145deg,rgba(14,31,53,.90),rgba(5,15,29,.82)) !important;
  box-shadow:0 16px 40px rgba(0,0,0,.22) !important;
}

@media(max-width:900px){
  html body main.about-page section.about-hero-modern,
  html body .about-page .about-hero-modern{
    border-radius:0 !important;
    background:transparent !important;
    background-image:none !important;
    box-shadow:none !important;
    border:0 !important;
    overflow:visible !important;
  }
}



/* ICONS FEST ZENTRIERT - KEINE BEWEGUNG */
.stat-icon-box,
.yi-about-creative .stat-icon-box{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    position:relative !important;
    overflow:hidden !important;
}

.stat-icon-box svg,
.yi-about-creative .stat-icon-box svg{
    position:absolute !important;
    top:50% !important;
    left:50% !important;
    transform:translate(-50%,-50%) !important;
    margin:0 !important;
    animation:none !important;
    transition:none !important;
}

.stat-icon-box:hover svg,
.yi-about-creative .stat-icon-box:hover svg{
    transform:translate(-50%,-50%) !important;
}


/* Header brand color like footer */
.brand{
 color:#ffffff !important;
}
.brand .accent,
.brand-highlight,
.brand span:last-child{
 background:linear-gradient(135deg,#00e5ff,#2dd4ff) !important;
 -webkit-background-clip:text !important;
 -webkit-text-fill-color:transparent !important;
 color:transparent !important;
 font-weight:800 !important;
}