Änderungern11080046

assets/scss/custom.scss

@@ -111,9 +111,10 @@ section {
   flex: 1;
 }
 
-.service-icon,
+
 .service-image {
   margin: 0;
+  
 }
 
 .service-image img {
@@ -246,7 +247,7 @@ section {
     color: #333;
   }
 }
-/* ========== WHY AMPERION – Grid + Cards (ohne Link-Gefühl, mit Icon-Animation) ========== */
+/* ========== WHY AMPERION  ========== */
 .why-grid {
   display: grid;
   gap: 2rem;
@@ -931,7 +932,6 @@ body {
 .cta__lead {
   margin: .9rem auto 0;
   color: #0f172a;
-  font-size: clamp(1.2rem, 2.8vw, 1.7rem);
   line-height: 1.55;
   max-width: 58rem;
   position: relative;
@@ -1108,8 +1108,21 @@ body {
 }
 
 /* About-Intro: Video ohne abgerundete Ecken */
-.intro-video { width: 100%; height: 100%; object-fit: cover; display: block; }
-.intro-media, .intro-video { border-radius: 0 !important; } /* überschreibt evtl. globale Styles */
+/* About-Intro: Video mit weichen Kanten */
+.intro-video {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  display: block;
+  border-radius: 12px; /* Weiche Kanten */
+}
+
+.intro-media {
+  overflow: hidden; /* sorgt dafür, dass der Radius auch das Video schneidet */
+  border-radius: 12px; /* gleicher Radius wie Video */
+  
+}
+
 
 
 /* ========================================
@@ -1141,84 +1154,69 @@ body {
   }
 }
 
-/* 2) Mission/Vision/Ziel: Tabs & Inhalt wie auf Index */
+/* ===========================
+   Mission / Vision / Ziel
+   =========================== */
 .mission-section {
+
+  /* Wrapper sauber mittig + schmaler */
+  .mission-tabs-wrapper{
+    max-width: 920px;
+    margin-inline: auto;
+  }
+
+  /* Tabs */
   .mission-tabs {
     border-bottom: 1px solid #eaeaea;
     margin-bottom: 1rem;
+    text-align: center; // Tabs mittig
 
-    .nav-link {
+    .nav-link{
       border: 0;
-      padding: .5rem 1rem;
-      font-weight: 600;
+      padding: .45rem .9rem;
       color: #046e6e;
       opacity: .7;
+      background: transparent;
+      cursor: pointer;
+      transition: all .2s ease;
 
-      &.active,
-      &:hover {
+      &:hover{
         opacity: 1;
+        color: #F5A623;                 /* Hover Orange */
+        border-bottom: 2px solid #F5A623;
+      }
+      &.active{
+        opacity: 1;
+        color: #046e6e;                 /* aktiv Türkis */
         border-bottom: 2px solid #046e6e;
-        background: transparent;
       }
     }
   }
 
-  .mission-tab-content {
-    .tab-inner {
-      background: #fff;
-      border: 1px solid #eee;
-      border-radius: .75rem;
-      padding: 1.25rem;
-      box-shadow: 0 8px 24px rgba(0,0,0,.04);
+  /* Inhalt – sofortiger Wechsel, p-Standard */
+  .mission-tab-content{
+    .tab-pane{ display:none; }
+    .tab-pane.active{ display:block; }
 
-      p { margin-bottom: .9rem; }
-      p:last-child { margin-bottom: 0; }
+    .tab-inner{
+      background:#fff;
+      border:1px solid #eee;
+      border-radius:.75rem;
+      padding:1.25rem;
+      box-shadow:0 8px 24px rgba(0,0,0,.04);
+      p:last-child{ margin-bottom:0; }
     }
   }
 }
 
-/* 3) „Was uns auszeichnet“: Grid andocken an bestehende Service-Cards */
-.why-grid {
-  display: grid;
-  grid-template-columns: repeat(4, minmax(0, 1fr));
-  gap: 1.25rem;
-
-  @media (max-width: 992px) {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-  @media (max-width: 576px) {
-    grid-template-columns: 1fr;
+/* Kleinere Bildschirme: etwas kompakter */
+@media (max-width: 576px){
+  .mission-section{
+    .mission-tabs .nav-link{ padding:.4rem .7rem; }
+    .mission-tabs-wrapper{ max-width: 100%; }
   }
 }
 
-.service-card {
-  background: #fff;
-  border: 1px solid #eee;
-  border-radius: .75rem;
-  padding: 1.25rem;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  justify-content: flex-start;
-  text-align: center;
-  box-shadow: 0 8px 24px rgba(0,0,0,.04);
-
-  .service-icon {
-    width: 48px;
-    height: 48px;
-    margin: 0 auto .5rem;
-    display: block;
-  }
-
-  .service-card-title {
-    font-weight: 700;
-    margin-bottom: .35rem;
-  }
-
-  .service-card-description {
-    margin: 0;
-  }
-}
 
 /* 4) Team-Block: Karten & Bild */
 .team-image {